//////////////////////////////////////////////////////////////////////////
// KoLorizer v2
// Recoded by Phlip (#509981), based on concept from
//  stabwound (#690960)
//  OlafTheMediocre (#438205)
//  Code contributed by OneTonTomato (#316736)
//  KoL Colors by Turias (http://forums.kingdomofloathing.com/viewtopic.php?t=48919) 
//////////////////////////////////////////////////////////////////////////
// This script allows you to change the border and header colors of the
// Kingdom of Loathing tables, as well as the background color of all pages.
//////////////////////////////////////////////////////////////////////////
// ==UserScript==
// @name          The KoLorizer Mk II
// @description	  Alters the Kingdom of Loathing color scheme, depending on who you're logged in as. As whom you are logged in.
// @namespace     http://www.mrphlip.com/
// @include       http://kingdomofloathing.com/*
// @include       http://www*.kingdomofloathing.com*
// @include       http://loathing2.com/*
// @include       http://www*.loathing2.com/*
// @include       http://dev.kingdomofloathing.com/*
// ==/UserScript==
//////////////////////////////////////////////////////////////////////////

/** CONFIGURABLES START HERE **/
// bgcolors set the background colors for your various multies
// the line staring "0: " is the default
// it us used if you are not logged in, or if you are logged in as someone who's not on the list.
// add one line for each multi you have. The names *must* be in *lowercase*.
// Any color accepted by CSS is valid here. A list of names can be found at
// http://www.w3.org/TR/2003/CR-css3-color-20030514/#svg-color
// for the background colors, the lighter the color is, the better.
// Darker colors will result in a harder-to-read interface and faded pictures.
bgcolors = {
	0: "#EEF",
	phlip: "#DEF",
	leomard: "#FED",
	banjulhu: "#EFD",
};
// bordercolors sets the colors for the borders around boxes in the interface.
// Lighter colors are not an issue here, any color is fine.
// Again, 0 is the default, and others for your multies, in lowercase.
bordercolors = {
	0: "#339",
	phlip: "#069",
	leomard: "#960",
	banjulhu: "#690",
}
/** CONFIGURABLES END HERE **/

function loggingin()
{
  // note that this will set the variable even if the login fails...
  // but since you'll have to log in again to get it to work, this should be fine...
  GM_setValue("loggedinas." + location.host, document.forms[0].elements.namedItem('loginname').value);
}
//Are we on the login screen? If so, hook the login form
if (document.forms && document.forms[0] && document.forms[0].action.indexOf("login.php") >= 0)
  document.forms[0].addEventListener("submit",loggingin,false);

bgcolor = bgcolors[0];
bordercolor = bordercolors[0];

// don't colour for login/logout/etc pages, but do colour item description popups and the like
if (parent.frames.length > 0 || (window.opener && window.opener != window))
{
  username = GM_getValue("loggedinas." + location.host, 0);
  username = (username + "").toLowerCase();
  if (bgcolors[username])
    bgcolor = bgcolors[username];
  if (bordercolors[username])
    bordercolor = bordercolors[username];
}

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}
addGlobalStyle('input, textarea, select, checkbox { background-color: ' + bgcolor + ' ! important; }');
document.body.style.backgroundColor = bgcolor;
// when we read back the color it should be in rgb(##, ##, ##) format - exactly what we want
// still, fail cleanly if it isn't... images just won't be replaced.
bgcolor = document.defaultView.getComputedStyle(document.body, null).backgroundColor;
if (results = bgcolor.match(/rgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/i))
{
  bgred = results[1];
  bggreen = results[2];
  bgblue = results[3];
  minimum = bgred < bggreen ? (bgred < bgblue ? bgred : bgblue) : (bggreen < bgblue ? bggreen : bgblue);
  alpha = minimum / 255.0;
  transpred   = Math.round((bgred   - minimum) / (1 - alpha));
  transpgreen = Math.round((bggreen - minimum) / (1 - alpha));
  transpblue  = Math.round((bgblue  - minimum) / (1 - alpha));
  transpcol = "rgb(" + transpred + "," + transpgreen + "," + transpblue + ")";
  // div inside a span? "display: table-cell"? what craziness is this?
  // yeah, I know, but somehow it works. Just a div loses the inline-ness, just a span means the background is only 1em high...
  addGlobalStyle(
    'span.transpimg { } ' +
    'span.transpimg div { display: table-cell; background: ' + transpcol + ' } ' +
    'span.transpimg img { opacity: ' + alpha + '; -moz-opacity: ' + alpha + '; display: block } '
  );
  
  images = document.getElementsByTagName("img");
  for (i = 0; i < images.length; i++)
  {
    if (images[i].id && images[i].id.indexOf("slider") >= 0)
      continue;
    
    span = document.createElement("span");
    span.className = "transpimg";
    div = document.createElement("div");
    images[i].parentNode.insertBefore(span, images[i]);
    span.appendChild(div);
    div.appendChild(images[i]);
  }
}
else
  GM_log("Something went wrong... " + bgcolor + " isn't rgb(##,##,##) format");

tablecells = document.getElementsByTagName("td");
for (i = 0; i < tablecells.length; i++)
{
  // I don't think there's any green borders left in the kingdom... still, can't hurt to check anyways
  if (tablecells[i].bgColor                 == "blue" ||
      tablecells[i].bgColor                 == "green") tablecells[i].style.backgroundColor   = bordercolor;
  if (tablecells[i].style.backgroundColor   == "blue" ||
      tablecells[i].style.backgroundColor   == "green") tablecells[i].style.backgroundColor   = bordercolor;
  if (tablecells[i].style.borderTopColor    == "blue" ||
      tablecells[i].style.borderTopColor    == "green") tablecells[i].style.borderTopColor    = bordercolor;
  if (tablecells[i].style.borderRightColor  == "blue" ||
      tablecells[i].style.borderRightColor  == "green") tablecells[i].style.borderRightColor  = bordercolor;
  if (tablecells[i].style.borderBottomColor == "blue" ||
      tablecells[i].style.borderBottomColor == "green") tablecells[i].style.borderBottomColor = bordercolor;
  if (tablecells[i].style.borderLeftColor   == "blue" ||
      tablecells[i].style.borderLeftColor   == "green") tablecells[i].style.borderLeftColor   = bordercolor;
}