redeyed-jekyll-theme 0.1.0 → 0.1.3

data/_includes/extensions/google-translate.html

@@ -0,0 +1,108 @@
+{% if include.translate_langs %}
+    {% assign translate_langs = include.translate_langs %}
+{% endif %}
+
+{% if include.lang %}
+    {% assign lang = include.lang %}
+{% endif %}
+
+<div id="google_translate_element" style="display: none;">
+</div>
+
+<span class="ct-language">
+    <ul class="list-unstyled ct-language-dropdown">
+    {% for item in translate_langs %}
+        <li>
+            <a href="#" class="lang-select" data-lang="{{ item.lang }}">
+            {% if item.img %}
+                <img src="{{ item.img }}" title="{{ item.text }}">
+            {% else %}
+                {{ item.text }}
+            {% endif %}
+            </a>
+        </li>
+    {% endfor %}
+    </ul>
+</span>
+
+<script type="text/javascript">
+    function googleTranslateElementInit() {
+        new google.translate.TranslateElement({
+            pageLanguage: '{{ lang }}',
+            autoDisplay: false,
+            layout: google.translate.TranslateElement.InlineLayout.VERTICAL
+        }, 'google_translate_element');
+
+        // Links to cross-origin destinations are unsafe
+        var gll = document.getElementsByClassName('goog-logo-link')[0];
+        if (gll) {
+            gll.setAttribute('rel', 'noopener');
+        }
+
+        function restoreLang() {
+            var iframe = document.getElementsByClassName('goog-te-banner-frame')[0];
+            if (!iframe) return;
+
+            var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
+            var restore_el = innerDoc.getElementsByTagName("button");
+
+            for (var i = 0; i < restore_el.length; i++) {
+                if (restore_el[i].id.indexOf("restore") >= 0) {
+                    restore_el[i].click();
+                    var close_el = innerDoc.getElementsByClassName("goog-close-link");
+                    close_el[0].click();
+                    return;
+                }
+            }
+        }
+
+        function triggerHtmlEvent(element, eventName) {
+            var event;
+            if (document.createEvent) {
+                event = document.createEvent('HTMLEvents');
+                event.initEvent(eventName, true, true);
+                element.dispatchEvent(event);
+            } else {
+                event = document.createEventObject();
+                event.eventType = eventName;
+                element.fireEvent('on' + event.eventType, event);
+            }
+        }
+
+        var googleCombo = document.querySelector("select.goog-te-combo");
+        var langSelect = document.querySelector('.ct-language');
+        langSelect.addEventListener('click', function(event) {
+            if (!event.target) {
+                return;
+            }
+
+            var selected = document.querySelector('.ct-language .ct-language-selected');
+            if (selected) {
+                selected.classList.remove('ct-language-selected');
+            }
+
+            var target = event.target;
+            while (target && target !== langSelect ) {
+                if (target.matches('.lang-select')) {
+                    break;
+                }
+                target = target.parentElement;
+            }
+
+            if (target && target.matches('.lang-select')) {
+                var lang = target.getAttribute('data-lang');
+                if (googleCombo.value == lang) {
+                    restoreLang();
+                } else {
+                    target.parentElement.classList.add('ct-language-selected');
+                    googleCombo.value = lang;
+                    triggerHtmlEvent(googleCombo, 'change');
+                }
+            }
+
+            event.preventDefault();
+        });
+    }
+</script>
+
+<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

data/_includes/extensions/hashlocate.html

