Hue-Tab/options.js at master · TwoTau/Hue-Tab · GitHub

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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
document.querySelectorAll("input:not([type=color])").forEach(inputElement => inputElement.addEventListener("change", saveOptions));
document.querySelectorAll("input[type=color]").forEach(inputElement => {
    inputElement.addEventListener("change", saveOptions);
});

document.addEventListener("DOMContentLoaded", restoreOptions);

function geti(elementId) {
    return document.getElementById(elementId);
}

function saveOptions(event) {
    const target = event.target;

    if (target.checked) {
        if (target.id === "sample-hex-copyable") {
            // turning on copyable, so turn off editable
            geti("sample-hex-editable").checked = false;
        } else if (target.id === "sample-hex-editable") {
            // turning on editable, so turn off copyable
            geti("sample-hex-copyable").checked = false;
        }
    }

    let startColor;
    if (geti("random-on-start").checked) {
        startColor = "random";
    } else if (geti("custom-on-start").checked) {
        startColor = geti("start-color-custom").value;
    }

    let startBgColor;
    if (geti("random-bg-on-start").checked) {
        startBgColor = "random";
    } else if (geti("match-bg-on-start").checked) {
        startBgColor = "match";
    } else if (geti("custom-bg-on-start").checked) {
        startBgColor = geti("start-bg-custom").value;
    }

    let startBgColorIncognito;
    if (geti("random-bg-on-incognito").checked) {
        startBgColorIncognito = "random";
    } else if (geti("match-bg-on-incognito").checked) {
        startBgColorIncognito = "match";
    } else if (geti("dark-bg-on-incognito").checked) {
        startBgColorIncognito = "#222222";
    } else if (geti("custom-bg-on-incognito").checked) {
        startBgColorIncognito = geti("incognito-bg-custom").value;
    }

    chrome.storage.sync.set({
        "clickBGChange": geti("click-bg-change").checked,
        "sampleHexVisible": geti("sample-hex-visible").checked,
        "sampleHexEditable": geti("sample-hex-editable").checked,
        "clickCopyHex": geti("sample-hex-copyable").checked,
        "sampleNameVisible": geti("sample-name-visible").checked,
        "schemeVisible": geti("scheme-visible").checked,
        "schemeHexVisible": geti("scheme-hex-visible").checked,
        "schemeClickSampleChange": geti("scheme-click-sample-change").checked,
        "schemeClickBGChange": geti("scheme-click-bg-change").checked,
        "randomVisible": geti("random-visible").checked,
        "settingsVisible": geti("settings-visible").checked,
        "fontfamily": geti("font-family").value,
        "fontsize": geti("font-size").value,
        "uppercaseHex": geti("uppercase-hex").checked,
        "startColor": startColor,
        "startBgColor": startBgColor,
        "startBgColorIncognito": startBgColorIncognito
    }, function() {
        geti("saved-banner").className = "slide-in";
        setTimeout(function() {
            geti("saved-banner").className = "slide-out";
        }, 800);
    });
}

function restoreOptions() {
    chrome.storage.sync.get({
        "clickBGChange": true,
        "sampleHexVisible": true,
        "sampleHexEditable": true,
        "clickCopyHex": false,
        "sampleNameVisible": false,
        "schemeVisible": true,
        "schemeHexVisible": true,
        "schemeClickSampleChange": false,
        "schemeClickBGChange": false,
        "randomVisible": true,
        "settingsVisible": true,
        "fontfamily": "Helvetica",
        "fontsize": 100,
        "uppercaseHex": true,
        "startColor": "random",
        "startBgColor": "random",
        "startBgColorIncognito": "#222222"
    }, function(items) {
        geti("click-bg-change").checked = items.clickBGChange;
        geti("sample-hex-visible").checked = items.sampleHexVisible;
        geti("sample-hex-copyable").checked = items.clickCopyHex;
        geti("sample-hex-editable").checked = items.sampleHexEditable;
        geti("sample-name-visible").checked = items.sampleNameVisible;
        geti("scheme-visible").checked = items.schemeVisible;
        geti("scheme-hex-visible").checked = items.schemeHexVisible;
        geti("scheme-click-sample-change").checked = items.schemeClickSampleChange;
        geti("scheme-click-bg-change").checked = items.schemeClickBGChange;
        geti("random-visible").checked = items.randomVisible;
        geti("settings-visible").checked = items.settingsVisible;
        geti("font-family").value = items.fontfamily;
        geti("font-size").value = items.fontsize;
        geti("uppercase-hex").checked = items.uppercaseHex;

        if (items.startColor === "random") {
            geti("random-on-start").checked = true;
        } else {
            geti("custom-on-start").checked = true;
            geti("start-color-custom").value = items.startColor;
        }

        if (items.startBgColor === "random") {
            geti("random-bg-on-start").checked = true;
        } else if (items.startBgColor === "match") {
            geti("match-bg-on-start").checked = true;
        } else {
            geti("custom-bg-on-start").checked = true;
            geti("start-bg-custom").value = items.startBgColor;
        }

        if (items.startBgColorIncognito === "random") {
            geti("random-bg-on-incognito").checked = true;
        } else if (items.startBgColorIncognito === "match") {
            geti("match-bg-on-incognito").checked = true;
        } else if (items.startBgColorIncognito === "#222222") {
            geti("dark-bg-on-incognito").checked = true;
        } else {
            geti("custom-bg-on-incognito").checked = true;
            geti("incognito-bg-custom").value = items.startBgColorIncognito;
        }
    });
}