StarkTemplar / No Spoilers Liquipedia

// ==UserScript==
// @name  No Spoilers Liquipedia
// @namespace https://gist.github.com/StarkTemplar/322d7a7409f96fe89547/raw/eccf0b596501a008e2e9393efd2d70681661cca7/NoSpoilerLiquipedia.user.js    
// @description   "No spoilers" style for StarCarft2 on wiki.teamliquid.net
// @include   http://wiki.teamliquid.net/*
// @include   https://wiki.teamliquid.net/*
// @include http://liquipedia.net/*
// @include https://liquipedia.net/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
// @author        StarkTemplar
// @license MIT
// @grant none
// ==/UserScript==
 
//I originally found script at http://stylebot.me/styles/9173 from author acrus. Full credit to him or her for getting me started.
//used following reference heavily http://www.w3.org/TR/selectors/#selectors
 
var styleEl = document.createElement('style');
styleEl.type = 'text/css';
 
// ***NEW FORMAT applies to tournament brackets
//hides rounds 1-10. every other bracket column contains a blank div for spacing
styleEl.innerHTML = '.bracket-column:nth-child(1) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(3) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(5) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(7) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(9) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(11) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(13) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(15) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(17) .bracket-game{ display:none;}';
styleEl.innerHTML += '.bracket-column:nth-child(19) .bracket-game{ display:none;}';
 
//hides scores
styleEl.innerHTML += '.bracket-score {    background-color: #444444;}';
 
//makes all table font bold so the winner is not shown
styleEl.innerHTML += '.bracket-game {    font-weight: bold;}';
 
//shows rounds 1-10 when hovered. every other bracket column contains a blank div for spacing
styleEl.innerHTML += '.bracket-column:nth-child(1):hover .bracket-game { display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(3):hover .bracket-game { display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(5):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(7):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(9):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(11):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(13):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(15):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(17):hover .bracket-game{ display:block;}';
styleEl.innerHTML += '.bracket-column:nth-child(19):hover .bracket-game{ display:block;}';

//show rounds scores 1-10 when clicked. every every other bracket column contains a blank div for spacing
styleEl.innerHTML += '.bracket-column:nth-child(1):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(3):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(5):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(7):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(9):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(11):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(13):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(15):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(17):active .bracket-score {    background-color: #ffffff;}';
styleEl.innerHTML += '.bracket-column:nth-child(19):active .bracket-score {    background-color: #ffffff;}';
 
 
// ***NEW FORMAT applies to group stages with matchlist class name
//make all table font bold
styleEl.innerHTML += '.matchlist tr td{ font-weight: bold;}';
 
//highlights all player names so winner is not revealed
styleEl.innerHTML += '.matchlist tr td{ background-color: #ccffcc;}';
 
//hides scores
styleEl.innerHTML += '.matchlist tr td:nth-child(2), .matchlist tr td:nth-child(3){ background-color: #444444;}';
 
//shows scores when hovered
styleEl.innerHTML += '.matchlist tr:hover td:nth-child(2), .matchlist tr:hover td:nth-child(3){ background-color: #ffffff;}'; 
 
// ***NEW FORMAT applies to group stages with grouptable class name
//hides scores
styleEl.innerHTML += '.grouptable tr td:nth-child(3), .grouptable tr td:nth-child(4){ background-color: #444444;}';
 
//highlights all player names so winner is not revealed
styleEl.innerHTML += '.grouptableslot { background-color: #ffffff ! important;}';

//hides column header so finshing place is not revealed
styleEl.innerHTML += '.grouptable th{ background-color: #444444 ! important;}';

//reveals first column header so group stage is visible
styleEl.innerHTML += '.grouptable tr:first-of-type th{ background-color: #ffffff ! important;}';
 
//shows scores when hovered
styleEl.innerHTML += '.grouptable tr td:nth-child(3):hover, .grouptable tr td:nth-child(4):hover{ background-color: #ffffff;}';

