vjudge black theme

black color scheme, (no color pallette yet)

Verzia zo dňa 01.06.2022. Pozri najnovšiu verziu.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, Greasemonkey alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey alebo Userscripts.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie, ako napríklad Tampermonkey.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie správcu používateľských skriptov.

(Už mám správcu používateľských skriptov, nechajte ma ho nainštalovať!)

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

(Už mám správcu používateľských štýlov, nechajte ma ho nainštalovať!)

// ==UserScript==
// @name         vjudge black theme
// @namespace    https://github.com/notwatermango/vjudge-dark-theme
// @version      0.1.1
// @description  black color scheme, (no color pallette yet)
// @author       notwatermango
// @match        https://vjudge.net/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=vjudge.net
// @grant        GM_addStyle
// ==/UserScript==

(function () {
  'use strict';
  var colors = {
    background: '#1c1c1c',
    superblack: '#0A0908'
  };
  function overrideStyleAttribute(elm, prop, value) {
    elm.setAttribute("style", elm.getAttribute("style") + `; ${prop}: ${value} !important; `);
  }

  function applyFuncWhenElmLoaded(sel, func, delay = 100) {
    var elm = document.querySelectorAll(sel);
    if (!elm || elm.length == 0) return setTimeout(applyFuncWhenElmLoaded, delay, sel, func);
    for (let i = 0, len = elm.length; i < len; i++) func(elm[i]);
  }
  var body_elm = document.querySelectorAll('body')[0];
  overrideStyleAttribute(body_elm, "color", "white");
  overrideStyleAttribute(body_elm, "background", "none");
  overrideStyleAttribute(body_elm, "background-color", colors.background);
  applyFuncWhenElmLoaded(
    'body',
    function (elm) {
      overrideStyleAttribute(elm, "color", "white");
      overrideStyleAttribute(elm, "background", "none");
      overrideStyleAttribute(elm, "background-color", colors.background)
    }
  );

  function rank_functions() {
    applyFuncWhenElmLoaded(
      '#contest-rank-table tr.this td.meta',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#003540");
        overrideStyleAttribute(elm, "color", "#fff");
      }
    );
    applyFuncWhenElmLoaded(
      '.modal-content, .modal-body',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#003540");
        overrideStyleAttribute(elm, "color", "#fff");
      }, 1500
    );
    applyFuncWhenElmLoaded(
      '#solutionModal #info-panel td',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#121212");
        overrideStyleAttribute(elm, "color", "#fff");
      }, 1500
    )

    applyFuncWhenElmLoaded(
      '#contest-rank-table tr.this.myself td.meta',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#0a697d");
        overrideStyleAttribute(elm, "color", "#fff");
      }, 1500
    );
    applyFuncWhenElmLoaded(
      '#contest-rank-table td.failed',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#321010");
        overrideStyleAttribute(elm, "color", "#fff");
      }
    );
    applyFuncWhenElmLoaded(
      '#contest-rank-table td.accepted',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#366039");
        overrideStyleAttribute(elm, "color", "#fff");
      }
    );
    applyFuncWhenElmLoaded(
      '#contest-rank-table td.prob.fb',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#037603");
        overrideStyleAttribute(elm, "color", "#fff");
      }
    );
    applyFuncWhenElmLoaded( // needs delay
      '#contest-rank-table th',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#091122");
        overrideStyleAttribute(elm, "color", "#fff");
      },
      1500
    );
    applyFuncWhenElmLoaded( // needs delay
      '#contest-rank-table a ',
      function (elm) {
        overrideStyleAttribute(elm, "color", "#fff");
      },
      1500
    );
    applyFuncWhenElmLoaded(
      ' table.table thead',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#06162e");
      }
    );
    applyFuncWhenElmLoaded(
      ' #description-container dd',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", "#101935");
        overrideStyleAttribute(elm, "color", "#F2FDFF");
        overrideStyleAttribute(elm, "box-shadow", "none");
      }
    );
    applyFuncWhenElmLoaded(
      'table.vjudge_sample tbody tr td',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", colors.superblack);
        overrideStyleAttribute(elm, "color", "white");
      }
    );
    applyFuncWhenElmLoaded(
      'table.vjudge_sample thead tr th, li.list-group-item',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", colors.superblack);
        overrideStyleAttribute(elm, "color", "white");
      }, 1000
    );
    //#description-container>dd


  }
  function list_update() {
    applyFuncWhenElmLoaded(
      'li.list-group-item',
      function (elm) {
        overrideStyleAttribute(elm, "background-color", colors.superblack);
        overrideStyleAttribute(elm, "color", "white");
      }, 1000
    );
  }


  applyFuncWhenElmLoaded(
    '.card-block, .list-group-item, .card, .btn',
    function (elm) {
      overrideStyleAttribute(elm, "color", "white");
      overrideStyleAttribute(elm, "background", "none");
      overrideStyleAttribute(elm, "background-color", "#121212")
    }
  );
  // 86c2f7

  rank_functions();
  let currentPage = location.href;

  const mutationObserver = new MutationObserver(function (mutations_list) {
    mutations_list.forEach(function (mutation) {
      mutation.addedNodes.forEach(function (added_node) {
        console.log("observing...:");
          rank_functions();
        list_update();
      });
    });
  });

  function handleHashChange() {
    let urlParam = window.location.hash;
    if (urlParam == '#rank') {
      setTimeout(rank_functions);
      mutationObserver.observe(document.querySelector('#contest-rank-table'), { subtree: false, childList: true });
    } else if (urlParam[1] == 'p') {
      var li_elm = document.querySelector('#prob-descs');
      mutationObserver.observe(li_elm, { subtree: false, childList: true});
    }
  };

  handleHashChange();
  window.addEventListener('hashchange', handleHashChange);

  function onClassChange(element, callback) {
    const observer = new MutationObserver((mutations) => {
      mutations.forEach((mutation) => {
        if (
          mutation.type === 'attributes' &&
          mutation.attributeName === 'class'
        ) {
          callback(mutation.target);
        }
      });
    });
    observer.observe(element, { attributes: true });
    return observer.disconnect;
  }

  onClassChange(body_elm, (node) => {
    node.classList.contains('active')
      ? ''
      : rank_functions();
  });





  //mutationObserver.observe(document.querySelector('#group-contest-table tbody'), {subtree: false, childList: true});
  mutationObserver.observe(body_elm, { subtree: false, childList: true });

  // default #0275d8
  function getStyle(elem, prop) {
    if (elem.currentStyle) {
      return elem.currentStyle[prop];
    }
    return document.defaultView.getComputedStyle(elem, null)[prop];
  }
  function parentHasClass(elm, classname, depth = 0) {
    if (depth == 2) return false;
    if (elm.className.split(' ').indexOf(classname) >= 0) return true;
    return elm.parentNode && parentHasClass(elm.parentNode, classname, depth + 1);
  }
  function fixLinkColor() {
    if (document.readyState != "complete") {
      return setTimeout(fixLinkColor, 100);
    }
    var elms = document.querySelectorAll("a");
    list_update();
    for (let i = 0, len = elms.length; i < len; i++) {
      if (!elms[i].classList.contains('btn') && !parentHasClass(elms[i], 'name')) {
        overrideStyleAttribute(elms[i], "color", "#86c2f7");
      }
    }
  };

  fixLinkColor();


})();