From 67250dca95369b7cd1afbdaf694b022b008e5009 Mon Sep 17 00:00:00 2001 From: sptaule Date: Thu, 27 Jan 2022 15:03:27 +0100 Subject: Added gobal Search, template partials, deleted shortcodes not in use --- static/images/garage-logo.svg | 168 +++++++++++++++++++++--------------------- static/js/site.js | 97 +++++++++++++++++++++--- 2 files changed, 172 insertions(+), 93 deletions(-) (limited to 'static') diff --git a/static/images/garage-logo.svg b/static/images/garage-logo.svg index 654e25b..af33380 100644 --- a/static/images/garage-logo.svg +++ b/static/images/garage-logo.svg @@ -2,9 +2,9 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + diff --git a/static/js/site.js b/static/js/site.js index 4b64425..f764289 100755 --- a/static/js/site.js +++ b/static/js/site.js @@ -1,5 +1,7 @@ "use strict"; +var indexScriptLoaded = false; + function debounce(func, wait) { var timeout; @@ -110,17 +112,12 @@ function makeTeaser(body, terms) { function formatSearchResultItem(item, terms) { return ( - `
` + - `

` + - `${item.doc.title}` + - `

` + - `
` + - `${makeTeaser(item.doc.body, terms)}` + - `` + - `Read More ` + - `` + - `
` + - `` + `` + + `

` + `${item.doc.title}` + `

` + + `
` + + `${makeTeaser(item.doc.body, terms)}` + + `
` + + `
` ); } @@ -168,4 +165,82 @@ function search() { } }, 150) ); +} + +function openSearchModal() { + if (indexScriptLoaded === false) { + var indexScript = document.createElement('script'); + indexScript.setAttribute('src', './search_index.en.js'); + document.head.appendChild(indexScript); + indexScriptLoaded = true; + } + document.getElementById('search-modal').classList.remove('hidden'); + document.getElementById('search').focus(); + document.getElementById('search').select(); +} + +function closeSearchModal() { + document.getElementById('search-modal').classList.add('hidden'); +} + +function documentReadyCallback() { + + if (localStorage.getItem("theme") === "dark") { + document.body.setAttribute("theme", "dark"); + document.querySelectorAll("img, picture, video, pre").forEach(img => img.setAttribute("theme", "dark")); + document.querySelectorAll(".vimeo, .youtube, .chart").forEach(video => video.setAttribute("theme", "dark")); + document.getElementById("dark-mode").setAttribute("title", "Switch to light theme"); + } + + document.addEventListener('click', function(ev) { + if (ev.target.matches('#nav-search-btn') || ev.target.matches('#nav-search-btn-icon')) { + openSearchModal(); + } + else if (ev.target.matches('#close-modal-btn') + || ev.target.matches('#close-modal-btn-icon') + || !ev.target.closest('#search-modal')) { + closeSearchModal(); + } + }); + + document.addEventListener('keydown', function(event) { + if (event.altKey && event.key === 's') { + if (document.getElementById('search-modal').classList.contains('hidden')) { + openSearchModal(); + } else { + closeSearchModal(); + } + } + }); + + document.addEventListener('keyup', function(ev) { + if (ev.key === "Escape") { + closeSearchModal(); + } + }); + + document.getElementById("search").addEventListener("keyup", () => { + search(); + }); + + if (typeof mermaid !== "undefined") { + mermaid.initialize({ startOnLoad: true }); + } + + if (typeof renderMathInElement !== "undefined") { + renderMathInElement(document.body, { + delimiters: [ + { left: '$$', right: '$$', display: true }, + { left: '$', right: '$', display: false }, + { left: '\\(', right: '\\)', display: false }, + { left: '\\[', right: '\\]', display: true } + ] + }); + } +}; + +if (document.readyState === 'loading') { // Loading hasn't finished yet + document.addEventListener('DOMContentLoaded', documentReadyCallback); +} else { // `DOMContentLoaded` has already fired + documentReadyCallback(); } \ No newline at end of file -- cgit v1.2.3