function set_border_color(id, color)
{
    $(id).style.borderColor = color;
}

function make_hex(r,g,b) 
{
    r = r.toString(16); if (r.length == 1) r = '0' + r;
    g = g.toString(16); if (g.length == 1) g = '0' + g;
    b = b.toString(16); if (b.length == 1) b = '0' + b;
    
    return "#" + r + g + b;
}

function fade_element(id, fps, duration, from, to)
{
    if (!fps) fps = 30;
    if (!duration) duration = 3000;
    if (!from || from == "#") from = "#ffff33";

    var frames = Math.round(fps * (duration / 1000));
    var interval = duration / frames;
    var delay = interval;
    var frame = 0;

    if (from.length < 7) from += from.substr(1,3);
    if (to.length < 7) to += to.substr(1,3);

    var rf = parseInt(from.substr(1, 2), 16);
    var gf = parseInt(from.substr(3, 2), 16);
    var bf = parseInt(from.substr(5, 2), 16);
    var rt = parseInt(to.substr(1, 2), 16);
    var gt = parseInt(to.substr(3, 2), 16);
    var bt = parseInt(to.substr(5, 2), 16);

    var r, g, b, h;
    while (frame < frames)
    {
        r = Math.floor(rf * ((frames-frame)/frames) + rt * (frame/frames));
        g = Math.floor(gf * ((frames-frame)/frames) + gt * (frame/frames));
        b = Math.floor(bf * ((frames-frame)/frames) + bt * (frame/frames));
        h = make_hex(r, g, b);
        
        setTimeout("set_border_color('" + id + "', '" + h + "')", delay);

        frame++;
        delay = interval * frame;
    }
    setTimeout("set_border_color('" + id + "', '" + to + "')", delay);
}