I am trying to add simple themes to my website. The script is supposed to create a theme cookie to see what theme is used and then apply the style. It used to work but now it gets set to httpOnly(meaning it cant be changed by JS even if it gets created by JS). It gets set to http only true even if I specifficaly try to set it to false which prevents me from changing it. Here is the code:
// Themes
var numOfThemes = 2;
var theme = 0;
// Standart getCookie function copied from w3schools
function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
// This function sets the theme depending on the value inside the theme cookie (eg.: "theme=3")
function applyTheme() {
var cookie = parseInt(getCookie("theme"));
var hs = document.getElementsByTagName('style');
if(hs.length > 1);
for (var i=0, max=hs.length; i < max; i++) {
hs[i].parentNode.removeChild(hs[i]);
}
switch(cookie) {
case 0:
theme = 0;
break;
case 1:
theme = 1;
var style = document.createElement('style');
style.innerHTML = ``;
document.head.appendChild(style);
break;
//...
}
}
// This is supposed to set the cookie inside the browser. I tried adding HttpOnly=false; at the end but it doesn't change anything
function setTheme(theme) {
const d = new Date();
d.setTime(d.getTime() + (365*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = "theme=" + theme + ";" + expires + ";path=/;SameSite=Lax;";
}
// this is the function for switching the theme on a button click
function themeSwitch() {
var theme = + parseInt(getCookie("theme")) + 1;
if(theme > 4) {
theme = 0;
}
setTheme(theme);
}
applyTheme();