feat: update for doks 0.3.4

assets/js/alert.js

@@ -0,0 +1,17 @@
+var announcement = document.getElementById('announcement');
+
+if (announcement !== null) {
+
+  if (localStorage.getItem('announcement') === null ) {
+
+    announcement.classList.remove('d-none');
+
+  }
+
+  announcement.addEventListener('closed.bs.alert', () => {
+
+    localStorage.setItem('announcement', 'closed');
+
+  });
+
+}

assets/js/darkmode-init.js

@@ -0,0 +1,21 @@
+const globalDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
+const localMode = localStorage.getItem('theme');
+
+if (globalDark && (localMode === null)) {
+
+  localStorage.setItem('theme', 'dark');
+  document.documentElement.setAttribute('data-dark-mode', '');
+
+}
+
+if (globalDark && (localMode === 'dark')) {
+
+  document.documentElement.setAttribute('data-dark-mode', '');
+
+}
+
+if (localMode === 'dark') {
+
+  document.documentElement.setAttribute('data-dark-mode', '');
+
+}

assets/js/darkmode.js

@@ -1,12 +1,38 @@
-document.getElementById('mode').addEventListener('click', () => {
+const mode = document.getElementById('mode');
 
-  document.body.classList.toggle('dark');
-  localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light');
+if (mode !== null) {
 
-});
+  window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
 
-if (localStorage.getItem('theme') === 'dark') {
+    if (event.matches) {
 
-  document.body.classList.add('dark');
+      localStorage.setItem('theme', 'dark');
+      document.documentElement.setAttribute('data-dark-mode', '');
+
+    } else {
+
+      localStorage.setItem('theme', 'light');
+      document.documentElement.removeAttribute('data-dark-mode');
+
+    }
+
+  })
+
+  mode.addEventListener('click', () => {
+
+    document.documentElement.toggleAttribute('data-dark-mode');
+    localStorage.setItem('theme', document.documentElement.hasAttribute('data-dark-mode') ? 'dark' : 'light');
+
+  });
+
+  if (localStorage.getItem('theme') === 'dark') {
+
+    document.documentElement.setAttribute('data-dark-mode', '');
+
+  } else {
+
+    document.documentElement.removeAttribute('data-dark-mode');
+
+  }
 
 }

assets/js/index.js

@@ -1,20 +1,19 @@
 var suggestions = document.getElementById('suggestions');
-var userinput = document.getElementById('userinput');
+var search = document.getElementById('search');
 
-document.addEventListener('keydown', inputFocus);
+if (search !== null) {
+  document.addEventListener('keydown', inputFocus);
+}
 
 function inputFocus(e) {
-
-  if (e.keyCode === 191 ) {
+  if (e.ctrlKey && e.key === '/' ) {
     e.preventDefault();
-    userinput.focus();
+    search.focus();
   }
-
-  if (e.keyCode === 27 ) {
-    userinput.blur();
+  if (e.key === 'Escape' ) {
+    search.blur();
     suggestions.classList.add('d-none');
   }
-
 }
 
 document.addEventListener('click', function(event) {
@@ -40,14 +39,16 @@ function suggestionFocus(e){
   const focusable= [...focusableSuggestions];
   const index = focusable.indexOf(document.activeElement);
 
+  const keyDefault = suggestions.classList.contains('d-none');
+
   let nextIndex = 0;
 
-  if (e.keyCode === 38) {
+  if ((e.keyCode === 38) && (!keyDefault)) {
     e.preventDefault();
     nextIndex= index > 0 ? index-1 : 0;
     focusableSuggestions[nextIndex].focus();
   }
-  else if (e.keyCode === 40) {
+  else if ((e.keyCode === 40) && (!keyDefault)) {
     e.preventDefault();
     nextIndex= index+1 < focusable.length ? index+1 : index;
     focusableSuggestions[nextIndex].focus();
@@ -55,7 +56,6 @@ function suggestionFocus(e){
 
 }
 
-
 /*
 Source:
   - https://github.com/nextapps-de/flexsearch#index-documents-field-search
@@ -113,7 +113,7 @@ Source:
     {{ end -}}
   ;
 
-  userinput.addEventListener('input', show_results, true);
+  search.addEventListener('input', show_results, true);
   suggestions.addEventListener('click', accept_suggestion, true);
 
   function show_results(){