ArmagedOFF / FinalWhistle.org Players table styling

// ==UserScript==
// @name FinalWhistle.org Players table styling
// @namespace Violentmonkey Scripts
// @icon data:image/png;base64,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
// @match *://www.finalwhistle.org/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant none
// @copyright 2018, ArmagedOFF (https://openuserjs.org/users/ArmagedOFF)
// @license MIT
// @version 1.1.0
// @updateURL https://openuserjs.org/meta/ArmagedOFF/FinalWhistle.org_Players_table_styling.meta.js
// ==/UserScript==

(function() {

  var tag_css = document.createElement('style');
  tag_css.innerHTML = '.training-underline {text-decoration-color: inherit; text-decoration-style: double;} \
                       .denom1,.p1,.p2,.p3,.p4,.p5,.p6,.p7,.p8,.p9,.p10,.p11,.p12,.p13,.p14,.poca{color: #B2B2B2;}\
                       .denom2,.p15,.p16,.p17,.p18,.p19,.p20,.p21,.p22,.p23,.p24,.p25,.p26,.p27,.p28,.p29,.poca{color: #AF9BE1;}\
                       .denom3,.p30,.p31,.p32,.p33,.p34,.p35,.p36,.p37,.p38,.p39,.pslab{color: #6B9FD3;}\
                       .denom4,.p40,.p41,.p42,.p43,.p44,.p45,.p46,.p47,.p48,.p49,.psol{color: #6DCCCE;}\
                       .denom5,.p50,.p51,.p52,.p53,.p54,.p55,.p56,.p57,.p58,.p59,.pdob{color: #31D678;}\
                       .denom6,.p60,.p61,.p62,.p63,.p64,.p65,.p66,.p67,.p68,.p69,.podl{color: #ACE21F;}\
                       .denom7,.p70,.p71,.p72,.p73,.p74,.p75,.p76,.p77,.p78,.p79,.psup{color: #FFD819;}\
                       .denom8,.p80,.p81,.p82,.p83,.p84,.p85,.p86,.p87,.p88,.p89,.pbri{color: #F78C00;}\
                       .denom9,.p90,.p91,.p92,.p93,.p94,.p95,.p96,.p97,.p98,.p99,.p100,.p101,.p102,.p103,.p104,.p105,.pizv{color: #FF6068;}\
                       body, a {color: #E0E0E0;}\
                       \
                       .hovercard-detail {background-color:#496049; border:2px solid #865d2d9c;} \
                       .hovercard .table-fw {font-size:0.7rem;} \
                       .hovercard-detail .player-container, .hovercard-detail .face-part {height:100px;} \
                       .hovercard .table {background-color:#496049; \
                        }'
  var tag_head = document.getElementsByTagName('head');
  tag_head[0].appendChild(tag_css);

  waitForKeyElements ('fw-player-age', function() {
    addPotentialDenom();
    setMainSkillsStyle();
  });
 
// functions 
 
  function getMainSkillsByPosition(position) {
    var skills = [];
    switch (position) {
      case 'FW':
        skills = ['SC', 'OP', 'BC', 'AE', 'CO'];
        break;
      case 'OM':
      case 'RW':
      case 'LW':
        skills = ['OP', 'BC', 'PA', 'CO'];
        break;
      case 'CM':
      case 'RM':
      case 'LM':
        skills = ['OP', 'BC', 'PA', 'CO', 'TA', 'DP'];
        break;
      case 'DM':
      case 'RWB':
      case 'LWB':
      case 'RB':
      case 'LB':
        skills = ['PA', 'CO', 'TA', 'DP'];
        break;
      case 'CB':
        skills = ['AE', 'CO', 'TA', 'DP'];
        break;
    }
    return skills;
  }
 
  function changeSkillsStyle(playerPositionsElement, position) {
    var mainSkills = getMainSkillsByPosition(position);
    var skills = ['SC', 'OP', 'BC', 'PA', 'AE', 'CO', 'TA', 'DP'];
    var elem = playerPositionsElement.parentElement.nextElementSibling;
    for(var i = 0; i < skills.length; i++) {
      elem = elem.nextElementSibling;
      if (!(Array.prototype.indexOf.call(mainSkills, skills[i]) + 1)) { 
        elem.firstElementChild.firstElementChild.style.fontWeight = 'normal';
        if (elem.firstElementChild.firstElementChild.nextElementSibling) {
          elem.firstElementChild.firstElementChild.nextElementSibling.firstElementChild.style.fontWeight = 'normal';        
        }
      }
    }
  }

  function setMainSkillsStyle() {
    var playerPositions = document.getElementsByClassName('badge-position');
    for(var i = 0; i < playerPositions.length; i++) {
      var position = playerPositions[i].innerHTML;
      changeSkillsStyle(playerPositions[i], position);
    }  
  }
 
  function addPotentialDenom() {
    var potentials = document.getElementsByTagName('sup');
    for(var i = 0; i < potentials.length; i++) {
      var potentialValue = potentials[i].innerHTML;
      if (potentialValue < 15) potentials[i].className = 'denom1';
      else if (potentialValue < 30) potentials[i].className = 'denom2';
      else if (potentialValue < 40) potentials[i].className = 'denom3';
      else if (potentialValue < 50) potentials[i].className = 'denom4';
      else if (potentialValue < 60) potentials[i].className = 'denom5';
      else if (potentialValue < 70) potentials[i].className = 'denom6';
      else if (potentialValue < 80) potentials[i].className = 'denom7';
      else if (potentialValue < 90) potentials[i].className = 'denom8';
      else potentials[i].className = 'denom9';    
    }
  }
 
})();