//shows column header when hovered
styleEl.innerHTML += '.grouptable th:hover{ background-color: #ffffff ! important;}';

// *** NEW FORMAT applies to proleague esque round robin matches with class name of wikitable
//make all table font bold
styleEl.innerHTML += '.wikitable tr td{ font-weight: bold;}';
 
//hides scores
styleEl.innerHTML += '.wikitable tr td:nth-child(2), .wikitable tr td:nth-child(3){ background-color: #444444;}';
 
//shows scores when hovered
styleEl.innerHTML += '.wikitable tr:hover td:nth-child(2), .wikitable tr:hover td:nth-child(3){ background-color: #ffffff;}';

//highlights all player names so winner is not revealed in map details
styleEl.innerHTML += '.collapsed tr td:nth-child(1){ background-color: #ccffcc ! important;}';
styleEl.innerHTML += '.collapsed tr td:last-child{ background-color: #ccffcc ! important;}';

//hides Ace match
styleEl.innerHTML += '.collapsed tr:nth-child(7) td:nth-child(1), .collapsed tr:nth-child(7) td:nth-child(3){ visibility: hidden;}';

//shows Ace match
styleEl.innerHTML += '.collapsed tr:nth-child(7):hover td:nth-child(1), .collapsed tr:nth-child(7):hover td:nth-child(3){ visibility: visible;}';

// ***NEW FORMAT applies to many different type of brackets
//removes map strikethrough so length of series is not revealed
styleEl.innerHTML += '.maprow div{ text-decoration: none ! important;}';
styleEl.innerHTML += '.collapsed s{ text-decoration: none ! important;}';
styleEl.innerHTML += '.bracket-game-details div{ text-decoration: none ! important;}';

// *** NEW FORMAT applies to proleague esque playoff rounds with class name of bracket-game-details
//highlights all player names so winner is not revealed in map details
styleEl.innerHTML += '.bracket-game-details div{ background-color: #ccffcc ! important;}';
//styleEl.innerHTML += '.bracket-game-details tr td:last-child{ background-color: #ccffcc ! important;}';

//hides match participants. crucial since this is an all kill format. a players name repeating would be an indicator that the player won.
styleEl.innerHTML += '.bracket-game-details div:nth-child(3) div div:nth-child(1), .bracket-game-details div:nth-child(3) div div:nth-child(3){ visibility: hidden;}';

//shows match participants
styleEl.innerHTML += '.bracket-game-details div:nth-child(3) div:hover div:nth-child(1), .bracket-game-details div:nth-child(3) div:hover div:nth-child(3){ visibility: visible;}';
 
document.documentElement.appendChild(styleEl);
 
//remove all green check marks so user can look at map details without seeing spoilers
//found at http://stackoverflow.com/questions/6434558/greasemonkey-script-to-rewrite-image-links
// This fetches all of the <img> tags and stores them in "tags".
var tags = document.getElementsByTagName('img');
 
// This loops over all of the <img> tags.
for (var i = 0; i < tags.length; i++) {
 
  // This replaces the src attribute of the tag with the modified one
  tags[i].src = tags[i].src.replace('/commons/images/6/66/GreenCheck.png', '/commons/images/8/89/NoCheck.png');
}

//randomize the order of the rows for group tables so the winner of the group is not known
//get the table we want to sort.
//info found at http://stackoverflow.com/questions/4652835/how-to-sort-an-existing-table-in-greasemonkey
$("table.grouptable").each(function() {
  
  var jTableToSort    = $(this);

  //get the rows to sort, but skip the first row, since it contains column titles.
  var jRowsToSort     = jTableToSort.find("tr:gt(1)");

  //sort the rows in place.
  jRowsToSort.sort(randomSort).appendTo(jTableToSort);

  function randomSort ()
  {
      if (Math.random()<.5) return -1; else return 1;
  }
});