@@ -0,0 +1,44 @@
+<script>
+    function hashLocate(hashValue) {
+        hashValue = hashValue.replace(/^.*#h-/, '');
+        hashValue = decodeURIComponent(hashValue);
+        var element = document.getElementById(hashValue);
+
+        if (!element) {
+            return;
+        }
+
+        var header = document.querySelector('header.site-header');
+        var headerRect = header.getBoundingClientRect();
+        var headerTop = Math.floor(headerRect.top);
+        var headerHeight = Math.floor(headerRect.height);
+        var scrollPos = getScrollPos();
+        var offsetY = element.offsetTop - (headerTop + headerHeight + 20);
+
+        if (offsetY == scrollPos.y) {
+            return;
+        }
+
+        if (headerTop == 0  && offsetY > scrollPos.y) {
+            offsetY += headerHeight + 2;
+        } else if (headerTop < 0  && offsetY < scrollPos.y) {
+            offsetY -= headerHeight - 2;
+        }
+
+        smoothScrollTo(offsetY);
+    }
+
+    // The first event occurred
+    window.addEventListener('load', function(event) {
+        if (window.location.hash) {
+            hashLocate(window.location.hash);
+        }
+    });
+
+    // The first event occurred
+    window.addEventListener('click', function(event) {
+        if (event.target.tagName.toLowerCase() == 'a') {
+            hashLocate(event.target.getAttribute('href'));
+        }
+    });
+</script>

data/_includes/extensions/mathjax.html

@@ -0,0 +1,9 @@
+<script type="text/x-mathjax-config">
+    MathJax.Hub.Config({
+        tex2jax: {
+            skipTags: ['script', 'noscript', 'style', 'textarea', 'pre'],
+            inlineMath: [['$','$']]
+        }
+    });
+</script>
+<script src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML" type="text/javascript"></script>

data/_includes/{mode-toggle.html → extensions/theme-mode.html}

@@ -8,7 +8,6 @@
         static get MODE_ATTR() { return "data-mode"; }
         static get DARK_MODE() { return "dark"; }
         static get LIGHT_MODE() { return "light"; }
-        static get BREW_MODE() { return "brew"; }
         static get ID() { return "mode-toggle"; }
 
         constructor() {
@@ -57,8 +56,6 @@
 
         get isLightMode() { return this.mode === ModeToggle.LIGHT_MODE; }
 
-        get isBrewMode() { return this.mode === ModeToggle.BREW_MODE; }
-
         get hasMode() { return this.mode != null; }
 
         get mode() { return sessionStorage.getItem(ModeToggle.MODE_KEY); }
@@ -67,8 +64,6 @@
         get modeStatus() {
             if (this.isDarkMode || (!this.hasMode && this.isSysDarkPrefer)) {
                 return ModeToggle.DARK_MODE;
-            } else if (this.isBrewMode) {
-                return ModeToggle.BREW_MODE;
             } else {
                 return ModeToggle.LIGHT_MODE;
             }
@@ -84,11 +79,6 @@
             sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE);
         }
 
-        setBrew() {
-            $('html').attr(ModeToggle.MODE_ATTR, ModeToggle.BREW_MODE);
-            sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.BREW_MODE);
-        }
-
         clearMode() {
             $('html').removeAttr(ModeToggle.MODE_ATTR);
             sessionStorage.removeItem(ModeToggle.MODE_KEY);

data/_includes/extensions/theme-toggle.html

@@ -0,0 +1,108 @@
+<div class="theme-toggle">
+    <input type="checkbox" id="theme-switch">
+    <label for="theme-switch">
+        <div class="toggle"></div>
+        <div class="names">
+            <p class="light">Light</p>
+            <p class="dark">Dark</p>
+        </div>
+    </label>
+</div>
+
+{%- assign name = 'night_mode' -%}
+{%- include functions.html func='get_value' default='auto' -%}
+{%- assign night_mode = return -%}
+
+<script>
+    (function() {
+        var sw = document.getElementById('theme-switch');
+        var html = document.getElementsByTagName('html')[0];
+        var nightModeOption = ('{{ night_mode }}' || 'auto').toLowerCase();
+        var storage = nightModeOption === 'manual'
+            ? localStorage
+            : sessionStorage;
+        var themeData = loadThemeData();
+
+        function saveThemeData(data) {
+            storage.setItem('theme', JSON.stringify(data));
+        }
+
+        function loadThemeData() {
+            var data = storage.getItem('theme');
+            try {
+                data = JSON.parse(data ? data : '');
+            } catch(e) {
+                data = { nightShift: undefined, autoToggleAt: 0 };
+                saveThemeData(data);
+            }
+            return data;
+        }
+
+        function handleThemeToggle(nightShift) {
+            themeData.nightShift = nightShift;
+            saveThemeData(themeData);
+            html.dataset.theme = nightShift ? 'dark' : 'light';
+            setTimeout(function() {
+                sw.checked = nightShift ? true : false;
+            }, 50);
+        }
+
+        function autoThemeToggle() {
+            // Next time point of theme toggle
+            var now = new Date();
+            var toggleAt = new Date();
+            var hours = now.getHours();
+            var nightShift = hours >= 19 || hours <=7;
+
+            if (nightShift) {
+                if (hours > 7) {
+                    toggleAt.setDate(toggleAt.getDate() + 1);
+                }
+                toggleAt.setHours(7);
+            } else {
+                toggleAt.setHours(19);
+            }
+
+            toggleAt.setMinutes(0);
+            toggleAt.setSeconds(0);
+            toggleAt.setMilliseconds(0)
+
+            var delay = toggleAt.getTime() - now.getTime();
+
+            // auto toggle theme mode
+            setTimeout(function() {
+                handleThemeToggle(!nightShift);
+            }, delay);
+
+            return {
+                nightShift: nightShift,
+                toggleAt: toggleAt.getTime()
+            };
+        }
+
+        // Listen the theme toggle event
+        sw.addEventListener('change', function(event) {
+            handleThemeToggle(event.target.checked);
+        });
+
+        if (nightModeOption == 'auto') {
+            var data = autoThemeToggle();
+
+            // Toggle theme by local setting
+            if (data.toggleAt > themeData.autoToggleAt) {
+                themeData.autoToggleAt = data.toggleAt;
+                handleThemeToggle(data.nightShift);
+            } else {
+                handleThemeToggle(themeData.nightShift);
+            }
+        } else if (nightModeOption == 'manual') {
+            handleThemeToggle(themeData.nightShift);
+        } else {
+            var nightShift = themeData.nightShift;
+            if (nightShift === undefined) {
+                nightShift = nightModeOption === 'on';
+            }
+            handleThemeToggle(nightShift);
+        }
+    })();
+</script>

data/_includes/extensions/trianglify.html

@@ -0,0 +1,26 @@
+{% if include.selector %}
+    {% assign selector = include.selector %}
+{% endif %}
+
+{% if include.seed %}
+    {% assign seed = include.seed %}
+{% endif %}
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/trianglify/2.0.0/trianglify.min.js"></script>
+<script>
+    function setRandomBgImage(selector, seed, zoom) {
+        var element = document.querySelector(selector);
+        if (!element) return;
+        var pattern = Trianglify({
+            width: screen.width * zoom,
+            height: element.offsetHeight * zoom,
+            seed: seed
+        });
+
+        var image = document.createElement("div");
+        image.style.backgroundImage = "url(" + pattern.png() + ")";
+        element.appendChild(image);
+    }
+
+    setRandomBgImage('{{ selector }}', '{{ seed }}', {{ zoom | default: 1}});
+</script>

data/_includes/functions/get-article-excerpt.html

@@ -0,0 +1,33 @@
+{% if include.params.article %}
+    {% assign article = include.params.article %}
+{% endif %}
+
+{% if include.params.lang %}
+    {% assign lang = include.params.lang %}
+{% else %}
+    {% assign lang = lang | default: site.lang | default: "en" %}
+{% endif %}
+
+{% if include.params.excerpt_size %}
+    {% assign excerpt_size = include.params.excerpt_size %}
+{% else %}
+    {% assign excerpt_size = excerpt_size | default: site.excerpt_size | default: 350 %}
+{% endif %}
+
+{%- include functions.html func='get_article_words' -%}
+{% assign words = return %}
+
+{% assign _article = article | strip_html %}
+{% assign _words = _article | size %}
+
+{% assign _size = excerpt_size %}
+
+{% if lang != "en" %}
+    {% assign _size = words | times: 1.0 | divided_by: _words | times: _size | round %}
+{% endif %}
+
+{% if _size > excerpt_size %}
+    {% assign _size = excerpt_size %}
+{% endif %}
+
+{% assign return = _article | truncate: _size %}

data/_includes/functions/get-article-words.html

@@ -0,0 +1,18 @@
+{% if include.params.article %}
+    {% assign article = include.params.article %}
+{% endif %}
+
+{% if include.params.lang %}
+    {% assign lang = include.params.lang %}
+{% else %}
+    {% assign lang = lang | default: site.lang | default: "en" %}
+{% endif %}
+
+{% assign words = article | number_of_words %}
+
+{% if lang != "en" %}
+    {% assign words = words | times: 0.6 | round %}
+    {% assign words = article | strip_html | strip_newlines | size | times: 0.4 | plus: words | round %}
+{% endif %}
+
+{% assign return = words %}

data/_includes/functions/get-banner.html

@@ -0,0 +1,67 @@
+{%- include functions.html func='log' level='debug' msg='Get banner value' -%}
+{% assign name = 'banner' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner = return %}
+
+{%- if banner.first -%}
+    {%- include functions.html func='log' level='debug' msg='Get banner_image value' -%}
+    {% assign name = 'banner.image' %}
+    {%- include functions.html func='get_value' -%}
+    {% assign banner_image = return | relative_url %}
+{%- else -%}
+    {% assign banner_image = banner | relative_url %}
+{%- endif -%}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_background value' -%}
+{% assign name = 'banner.background' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_background = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_opacity value' -%}
+{% assign name = 'banner.opacity' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_opacity = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_height value' -%}
+{% assign name = 'banner.height' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_height = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_min_height value' -%}
+{% assign name = 'banner.min_height' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_min_height = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_heading_style value' -%}
+{% assign name = 'banner.heading_style' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_heading_style = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_subheading_style value' -%}
+{% assign name = 'banner.subheading_style' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_subheading_style = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_video value' -%}
+{% assign name = 'banner.video' %}
+{%- include functions.html func='get_value' -%}
+{% assign banner_video = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_loop value' -%}
+{% assign name = 'banner.loop' %}
+{%- include functions.html func='get_value' default=true -%}
+{% assign banner_loop = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_volume value' -%}
+{% assign name = 'banner.volume' %}
+{%- include functions.html func='get_value' default=0 -%}
+{% assign banner_volume = return %}
+
+{%- include functions.html func='log' level='debug' msg='Get banner_start_at value' -%}
+{% assign name = 'banner.start_at' %}
+{%- include functions.html func='get_value' default=0 -%}
+{% assign banner_start_at = return %}
+
+{% if banner_image or banner_video %}
+    {% assign has_banner = true %}
+{% endif %}

data/_includes/functions/get-categories.html

@@ -0,0 +1,9 @@
+{% assign split_mark = '<|>' %}
+
+{% assign categories = '' %}
+{% for category in site.categories %}
+    {% assign name = category | first %}
+    {% assign categories = categories | append: split_mark  | append: name %}
+{% endfor %}
+
+{% assign return = categories | remove_first: split_mark | split: split_mark | sort: self %}

data/_includes/functions/get-datetimes.html

@@ -0,0 +1,13 @@
+{% if include.params.filter %}
+    {% assign filter = include.params.filter %}
+{% endif %}
+
+{% assign split_mark = '<|>' %}
+
+{% assign dates = '' %}
+{% for post in site.posts %}
+    {% assign name = post.date | date: filter %}
+    {% assign dates = dates | append: split_mark  | append: name %}
+{% endfor %}
+
+{% assign return = dates | remove_first: split_mark | split: split_mark | sort: self | uniq %}

data/_includes/functions/get-reading-time.html

@@ -0,0 +1,39 @@
+{% if include.params.article %}
+    {% assign article = include.params.article %}
+{% endif %}
+
+{% if include.params.lang %}
+    {% assign lang = include.params.lang %}
+{% else %}
+    {% assign lang = lang | default: site.lang | default: "en" %}
+{% endif %}
+
+{% if include.params.speed %}
+    {% assign speed = include.params.speed %}
+{% else %}
+    {% assign speed = 160 %}
+{% endif %}
+
+{%- include functions.html func='get_article_words' -%}
+{% assign words = return %}
+
+{% assign total_mins = words | divided_by: speed | at_least: 1 %}
+
+{% assign hours = total_mins | divided_by: 60 %}
+{% assign mins = total_mins | modulo: 60 %}
+
+{% assign return = "About" %}
+
+{% if hours > 0 %}
+    {% assign unit = "hour" %}
+    {% if hours > 1 %}
+        {% assign unit = unit | append: "s" %}
+    {% endif %}
+    {% assign return = return | append: " " | append: hours | append: " " | append: unit %}
+{% endif %}
+
+{% assign unit = "min" %}
+{% if mins > 1 %}
+    {% assign unit = unit | append: "s" %}
+{% endif %}
+{% assign return = return | append: " " | append: mins | append: " " | append: unit %}

data/_includes/functions/get-tags.html

@@ -0,0 +1,9 @@
+{% assign split_mark = '<|>' %}
+
+{% assign tags = '' %}
+{% for tag in site.tags %}
+    {% assign name = tag | first %}
+    {% assign tags = tags | append: split_mark  | append: name %}
+{% endfor %}
+
+{% assign return = tags | remove_first: split_mark | split: split_mark | sort: self %}

data/_includes/functions/get-value.html

@@ -0,0 +1,41 @@
+{%- if include.params.name -%}
+    {%- assign name = include.params.name -%}
+{%- endif -%}
+
+{%- assign return = nil -%}
+
+{%- assign keys = name | split:'.' -%}
+{%- assign name = keys.first -%}
+{%- assign keys = keys | shift -%}
+
+{%- for step in (1..7) -%}
+
+    {%- case step -%}
+        {%- when 1 -%}
+            {%- assign return = page[name] -%}
+        {%- when 2 -%}
+            {%- assign return = site[name] -%}
+        {%- when 3 -%}
+            {%- assign return = site.data[name] -%}
+        {%- when 4 -%}
+            {%- assign return = site.defaults[page.layout][name] -%}
+        {%- when 5 -%}
+            {%- assign return = site.data.defaults[page.layout][name] -%}
+        {%- when 6 -%}
+            {%- assign return = layout[name] -%}
+        {%- else -%}
+            {%- assign return = include.params.default -%}
+    {%- endcase -%}
+
+    {%- for key in keys -%}
+        {%- assign return = return[key] -%}
+        {%- if return == nil -%}
+            {%- break -%}
+        {%- endif -%}
+    {%- endfor -%}
+
+    {%- if return != nil -%}
+        {%- break -%}
+    {%- endif -%}
+
+{%- endfor -%}

data/_includes/{jsdelivr-combine.html → functions/js-combine.html}

@@ -1,18 +1,18 @@
-{% assign urls = include.urls | split: ',' %}
-{% assign combined_urls = nil %}
-{% assign domain = 'https://cdn.jsdelivr.net/' %}
-{% for url in urls %}
-    {% if url contains domain %}
-        {% assign url_snippet = url | slice: domain.size, url.size %}
-        {% if combined_urls %}
-            {% assign combined_urls = combined_urls | append: ',' | append: url_snippet %}
-        {% else %}
-            {% assign combined_urls = domain | append: 'combine/' | append: url_snippet %}
-        {% endif %}
-    {% elsif url contains '//' %}
-        <script src="{{ url }}"></script>
-    {% else %}
-        <script src="{{ url | relative_url }}"></script>
-    {% endif %}
-{% endfor %}
-{% if combined_urls %}<script src="{{ combined_urls }}"></script>{% endif %}
+{% assign urls = include.urls | split: ',' %}
+{% assign combined_urls = nil %}
+{% assign domain = 'https://cdn.jsdelivr.net/' %}
+{% for url in urls %}
+    {% if url contains domain %}
+        {% assign url_snippet = url | slice: domain.size, url.size %}
+        {% if combined_urls %}
+            {% assign combined_urls = combined_urls | append: ',' | append: url_snippet %}
+        {% else %}
+            {% assign combined_urls = domain | append: 'combine/' | append: url_snippet %}
+        {% endif %}
+    {% elsif url contains '//' %}
+        <script src="{{ url }}"></script>
+    {% else %}
+            <script src="{{ url | relative_url }}"></script>
+    {% endif %}
+{% endfor %}
+{% if combined_urls %}<script src="{{ combined_urls }}"></script>{% endif %}

data/_includes/functions/log.html

@@ -0,0 +1,17 @@
+{% if include.params.level %}
+    {% assign level = include.params.level %}
+{% endif %}
+
+{% if include.params.msg %}
+    {% assign msg = include.params.msg %}
+{% endif %}
+
+{% if site.debug == true %}
+    {% if level == 'debug' %}
+        {% if jekyll.environment == "development" %}
+            <!-- {{ msg }} -->
+        {% endif %}
+    {% else %}
+        <!-- {{ msg }} -->
+    {% endif %}
+{% endif %}

data/_includes/head.html

@@ -24,7 +24,7 @@
 
     <title>{% unless page.layout == "home" %}{{ page.title | append: " | "}}{% endunless %}{{ site.title }}</title>
 
-    {% include favicons.html %}
+    {% include elements/favicons.html %}
 
     {% if site.resources.ignore_env != jekyll.environment and site.resources.self_hosted %}
     <link href="{{ site.data.assets[origin].webfonts | relative_url }}" rel="stylesheet">
@@ -36,8 +36,8 @@
     <link rel="stylesheet" href="{{ site.data.assets[origin].webfonts | relative_url }}">
     {% endif %}
 
-    {% if jekyll.environment == 'production' and site.google_analytics.id != empty and site.google_analytics.id %}
-    {% include ga-site-tag.html %}
+    {% if jekyll.environment == 'production' and site.google_analytics != empty %}
+    {% include extensions/google-analytics.html %}
     {% endif %}
 
     <!-- Bootstrap -->
@@ -66,7 +66,7 @@
     <script src="{{ site.data.assets[origin].jquery.js | relative_url }}"></script>
 
     {% unless site.theme_mode %}
-    {% include mode-toggle.html %}
+        {% include extensions/theme-mode.html %}
     {% endunless %}
 
 </head>

data/_includes/views/header-banner.html

@@ -0,0 +1,9 @@
+<!-- HEADER-BANNER -->
+
+<header id="banner">
+    <div id="header">
+        {% ifhascontent header %}
+            {% contentblock header %}
+        {% endifhascontent %}
+    </div>
+</header>