js/utility.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

/* global UtilityApp */

/* TODO: this should probably be something like night_mode.js since it does nothing specific to utility scripts */

window.addEventListener("load", function() {
    const UtilityJS = {
        apply_night_mode: function (is_night, link) {
            console.log("night mode changed to", is_night);

            const light_theme = typeof __default_light_theme !== 'undefined' ? __default_light_theme : 'themes/light.css';
            const dark_theme = typeof __default_dark_theme !== 'undefined' ? __default_dark_theme : 'themes/night.css';

            if (link) {
                const css_override = is_night ? dark_theme : light_theme;

                link.setAttribute("href", css_override + "?" + Date.now());
            }
        },
        setup_night_mode: function() {
            const mql = window.matchMedia('(prefers-color-scheme: dark)');

            const link = document.createElement("link");

            link.rel = "stylesheet";
            link.id = "theme_auto_css";

            link.onload = function() {
                document.querySelector("body").removeClassName("css_loading");

                if (typeof UtilityApp !== "undefined")
                    UtilityApp.init();
            };

            try {
                mql.addEventListener("change", () => {
                    UtilityJS.apply_night_mode(mql.matches, link);
                });
            } catch (e) {
                console.warn("exception while trying to set MQL event listener");
            }

            document.querySelector("head").appendChild(link);

            UtilityJS.apply_night_mode(mql.matches, link);
        }
    };

    UtilityJS.setup_night_mode();
});