summaryrefslogtreecommitdiff
path: root/scripts
diff options
context:
space:
mode:
Diffstat (limited to 'scripts')
-rw-r--r--scripts/cookie.js36
-rw-r--r--scripts/light-dark.js24
-rw-r--r--scripts/theme.js75
3 files changed, 135 insertions, 0 deletions
diff --git a/scripts/cookie.js b/scripts/cookie.js
new file mode 100644
index 0000000..9c88963
--- /dev/null
+++ b/scripts/cookie.js
@@ -0,0 +1,36 @@
+'use strict';
+
+class Cookies {
+ static getCookie(name){
+ let cookies = document.cookie.split(";");
+ for(let i in cookies) {
+ let cname = cookies[i].trim().split("=")[0];
+ if(cname == name){
+ return cookies[i].trim().slice(name.length + 1);
+ }
+ }
+ return "";
+ }
+
+ static setCookie(name, value, data = {SameSite: "Strict"}) {
+ let extra = "";
+
+ for(let key in data)
+ {
+ extra += "; " + key + "=" + data[key];
+ }
+
+ document.cookie = name + "=" + value + extra;
+ }
+
+ static setYearCookie(name, value) {
+ var date = new Date(Date.now());
+ date.setFullYear(date.getFullYear() + 1);
+ Cookies.setCookie(name, value, {SameSite: "Strict", expires: date.toUTCString()});
+ }
+
+ static removeCookie(name) {
+ var date = new Date(0);
+ Cookies.setCookie(name, "", {SameSite: "Strict", expires: date.toUTCString()});
+ }
+}
diff --git a/scripts/light-dark.js b/scripts/light-dark.js
new file mode 100644
index 0000000..0e23d98
--- /dev/null
+++ b/scripts/light-dark.js
@@ -0,0 +1,24 @@
+'use strict';
+
+(function() {
+ lightDark = document.getElementById("light-dark");
+
+ function setButtonText() {
+ if(Theme.get() == BASE_THEMES[0][0])
+ lightDark.innerText = BASE_THEMES[1][1] + " Mode";
+ else
+ lightDark.innerText = BASE_THEMES[1][0] + " Mode";
+ }
+
+ function changeTheme(e) {
+ if(Theme.get() == BASE_THEMES[0][0])
+ Theme.set(BASE_THEMES[0][1]);
+ else
+ Theme.set(BASE_THEMES[0][0]);
+
+ setButtonText();
+ }
+
+ lightDark.addEventListener("click", changeTheme);
+ setButtonText();
+})();
diff --git a/scripts/theme.js b/scripts/theme.js
new file mode 100644
index 0000000..8147260
--- /dev/null
+++ b/scripts/theme.js
@@ -0,0 +1,75 @@
+'use strict';
+
+const BASE_THEMES = [[
+ "/styles/themes/colors-base.css",
+ "/styles/themes/colors-dark.css"
+],
+[
+ "Light",
+ "Dark"
+]];
+
+const APP_NAME = "cshift-net";
+
+class Theme{
+ static theme = document.getElementById("theme");
+ static UserThemes = [[],[]];
+
+ static init()
+ {
+ let uth = Cookies.getCookie("userThemes-" + APP_NAME).split(',');
+
+ for (let i = 1; i < uth.length; i += 2)
+ {
+ this.UserThemes[0].push(uth[i - 1]);
+ this.UserThemes[1].push(uth[i]);
+ }
+
+ if(Cookies.getCookie("theme-" + APP_NAME) == ""){
+ Cookies.setYearCookie("theme", BASE_THEMES[0][0]);
+ }
+ }
+
+ static restore()
+ {
+ Theme.init();
+ Theme.theme.setAttribute("href", Cookies.getCookie("theme-" + APP_NAME) + "?v=" + Date.now());
+ }
+
+ static set(sheet)
+ {
+ Cookies.setYearCookie("theme-" + APP_NAME, sheet);
+ Theme.theme.setAttribute("href", sheet + "?v=" + Date.now());
+ }
+
+ static get() {
+ return Cookies.getCookie("theme-" + APP_NAME);
+ }
+
+ static setUserThemes() {
+ let out = "";
+ for (let i = 0; i < this.UserThemes[0].length; i++)
+ {
+ if(i !== 0)
+ out = out + ",";
+
+ out = out + this.UserThemes[0][i] + "," + this.UserThemes[1][i];
+ }
+
+ Cookies.setYearCookie("userThemes-" + APP_NAME, out);
+ }
+
+ static removeUserTheme (index) {
+ this.UserThemes[0].splice(index, 1);
+ this.UserThemes[1].splice(index, 1);
+ this.setUserThemes();
+ }
+
+ static addUserTheme (name, value) {
+ this.UserThemes[0].push(name);
+ this.UserThemes[1].push(value);
+ this.setUserThemes();
+ }
+}
+
+Theme.restore(); \ No newline at end of file