Merge branch 'feature/v6-core'

This commit is contained in:
Cotes Chung 2023-05-13 07:15:47 +08:00
commit fe18011f8a
No known key found for this signature in database
GPG key ID: 0D9E54843167A808
16 changed files with 234 additions and 200 deletions

View file

@ -5,7 +5,7 @@ jobs:
commitlint: commitlint:
runs-on: ubuntu-latest runs-on: ubuntu-latest
steps: steps:
- uses: actions/checkout@v2 - uses: actions/checkout@v3
with: with:
fetch-depth: 0 fetch-depth: 0
- uses: wagoid/commitlint-github-action@v4 - uses: wagoid/commitlint-github-action@v5

View file

@ -16,31 +16,31 @@ webfonts: https://fonts.googleapis.com/css2?family=Lato&family=Source+Sans+Pro:w
# Libraries # Libraries
jquery: jquery:
js: https://cdn.jsdelivr.net/npm/jquery@3.6.1/dist/jquery.min.js js: https://cdn.jsdelivr.net/npm/jquery@3.7.0/dist/jquery.min.js
bootstrap: bootstrap:
css: https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css css: https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css
js: https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js js: https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js
toc: toc:
css: https://cdn.jsdelivr.net/npm/tocbot@4.20.1/dist/tocbot.min.css css: https://cdn.jsdelivr.net/npm/tocbot@4.21.0/dist/tocbot.min.css
js: https://cdn.jsdelivr.net/npm/tocbot@4.20.1/dist/tocbot.min.js js: https://cdn.jsdelivr.net/npm/tocbot@4.21.0/dist/tocbot.min.js
fontawesome: fontawesome:
css: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.1/css/all.min.css css: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.4.0/css/all.min.css
search: search:
js: https://cdn.jsdelivr.net/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js js: https://cdn.jsdelivr.net/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js
mermaid: mermaid:
js: https://cdn.jsdelivr.net/npm/mermaid@9.2.2/dist/mermaid.min.js js: https://cdn.jsdelivr.net/npm/mermaid@9.4.3/dist/mermaid.min.js
dayjs: dayjs:
js: js:
common: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/dayjs.min.js common: https://cdn.jsdelivr.net/npm/dayjs@1.11.7/dayjs.min.js
locale: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/locale/:LOCALE.min.js locale: https://cdn.jsdelivr.net/npm/dayjs@1.11.7/locale/:LOCALE.min.js
relativeTime: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/plugin/relativeTime.min.js relativeTime: https://cdn.jsdelivr.net/npm/dayjs@1.11.7/plugin/relativeTime.min.js
localizedFormat: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/plugin/localizedFormat.min.js localizedFormat: https://cdn.jsdelivr.net/npm/dayjs@1.11.7/plugin/localizedFormat.min.js
countup: countup:
js: https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js js: https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js

View file

