jekyll-theme-satellite 1.0.0 → 1.1.0

data/assets/js/main.js

@@ -1,709 +0,0 @@
-document.addEventListener('DOMContentLoaded', function(){
-    // Loading page
-    window.addEventListener("load", () => {
-        var load_div = document.querySelector('#loading');
-
-        if(load_div != null){
-            setTimeout(function(){
-                load_div.style.transition = '.75s';
-                load_div.style.opacity = '0';
-                load_div.style.visibility = 'hidden';
-            }, 800);
-        }
-    });
-
-    // Lazy image loading
-    var content = document.querySelector('main');
-
-    if (content){
-        var images = content.querySelectorAll('img');
-
-        images.forEach((img) => {
-            img.setAttribute('loading', 'lazy');
-        });
-    }
-
-    function loadImage(image) {
-        var i = new Image();
-
-        i.onload = function() {
-            image.classList.add('lazy-loaded')
-            image.src = image.dataset.lazySrc
-        }
-
-        i.onerror = function() {image.classList.add('lazy-error')}
-        i.src = image.dataset.lazySrc
-    }
-
-    function onIntersection(entries) {
-        for (var e in entries) {
-            if(entries[e].intersectionRatio <= 0) continue
-            observer.unobserve(entries[e].target) // Stop watching
-            loadImage(entries[e].target)
-        }
-    }
-
-
-
-    // navigation (mobile)
-    var siteNav = document.querySelector('#navigation');
-    var siteContact = document.querySelector('#contact');
-    var menuButton = document.querySelector("#btn-nav");
-
-    menuButton.addEventListener('click', function() {
-        if (menuButton.classList.toggle('nav-open')) {
-            siteNav.classList.add('nav-open');
-            siteContact.classList.add('contact-open');
-        } else {
-            siteNav.classList.remove('nav-open');
-            siteContact.classList.remove('contact-open');
-        }
-    });
-
-    // kept nav opened
-    var firstNavs = document.querySelectorAll('#nav-first');
-    var page_path = window.location.pathname.replace(/%20/g, " ");
-    var page_tree = page_path.split('/');
-
-    Array.prototype.forEach.call(firstNavs, function (nav_first) {
-        if (page_tree[1] === nav_first.ariaLabel){
-            nav_first.classList.add('active');
-
-            var secondNavs = nav_first.querySelectorAll('#nav-second');
-
-            Array.prototype.forEach.call(secondNavs, function (nav_second) {
-                if (page_tree[2] === nav_second.ariaLabel){
-                    nav_second.classList.toggle('active');
-
-                    var thirdNavs = nav_second.querySelectorAll('#nav-third');
-
-                    Array.prototype.forEach.call(thirdNavs, function (nav_third) {
-                        if (page_tree[3] === nav_third.ariaLabel){
-                            nav_third.classList.toggle('active');
-                        }
-                    });
-                }
-            });
-        }
-    });
-
-    // navigation (toogle sub-category)
-    document.addEventListener('click', function(e){
-        var target = e.target;
-
-        while (target && !(target.classList && target.classList.contains('nav-list-expander'))) {
-            target = target.parentNode;
-        }
-
-        if (target) {
-            e.preventDefault();
-            var nav_item = target.parentNode;
-            target.ariaPressed = nav_item.parentNode.classList.toggle('active');
-        }
-    });
-
-    document.querySelectorAll('.nav-item').forEach((nav_item) => {
-        if (nav_item.parentNode.classList.contains('active')){
-            nav_item.classList.add('selected');
-        }
-        else {
-            nav_item.classList.remove('selected');
-        }
-    });
-
-    // tocbot
-    //var content = document.querySelector('main');
-
-    if (content){
-        var headings = content.querySelectorAll('h1, h2');
-        var headingMap = {};
-
-        Array.prototype.forEach.call(headings, function (heading) {
-            var id = heading.id ? heading.id : heading.textContent.trim().toLowerCase()
-                    .split(' ').join('-').replace(/[\!\@\#\$\%\^\&\*\(\):]/ig, '');
-
-            headingMap[id] = !isNaN(headingMap[id]) ? ++headingMap[id] : 0;
-
-            if (headingMap[id]) {
-                heading.id = id + '-' + headingMap[id];
-            } else {
-                heading.id = id;
-            }
-        })
-
-        tocbot.init({
-            tocSelector: '.toc-board',
-            contentSelector: '.inner-content',
-            headingSelector:'h1, h2',
-            hasInnerContainers: false
-        });
-    }
-
-    // link (for hover effect)
-    if (content){
-        var links = content.querySelectorAll('a');
-
-        links.forEach((link) => {
-            link.setAttribute('data-content', link.innerText);
-        });
-    }
-
-    // pagination
-    const paginationNumbers = document.querySelector("#pagination-numbers");
-    const paginatedList = document.querySelector(".paginated-list");
-
-    if (paginatedList) {
-        const listItems = paginatedList.querySelectorAll("li");
-        const nextButton = document.querySelector("#next-button");
-        const prevButton = document.querySelector("#prev-button");
-        const pageKey = "pageKey=" + document.URL;
-
-        const paginationLimit = 5;
-        const pageCount = Math.ceil(listItems.length / paginationLimit);
-        let currentPage = 1;
-
-        const disableButton = (button) => {
-            button.classList.add("disabled");
-            button.setAttribute("disabled", true);
-        };
-        
-        const enableButton = (button) => {
-            button.classList.remove("disabled");
-            button.removeAttribute("disabled");
-        };
-
-        const handlePageButtonsStatus = () => {
-            if (currentPage === 1) {
-                disableButton(prevButton);
-            } else {
-                enableButton(prevButton);
-            }
-        
-            if (pageCount === currentPage) {
-                disableButton(nextButton);
-            } else {
-                enableButton(nextButton);
-            }
-        };
-
-        const handleActivePageNumber = () => {
-            document.querySelectorAll(".pagination-number").forEach((button) => {
-                button.classList.remove("active");
-                
-                const pageIndex = Number(button.getAttribute("page-index"));
-
-                if (pageIndex == currentPage) {
-                    button.classList.add("active");
-                }
-            });
-        };
-
-        const appendPageNumber = (index) => {
-            const pageNumber = document.createElement("button");
-
-            pageNumber.className = "pagination-number";
-            pageNumber.innerHTML = index;
-            pageNumber.setAttribute("page-index", index);
-            pageNumber.setAttribute("aria-label", "Page " + index);
-
-            paginationNumbers.appendChild(pageNumber);
-        };
-
-        const getPaginationNumbers = () => {
-            for (let i = 1; i <= pageCount; i++) {
-                appendPageNumber(i);
-            }
-        };
-
-        const setCurrentPage = (pageNum) => {
-            currentPage = pageNum;
-            
-            handleActivePageNumber();
-            handlePageButtonsStatus();
-
-            const prevRange = (pageNum - 1) * paginationLimit;
-            const currRange = pageNum * paginationLimit;
-
-            listItems.forEach((item, index) => {
-                item.classList.add("hidden");
-
-                if (index >= prevRange && index < currRange) {
-                    item.classList.remove("hidden");
-                }
-            });
-
-            $('html, body').scrollTop(0);
-            localStorage.setItem(pageKey, currentPage);
-        };
-
-        window.addEventListener("load", (event) => {
-            // Load last visited page number
-            if (event.persisted 
-            || (window.performance && window.performance.navigation.type == 2)) {
-                currentPage = localStorage.getItem(pageKey);
-            }
-
-            getPaginationNumbers();
-            setCurrentPage(currentPage);
-
-            prevButton.addEventListener("click", () => {
-                setCurrentPage(currentPage - 1);
-            });
-            
-            nextButton.addEventListener("click", () => {
-                setCurrentPage(currentPage + 1);
-            });
-
-            document.querySelectorAll(".pagination-number").forEach((button) => {
-                const pageIndex = Number(button.getAttribute("page-index"));
-
-                if (pageIndex) {
-                    button.addEventListener("click", () => {
-                        setCurrentPage(pageIndex);
-                    });
-                }
-            });
-        });
-    }
-
-    // code clipboard copy button
-    async function copyCode(block) {
-        let code = block.querySelector("code");
-        let text = code.innerText;
-      
-        await navigator.clipboard.writeText(text);
-    }
-
-    let blocks = document.querySelectorAll("pre");
-
-    blocks.forEach((block) => {
-        // only add button if browser supports Clipboard API
-        if (navigator.clipboard) {
-            let clip_btn = document.createElement("button");
-            let clip_img = document.createElement("svg");
-
-            clip_btn.setAttribute('title', "Copy Code");
-            clip_img.ariaHidden = true;
-
-            block.appendChild(clip_btn);
-            clip_btn.appendChild(clip_img);
-
-            clip_btn.addEventListener("click", async () => {
-                await copyCode(block, clip_btn);
-            });
-        }
-    });
-
-    // dark mode
-    let currentTheme = localStorage.getItem('theme');
-    let isDarkMode = false;
-
-    if (currentTheme === 'dark'){
-        isDarkMode = true;
-        document.body.classList.add('dark-theme');
-
-        const moonIcons = document.querySelectorAll(".ico-dark");
-        const sunIcons = document.querySelectorAll(".ico-light");
-
-        moonIcons.forEach((ico) => {
-            ico.classList.add('active');
-        });
-
-        sunIcons.forEach((ico) => {
-            ico.classList.add('active');
-        });
-
-        // Disable highlighter default color theme
-        document.getElementById("highlight-default").disabled=true;
-    }
-    else {
-        isDarkMode = false;
-        // Disable highlighter dark color theme
-        document.getElementById("highlight-dark").disabled=true;
-    }
-
-    const themeButton = document.querySelectorAll("#btn-brightness");
-
-    themeButton.forEach((btn) => {
-        btn.addEventListener('click', function() {
-            const moonIcons = document.querySelectorAll(".btn-dark");
-            const sunIcons = document.querySelectorAll(".btn-light");
-
-            moonIcons.forEach((ico) => {
-                ico.classList.toggle('active');
-            });
-
-            sunIcons.forEach((ico) => {
-                ico.classList.toggle('active');
-            });
-
-            document.body.classList.toggle('dark-theme');
-
-            if (isDarkMode){
-                localStorage.setItem('theme', 'default');
-                // Disable highlighter dark color theme
-                document.getElementById("highlight-default").disabled=false;
-                document.getElementById("highlight-dark").disabled=true;
-                changeGiscusTheme('light');
-                isDarkMode = false;
-            }
-            else {
-                localStorage.setItem('theme', 'dark');
-                // Disable highlighter default color theme
-                document.getElementById("highlight-default").disabled=true;
-                document.getElementById("highlight-dark").disabled=false;
-                changeGiscusTheme('noborder_gray');
-                isDarkMode = true;
-            }
-        });
-    });
-
-    // Initialize/Change Giscus theme
-    const commentBox = document.getElementById('giscus');
-
-    if (commentBox) {
-        var giscusUserInfos = [];
-        var giscusTheme = "light";
-
-        $.getJSON('/giscus.json', function (data) {
-            giscusUserInfos = data[0];
-        })
-        .done(function() { 
-            console.log('getJSON request succeeded! [giscus.json]');
-
-            if (giscusUserInfos.repo === '') return;
-
-            if (currentTheme === 'dark'){
-                giscusTheme = "noborder_gray";
-            }
-    
-            let giscusAttributes = {
-                "src": "https://giscus.app/client.js",
-                "data-repo": giscusUserInfos.repo,
-                "data-repo-id": giscusUserInfos.repoId,
-                "data-category": giscusUserInfos.category,
-                "data-category-id": giscusUserInfos.categoryId,
-                "data-mapping": "pathname",
-                "data-reactions-enabled": "1",
-                "data-emit-metadata": "1",
-                "data-theme": giscusTheme,
-                "data-lang": "en",
-                "crossorigin": "anonymous",
-                "async": "",
-            };
-    
-            let giscusScript = document.createElement("script");
-            Object.entries(giscusAttributes).forEach(([key, value]) => giscusScript.setAttribute(key, value));
-            document.body.appendChild(giscusScript);
-        })
-        .fail(function(jqXHR, textStatus, errorThrown) { console.log('getJSON request failed! [giscus.json] ' + textStatus); })
-        .always(function() { console.log('getJSON request ended! [giscus.json]'); });
-
-        // Giscus IMetadataMessage event handler
-        function handleMessage(event) {
-            if (event.origin !== 'https://giscus.app') return;
-            if (!(typeof event.data === 'object' && event.data.giscus)) return;
-          
-            const giscusData = event.data.giscus;
-
-            if (giscusData && giscusData.hasOwnProperty('discussion')) {
-                $('#num-comments').text(giscusData.discussion.totalCommentCount);
-            }
-            else {
-                $('#num-comments').text('0');
-            }
-        }
-          
-        window.addEventListener('message', handleMessage);
-    }
-
-    function changeGiscusTheme(theme) {
-        const iframe = document.querySelector('iframe.giscus-frame');
-        if (!iframe) return;
-
-        const message = {
-            setConfig: {
-            theme: theme
-            }
-        };
-
-        iframe.contentWindow.postMessage({ giscus: message }, 'https://giscus.app');
-    }
-
-    // search box
-    const searchButton = document.querySelectorAll("#btn-search");
-    const cancelButton = document.querySelector('#btn-clear');
-    const searchPage = document.querySelector("#search");
-
-    if (searchButton) {
-        searchButton.forEach((btn) => {
-            btn.addEventListener('click', function() {
-                searchPage.classList.add('active');
-                $('#search-input').focus();
-            });
-        });
-    }
-
-    if (searchPage) {
-        searchPage.addEventListener('click', function(event) {
-            const searchBar = document.querySelector(".search-box");
-            var target = event.target;
-
-            if (searchBar.contains(target))
-                return;
-
-            searchPage.classList.remove('active');
-        });
-    }
-
-    var posts = [];
-
-    $.getJSON('/search.json', function (data) {
-        posts = data;
-    })
-    .done(function() { 
-        console.log('getJSON request succeeded! [search.json]');
-
-        // Related Posts
-        displayRelatedPosts(posts);
-    })
-    .fail(function(jqXHR, textStatus, errorThrown) { console.log('getJSON request failed! [search.json] ' + textStatus); })
-    .always(function() { console.log('getJSON request ended! [search.json]'); });
-
-    $('#search-input').on('keyup', function () {
-        var keyword = this.value.toLowerCase();
-        var searchResult = [];
-
-        if (keyword.length > 0) {
-            $('#search-result').show();
-            $('#btn-clear').show();
-        } else {
-            $('#search-result').hide();
-            $('#btn-clear').hide();
-        }
-        
-        $('.result-item').remove();
-
-        for (var i = 0; i < posts.length; i++) {
-            var post = posts[i];
-
-            if (post.title === 'Home' && post.type == 'category') continue;
-
-            if (post.title.toLowerCase().indexOf(keyword) >= 0
-            || post.path.toLowerCase().indexOf(keyword) >= 0
-            || post.tags.toLowerCase().indexOf(keyword) >= 0){
-                searchResult.push(post);
-            }
-        }
-
-        if (searchResult.length === 0) {
-            $('#search-result').append(
-                '<li class="result-item"><span class="description">There is no search result.</span></li>'
-            );
-
-            return;
-        } 
-
-        searchResult.sort(function (a, b) {
-            if (a.type == 'category') return 1;
-
-            return -1;
-        });
-
-        for (var i = 0; i < searchResult.length; i++) {
-            var highlighted_path = highlightKeyword(searchResult[i].path, keyword);
-
-            if (highlighted_path === '')
-                highlighted_path = "Home";
-
-            if (searchResult[i].type === 'post'){
-                var highlighted_title = highlightKeyword(searchResult[i].title, keyword);
-                var highlighted_tags = highlightKeyword(searchResult[i].tags, keyword);
-
-                if (highlighted_tags === '')
-                    highlighted_tags = "none";
-
-                $('#search-result').append(
-                    '<li class="result-item"><a href="' +
-                        searchResult[i].url +
-                        '"><table><thead><tr><th><svg class="ico-book"></svg></th><th>' + highlighted_title +  
-                        '</th></tr></thead><tbody><tr><td><svg class="ico-folder"></svg></td><td>' + highlighted_path +
-                        '</td></tr><tr><td><svg class="ico-tags"></svg></td><td>' + highlighted_tags +
-                        '</td></tr><tr><td><svg class="ico-calendar"></svg></td><td>' + searchResult[i].date +
-                        '</td></tr></tbody></table></a></li>'
-                );
-            }
-            else {
-                $('#search-result').append(
-                    '<li class="result-item"><a href="' +
-                        searchResult[i].url +
-                        '"><table><thead><tr><th><svg class="ico-folder"></svg></th><th>' + highlighted_path + 
-                        '</th></tr></thead></table></a></li>'
-                );
-            }
-        }
-    });
-
-    if (cancelButton) {
-        cancelButton.addEventListener('click', function() {
-            $('.result-item').remove();
-            $('#search-input').val("");
-            $('#btn-clear').hide();
-        });
-    }
-
-    function highlightKeyword(txt, keyword) {
-        var index = txt.toLowerCase().lastIndexOf(keyword);
-
-        if (index >= 0) { 
-            out = txt.substring(0, index) + 
-                "<span class='highlight'>" + 
-                txt.substring(index, index+keyword.length) + 
-                "</span>" + 
-                txt.substring(index + keyword.length);
-            return out;
-        }
-
-        return txt;
-    }
-
-    // Tag EventListener
-    document.querySelectorAll('.tag-box').forEach(function(tagButton){
-        tagButton.addEventListener('click', function() {
-            const contentID = tagButton.getAttribute('contentID');
-            searchPage.classList.add('active');
-
-            $('#search-input').val(contentID);
-            $('#search-input').trigger('keyup');
-        });
-    });
-
-    // Related Posts
-    function displayRelatedPosts(pages){
-        const refBox = document.getElementById('related-box');
-
-        if (!refBox) return;
-
-        var relatedPosts = [];
-        var currPost = pages.find(obj => {return obj.url === location.pathname});
-
-        let currTags = currPost.tags.split(', ');
-        let currCategory = currPost.path.split(' > ').pop();
-
-        for (var i = 0; i < pages.length; i++) {
-            let page = pages[i];
-
-            if (page.type === 'category') continue;
-
-            if (page.title === currPost.title) continue;
-
-            let tags = page.tags.split(', ');
-            let category = page.path.split(' > ').pop();
-            let correlationScore = 0;
-
-            for (var j = 0; j < currTags.length; j++){
-                if (tags.indexOf(currTags[j]) != -1) correlationScore += 1;
-            }
-
-            if (category === currCategory) correlationScore += 1;
-
-            if (correlationScore == 0) continue;
-
-            relatedPosts.push({
-                'title': page.title,
-                'date': page.date,
-                'category': category,
-                'url': page.url,
-                'thumbnail': page.image,
-                'score': correlationScore
-            });
-        }
-
-        relatedPosts.sort(function (a, b) {
-            if(a.hasOwnProperty('score')){
-                return b.score - a.score;
-            }
-        });
-
-        if (relatedPosts.length == 0){
-            $('#related-box').hide();
-            return;
-        }
-
-        for (var i = 0; i < Math.min(relatedPosts.length, 6); i++){
-            let post = relatedPosts[i];
-            let date = '-';
-            let category = 'No category';
-
-            if (post.date !== '1900-01-01'){
-                date = new Date(post.date);
-                date = date.toLocaleString('en-US', {day: 'numeric', month:'long', year:'numeric'});
-            }
-
-            if (post.category !== '') category = post.category;
-
-            if (post.thumbnail === ''){
-                post.thumbnail = "/assets/img/thumbnail/empty.jpg";
-            }
-
-            $('#related-posts').append(
-                '<li class="related-item"><a href="' + post.url +
-                    '"><img src="' + post.thumbnail + 
-                    '"/><p class="category">' + category +  
-                    '</p><p class="title">' + post.title + 
-                    '</p><p class="date">' + date +
-                    '</p></a></li>'
-            );
-        }
-    }
-
-    // Page Hits
-    const pageHits = document.getElementById('page-hits');
-
-    if (pageHits) {
-        const goatcounterCode = pageHits.getAttribute('usercode');
-        const requestURL = 'https://' 
-            + goatcounterCode 
-            + '.goatcounter.com/counter/' 
-            + encodeURIComponent(location.pathname) 
-            + '.json';
-
-        var resp = new XMLHttpRequest();
-        resp.open('GET', requestURL);
-        resp.onerror = function() { pageHits.innerText = "0"; };
-        resp.onload = function() { pageHits.innerText = JSON.parse(this.responseText).count; };
-        resp.send();
-    }
-
-    // Sweat Scroll
-    const scroller = new SweetScroll({
-        /* some options */
-    });
-
-    // Move to Top
-    if (document.querySelector('.thumbnail')){
-        const arrowButton = document.querySelector('.top-arrow');
-
-        setInterval(function(){
-            var scrollPos = document.documentElement.scrollTop;
-            console.log(scrollPos);
-    
-            if (scrollPos < 512){
-                arrowButton.classList.remove('arrow-open');
-            }
-            else {
-                arrowButton.classList.add('arrow-open');
-            }
-        }, 1000);
-    }
-
-    // Code highlighter
-    hljs.highlightAll();
-
-    // Disable code highlights to the plaintext codeblocks
-    document.querySelectorAll('.language-text, .language-plaintext').forEach(function(codeblock){
-        codeblock.querySelectorAll('.hljs-keyword, .hljs-meta, .hljs-selector-tag').forEach(function($){
-            $.outerHTML = $.innerHTML;
-        });
-    });
-});