﻿function colorFade(target,start,end,steps,speed) {
    var startrgb,endrgb,rint,gint,bint;
    clearInterval(target.timer);
    endrgb = colorConv(end);
    startrgb = colorConv(start);
    target.r = startrgb[0];
    target.g = startrgb[1];
    target.b = startrgb[2];
    rint = Math.round(Math.abs(startrgb[0]-endrgb[0])/steps);
    gint = Math.round(Math.abs(startrgb[1]-endrgb[1])/steps);
    bint = Math.round(Math.abs(startrgb[2]-endrgb[2])/steps);
    if(rint == 0) { rint = 1 }
    if(gint == 0) { gint = 1 }
    if(bint == 0) { bint = 1 }
    target.step = 1;
    target.timer = setInterval( function() { animateColor(target,steps,endrgb[0],endrgb[1],endrgb[2],rint,gint,bint) }, speed);
}

function animateColor(target,steps,er,eg,eb,rint,gint,bint) {
    if(target.step <= steps) {
        var r = target.r;
        var g = target.g;
        var b = target.b;
        if(r >= er) {r = r - rint;} else {r = parseInt(r) + parseInt(rint);}
        if(g >= eg) {g = g - gint;} else {g = parseInt(g) + parseInt(gint);}
        if(b >= eb) {b = b - bint;} else {b = parseInt(b) + parseInt(bint);}
        target.style.backgroundColor = 'rgb(' + r + ',' + g + ',' + b + ')';;
        target.r = r;
        target.g = g;
        target.b = b;
        target.step += 1;
    } else {
        clearInterval(target.timer);
        target.style.backgroundColor = 'rgb(' + er + ',' + eg + ',' + eb + ')';
    }
}

function colorConv(color) {
    return [parseInt(color.substring(1,3),16),parseInt(color.substring(3,5),16), parseInt(color.substring(5,7),16)];}