@ -1,44 +1,54 @@
<!-- https://giscus.app/ --> <!-- https://giscus.app/ -->
<script type="text/javascript"> <script type="text/javascript">
$(function () { (function () {
const origin = "https://giscus.app"; const origin = 'https://giscus.app';
const iframe = "iframe.giscus-frame"; const iframe = 'iframe.giscus-frame';
const lightTheme = "light"; const lightTheme = 'light';
const darkTheme = "dark_dimmed"; const darkTheme = 'dark_dimmed';
let initTheme = lightTheme;
if ($("html[data-mode=dark]").length > 0 let initTheme = lightTheme;
|| ($("html[data-mode]").length == 0 const html = document.documentElement;
&& window.matchMedia("(prefers-color-scheme: dark)").matches)) {
if (
(html.hasAttribute('data-mode') &&
html.getAttribute('data-mode') === 'dark') ||
(!html.hasAttribute('data-mode') &&
window.matchMedia('(prefers-color-scheme: dark)').matches)
) {
initTheme = darkTheme; initTheme = darkTheme;
} }
let giscusAttributes = { let giscusAttributes = {
"src": "https://giscus.app/client.js", src: 'https://giscus.app/client.js',
"data-repo": "{{ site.comments.giscus.repo}}", 'data-repo': '{{ site.comments.giscus.repo}}',
"data-repo-id": "{{ site.comments.giscus.repo_id }}", 'data-repo-id': '{{ site.comments.giscus.repo_id }}',
"data-category": "{{ site.comments.giscus.category }}", 'data-category': '{{ site.comments.giscus.category }}',
"data-category-id": "{{ site.comments.giscus.category_id }}", 'data-category-id': '{{ site.comments.giscus.category_id }}',
"data-mapping": "{{ site.comments.giscus.mapping | default: 'pathname' }}", 'data-mapping': '{{ site.comments.giscus.mapping | default: 'pathname' }}',
"data-reactions-enabled": "{{ site.comments.giscus.reactions_enabled | default: '1' }}", 'data-reactions-enabled': '{{ site.comments.giscus.reactions_enabled | default: '1' }}',
"data-emit-metadata": "0", 'data-emit-metadata': '0',
"data-theme": initTheme, 'data-theme': initTheme,
"data-input-position": "{{ site.comments.giscus.input_position | default: 'bottom' }}", 'data-input-position': '{{ site.comments.giscus.input_position | default: 'bottom' }}',
"data-lang": "{{ site.comments.giscus.lang | default: lang }}", 'data-lang': '{{ site.comments.giscus.lang | default: lang }}',
"crossorigin": "anonymous", crossorigin: 'anonymous',
"async": "" async: ''
}; };
let giscusScript = document.createElement("script"); let giscusScript = document.createElement('script');
Object.entries(giscusAttributes).forEach(([key, value]) => giscusScript.setAttribute(key, value)); Object.entries(giscusAttributes).forEach(([key, value]) =>
document.getElementById("tail-wrapper").appendChild(giscusScript); giscusScript.setAttribute(key, value)
);
document.getElementById('tail-wrapper').appendChild(giscusScript);
addEventListener("message", (event) => { addEventListener('message', (event) => {
if (event.source === window && event.data && if (
event.data.direction === ModeToggle.ID) { event.source === window &&
event.data &&
event.data.direction === ModeToggle.ID
) {
/* global theme mode changed */ /* global theme mode changed */
const mode = event.data.message; const mode = event.data.message;
const theme = (mode === ModeToggle.DARK_MODE ? darkTheme : lightTheme); const theme = mode === ModeToggle.DARK_MODE ? darkTheme : lightTheme;
const message = { const message = {
setConfig: { setConfig: {
@ -49,8 +59,6 @@
const giscus = document.querySelector(iframe).contentWindow; const giscus = document.querySelector(iframe).contentWindow;
giscus.postMessage({ giscus: message }, origin); giscus.postMessage({ giscus: message }, origin);
} }
});
}); });
})();
</script> </script>

View file

@ -58,15 +58,15 @@
{% include favicons.html %} {% include favicons.html %}
{% if site.resources.ignore_env != jekyll.environment and site.resources.self_hosted %} {% if site.resources.ignore_env != jekyll.environment and site.resources.self_hosted %}
<link href="{{ site.data.assets[origin].webfonts | relative_url }}" rel="stylesheet"> <link href="{{ site.data.origin[type].webfonts | relative_url }}" rel="stylesheet">
{% else %} {% else %}
{% for cdn in site.data.assets[origin].cdns %} {% for cdn in site.data.origin[type].cdns %}
<link rel="preconnect" href="{{ cdn.url }}" {{ cdn.args }}> <link rel="preconnect" href="{{ cdn.url }}" {{ cdn.args }}>
<link rel="dns-prefetch" href="{{ cdn.url }}" {{ cdn.args }}> <link rel="dns-prefetch" href="{{ cdn.url }}" {{ cdn.args }}>
{% endfor %} {% endfor %}
<link rel="stylesheet" href="{{ site.data.assets[origin].webfonts | relative_url }}"> <link rel="stylesheet" href="{{ site.data.origin[type].webfonts | relative_url }}">
{% endif %} {% endif %}
<!-- GA --> <!-- GA -->
@ -90,30 +90,27 @@
{% endif %} {% endif %}
<!-- Bootstrap --> <!-- Bootstrap -->
<link rel="stylesheet" href="{{ site.data.assets[origin].bootstrap.css | relative_url}}"> <link rel="stylesheet" href="{{ site.data.origin[type].bootstrap.css | relative_url}}">
<!-- Font Awesome --> <!-- Font Awesome -->
<link rel="stylesheet" href="{{ site.data.assets[origin].fontawesome.css | relative_url }}"> <link rel="stylesheet" href="{{ site.data.origin[type].fontawesome.css | relative_url }}">
<link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}"> <link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
{% if site.toc and page.toc %} {% if site.toc and page.toc %}
<link rel="stylesheet" href="{{ site.data.assets[origin].toc.css | relative_url }}"> <link rel="stylesheet" href="{{ site.data.origin[type].toc.css | relative_url }}">
{% endif %} {% endif %}
{% if page.layout == 'page' or page.layout == 'post' %} {% if page.layout == 'page' or page.layout == 'post' %}
<!-- Manific Popup --> <!-- Manific Popup -->
<link rel="stylesheet" href="{{ site.data.assets[origin].magnific-popup.css | relative_url }}"> <link rel="stylesheet" href="{{ site.data.origin[type].magnific-popup.css | relative_url }}">
{% endif %} {% endif %}
<!-- JavaScript --> <!-- JavaScript -->
<script src="{{ site.data.assets[origin].jquery.js | relative_url }}"></script>
{% unless site.theme_mode %} {% unless site.theme_mode %}
{% include mode-toggle.html %} {% include mode-toggle.html %}
{% endunless %} {% endunless %}
{% include metadata-hook.html %} {% include metadata-hook.html %}
</head> </head>

View file

@ -1,27 +1,35 @@
<!-- JS selector for site. --> <!-- JS selector for site. -->
<!-- commons -->
{% assign urls = site.data.origin[type].jquery.js
| append: ','
| append: site.data.origin[type].bootstrap.js
| append: ','
| append: site.data.origin[type].search.js
%}
<!-- layout specified --> <!-- layout specified -->
{% if page.layout == 'post' %} {% if page.layout == 'post' %}
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %} {% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
<!-- pv-report needs countup.js --> <!-- pv-report needs countup.js -->
<script async src="{{ site.data.assets[origin].countup.js | relative_url }}"></script> {% assign urls = urls | append: ',' | append: site.data.origin[type].countup.js %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if page.layout == 'post' or page.layout == 'page' or page.layout == 'home' %} {% if page.layout == 'post' or page.layout == 'page' or page.layout == 'home' %}
{% assign _urls = site.data.assets[origin].lazysizes.js %} {% assign urls = urls | append: ',' | append: site.data.origin[type].lazysizes.js %}
{% unless page.layout == 'home' %} {% unless page.layout == 'home' %}
{% assign _urls = _urls <!-- image lazy-loading & popup & clipboard -->
{% assign urls = urls
| append: ',' | append: ','
| append: site.data.assets[origin]['magnific-popup'].js | append: site.data.origin[type]['magnific-popup'].js
| append: ',' | append: ','
| append: site.data.assets[origin].clipboard.js | append: site.data.origin[type].clipboard.js
%} %}
{% endunless %} {% endunless %}
{% include jsdelivr-combine.html urls=_urls %}
{% endif %} {% endif %}
{% if page.layout == 'home' {% if page.layout == 'home'
@ -32,29 +40,39 @@
%} %}
{% assign locale = site.lang | split: '-' | first %} {% assign locale = site.lang | split: '-' | first %}
{% assign _urls = site.data.assets[origin].dayjs.js.common {% assign urls = urls
| append: ',' | append: ','
| append: site.data.assets[origin].dayjs.js.locale | append: site.data.origin[type].dayjs.js.common
| append: ','
| append: site.data.origin[type].dayjs.js.locale
| replace: ':LOCALE', locale | replace: ':LOCALE', locale
| append: ',' | append: ','
| append: site.data.assets[origin].dayjs.js.relativeTime | append: site.data.origin[type].dayjs.js.relativeTime
| append: ',' | append: ','
| append: site.data.assets[origin].dayjs.js.localizedFormat | append: site.data.origin[type].dayjs.js.localizedFormat
%} %}
{% include jsdelivr-combine.html urls=_urls %}
{% endif %} {% endif %}
{% if page.content contains '<h2' or page.content contains '<h3' and site.toc and page.toc %}
{% assign urls = urls | append: ',' | append: site.data.origin[type].toc.js %}
{% endif %}
{% if page.mermaid %}
{% assign urls = urls | append: ',' | append: site.data.origin[type].mermaid.js %}
{% endif %}
{% include jsdelivr-combine.html urls=urls %}
{% case page.layout %} {% case page.layout %}
{% when 'home', 'categories', 'post', 'page' %} {% when 'home', 'categories', 'post', 'page' %}
{% assign type = page.layout %} {% assign js = page.layout %}
{% when 'archives', 'category', 'tag' %} {% when 'archives', 'category', 'tag' %}
{% assign type = 'misc' %} {% assign js = 'misc' %}
{% else %} {% else %}
{% assign type = 'commons' %} {% assign js = 'commons' %}
{% endcase %} {% endcase %}
{% capture script %}/assets/js/dist/{{ type }}.min.js{% endcapture %} {% capture script %}/assets/js/dist/{{ js }}.min.js{% endcapture %}
<script defer src="{{ script | relative_url }}"></script> <script defer src="{{ script | relative_url }}"></script>
{% if page.math %} {% if page.math %}
@ -76,14 +94,10 @@
} }
}; };
</script> </script>
<script src="{{ site.data.assets[origin].polyfill.js | relative_url }}"></script> <script src="{{ site.data.origin[type].polyfill.js | relative_url }}"></script>
<script id="MathJax-script" async src="{{ site.data.assets[origin].mathjax.js | relative_url }}"></script> <script id="MathJax-script" async src="{{ site.data.origin[type].mathjax.js | relative_url }}"></script>
{% endif %} {% endif %}
<!-- commons -->
<script src="{{ site.data.assets[origin].bootstrap.js | relative_url }}"></script>
{% if jekyll.environment == 'production' %} {% if jekyll.environment == 'production' %}
<!-- PWA --> <!-- PWA -->
{% if site.pwa.enabled %} {% if site.pwa.enabled %}

