Skip to content

Commit 226f661

Browse files
h-enkh-enk
committed
feat: added options lazySizes, clipBoard, instantPage, flexSearch, and darkMode
1 parent a83f039 commit 226f661

File tree

10 files changed

+90
-57
lines changed

10 files changed

+90
-57
lines changed

‎.eslintrc.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,8 @@
1111
"SharedArrayBuffer": "readonly"
1212
},
1313
"parserOptions": {
14-
"ecmaVersion": 2018
14+
"ecmaVersion": 2018,
15+
"sourceType": "module"
1516
},
1617
"rules": {
1718
"no-console": 0,

‎assets/js/app.js‎

Lines changed: 0 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +0,0 @@
1-
document.getElementById('mode').addEventListener('click', () => {
2-
3-
document.body.classList.toggle('dark');
4-
localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light');
5-
6-
});
7-
8-
if (localStorage.getItem('theme') === 'dark') {
9-
10-
document.body.classList.add('dark');
11-
12-
}
13-
14-
/* eslint-disable */
15-
var clipboard = new ClipboardJS('.btn-clipboard');
16-
17-
clipboard.on('success', function(e) {
18-
/*
19-
console.info('Action:', e.action);
20-
console.info('Text:', e.text);
21-
console.info('Trigger:', e.trigger);
22-
*/
23-
24-
e.clearSelection();
25-
});
26-
27-
clipboard.on('error', function(e) {
28-
console.error('Action:', e.action);
29-
console.error('Trigger:', e.trigger);
30-
});
31-
/* eslint-enable */

‎assets/js/clipboard.js‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import Clipboard from 'clipboard';
2+
3+
var clipboard = new Clipboard('.btn-clipboard');
4+
5+
clipboard.on('success', function(e) {
6+
/*
7+
console.info('Action:', e.action);
8+
console.info('Text:', e.text);
9+
console.info('Trigger:', e.trigger);
10+
*/
11+
12+
e.clearSelection();
13+
});
14+
15+
clipboard.on('error', function(e) {
16+
console.error('Action:', e.action);
17+
console.error('Trigger:', e.trigger);
18+
});

‎assets/js/darkmode.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
document.getElementById('mode').addEventListener('click', () => {
2+
3+
document.body.classList.toggle('dark');
4+
localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light');
5+
6+
});
7+
8+
if (localStorage.getItem('theme') === 'dark') {
9+
10+
document.body.classList.add('dark');
11+
12+
}

‎assets/js/instant.page.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import 'instant.page';

‎assets/js/lazysizes.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import 'lazysizes';

‎config/_default/config.toml‎

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -76,18 +76,6 @@ rel = "sitemap"
7676
[[module.mounts]]
7777
source = "static"
7878
target = "static"
79-
[[module.mounts]]
80-
source = "node_modules/lazysizes"
81-
target = "assets/js/vendor/lazysizes"
82-
[[module.mounts]]
83-
source = "node_modules/instant.page"
84-
target = "assets/js/vendor/instant.page"
85-
[[module.mounts]]
86-
source = "node_modules/lazysizes"
87-
target = "assets/js/vendor/lazysizes"
8879
[[module.mounts]]
8980
source = "node_modules/flexsearch"
9081
target = "assets/js/vendor/flexsearch"
91-
[[module.mounts]]
92-
source = "node_modules/clipboard"
93-
target = "assets/js/vendor/clipboard"

‎config/_default/params.toml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,3 +45,10 @@ alertText = "Like Doks? <a class=\"alert-link\" href=\"https://github.com/h-enk/
4545
# Edit Page
4646
docsRepo = "https://github.com/h-enk/doks"
4747
editPage = false
48+
49+
[options]
50+
lazySizes = true
51+
clipBoard = true
52+
instantPage = true
53+
flexSearch = true
54+
darkMode = true

‎layouts/partials/footer/script-footer.html‎

Lines changed: 45 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,51 @@
11
{{ $indexTemplate := resources.Get "js/index.js" -}}
22
{{ $index := $indexTemplate | resources.ExecuteAsTemplate "index.js" . -}}
3-
{{ $lazysizes := resources.Get "js/vendor/lazysizes/lazysizes.min.js" -}}
4-
{{ $flexsearch := resources.Get "js/vendor/flexsearch/dist/flexsearch.min.js" -}}
5-
{{ $clipboard := resources.Get "js/vendor/clipboard/dist/clipboard.min.js" -}}
3+
4+
{{ $app := resources.Get "js/app.js" -}}
5+
6+
{{ $slice := slice $app -}}
7+
8+
{{ if .Site.Params.options.lazySizes -}}
9+
{{ $lazySizes := resources.Get "js/lazySizes.js" -}}
10+
{{ $lazySizes := $lazySizes | js.Build -}}
11+
{{ $slice = $slice | append $lazySizes -}}
12+
{{ end -}}
13+
14+
{{ if .Site.Params.options.clipBoard -}}
15+
{{ $clipBoard := resources.Get "js/clipBoard.js" -}}
16+
{{ $clipBoard := $clipBoard | js.Build -}}
17+
{{ $slice = $slice | append $clipBoard -}}
18+
{{ end -}}
19+
20+
{{ if .Site.Params.options.instantPage -}}
21+
{{ $instantPage := resources.Get "js/instant.page.js" -}}
22+
{{ $instantPage := $instantPage | js.Build -}}
23+
{{ $slice = $slice | append $instantPage -}}
24+
{{ end -}}
25+
26+
{{ if .Site.Params.options.flexSearch -}}
27+
{{ $flexSearch := resources.Get "js/vendor/flexsearch/dist/flexsearch.min.js" -}}
28+
{{ $slice = $slice | append $flexSearch -}}
29+
{{ end -}}
30+
31+
{{ if .Site.Params.options.darkMode -}}
32+
{{ $darkMode := resources.Get "js/darkmode.js" -}}
33+
{{ $darkMode := $darkMode | js.Build -}}
34+
{{ $slice = $slice | append $darkMode -}}
35+
{{ end -}}
36+
37+
{{ $js := $slice | resources.Concat "main.js" -}}
38+
639
{{ if eq (hugo.Environment) "development" -}}
7-
{{ $app := resources.Get "js/app.js" -}}
8-
{{ $js := slice $lazysizes $clipboard $flexsearch $app | resources.Concat "main.js" -}}
940
<script src="{{ $js.Permalink }}" defer></script>
10-
<script src="{{ $index.Permalink }}" defer></script>
41+
{{ if .Site.Params.options.flexSearch -}}
42+
<script src="{{ $index.Permalink }}" defer></script>
43+
{{ end -}}
1144
{{ else -}}
12-
{{ $instantPage := resources.Get "js/vendor/instant.page/instantpage.js" | minify -}}
13-
{{ $app := resources.Get "js/app.js" | minify -}}
14-
{{ $js := slice $lazysizes $clipboard $flexsearch $instantPage $app | resources.Concat "main.js" -}}
15-
{{ $jsProd := $js | resources.Fingerprint "sha512" -}}
16-
{{ $indexProd := $index | resources.Minify | resources.Fingerprint "sha512" -}}
17-
<script src="{{ $jsProd.Permalink }}" integrity="{{ $jsProd.Data.Integrity }}" crossorigin="anonymous" defer></script>
18-
<script src="{{ $indexProd.Permalink }}" integrity="{{ $indexProd.Data.Integrity }}" crossorigin="anonymous" defer></script>
45+
{{ $js := $js | minify | fingerprint "sha512" -}}
46+
{{ $index := $index | minify | fingerprint "sha512" -}}
47+
<script src="{{ $js.Permalink }}" integrity="{{ $js.Data.Integrity }}" crossorigin="anonymous" defer></script>
48+
{{ if .Site.Params.options.flexSearch -}}
49+
<script src="{{ $index.Permalink }}" integrity="{{ $index.Data.Integrity }}" crossorigin="anonymous" defer></script>
50+
{{ end -}}
1951
{{ end -}}

‎layouts/partials/header/header.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,12 @@
44
<input class="menu-btn order-0" type="checkbox" id="menu-btn">
55
<label class="menu-icon d-md-none" for="menu-btn"><span class="navicon"></span></label>
66
<a class="navbar-brand order-1 order-md-0 mr-auto" href="{{ .Site.BaseURL | absURL }}">{{ .Site.Params.Title }}</a>
7+
{{ if .Site.Params.options.darkMode -}}
78
<button id="mode" class="btn btn-link order-2 order-md-4" type="button" aria-label="Toggle mode">
89
<span class="toggle-dark"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg></span>
910
<span class="toggle-light"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></span>
1011
</button>
12+
{{ end -}}
1113
<ul class="navbar-nav social-nav order-3 order-md-5">
1214
{{ range .Site.Menus.social -}}
1315
<li class="nav-item">
@@ -30,10 +32,12 @@
3032
{{ end -}}
3133
</ul>
3234
<div class="break order-6 d-md-none"></div>
35+
{{ if .Site.Params.options.flexSearch -}}
3336
<form class="navbar-form flex-grow-1 order-7 order-md-3">
3437
<input id="userinput" class="form-control is-search" type="search" placeholder="Search docs..." aria-label="Search docs..." autocomplete="off">
3538
<div id="suggestions" class="shadow bg-white rounded"></div>
3639
</form>
40+
{{ end -}}
3741
</div>
3842
</div>
3943
</header>

0 commit comments

Comments
 (0)