added activity dates for the top banner and cms config (#1090)

qdrant-landing/content/headless/top-banner.md

@@ -4,5 +4,6 @@ text: Introducing Qdrant Hybrid Cloud
 link:
   text: Learn More
   url: /blog/hybrid-cloud/
+start: 2024-08-14T14:22:00.000Z
 sitemapExclude: true
 ---

qdrant-landing/static/admin/config.yml

@@ -30,3 +30,22 @@ collections:
       - { label: 'Tags', name: 'tags', widget: 'list', allow_add: true,
           hint: 'Use a comma without a space to separate tags (this widget will add spaces after commas itself). Currently, tags only used to show related posts and not appear in user interface. But it can change in the future.' }
       - { label: 'Body', name: 'body', widget: 'markdown', modes: ['raw'] }
+  - name: 'top-banner'
+    label: 'Top Banner'
+    create: false
+    editor:
+      preview: false
+    files:
+      - name: 'top-banner'
+        label: 'Top Banner'
+        file: 'qdrant-landing/content/headless/top-banner.md'
+        fields:
+          - { label: 'Text', name: 'text', widget: 'string' }
+          - label: 'Link'
+            name: 'link'
+            widget: 'object'
+            fields:
+              - { label: 'Text', name: 'text', widget: 'string' }
+              - { label: 'URL', name: 'url', widget: 'string' }
+          - { label: 'Start Date', name: 'start', widget: 'datetime', picker_utc: true, hint: 'The banner will be displayed starting from this date, if not set, the banner will not be displayed' }
+          - { label: 'End Date', name: 'end', widget: 'datetime', picker_utc: true, hint: 'If not set, the banner will be displayed indefinitely' }

qdrant-landing/themes/qdrant-2024/assets/js/index.js

@@ -1,7 +1,7 @@
 import scrollHandler from './scroll-handler';
 import { XXL_BREAKPOINT } from './constants';
 import { initGoToTopButton, getCookie } from './helpers';
-import { loadSegment, createSegmentStoredPage } from './segment-helpers'
+import { loadSegment, createSegmentStoredPage } from './segment-helpers';
 
 createSegmentStoredPage();
 
@@ -11,10 +11,21 @@ document.addEventListener('DOMContentLoaded', function () {
     loadSegment();
   }
 
+  // Top banner activation
+  const topBanner = document.querySelector('.top-banner');
+  if (topBanner) {
+    const start = parseInt(topBanner.getAttribute('data-start'));
+    const end = parseInt(topBanner.getAttribute('data-end'));
+    const now = Math.floor(Date.now() / 1000);
+    if (start && now > start && (end ? now < end : true)) {
+      topBanner.style.display = 'flex';
+    }
+  }
+
   // Header scroll
   const body = document.querySelector('body');
   const header = document.querySelector('.site-header');
-  const topBannerHeight = document.querySelector('.top-banner')?.offsetHeight ?? 0;
+  const topBannerHeight = topBanner?.offsetHeight ?? 0;
   const mainMenuHeight = document.querySelector('.main-menu')?.offsetHeight ?? 0;
   const PADDING_PART_TO_HIDE = 24;
   let menuOffset = window.innerWidth >= 1400 ? PADDING_PART_TO_HIDE : 0; // 24px is a PART of padding-top which we want to scroll over

qdrant-landing/themes/qdrant-2024/layouts/partials/top-banner.html

@@ -1,9 +1,31 @@
 {{ with (.Site.GetPage "/headless/top-banner") }}
-  <section class="top-banner">
+  {{ $startExists := isset .Params "start" }}
+  {{ $endExists := isset .Params "end" }}
+  {{ $start := 0 }}
+  {{ $end := 0 }}
+
+  {{ if $startExists }}
+    {{ $start = time.AsTime .Params.start }}
+    {{ $start = $start.Unix }}
+  {{ end }}
+
+  {{ if $endExists }}
+    {{ $end = time.AsTime .Params.end }}
+    {{ $end = $end.Unix }}
+  {{ end }}
+
+
+  <section class="top-banner" data-start="{{ $start }}" data-end="{{ $end }}" style="display: none;">
     <div>
       <span class="top-banner__icon"> {{ .Params.icon | safeHTML }} </span>
       <span class="top-banner__text"> {{ .Params.text }} </span>
-      <a data-metric-loc="banner" data-metric-label="{{ .Params.text }} {{ .Params.link.text }}" class="link link_light link_sm" href="{{ .Params.link.url }}">{{ .Params.link.text }}</a>
+      <a
+        data-metric-loc="banner"
+        data-metric-label="{{ .Params.text }} {{ .Params.link.text }}"
+        class="link link_light link_sm"
+        href="{{ .Params.link.url }}"
+        >{{ .Params.link.text }}</a
+      >
     </div>
   </section>
 {{ end }}