View file

@ -5,7 +5,6 @@
{% assign domain = 'https://cdn.jsdelivr.net/' %} {% assign domain = 'https://cdn.jsdelivr.net/' %}
{% for url in urls %} {% for url in urls %}
{% if url contains domain %} {% if url contains domain %}
{% assign url_snippet = url | slice: domain.size, url.size %} {% assign url_snippet = url | slice: domain.size, url.size %}
@ -16,15 +15,10 @@
{% endif %} {% endif %}
{% elsif url contains '//' %} {% elsif url contains '//' %}
<script src="{{ url }}"></script> <script src="{{ url }}"></script>
{% else %} {% else %}
<script src="{{ url | relative_url }}"></script> <script src="{{ url | relative_url }}"></script>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{% if combined_urls %} {% if combined_urls %}

View file

@ -1,43 +1,37 @@
<!-- <!-- mermaid-js loader -->
mermaid-js loader <script type="text/javascript">
-->
<script src="{{ site.data.assets[origin].mermaid.js | relative_url }}"></script>
<script>
(function () { (function () {
function updateMermaid(event) { function updateMermaid(event) {
if (event.source === window && event.data && if (event.source === window && event.data && event.data.direction === ModeToggle.ID) {
event.data.direction === ModeToggle.ID) {
const mode = event.data.message; const mode = event.data.message;
if (typeof mermaid === "undefined") { if (typeof mermaid === 'undefined') {
return; return;
} }
let expectedTheme = (mode === ModeToggle.DARK_MODE ? "dark" : "default"); let expectedTheme = mode === ModeToggle.DARK_MODE ? 'dark' : 'default';
let config = { theme: expectedTheme }; let config = { theme: expectedTheme };
/* Re-render the SVG <https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */ /* Re-render the SVG <https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */
$(".mermaid").each(function () { $('.mermaid').each(function () {
let svgCode = $(this).prev().children().html(); let svgCode = $(this).prev().children().html();
$(this).removeAttr("data-processed"); $(this).removeAttr('data-processed');
$(this).html(svgCode); $(this).html(svgCode);
}); });
mermaid.initialize(config); mermaid.initialize(config);
mermaid.init(undefined, ".mermaid"); mermaid.init(undefined, '.mermaid');
} }
} }
let initTheme = "default"; let initTheme = 'default';
const html = document.documentElement;
if ($("html[data-mode=dark]").length > 0 if (
|| ($("html[data-mode]").length == 0 (html.hasAttribute('data-mode') && html.getAttribute('data-mode') === 'dark') ||
&& window.matchMedia("(prefers-color-scheme: dark)").matches)) { (!html.hasAttribute('data-mode') && window.matchMedia('(prefers-color-scheme: dark)').matches)
initTheme = "dark"; ) {
initTheme = 'dark';
} }
let mermaidConf = { let mermaidConf = {
@ -45,15 +39,20 @@
}; };
/* Create mermaid tag */ /* Create mermaid tag */
$("pre").has("code.language-mermaid").each(function () { document.querySelectorAll('pre>code.language-mermaid').forEach((elem) => {
let svgCode = $(this).children().html(); const svgCode = elem.textContent;
$(this).addClass("unloaded"); const backup = elem.parentElement;
$(this).after(`<pre class=\"mermaid\">${svgCode}</pre>`); backup.classList.add('unloaded');
/* create mermaid node */
let mermaid = document.createElement('pre');
mermaid.classList.add('mermaid');
const text = document.createTextNode(svgCode);
mermaid.appendChild(text);
backup.after(mermaid);
}); });
mermaid.initialize(mermaidConf); mermaid.initialize(mermaidConf);
window.addEventListener("message", updateMermaid); window.addEventListener('message', updateMermaid);
})(); })();
</script> </script>

