https://sgsgsama.github.io/js/main.js

1/* eslint-disable node/no-unsupported-features/node-builtins */
2(function ($, moment, ClipboardJS, config) {
3    $('.article img:not(".not-gallery-item")').each(function () {
4        // wrap images with link and add caption if possible
5        if ($(this).parent('a').length === 0) {
6            $(this).wrap('<a class="gallery-item" href="' + $(this).attr('src') + '"></a>');
7            if (this.alt) {
8                $(this).after('<p class="has-text-centered is-size-6 caption">' + this.alt + '</p>');
9            }
10        }
11    });
12
13    if (typeof $.fn.lightGallery === 'function') {
14        $('.article').lightGallery({ selector: '.gallery-item' });
15    }
16    if (typeof $.fn.justifiedGallery === 'function') {
17        if ($('.justified-gallery > p > .gallery-item').length) {
18            $('.justified-gallery > p > .gallery-item').unwrap();
19        }
20        $('.justified-gallery').justifiedGallery();
21    }
22
23    if (typeof moment === 'function') {
24        $('.article-meta time').each(function () {
25            $(this).text(moment($(this).attr('datetime')).fromNow());
26        });
27    }
28
29    $('.article > .content > table').each(function () {
30        if ($(this).width() > $(this).parent().width()) {
31            $(this).wrap('<div class="table-overflow"></div>');
32        }
33    });
34
35    function adjustNavbar() {
36        const navbarWidth = $('.navbar-main .navbar-start').outerWidth() + $('.navbar-main .navbar-end').outerWidth();
37        if ($(document).outerWidth() < navbarWidth) {
38            $('.navbar-main .navbar-menu').addClass('justify-content-start');
39        } else {
40            $('.navbar-main .navbar-menu').removeClass('justify-content-start');
41        }
42    }
43    adjustNavbar();
44    $(window).resize(adjustNavbar);
45
46    function toggleFold(codeBlock, isFolded) {
47        const $toggle = $(codeBlock).find('.fold i');
48        !isFolded ? $(codeBlock).removeClass('folded') : $(codeBlock).addClass('folded');
49        !isFolded ? $toggle.removeClass('fa-angle-right') : $toggle.removeClass('fa-angle-down');
50        !isFolded ? $toggle.addClass('fa-angle-down') : $toggle.addClass('fa-angle-right');
51    }
52
53    function createFoldButton(fold) {
54        return '<span class="fold">' + (fold === 'unfolded' ? '<i class="fas fa-angle-down"></i>' : '<i class="fas fa-angle-right"></i>') + '</span>';
55    }
56
57    $('figure.highlight table').wrap('<div class="highlight-body">');
58    if (typeof config !== 'undefined'
59        && typeof config.article !== 'undefined'
60        && typeof config.article.highlight !== 'undefined') {
61
62        $('figure.highlight').addClass('hljs');
63        $('figure.highlight .code .line span').each(function () {
64            const classes = $(this).attr('class').split(/\s+/);
65            for (const cls of classes) {
66                $(this).addClass('hljs-' + cls);
67                $(this).removeClass(cls);
68            }
69        });
70
71
72        const clipboard = config.article.highlight.clipboard;
73        const fold = config.article.highlight.fold.trim();
74
75        $('figure.highlight').each(function () {
76            if ($(this).find('figcaption').length) {
77                $(this).find('figcaption').addClass('level is-mobile');
78                $(this).find('figcaption').append('<div class="level-left">');
79                $(this).find('figcaption').append('<div class="level-right">');
80                $(this).find('figcaption div.level-left').append($(this).find('figcaption').find('span'));
81                $(this).find('figcaption div.level-right').append($(this).find('figcaption').find('a'));
82            } else {
83                if (clipboard || fold) {
84                    $(this).prepend('<figcaption class="level is-mobile"><div class="level-left"></div><div class="level-right"></div></figcaption>');
85                }
86            }
87        });
88
89        if (typeof ClipboardJS !== 'undefined' && clipboard) {
90            $('figure.highlight').each(function () {
91                const id = 'code-' + Date.now() + (Math.random() * 1000 | 0);
92                const button = '<a href="javascript:;" class="copy" title="Copy" data-clipboard-target="#' + id + ' .code"><i class="fas fa-copy"></i></a>';
93                $(this).attr('id', id);
94                $(this).find('figcaption div.level-right').append(button);
95            });
96            new ClipboardJS('.highlight .copy'); // eslint-disable-line no-new
97        }
98
99        if (fold) {
100            $('figure.highlight').each(function () {
101                $(this).addClass('foldable'); // add 'foldable' class as long as fold is enabled
102
103                if ($(this).find('figcaption').find('span').length > 0) {
104                    const span = $(this).find('figcaption').find('span');
105                    if (span[0].innerText.indexOf('>folded') > -1) {
106                        span[0].innerText = span[0].innerText.replace('>folded', '');
107                        $(this).find('figcaption div.level-left').prepend(createFoldButton('folded'));
108                        toggleFold(this, true);
109                        return;
110                    }
111                }
112                $(this).find('figcaption div.level-left').prepend(createFoldButton(fold));
113                toggleFold(this, fold === 'folded');
114            });
115
116            $('figure.highlight figcaption .level-left').click(function () {
117                const $code = $(this).closest('figure.highlight');
118                toggleFold($code.eq(0), !$code.hasClass('folded'));
119            });
120        }
121    }
122
123    const $toc = $('#toc');
124    if ($toc.length > 0) {
125        $toc.addClass('column-left is-sticky');
126        const $mask = $('<div>');
127        $mask.attr('id', 'toc-mask');
128
129        $('body').append($mask);
130
131        function toggleToc() { // eslint-disable-line no-inner-declarations
132            $toc.toggleClass('is-active');
133            $mask.toggleClass('is-active');
134        }
135
136        $toc.on('click', toggleToc);
137        $mask.on('click', toggleToc);
138        $('.navbar-main .catalogue').on('click', toggleToc);
139    }
140}(jQuery, window.moment, window.ClipboardJS, window.IcarusThemeSettings));