From 226f661966ebb68f595541b31e6605d1c71efbdd Mon Sep 17 00:00:00 2001 From: Henk Verlinde Date: Mon, 1 Mar 2021 16:34:43 +0100 Subject: [PATCH] feat: added options lazySizes, clipBoard, instantPage, flexSearch, and darkMode --- .eslintrc.json | 3 +- assets/js/app.js | 31 ------------ assets/js/clipboard.js | 18 +++++++ assets/js/darkmode.js | 12 +++++ assets/js/instant.page.js | 1 + assets/js/lazysizes.js | 1 + config/_default/config.toml | 12 ----- config/_default/params.toml | 7 +++ layouts/partials/footer/script-footer.html | 58 +++++++++++++++++----- layouts/partials/header/header.html | 4 ++ 10 files changed, 90 insertions(+), 57 deletions(-) create mode 100644 assets/js/clipboard.js create mode 100644 assets/js/darkmode.js create mode 100644 assets/js/instant.page.js create mode 100644 assets/js/lazysizes.js diff --git a/.eslintrc.json b/.eslintrc.json index 76ff225..c926994 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -11,7 +11,8 @@ "SharedArrayBuffer": "readonly" }, "parserOptions": { - "ecmaVersion": 2018 + "ecmaVersion": 2018, + "sourceType": "module" }, "rules": { "no-console": 0, diff --git a/assets/js/app.js b/assets/js/app.js index fa64c92..e69de29 100644 --- a/assets/js/app.js +++ b/assets/js/app.js @@ -1,31 +0,0 @@ -document.getElementById('mode').addEventListener('click', () => { - - document.body.classList.toggle('dark'); - localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light'); - -}); - -if (localStorage.getItem('theme') === 'dark') { - - document.body.classList.add('dark'); - -} - -/* eslint-disable */ -var clipboard = new ClipboardJS('.btn-clipboard'); - -clipboard.on('success', function(e) { - /* - console.info('Action:', e.action); - console.info('Text:', e.text); - console.info('Trigger:', e.trigger); - */ - - e.clearSelection(); -}); - -clipboard.on('error', function(e) { - console.error('Action:', e.action); - console.error('Trigger:', e.trigger); -}); -/* eslint-enable */ diff --git a/assets/js/clipboard.js b/assets/js/clipboard.js new file mode 100644 index 0000000..b216c12 --- /dev/null +++ b/assets/js/clipboard.js @@ -0,0 +1,18 @@ +import Clipboard from 'clipboard'; + +var clipboard = new Clipboard('.btn-clipboard'); + +clipboard.on('success', function(e) { + /* + console.info('Action:', e.action); + console.info('Text:', e.text); + console.info('Trigger:', e.trigger); + */ + + e.clearSelection(); +}); + +clipboard.on('error', function(e) { + console.error('Action:', e.action); + console.error('Trigger:', e.trigger); +}); diff --git a/assets/js/darkmode.js b/assets/js/darkmode.js new file mode 100644 index 0000000..4d8bcce --- /dev/null +++ b/assets/js/darkmode.js @@ -0,0 +1,12 @@ +document.getElementById('mode').addEventListener('click', () => { + + document.body.classList.toggle('dark'); + localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light'); + +}); + +if (localStorage.getItem('theme') === 'dark') { + + document.body.classList.add('dark'); + +} diff --git a/assets/js/instant.page.js b/assets/js/instant.page.js new file mode 100644 index 0000000..b394bcc --- /dev/null +++ b/assets/js/instant.page.js @@ -0,0 +1 @@ +import 'instant.page'; diff --git a/assets/js/lazysizes.js b/assets/js/lazysizes.js new file mode 100644 index 0000000..c12ed58 --- /dev/null +++ b/assets/js/lazysizes.js @@ -0,0 +1 @@ +import 'lazysizes'; diff --git a/config/_default/config.toml b/config/_default/config.toml index 26bc675..2c5f94a 100644 --- a/config/_default/config.toml +++ b/config/_default/config.toml @@ -76,18 +76,6 @@ rel = "sitemap" [[module.mounts]] source = "static" target = "static" - [[module.mounts]] - source = "node_modules/lazysizes" - target = "assets/js/vendor/lazysizes" - [[module.mounts]] - source = "node_modules/instant.page" - target = "assets/js/vendor/instant.page" - [[module.mounts]] - source = "node_modules/lazysizes" - target = "assets/js/vendor/lazysizes" [[module.mounts]] source = "node_modules/flexsearch" target = "assets/js/vendor/flexsearch" - [[module.mounts]] - source = "node_modules/clipboard" - target = "assets/js/vendor/clipboard" diff --git a/config/_default/params.toml b/config/_default/params.toml index 4e039e1..40ebcdb 100644 --- a/config/_default/params.toml +++ b/config/_default/params.toml @@ -45,3 +45,10 @@ alertText = "Like Doks? - + {{ if .Site.Params.options.flexSearch -}} + + {{ end -}} {{ else -}} - {{ $instantPage := resources.Get "js/vendor/instant.page/instantpage.js" | minify -}} - {{ $app := resources.Get "js/app.js" | minify -}} - {{ $js := slice $lazysizes $clipboard $flexsearch $instantPage $app | resources.Concat "main.js" -}} - {{ $jsProd := $js | resources.Fingerprint "sha512" -}} - {{ $indexProd := $index | resources.Minify | resources.Fingerprint "sha512" -}} - - + {{ $js := $js | minify | fingerprint "sha512" -}} + {{ $index := $index | minify | fingerprint "sha512" -}} + + {{ if .Site.Params.options.flexSearch -}} + + {{ end -}} {{ end -}} \ No newline at end of file diff --git a/layouts/partials/header/header.html b/layouts/partials/header/header.html index 71872d1..9cbc5a9 100644 --- a/layouts/partials/header/header.html +++ b/layouts/partials/header/header.html @@ -4,10 +4,12 @@ {{ .Site.Params.Title }} + {{ if .Site.Params.options.darkMode -}} + {{ end -}}
+ {{ if .Site.Params.options.flexSearch -}} + {{ end -}} \ No newline at end of file