View file

@ -1,14 +1,22 @@
<!-- <!-- Switch the mode between dark and light. -->
Switch the mode between dark and light.
-->
<script type="text/javascript"> <script type="text/javascript">
class ModeToggle { class ModeToggle {
static get MODE_KEY() { return "mode"; } static get MODE_KEY() {
static get MODE_ATTR() { return "data-mode"; } return 'mode';
static get DARK_MODE() { return "dark"; } }
static get LIGHT_MODE() { return "light"; } static get MODE_ATTR() {
static get ID() { return "mode-toggle"; } return 'data-mode';
}
static get DARK_MODE() {
return 'dark';
}
static get LIGHT_MODE() {
return 'light';
}
static get ID() {
return 'mode-toggle';
}
constructor() { constructor() {
if (this.hasMode) { if (this.hasMode) {
@ -45,17 +53,29 @@
}); });
} /* constructor() */ } /* constructor() */
get sysDarkPrefers() { return window.matchMedia("(prefers-color-scheme: dark)"); } get sysDarkPrefers() {
return window.matchMedia('(prefers-color-scheme: dark)');
}
get isSysDarkPrefer() { return this.sysDarkPrefers.matches; } get isSysDarkPrefer() {
return this.sysDarkPrefers.matches;
}
get isDarkMode() { return this.mode === ModeToggle.DARK_MODE; } get isDarkMode() {
return this.mode === ModeToggle.DARK_MODE;
}
get isLightMode() { return this.mode === ModeToggle.LIGHT_MODE; } get isLightMode() {
return this.mode === ModeToggle.LIGHT_MODE;
}
get hasMode() { return this.mode != null; } get hasMode() {
return this.mode != null;
}
get mode() { return sessionStorage.getItem(ModeToggle.MODE_KEY); } get mode() {
return sessionStorage.getItem(ModeToggle.MODE_KEY);
}
/* get the current mode on screen */ /* get the current mode on screen */
get modeStatus() { get modeStatus() {
@ -67,26 +87,29 @@
} }
setDark() { setDark() {
$('html').attr(ModeToggle.MODE_ATTR, ModeToggle.DARK_MODE); document.documentElement.setAttribute(ModeToggle.MODE_ATTR, ModeToggle.DARK_MODE);
sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE); sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE);
} }
setLight() { setLight() {
$('html').attr(ModeToggle.MODE_ATTR, ModeToggle.LIGHT_MODE); document.documentElement.setAttribute(ModeToggle.MODE_ATTR, ModeToggle.LIGHT_MODE);
sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE); sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE);
} }
clearMode() { clearMode() {
$('html').removeAttr(ModeToggle.MODE_ATTR); document.documentElement.removeAttribute(ModeToggle.MODE_ATTR);
sessionStorage.removeItem(ModeToggle.MODE_KEY); sessionStorage.removeItem(ModeToggle.MODE_KEY);
} }
/* Notify another plugins that the theme mode has changed */ /* Notify another plugins that the theme mode has changed */
notify() { notify() {
window.postMessage({ window.postMessage(
{
direction: ModeToggle.ID, direction: ModeToggle.ID,
message: this.modeStatus message: this.modeStatus
}, "*"); },
'*'
);
} }
flipMode() { flipMode() {

View file

@ -1,12 +1,13 @@
{% comment %} Site static assets origin {% endcomment %} {% comment %} Site static assets origin type {% endcomment %}
{% assign origin = 'cross_origin' %}
{% assign type = 'cors' %}
{% if site.assets.self_host.enabled %} {% if site.assets.self_host.enabled %}
{% if site.assets.self_host.env %} {% if site.assets.self_host.env %}
{% if site.assets.self_host.env == jekyll.environment %} {% if site.assets.self_host.env == jekyll.environment %}
{% assign origin = 'self_host' %} {% assign type = 'basic' %}
{% endif %} {% endif %}
{% else %} {% else %}
{% assign origin = 'self_host' %} {% assign type = 'basic' %}
{% endif %} {% endif %}
{% endif %} {% endif %}

View file

@ -16,10 +16,8 @@
{% capture not_found %}<p class="mt-5">{{ site.data.locales[include.lang].search.no_results }}</p>{% endcapture %} {% capture not_found %}<p class="mt-5">{{ site.data.locales[include.lang].search.no_results }}</p>{% endcapture %}
<script src="{{ site.data.assets[origin].search.js | relative_url }}"></script>
<script> <script>
/* Note: dependent library will be loaded in `js-selector.html` */
SimpleJekyllSearch({ SimpleJekyllSearch({
searchInput: document.getElementById('search-input'), searchInput: document.getElementById('search-input'),
resultsContainer: document.getElementById('search-results'), resultsContainer: document.getElementById('search-results'),
@ -44,5 +42,4 @@ SimpleJekyllSearch({
} }
} }
}); });
</script> </script>

