diff options
author | Simone <26844016+simonebortolin@users.noreply.github.com> | 2022-12-30 17:54:00 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-12-30 17:54:00 +0100 |
commit | 9b16504485a14b477aa00ae33a43d91e7e4ce9e6 (patch) | |
tree | 5e1d9aba2b5e70055ed96daba87786d80cc6085e | |
parent | Hot fix pages.yml (#74) (diff) | |
download | hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.tar hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.tar.gz hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.tar.bz2 hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.tar.lz hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.tar.xz hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.tar.zst hack-gpon.github.io-9b16504485a14b477aa00ae33a43d91e7e4ce9e6.zip |
-rw-r--r-- | _config.yml | 13 | ||||
-rw-r--r-- | _includes/cig_password.html | 30 | ||||
-rw-r--r-- | _includes/icons/custom.html | 9 | ||||
-rw-r--r-- | _layouts/default.html | 394 | ||||
-rw-r--r-- | _ont/ont-huawei-ma5671a-root-web.md | 8 | ||||
-rw-r--r-- | _sass/custom/custom.scss | 120 | ||||
-rw-r--r-- | _tools/ascii-hex.md | 53 | ||||
-rw-r--r-- | _tools/speed-gpon-eth.md | 161 | ||||
-rw-r--r-- | assets/js/modal.js | 28 | ||||
-rw-r--r-- | assets/js/theme-switch.js | 37 |
10 files changed, 359 insertions, 494 deletions
diff --git a/_config.yml b/_config.yml index 1246691..3633e02 100644 --- a/_config.yml +++ b/_config.yml @@ -33,18 +33,21 @@ plugins: - jekyll-redirect-from - jekyll-default-layout -color_scheme: "light" +color_scheme: "auto" +enable_switch_color_scheme: true +enable_localstorage_color_scheme: true + url: "https://hack-gpon.github.io" nav_sort: case_sensitive -aux_links: +aux_buttons: - title: "GitHub" color: 'purple' - icon: 'svg-github' + icon: 'github' link: '//github.com/hack-gpon/hack-gpon.github.io' - title: "Telegram" color: 'blue' - icon: 'svg-telegram' + icon: 'telegram' link: '//t.me/HackGPON' #aux_links: @@ -90,6 +93,8 @@ mermaid: # barGap: 4 # topPadding: 50 +enable_modal: true + collections: ont: permalink: "/:path/" diff --git a/_includes/cig_password.html b/_includes/cig_password.html index 5118a5c..e3be28b 100644 --- a/_includes/cig_password.html +++ b/_includes/cig_password.html @@ -1,32 +1,40 @@ <div> - <form id="cig-password"> + <form id="cig-password" novalidate> <div class="form-floating mb-3"> <input type="text" class="form-control" placeholder="Serial Number" name="serial" id="serial" required pattern="[A-Z]{4}[0-9a-z]{8}"> - <label for="serial">GPON S/N in format GPONabc12345</label> + <label for="serial" class="form-label">GPON S/N in format GPONabc12345</label> + <div class="invalid-feedback"> + Please provide a valid GPON S/N. + </div> </div> <div class="mb-3"> <input type="submit" class="btn btn-primary" value="Generate!" id="submit"> - <label for="submit">Warning: this script is hosted on a third-party server.</label> + <label for="submit" class="form-label">Warning: this script is hosted on a third-party server.</label> </div> <div class="form-floating mb-3"> <input readonly type="text" class="form-control" placeholder="Serial Number" name="username" id="username" value="{{include.username}}"> - <label for="username">Username</label> + <label for="username" class="form-label">Username</label> </div> <div class="form-floating mb-3"> <input readonly class="form-control" type="text" id="result" placeholder="Result"> - <label for="result">Password</label> + <label for="result" class="form-label">Password</label> </div> </form> <script> var cigPassword = document.getElementById('cig-password'); cigPassword.addEventListener('submit', (event) => { event.preventDefault(); - const data = new URLSearchParams(new FormData(cigPassword)); - var url = new URL("https://cigpassword.ml/"); - url.search = data.toString(); - fetch(url, {mode: 'cors'}).then(response => response.json()).then(json => document.getElementById('result').value = json.password).catch((error) => { - document.getElementById('result').value = "Error!" - }); + if (!cigPassword.checkValidity()) { + event.preventDefault(); + } else { + const data = new URLSearchParams(new FormData(cigPassword)); + var url = new URL("https://cigpassword.ml/"); + url.search = data.toString(); + fetch(url, {mode: 'cors'}).then(response => response.json()).then(json => document.getElementById('result').value = json.password).catch((error) => { + document.getElementById('result').value = "Error!" + }); + } + [...cigPassword.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); }); </script> </div>
\ No newline at end of file diff --git a/_includes/icons/custom.html b/_includes/icons/custom.html index a83ef5b..7fc2266 100644 --- a/_includes/icons/custom.html +++ b/_includes/icons/custom.html @@ -9,4 +9,11 @@ <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 16 16" role="img" aria-label="GitHub"> <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/> </svg> -</symbol>
\ No newline at end of file +</symbol> +<symbol id="svg-edit" viewBox="0 0 24 24"> + <title>Edit</title> + <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> + <path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"> + </path> + </svg> +</symbol>
\ No newline at end of file diff --git a/_layouts/default.html b/_layouts/default.html index 15482bb..43d58d6 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -6,57 +6,45 @@ layout: table_wrappers <html lang="{{ site.lang | default: 'en-US' }}"> {% include head.html %} - <body> + <a class="skip-to-main" href="#main-content">Skip to main content</a> <svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <symbol id="svg-link" viewBox="0 0 24 24"> <title>Link</title> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" - stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" - class="feather feather-link"> - <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path> - <path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link"> + <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path> </svg> </symbol> <symbol id="svg-search" viewBox="0 0 24 24"> <title>Search</title> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" - stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" - class="feather feather-search"> - <circle cx="11" cy="11" r="8"></circle> - <line x1="21" y1="21" x2="16.65" y2="16.65"></line> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"> + <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line> </svg> </symbol> <symbol id="svg-menu" viewBox="0 0 24 24"> <title>Menu</title> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" - stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" - class="feather feather-menu"> - <line x1="3" y1="12" x2="21" y2="12"></line> - <line x1="3" y1="6" x2="21" y2="6"></line> - <line x1="3" y1="18" x2="21" y2="18"></line> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu"> + <line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line> </svg> </symbol> <symbol id="svg-arrow-right" viewBox="0 0 24 24"> <title>Expand</title> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" - stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" - class="feather feather-chevron-right"> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"> <polyline points="9 18 15 12 9 6"></polyline> </svg> </symbol> <symbol id="svg-doc" viewBox="0 0 24 24"> <title>Document</title> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" - stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" - class="feather feather-file"> - <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path> - <polyline points="13 2 13 9 20 9"></polyline> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file"> + <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline> </svg> </symbol> {% include icons/alert.html %} - {% include icons/code_copy.html %} {% include icons/external_link.html %} + {% include icons/code_copy.html %} + {% if site.enable_switch_color_scheme != false %} + {% include icons/switch_color_scheme.html %} + {% endif %} {% include icons/custom.html %} </svg> @@ -64,66 +52,83 @@ layout: table_wrappers <div class="site-header"> <a href="{{ '/' | relative_url }}" class="site-title lh-tight">{% include title.html %}</a> <a href="#" id="menu-button" class="site-button"> - <svg viewBox="0 0 24 24" class="icon"> - <use xlink:href="#svg-menu"></use> - </svg> + <svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-menu"></use></svg> </a> </div> <nav role="navigation" aria-label="Main" id="site-nav" class="site-nav"> {% include nav/main.html %} </nav> - {% capture nav_footer_custom %} - {%- include nav_footer_custom.html -%} - {% endcapture %} - {% if nav_footer_custom != "" %} - {{ nav_footer_custom }} - {% else %} - <footer class="site-footer"> - This site uses <a href="https://github.com/just-the-docs/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll. - </footer> + + {% capture nav_footer_custom %} + {%- include nav_footer_custom.html -%} + {% endcapture %} + {% if nav_footer_custom != "" %} + {{ nav_footer_custom }} + {% else %} + <footer class="site-footer"> + This site uses <a href="https://github.com/just-the-docs/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll. + </footer> {% endif %} </div> <div class="main" id="top"> <div id="main-header" class="main-header"> {% if site.search_enabled != false %} - {% capture search_placeholder %}{% include search_placeholder_custom.html %}{% endcapture %} - <div class="search"> - <div class="search-input-wrap"> - <input type="text" id="search-input" class="search-input" tabindex="0" placeholder="{{ search_placeholder | strip_html | strip }}" aria-label="{{ search_placeholder | strip_html| strip }}" autocomplete="off"> - <label for="search-input" class="search-label"><svg viewBox="0 0 24 24" class="search-icon"><use xlink:href="#svg-search"></use></svg></label> - </div> - <div id="search-results" class="search-results"></div> - </div> + + {% capture search_placeholder %}{% include search_placeholder_custom.html %}{% endcapture %} + + <div class="search"> + <div class="search-input-wrap"> + <input type="text" id="search-input" class="search-input" tabindex="0" placeholder="{{ search_placeholder | strip_html | strip }}" aria-label="{{ search_placeholder | strip_html| strip }}" autocomplete="off"> + <label for="search-input" class="search-label"><svg viewBox="0 0 24 24" class="search-icon"><use xlink:href="#svg-search"></use></svg></label> + </div> + <div id="search-results" class="search-results"></div> + </div> + {% else %} + <div></div> {% endif %} {% include header_custom.html %} - <nav class="aux-nav"> - <ul class="aux-nav-list"> - {% if site.aux_links %} - {% for link in site.aux_links %} - <li class="aux-nav-list-item"> - <span class="site-button"> - <a href="{{ link.link }}" class="btn btn-{{ link.color }}">{{ link.title }} - {% if link.logo %} - <img src="{{ link.logo }}"></img> - {% endif %} - {% if link.icon %} - <svg> - <use xlink:href="#{{ link.icon }}"></use> - </svg> - </svg> - {% endif %} - </a> - </span> - </li> - {% endfor %} - {% endif %} - <li class="aux-nav-list-item"><span class="site-button "><a class="btn js-toggle-dark-mode">Dark - mode</a></span></li> - </ul> - </nav> + {% if site.aux_links or site.aux_buttons or site.enable_switch_color_scheme == true %} + <nav aria-label="Auxiliary" class="aux-nav"> + <ul class="aux-nav-list"> + {% for link in site.aux_buttons %} + <span class="site-button"> + <a href="{{ link.link }}" class="btn btn-{{ link.color }}">{{ link.title }} + {% if link.logo %} + <img src="{{ link.logo }}" class="site-button-icon"></img> + {% endif %} + {% if link.icon %} + <svg class="site-button-icon"> + <use xlink:href="#svg-{{ link.icon }}"></use> + </svg> + </svg> + {% endif %} + </a> + </span> + {% endfor %} + {% for link in site.aux_links %} + <li class="aux-nav-list-item"> + <a href="{{ link.last }}" class="site-button" + {% if site.aux_links_new_tab %} + target="_blank" rel="noopener noreferrer" + {% endif %} + > + {{ link.first }} + </a> + </li> + {% endfor %} + {% if site.enable_switch_color_scheme == true %} + <li class="aux-nav-list-item"> + <button class="site-button color-scheme-switch-theme-button"> + <svg aria-hidden="true" class="site-button-icon"><use href="#svg-{{ site.color_scheme | default: 'light' }}"></use></svg> + </button> + </li> + {% endif %} + </ul> + </nav> + {% endif %} </div> <div id="main-content-wrap" class="main-content-wrap"> - {% if page.parent and page.url != "/" %} + {% if page.parent and page.url != "/" %} {% include nav/crumbs.html nodes=nav_page_ancestors %} {% endif %} <div id="main-content" class="main-content" role="main"> @@ -139,9 +144,7 @@ layout: table_wrappers href="{{ site.gh_edit_repository }}/{{ site.gh_edit_view_mode }}/{{ site.gh_edit_branch }}{% if site.gh_edit_source %}/{{ site.gh_edit_source }}{% endif %}/{{ page.path }}" id="edit-this-page" title="{{ site.gh_edit_link_text }}"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> - <path - d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"> - </path> + <use xlink:href="#svg-edit"> </svg></a> {% endif %} <h1 class="fs-9">{{ page.title | default: site.title | default: site.github.repository_name }}</h1> @@ -151,10 +154,10 @@ layout: table_wrappers {% if site.last_edit_timestamp_script == true %} <ul class="metadata text-small"> <li id="last-modified">Last Modified</li> - <li><a id="contributors" data-toogle="modal" data-target="#contributors-modal">Contributor</a> + <li><a id="contributors" data-jtd-toogle="modal" data-jtd-target="#contributors-modal">Contributor</a> </li> </ul> - <div class="modal" data-modal="contributors-modal" id="contributors-modal"> + <div class="modal" data-jtd-modal="contributors-modal" id="contributors-modal"> <div class="modal-content"> <div class="modal-header"> <span class="close">×</span> @@ -172,138 +175,141 @@ layout: table_wrappers </header> <hr> {% if site.heading_anchors != false %} - {% include vendor/anchor_headings.html html=content beforeHeading="true" anchorBody="<svg viewBox=\"0 0 16 16\" aria-hidden=\"true\"><use xlink:href=\"#svg-link\"></use></svg>" anchorClass="anchor-heading" anchorAttrs="aria-labelledby=\"%html_id%\"" %} - {% else %} - {{ content }} - {% endif %} - {% unless page.has_toc == false %} - {% include nav/toc.html nodes=nav_page_children %} - {% endunless %} - {% capture footer_custom %} - {%- include footer_custom.html -%} + {% include vendor/anchor_headings.html html=content beforeHeading="true" anchorBody="<svg viewBox=\"0 0 16 16\" aria-hidden=\"true\"><use xlink:href=\"#svg-link\"></use></svg>" anchorClass="anchor-heading" anchorAttrs="aria-labelledby=\"%html_id%\"" %} + {% else %} + {{ content }} + {% endif %} + + {% unless page.has_toc == false %} + {% include nav/toc.html nodes=nav_page_children %} + {% endunless %} + + {% capture footer_custom %} + {%- include footer_custom.html -%} {% endcapture %} {% if footer_custom != "" or site.last_edit_timestamp or site.gh_edit_link %} - <hr> - <footer> - {% if site.back_to_top %} - <p><a href="#top" id="back-to-top">{{ site.back_to_top_text }}</a></p> - {% endif %} - {{ footer_custom }} - {% if site.last_edit_timestamp or site.gh_edit_link %} - <div class="d-flex mt-2"> - {% if site.last_edit_timestamp and site.last_edit_time_format and page.last_modified_date %} - <p class="text-small text-grey-400 mb-0 mr-2"> - Page last modified: <span class="d-inline-block">{{ page.last_modified_date | date: site.last_edit_time_format }}</span>. - </p> - {% endif %} - {% if - site.gh_edit_link and - site.gh_edit_link_text and - site.gh_edit_repository and - site.gh_edit_branch and - site.gh_edit_view_mode - %} - <p class="text-small text-grey-400 mb-0"> - <a href="{{ site.gh_edit_repository }}/{{ site.gh_edit_view_mode }}/{{ site.gh_edit_branch }}{% if site.gh_edit_source %}/{{ site.gh_edit_source }}{% endif %}{% if page.collection and site.collections_dir %}/{{ site.collections_dir }}{% endif %}/{{ page.path }}" id="edit-this-page">{{ site.gh_edit_link_text }}</a> - </p> - {% endif %} - </div> - {% endif %} - </footer> - {% endif %} - </div> - </div> - {% if site.search_enabled != false %} - {% if site.search.button %} - <a href="#" id="search-button" class="search-button"> - <svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-search"></use></svg> - </a> - {% endif %} - <div class="search-overlay"></div> - {% endif %} - </div> + <hr> + <footer> + {% if site.back_to_top %} + <p><a href="#top" id="back-to-top">{{ site.back_to_top_text }}</a></p> + {% endif %} -</body> -<script src="{{ base.url | prepend: site.url }}/assets/js/theme-switch.js"></script> -<script src="{{ base.url | prepend: site.url }}/assets/js/modal.js"></script> + {{ footer_custom }} -{%if site.last_edit_timestamp_script and site.gh_owner_name and site.gh_repository_name and page.path %} -<script> - var listOfScannedFilename = []; + {% if site.last_edit_timestamp or site.gh_edit_link %} + <div class="d-flex mt-2"> + {% if site.last_edit_timestamp and site.last_edit_time_format and page.last_modified_date %} + <p class="text-small text-grey-400 mb-0 mr-2"> + Page last modified: <span class="d-inline-block">{{ page.last_modified_date | date: site.last_edit_time_format }}</span>. + </p> + {% endif %} + {% if + site.gh_edit_link and + site.gh_edit_link_text and + site.gh_edit_repository and + site.gh_edit_branch and + site.gh_edit_view_mode + %} + <p class="text-small text-grey-400 mb-0"> + <a href="{{ site.gh_edit_repository }}/{{ site.gh_edit_view_mode }}/{{ site.gh_edit_branch }}{% if site.gh_edit_source %}/{{ site.gh_edit_source }}{% endif %}{% if page.collection and site.collections_dir %}/{{ site.collections_dir }}{% endif %}/{{ page.path }}" id="edit-this-page">{{ site.gh_edit_link_text }}</a> + </p> + {% endif %} + </div> + {% endif %} + </footer> + {% endif %} - async function parseFirstCommit(commit, filename) { - return fetch(commit.url).then((response) => { - return response.json(); - }).then(async function (commits) { - var old_filename = commits.files.filter(it => it.filename === filename && it.status === 'renamed').map(it => it.previous_filename); - if (old_filename[0] !== undefined && !listOfScannedFilename.includes(old_filename[0])) { - listOfScannedFilename.push(old_filename[0]); - return fetch("https://api.github.com/repos/{{ site.gh_owner_name }}/{{ site.gh_repository_name }}/commits?path=" + old_filename[0]) - .then((response) => { - return response.json(); - }).then(async function (commits) { - return parseCommitsList(commits, old_filename); - }); - } - }); - } - async function parseCommitsList(commits, filename) { - var authors = commits.flatMap(x => [{ ...x.commit.author, ...x.author }, { ...x.commit.committer, ...x.committer }]).map(({ date, ...keepAttrs }) => keepAttrs).filter((value, index, self) => - index === self.findIndex((t) => ( - t.login === value.login - )) && value.login !== "web-flow" - ); + </div> + </div> - var inner = await parseFirstCommit(commits[commits.length - 1], filename); + {% if site.search_enabled != false %} + {% if site.search.button %} + <a href="#" id="search-button" class="search-button"> + <svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-search"></use></svg> + </a> + {% endif %} + <div class="search-overlay"></div> + {% endif %} + </div> - if (inner) { - inner = inner.filter(it => !authors.map(i => i.login).includes(it.login) && it.login !== "web-flow"); - authors.push(...inner); + {%if site.last_edit_timestamp_script and site.gh_owner_name and site.gh_repository_name and page.path %} + <script> + var listOfScannedFilename = []; + async function parseFirstCommit(commit, filename) { + return fetch(commit.url).then((response) => { + return response.json(); + }).then(async function (commits) { + var old_filename = commits.files.filter(it => it.filename === filename && it.status === 'renamed').map(it => it.previous_filename); + if (old_filename[0] !== undefined && !listOfScannedFilename.includes(old_filename[0])) { + listOfScannedFilename.push(old_filename[0]); + return fetch("https://api.github.com/repos/{{ site.gh_owner_name }}/{{ site.gh_repository_name }}/commits?path=" + old_filename[0]) + .then((response) => { + return response.json(); + }).then(async function (commits) { + return parseCommitsList(commits, old_filename); + }); + } + }); } + async function parseCommitsList(commits, filename) { + var authors = commits.flatMap(x => [{ ...x.commit.author, ...x.author }, { ...x.commit.committer, ...x.committer }]).map(({ date, ...keepAttrs }) => keepAttrs).filter((value, index, self) => + index === self.findIndex((t) => ( + t.login === value.login + )) && value.login !== "web-flow" + ); + var inner = await parseFirstCommit(commits[commits.length - 1], filename); - return authors; - } - async function setModifiedDate() { - if (document.getElementById('last-modified')) { - listOfScannedFilename.push("{{ page.path }}"); - fetch("https://api.github.com/repos/{{ site.gh_owner_name }}/{{ site.gh_repository_name }}/commits?path={{ page.path }}") - .then((response) => { - return response.json(); - }) - .then(async function (commits) { - try{ - var date = new Date(commits[0]['commit']['committer']['date']); - var modified = date.toLocaleDateString(undefined); - var authors = await parseCommitsList(commits, "{{ page.path }}"); + if (inner) { + inner = inner.filter(it => !authors.map(i => i.login).includes(it.login) && it.login !== "web-flow"); + authors.push(...inner); - document.getElementById('last-modified').textContent = "Last Modified: " + modified; - document.getElementById('contributors').textContent = authors.length + " " + (authors.length == 1 ? "Contributor" : "Contributors"); + } - document.getElementById('contributors-modal-list').innerHTML = authors.map(x => "<li><a href='" + x.html_url + "'><img class='avatar' src='" + x.avatar_url + "'><span>" + x.name + "</span<</a></li>").join(''); - } catch (err) { - document.getElementById('last-modified').textContent = "Sorry, last modified not currently available"; - document.getElementById('contributors').textContent = "Contributors"; - document.getElementById('contributors-modal-list').innerHTML = "<li>Sorry, list not currently available</li>"; - } - }); + + return authors; } - } + async function setModifiedDate() { + if (document.getElementById('last-modified')) { + listOfScannedFilename.push("{{ page.path }}"); + fetch("https://api.github.com/repos/{{ site.gh_owner_name }}/{{ site.gh_repository_name }}/commits?path={{ page.path }}") + .then((response) => { + return response.json(); + }) + .then(async function (commits) { + try{ + var date = new Date(commits[0]['commit']['committer']['date']); + var modified = date.toLocaleDateString(undefined); + + var authors = await parseCommitsList(commits, "{{ page.path }}"); - window.addEventListener('load', function () { - setModifiedDate() - }); -</script> -{% endif %} -{% if site.mermaid_enabled != false %} -<script> - var config = {% include mermaid_config.js %}; - mermaid.initialize(config); - window.mermaid.init(undefined, document.querySelectorAll('.language-mermaid')); -</script> -{% endif %} + document.getElementById('last-modified').textContent = "Last Modified: " + modified; + document.getElementById('contributors').textContent = authors.length + " " + (authors.length == 1 ? "Contributor" : "Contributors"); -</html>
\ No newline at end of file + document.getElementById('contributors-modal-list').innerHTML = authors.map(x => "<li><a href='" + x.html_url + "'><img class='avatar' src='" + x.avatar_url + "'><span>" + x.name + "</span<</a></li>").join(''); + } catch (err) { + document.getElementById('last-modified').textContent = "Sorry, last modified not currently available"; + document.getElementById('contributors').textContent = "Contributors"; + document.getElementById('contributors-modal-list').innerHTML = "<li>Sorry, list not currently available</li>"; + } + }); + } + } + + window.addEventListener('load', function () { + setModifiedDate() + }); + </script> + {% endif %} + {% if site.mermaid %} + <script> + var config = {% include mermaid_config.js %}; + mermaid.initialize(config); + window.mermaid.init(undefined, document.querySelectorAll('.language-mermaid')); + </script> + {% endif %} +</body> +</html> diff --git a/_ont/ont-huawei-ma5671a-root-web.md b/_ont/ont-huawei-ma5671a-root-web.md index ddc0b77..9ca10d2 100644 --- a/_ont/ont-huawei-ma5671a-root-web.md +++ b/_ont/ont-huawei-ma5671a-root-web.md @@ -27,7 +27,7 @@ Connect the SFP adapter to the TTL adapter according to the following diagram: Connect the TTL adapter to the computer, once done press the following button. A window will open that will execute the root. {: .text-center .fs-6 } -<button id="start-button" class="btn btn-blue" data-toogle="modal" data-target="#root-modal" disabled>Start root!</button> +<button id="start-button" class="btn btn-blue" data-jtd-toogle="modal" data-jtd-target="#root-modal" disabled>Start root!</button> <div id="browser-error" style="display:none">{% include alert.html content="This browser is not compatible with the web-root procedure. See the <a href='https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API#browser_compatibility'>Browser compatibility</a>" alert="Note" icon="svg-warning" color="red" %}</div> <noscript> @@ -64,7 +64,7 @@ fw_setenv asc0 1 fw_setenv preboot "gpio set 3;gpio input 100;gpio input 105;gpio input 106;gpio input 107;gpio input 108" ``` -<div class="modal" data-modal="root-modal" data-modal-backdrop="static" id="root-modal"> +<div class="modal" data-jtd-modal="root-modal" data-jtd-modal-backdrop="static" id="root-modal"> <div class="modal-content"> <div class="modal-header"> <span class="close">×</span> @@ -123,10 +123,10 @@ fw_setenv preboot "gpio set 3;gpio input 100;gpio input 105;gpio input 106;gpio let rootModal = document.getElementById("root-modal"); let rootStep = [document.getElementById('root-step-1'),document.getElementById('root-step-2')]; let rootStepText = [document.getElementById('root-text-step-1'), document.getElementById('root-text-step-2')]; - rootModal.addEventListener('modal-close', async function(event) { + rootModal.addEventListener('modal-jtd-close', async function(event) { acontroller.abort(); }); - rootModal.addEventListener('modal-open', async function(event) { + rootModal.addEventListener('modal-jtd-open', async function(event) { root({signal: cs}); }); function pause(message, i) { diff --git a/_sass/custom/custom.scss b/_sass/custom/custom.scss index ec35a97..9651d11 100644 --- a/_sass/custom/custom.scss +++ b/_sass/custom/custom.scss @@ -59,111 +59,6 @@ ul.metadata { } } } - -[data-toogle] { - - cursor: pointer; -} - -.modal { - display: none; - position: fixed; - z-index: 100; - left: 0; - top: 0; - width: 100%; - height: 100%; - overflow: auto; - background-color: rgba(0,0,0,0.4); - - .modal-content { - border: $border $border-color; - position: relative; - background-color: $body-background-color; - width: unquote("min(500px, calc(100vw - 40px))"); - padding: 0; - margin: 40px auto; - animation-name: animatetop; - animation-duration: 0.4s; - - - - - .modal-header { - padding: 2px $spacing-unit; - margin-left: 1.5 * $spacing-unit; - - h2, .close { - font-size: 1.5 * $spacing-unit !important; - margin-top: 1.5 * $spacing-unit; - margin-bottom: 1.5 * $spacing-unit; - line-height: 1; - } - h2 { - margin-right: 1.5 * $spacing-unit; - } - - .close { - color: $nav-child-link-color; - float: right; - font-weight: bold; - cursor: pointer; - - &:hover { - color: $link-color; - } - } - } - - div.modal-body {padding: 2px $spacing-unit;} - - .modal-footer { - padding: 2px $spacing-unit; - color: $body-text-color; - } - - ul.modal-body { - padding: 0; - margin: 0; - - >li{ - - padding: 10px; - margin: -1px; - border-width: 1px 1px 1px 3px; - border-style: solid; - border-color: $border-color; - - &:hover { - border-left-color: $link-color; - } - - &::before { - content: ''; - } - - - >a { - color: $body-text-color; - text-decoration: none; - border: 0; - background: none; - display: flex; - align-items: center; - - &:hover { - color: $link-color; - } - - img { - margin-right: 10px; - } - } - - } - } - } -} /* Add Animation */ @keyframes animatetop { @@ -192,21 +87,6 @@ figure { width: 100%; } -.site-button img { - height: 20px; - vertical-align: middle; - margin-left: 10px; - width: auto; -} - -.site-button svg { - height: 20px; - vertical-align: middle; - margin-left: 10px; - width: 20px; -} - - .animated { svg { width: 100px; diff --git a/_tools/ascii-hex.md b/_tools/ascii-hex.md index 42d4311..ef0d8ef 100644 --- a/_tools/ascii-hex.md +++ b/_tools/ascii-hex.md @@ -7,10 +7,13 @@ layout: default --- <h1>ASCII To Hex</h1> -<form id="ascii-to-hex"> +<form id="ascii-to-hex" novalidate> <div class="form-floating mb-3"> - <input type="text" class="form-control" placeholder="ASCII" name="ascii-to-hex" id="ascii-to-hex" > + <input type="text" class="form-control" placeholder="ASCII" name="ascii-to-hex" id="ascii-to-hex" required> <label for="ascii-to-hex">ASCII</label> + <div class="invalid-feedback"> + Please provide a valid input text. + </div> </div> <div class="form-floating mb-3"> <input type="text" class="form-control" placeholder="Glue" name="ascii-to-hex-glue" id="ascii-to-hex-glue" value=" "> @@ -25,10 +28,13 @@ layout: default </div> </form> <h1>Hex To ASCII</h1> -<form id="hex-to-ascii"> +<form id="hex-to-ascii" novalidate> <div class="form-floating mb-3"> - <input type="text" class="form-control" placeholder="HEX" name="hex-to-ascii" id="hex-to-ascii"> + <input type="text" class="form-control" placeholder="HEX" name="hex-to-ascii" id="hex-to-ascii" required> <label for="hex-to-ascii">HEX</label> + <div class="invalid-feedback"> + Please provide a valid input text. + </div> </div> <div class="form-floating mb-3"> <input type="text" class="form-control" placeholder="Separator" name="hex-to-ascii-separator" id="hex-to-ascii-separator" value=" "> @@ -53,24 +59,35 @@ layout: default var asciiToHexForm = document.getElementById('ascii-to-hex'); asciiToHexForm.addEventListener('submit',(event) => { - event.preventDefault(); - var fomrdata = new FormData(asciiToHexForm); - var str = fomrdata.get('ascii-to-hex'); - var glue = fomrdata.get('ascii-to-hex-glue'); - var prefixi = glue !== "" ? "0x" : ""; - var prefix = glue === "" ? "0x" : ""; - var hex = prefix + ([...str].map((elem, n) => prefixi+Number(str.charCodeAt(n)).toString(16)).join(glue)); - document.getElementById('hex-result').value = hex; + if (!asciiToHexForm.checkValidity()) { + event.preventDefault(); + } else { + event.preventDefault(); + var fomrdata = new FormData(asciiToHexForm); + var str = fomrdata.get('ascii-to-hex'); + var glue = fomrdata.get('ascii-to-hex-glue'); + var prefixi = glue !== "" ? "0x" : ""; + var prefix = glue === "" ? "0x" : ""; + var hex = prefix + ([...str].map((elem, n) => prefixi+Number(str.charCodeAt(n)).toString(16)).join(glue)); + document.getElementById('hex-result').value = hex; + } + [...asciiToHexForm.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); }); var hexToAsciiForm = document.getElementById('hex-to-ascii'); hexToAsciiForm.addEventListener('submit',(event) => { - event.preventDefault(); - var fomrdata = new FormData(hexToAsciiForm); - var str = fomrdata.get('hex-to-ascii'); - var separator = fomrdata.get('hex-to-ascii-separator'); - var ascii = separator === "" ? getChunks(str.substring(2),2).map(el => String.fromCharCode(parseInt(el, 16))).join('') : str.split(separator).map(el => String.fromCharCode(Number(el))).join(''); - document.getElementById('ascii-result').value = ascii; + if (!hexToAsciiForm.checkValidity()) { + event.preventDefault(); + } else { + event.preventDefault(); + var fomrdata = new FormData(hexToAsciiForm); + var str = fomrdata.get('hex-to-ascii'); + var separator = fomrdata.get('hex-to-ascii-separator'); + var ascii = separator === "" ? getChunks(str.substring(2),2).map(el => String.fromCharCode(parseInt(el, 16))).join('') : str.split(separator).map(el => String.fromCharCode(Number(el))).join(''); + document.getElementById('ascii-result').value = ascii; + } + [...hexToAsciiForm.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); + }); </script> diff --git a/_tools/speed-gpon-eth.md b/_tools/speed-gpon-eth.md index f01b623..2a1b333 100644 --- a/_tools/speed-gpon-eth.md +++ b/_tools/speed-gpon-eth.md @@ -8,9 +8,9 @@ layout: default <h1>Ethernet calculator</h1> -<form id="eth-speed-mtu"> +<form id="eth-speed-mtu" novalidate> <div class="form-floating mb-3"> - <input type="number" class="form-control" placeholder="MTU L2" name="mtu" id="mtu" value="1500" min="1000" max="10000"> + <input type="number" class="form-control" placeholder="MTU L2" name="mtu" id="mtu" value="1500" min="1000" max="10000" required> <label for="mtu">MTU L2 (no overhead for PPPoE/MAP, only Ethernet PPPoE)</label> </div> <div class="form-floating mb-3"> @@ -25,20 +25,20 @@ layout: default </div> </div> </div> - <select class="form-select mb-3" placeholder="IPv4 L2 protocol" name="ipv4protocol" id="ipv4protocol"> - <option disabled selected>Select a Protocol</option> + <select class="form-select mb-3" placeholder="IPv4 L2 protocol" name="ipv4protocol" id="ipv4protocol" required> + <option value disabled selected>Select a Protocol</option> <option value="ipoe">IPoE</option> <option value="pppoe">PPPoE</option> <option value="map-t">MAP-T</option> <option value="map-e">MAP-E/4in6</option> </select> - <select class="form-select mb-3" placeholder="IPv6 L2 protocol" name="ipv6protocol" id="ipv6protocol" disabled> - <option disabled selected>Select a Protocol</option> + <select class="form-select mb-3" placeholder="IPv6 L2 protocol" name="ipv6protocol" id="ipv6protocol" disabled required> + <option value disabled selected>Select a Protocol</option> <option value="ipoe">IPoE</option> <option value="pppoe">PPPoE</option> </select> - <select class="form-select mb-3" placeholder="Speed" name="speed"> - <option disabled selected>Select a link speed</option> + <select class="form-select mb-3" placeholder="Speed" name="speed" required> + <option value disabled selected>Select a link speed</option> <option value="10">10 Mbps</option> <option value="100">100 Mbps</option> <option value="200">200 Mbps</option> @@ -62,7 +62,7 @@ layout: default </form> <h1>Gpon calculator</h1> -<form id="gpon-speed-mtu"> +<form id="gpon-speed-mtu" novalidate> <div class="form-floating mb-3"> <input step="1" type="number" class="form-control" placeholder="ONT number" name="gpon-ont" id="gpon-ont" value="10" min="1" max="128" required> <label for="gpon-ont">ONT number</label> @@ -82,14 +82,14 @@ layout: default </div> </div> <select class="form-select mb-3" placeholder="IPv4 L2 protocol" name="gpon-ipv4protocol" id="gpon-ipv4protocol" required> - <option disabled selected>Select a Protocol</option> + <option value disabled selected>Select a Protocol</option> <option value="ipoe">IPoE</option> <option value="pppoe">PPPoE</option> <option value="map-t">MAP-T</option> <option value="map-e">MAP-E/4in6</option> </select> <select class="form-select mb-3" placeholder="IPv6 L2 protocol" name="gpon-ipv6protocol" id="gpon-ipv6protocol" disabled required> - <option disabled selected>Select a Protocol</option> + <option value disabled selected>Select a Protocol</option> <option value="ipoe">IPoE</option> <option value="pppoe">PPPoE</option> </select> @@ -121,43 +121,47 @@ layout: default }); }); form.addEventListener('submit',(event) => { + if (!form.checkValidity()) { + event.preventDefault(); + } else { + event.preventDefault(); - var formdata = new FormData(form); - event.preventDefault(); - var overheadipv4 = { - "ipoe" : 20, - "pppoe" : 28, - "map-t" : 40, - "map-e" : 60, - }; - var overheadipv6 = { - "ipoe" : 40, - "pppoe" : 48, - }; - var overheadtcp = 20; - var overheadeth = 14; - var overheadfcs = 4; - var overheadgap = { - '10' : 5.875, - '100' : 12, - '200' : 8, - '500' : 8, - '1000' : 8, - '2500' : 5, - '5000' : 5, - '10000' : 5, - }; - var preamble = 8; - var cip = formdata.get('ip'); - var coverheadip = formdata.get('ip') === '4' ? overheadipv4[formdata.get('ipv4protocol')] : overheadipv6[formdata.get('ipv6protocol')]; - var mtu = formdata.get('mtu'); - var mss = mtu - coverheadip; - var overhead = overheadtcp + overheadeth + overheadfcs + overheadgap[formdata.get('speed')] + preamble + coverheadip; - document.getElementById('overhead').value = overhead/mss * 100; - var th = mss /(overhead + mss); - - document.getElementById('maxSpeed').value = th * formdata.get('speed'); - + var formdata = new FormData(form); + var overheadipv4 = { + "ipoe" : 20, + "pppoe" : 28, + "map-t" : 40, + "map-e" : 60, + }; + var overheadipv6 = { + "ipoe" : 40, + "pppoe" : 48, + }; + var overheadtcp = 20; + var overheadeth = 14; + var overheadfcs = 4; + var overheadgap = { + '10' : 5.875, + '100' : 12, + '200' : 8, + '500' : 8, + '1000' : 8, + '2500' : 5, + '5000' : 5, + '10000' : 5, + }; + var preamble = 8; + var cip = formdata.get('ip'); + var coverheadip = formdata.get('ip') === '4' ? overheadipv4[formdata.get('ipv4protocol')] : overheadipv6[formdata.get('ipv6protocol')]; + var mtu = formdata.get('mtu'); + var mss = mtu - coverheadip; + var overhead = overheadtcp + overheadeth + overheadfcs + overheadgap[formdata.get('speed')] + preamble + coverheadip; + document.getElementById('overhead').value = overhead/mss * 100; + var th = mss /(overhead + mss); + + document.getElementById('maxSpeed').value = th * formdata.get('speed'); + } + [...form.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); }); var formgpon = document.getElementById('gpon-speed-mtu'); var radioIp = document.getElementsByName('gpon-ip'); @@ -169,37 +173,40 @@ layout: default }); }); formgpon.addEventListener('submit',(event) => { - - var formdata = new FormData(formgpon); - event.preventDefault(); - var gtc = 38880; - var overheadgem = 5; - var overheadpcbd = 30 + 8*formdata.get('gpon-ont'); - var overheadipv4 = { - "ipoe" : 20, - "pppoe" : 28, - "map-t" : 40, - "map-e" : 60, - }; - var overheadipv6 = { - "ipoe" : 40, - "pppoe" : 48, - }; - var overheadtcp = 20; - var overheadeth = 14; - var overheadfcs = 4; - var cip = formdata.get('gpon-ip'); - var coverheadip = formdata.get('gpon-ip') === '4' ? overheadipv4[formdata.get('gpon-ipv4protocol')] : overheadipv6[formdata.get('gpon-ipv6protocol')]; - var overheadframeeth = overheadtcp + overheadeth + overheadfcs + coverheadip; - var overheadgtc = overheadgem + formdata.get('gpon-gem') * (overheadpcbd+overheadframeeth); - var payload = gtc - overheadgtc; - document.getElementById('gpon-average-packet-size').value = payload/formdata.get('gpon-gem'); + if (!formgpon.checkValidity()) { + event.preventDefault(); + } else { + event.preventDefault(); + var formdata = new FormData(formgpon); + var gtc = 38880; + var overheadgem = 5; + var overheadpcbd = 30 + 8*formdata.get('gpon-ont'); + var overheadipv4 = { + "ipoe" : 20, + "pppoe" : 28, + "map-t" : 40, + "map-e" : 60, + }; + var overheadipv6 = { + "ipoe" : 40, + "pppoe" : 48, + }; + var overheadtcp = 20; + var overheadeth = 14; + var overheadfcs = 4; + var cip = formdata.get('gpon-ip'); + var coverheadip = formdata.get('gpon-ip') === '4' ? overheadipv4[formdata.get('gpon-ipv4protocol')] : overheadipv6[formdata.get('gpon-ipv6protocol')]; + var overheadframeeth = overheadtcp + overheadeth + overheadfcs + coverheadip; + var overheadgtc = overheadgem + formdata.get('gpon-gem') * (overheadpcbd+overheadframeeth); + var payload = gtc - overheadgtc; + document.getElementById('gpon-average-packet-size').value = payload/formdata.get('gpon-gem'); - document.getElementById('gpon-overhead').value = overheadgtc/payload * 100; - var th = payload /gtc; - - document.getElementById('gpon-maxSpeed').value = th * 2.48832; - + document.getElementById('gpon-overhead').value = overheadgtc/payload * 100; + var th = payload /gtc; + + document.getElementById('gpon-maxSpeed').value = th * 2.48832; + } + [...formgpon.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); }); </script> diff --git a/assets/js/modal.js b/assets/js/modal.js deleted file mode 100644 index c18d751..0000000 --- a/assets/js/modal.js +++ /dev/null @@ -1,28 +0,0 @@ -var modals = document.querySelectorAll("[data-modal]"); -var modalToogles = document.querySelectorAll("[data-toogle=modal]"); - -[...modals].forEach(modal => { - var closeBtns = modal.getElementsByClassName("close"); - [...closeBtns].forEach(closeBtn => { - closeBtn.addEventListener("click", (event) => { - modal.style.display = "none"; - modal.dispatchEvent( new Event('modal-close')); - }); - }) -}); - -[...modalToogles].forEach(toogle => { - toogle.addEventListener("click", (event) => { - var modal = document.querySelector(toogle.getAttribute('data-target')); - modal.style.display = "block"; - modal.dispatchEvent(new Event('modal-open')); - }); -}); - -window.addEventListener("click", function(event) { - if ([...modals].filter(modal => modal.getAttribute("data-modal-backdrop") !== "static").includes(event.target)) { - event.target.dispatchEvent( new Event('modal-close')); - event.target.style.display = "none"; - } -}); - diff --git a/assets/js/theme-switch.js b/assets/js/theme-switch.js deleted file mode 100644 index caffe6e..0000000 --- a/assets/js/theme-switch.js +++ /dev/null @@ -1,37 +0,0 @@ -if(localStorage.getItem("color-scheme") === null) { - const newColorScheme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? "dark" : "light"; - const newTextScheme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? "Light mode" : "Dark mode"; - jtd.setTheme(newColorScheme); - localStorage.setItem("color-scheme",newColorScheme); - localStorage.setItem("text-scheme",newTextScheme); - window.addEventListener('load', function () { - toggleDarkMode.textContent = newTextScheme; - }); -} else { - jtd.setTheme(localStorage.getItem("color-scheme")); - window.addEventListener('load', function () { - toggleDarkMode.textContent = localStorage.getItem("text-scheme"); - }); -} - -window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => { - if(localStorage.getItem("color-scheme") === null) { - const newColorScheme = event.matches ? "dark" : "light"; - const newTextScheme = event.matches ? "Light mode" : "Dark mode"; - jtd.setTheme(newColorScheme); - toggleDarkMode.textContent = newTextScheme; - localStorage.setItem("color-scheme",newColorScheme); - localStorage.setItem("text-scheme",newTextScheme); - } -}); - - -const toggleDarkMode = document.querySelector('.js-toggle-dark-mode'); -jtd.addEvent(toggleDarkMode, 'click', function(){ - const newColorScheme = jtd.getTheme() !== 'dark' ? "dark" : "light"; - const newTextScheme = jtd.getTheme() !== 'dark' ? "Light mode" : "Dark mode"; - jtd.setTheme(newColorScheme); - toggleDarkMode.textContent = newTextScheme; - localStorage.setItem("color-scheme",newColorScheme); - localStorage.setItem("text-scheme",newTextScheme); -});
\ No newline at end of file |