f0ckv1/s/theme.js

/* Thanks to StephenLynx, I modified his Theme Changer from the Penumbra Lynx Frontend for the Lynxchan Software https://gitgud.io/LynxChan/LynxChan and reused it to make f0ck a nicer place. */
var themes = [ {
  file : 'cyber.css',
  label : 'Cyber',
  id : 'cyber'
}, {
  file : 'pink.css',
  label : 'pinkf0ck',
  id : 'pink'
}, {
  file : 'term.css',
  label : 'TERM',
  id : 'TERM'
}, {
  file : 'coldblue.css',
  label : 'COLD',
  id : 'COLD' ,
}, {
  file : 'krautchan.css' ,
  label : 'Krautchan' ,
  id : 'KC' 
  }];
var customCss;
var addedTheme;
function updateCss() {
  if (addedTheme) {
    addedTheme.parentNode.removeChild(addedTheme);
    addedTheme = null;
  }
  for (var i = 0; i < themes.length; i++) {
    var theme = themes[i];
    if (theme.id === localStorage.selectedTheme) {
      addedTheme = theme.element;
      document.head.insertBefore(theme.element, customCss);
    }
  }
}
for (var i = 0; i < document.head.children.length; i++) {
  var element = document.head.children[i];
  if (element.rel === 'stylesheet' && element.href.indexOf('/custom.css') > -1) {
    customCss = element;
    break;
  }
}
for (var i = 0; i < themes.length; i++) {
  themes[i].element = document.createElement('link');
  themes[i].element.type = 'text/css';
  themes[i].element.rel = 'stylesheet';
  themes[i].element.href = './s/' + themes[i].file;
}
updateCss();
var postingLink = document.getElementById('themes');
if (postingLink) {
  var divider = document.createElement('span');
  divider.innerHTML = '';
  var referenceNode = postingLink.nextSibling;
  postingLink.parentNode.insertBefore(divider, referenceNode);
  var themeSelector = document.createElement('select');
  themeSelector.id = 'themeSelector';
  var vanillaOption = document.createElement('option');
  vanillaOption.innerHTML = 'Default';
  themeSelector.appendChild(vanillaOption);
  for (i = 0; i < themes.length; i++) {
    var theme = themes[i];
    var themeOption = document.createElement('option');
    themeOption.innerHTML = theme.label;
    if (theme.id === localStorage.selectedTheme) {
      themeOption.selected = true;
    }
    themeSelector.appendChild(themeOption);
  }
  themeSelector.onchange = function() {
    if (!themeSelector.selectedIndex) {
      if (localStorage.selectedTheme) {
        delete localStorage.selectedTheme;
        updateCss();
      }
      return;
    }
    var selectedTheme = themes[themeSelector.selectedIndex - 1];
    if (selectedTheme.id === localStorage.selectedTheme) {
      return;
    }
    localStorage.selectedTheme = selectedTheme.id;
    updateCss();
  };
  postingLink.parentNode.insertBefore(themeSelector, referenceNode);
}