View file

@ -10,7 +10,4 @@
<div class="panel-heading ps-3 pt-2 mb-2">{{- site.data.locales[include.lang].panel.toc -}}</div> <div class="panel-heading ps-3 pt-2 mb-2">{{- site.data.locales[include.lang].panel.toc -}}</div>
<nav id="toc"></nav> <nav id="toc"></nav>
</div> </div>
<!-- toc.js will be loaded at medium priority -->
<script src="{{ site.data.assets[origin].toc.js | relative_url }}"></script>
{% endif %} {% endif %}

View file

@ -6,7 +6,6 @@ import ScrollHelper from './utils/scroll-helper';
const $searchInput = $('#search-input'); const $searchInput = $('#search-input');
const delta = ScrollHelper.getTopbarHeight(); const delta = ScrollHelper.getTopbarHeight();
let didScroll;
let lastScrollTop = 0; let lastScrollTop = 0;
function hasScrolled() { function hasScrolled() {
@ -60,34 +59,41 @@ function handleLandscape() {
export function switchTopbar() { export function switchTopbar() {
const orientation = screen.orientation; const orientation = screen.orientation;
if (orientation) { let didScroll = false;
orientation.onchange = () => {
const handleOrientationChange = () => {
const type = orientation.type; const type = orientation.type;
if (type === 'landscape-primary' || type === 'landscape-secondary') { if (type === 'landscape-primary' || type === 'landscape-secondary') {
handleLandscape(); handleLandscape();
} }
}; };
} else {
// for the browsers that not support `window.screen.orientation` API const handleWindowChange = () => {
$(window).on('orientationchange', () => {
if ($(window).width() < $(window).height()) { if ($(window).width() < $(window).height()) {
// before rotating, it is still in portrait mode. // before rotating, it is still in portrait mode.
handleLandscape(); handleLandscape();
} }
}); };
}
$(window).on('scroll', () => { const handleScroll = () => {
if (didScroll) {
return;
}
didScroll = true; didScroll = true;
}); };
setInterval(() => { const checkScroll = () => {
if (didScroll) { if (didScroll) {
hasScrolled(); hasScrolled();
didScroll = false; didScroll = false;
} }
}, 250); };
if (orientation) {
orientation.addEventListener('change', handleOrientationChange);
} else {
// for the browsers that not support `window.screen.orientation` API
$(window).on('orientationchange', handleWindowChange);
}
$(window).on('scroll', handleScroll);
setInterval(checkScroll, 250);
} }

View file

@ -5,7 +5,7 @@ layout: compress
<!doctype html> <!doctype html>
{% include assets-origin.html %} {% include origin-type.html %}
{% include lang.html %} {% include lang.html %}
@ -21,7 +21,6 @@ layout: compress
<body data-topbar-visible="true"> <body data-topbar-visible="true">
{% include sidebar.html lang=lang %} {% include sidebar.html lang=lang %}
{% include topbar.html lang=lang %} {% include topbar.html lang=lang %}
<div id="main-wrapper" class="d-flex justify-content-center"> <div id="main-wrapper" class="d-flex justify-content-center">
@ -31,14 +30,9 @@ layout: compress
{% include search-results.html lang=lang %} {% include search-results.html lang=lang %}
</div> </div>
<!-- #main-wrapper -->
{% include footer.html lang=lang %} {% include footer.html lang=lang %}
{% if page.mermaid %}
{% include mermaid.html %}
{% endif %}
<div id="mask"></div> <div id="mask"></div>
<a id="back-to-top" href="#" aria-label="back-to-top" class="btn btn-lg btn-box-shadow" role="button"> <a id="back-to-top" href="#" aria-label="back-to-top" class="btn btn-lg btn-box-shadow" role="button">
@ -72,8 +66,12 @@ layout: compress
</div> </div>
{% endif %} {% endif %}
{% include search-loader.html %}
{% include js-selector.html %} {% include js-selector.html %}
{% if page.mermaid %}
{% include mermaid.html %}
{% endif %}
{% include search-loader.html %}
</body> </body>
</html> </html>

View file

@ -3,7 +3,7 @@ layout: default
--- ---
{% include lang.html %} {% include lang.html %}
{% include assets-origin.html %} {% include origin-type.html %}
<div class="row"> <div class="row">
<!-- core --> <!-- core -->

@ -1 +1 @@
Subproject commit 24ebdb708f3f5451df953cb5f9deb3ad4433404a Subproject commit 5f28c7d5107a1c2e30381765194269680a3d0eae