const Cookie = {
  get: name => {
    const c = document.cookie.match(`(?:(?:^|.*; *)${name} *= *([^;]*).*$)|^.*$`)[1];
    if(c) return decodeURIComponent(c);
  },
  set: (name, value, opts = {}) => {
    if(opts.days) {
      opts['max-age'] = opts.days * 60 * 60 * 24;
      delete opts.days;
    }
    opts = Object.entries(opts).reduce((accumulatedStr, [k, v]) => `${accumulatedStr}; ${k}=${v}`, '');
    document.cookie = name + '=' + encodeURIComponent(value) + opts
  },
  delete: (name, opts) => Cookie.set(name, '', {'max-age': -1, ...opts})
};

(() => {
  const themes = [ 'f0ck', 'p1nk', 'orange', 'amoled' ];
  const acttheme = Cookie.get('theme') ?? "f0ck";
  if(acttheme !== document.documentElement.getAttribute("theme"))
    document.documentElement.setAttribute("theme", acttheme);
  if(themecontainer = document.querySelector("#themes")) {
    const sb = document.createElement("select");
    sb.id = "themeselector";
    themes.forEach(o => {
      const option = document.createElement("option");
      option.text = o;
      if(acttheme === o)
        option.selected = true;
      sb.add(option);
    });
    themecontainer.insertAdjacentElement("afterend", sb);
    sb.addEventListener("change", e => {
      const s = e.target.options[e.target.selectedIndex].innerText;
      document.documentElement.setAttribute("theme", s);
      Cookie.set("theme", s, { path: "/", days: 360 });
    });
  }
})();