function fader(elementId) {
    this.elementId = elementId;
    this.timeoutContainer = null;
}

//Get the hex version of the background color for the fader element.
fader.prototype.getBgColorHex = function() {
    var colorBlock = document.getElementById(this.elementId);
    var color;
    if (colorBlock.currentStyle) {
        color = colorBlock.currentStyle.backgroundColor;
    }
    if (document.defaultView) {
        color = document.defaultView.getComputedStyle(colorBlock, '').getPropertyValue("backgroundColor");
    }
    if (color.indexOf("#") != -1) {
        return (color);
    }
    else if (color.indexOf("rgb") != -1) {
        return this.convertRGBToHex(color);
    }
    else {
        throw ("Invalid color: please enter a valid hex or rgb color.");
    }
}

//Get the hex version of the foreground color for the fader element.
fader.prototype.getColorHex = function() {
    var colorBlock = document.getElementById(this.elementId);
    var color;
    if (colorBlock.currentStyle) {
        color = colorBlock.currentStyle.color;
    }
    if (document.defaultView) {
        color = document.defaultView.getComputedStyle(colorBlock, '').getPropertyValue("color");
    }
    if (color.indexOf("#") != -1) {
        return (color);
    }
    else if (color.indexOf("rgb") != -1) {
        return this.convertRGBToHex(color);
    }
    else {
        throw ("Invalid color: please enter a valid hex or rgb color.");
    }
}

//Convert an RGB color format to hex format.
fader.prototype.convertRGBToHex = function(color) {
    color = color.split("(")[1];
    color = color.substring(0, color.length - 1);
    color = color.split(",");
    var red = parseInt(parseFloat(color[0]) * .06);
    var green = parseInt(parseFloat(color[1]) * .06);
    var blue = parseInt(parseFloat(color[2]) * .06);
    return "#" + red.toString(16) + green.toString(16) + blue.toString(16);
}

//Get a piece of the hex color format
//color: the hex formatted color to split
//component: the portion of the color to get (red = 0, green = 1, blue = 2).
fader.prototype.getHexComponent = function(color, component)
{
    var Length = color.length;
    switch(Length)
    {
        case 4:
        {
            color = parseInt(color.substring(component + 1, component + 2), 16);
            break; 
        }
        case 7:
        {
            color = parseInt(color.substring((component * 2) + 1, (component * 2) + 2), 16); 
            break;
        }
        default:
        {
            alert("Invalid color: please enter a valid hex or rgb color.");
            break;
        }
    }
    return color;
}

fader.prototype.getComponentDiff = function(startColor, endColor, component) {
    var start = this.getHexComponent(startColor, component);
    var end = this.getHexComponent(endColor, component);
    return end - start;
}

fader.prototype.hideElement = function() {
    document.getElementById(this.elementId).style.display = "none";
}

fader.prototype.showElement = function() {
    document.getElementById(this.elementId).style.display = "block";
}

fadeColor = function(fader, endColor, stepTime, callbackFunction) {
    var startColor = fader.getColorHex();
    var doCallback = false;
    var Color = "#";
    fader.showElement();
    for (i = 0; i < 3; i++) {
        var diff = fader.getComponentDiff(startColor, endColor, i);
        if (!doCallback) {
            doCallback = (diff != 0);
        }
        if (diff > 0) {
            var NewComponent = fader.getHexComponent(startColor, i) + 1;
            Color += NewComponent.toString(16);
        }
        if (diff == 0) {
            var Component = fader.getHexComponent(startColor, i);
            Color += Component.toString(16);
        }
        if (diff < 0) {
            var NewComponent = fader.getHexComponent(startColor, i) - 1;
            Color += NewComponent.toString(16);
        }
    }
    document.getElementById(fader.elementId).style.color = Color;
    if (doCallback) {
        fader.timeoutContainer = setTimeout(function() { fadeColor(fader, endColor, stepTime, callbackFunction); }, stepTime);
    }
    else if (callbackFunction) {
        clearTimeout(fader.timeoutContainer);
        fader.timeoutContainer = null;
        callbackFunction();
    }
}
