var count;
var item;
var time_flag;

var color;

var colors = new Array();	

//green
colors['green'] = new Array();
colors['green'][7] = "#65682b";
colors['green'][6] = "#747839";
colors['green'][5] = "#85894c";
colors['green'][4] = "#969961";
colors['green'][3] = "#a8ab79";
colors['green'][2] = "#bcbe95";
colors['green'][1] = "#d0d2b4";
colors['green'][0] = "#e5e6d3";


//orange
colors['orange'] = new Array();
colors['orange'][7] = "#B3522C";
colors['orange'][6] = "#c06541";
colors['orange'][5] = "#ce7c5b";
colors['orange'][4] = "#db957a";
colors['orange'][3] = "#e7b09a";
colors['orange'][2] = "#f0c5b5";
colors['orange'][1] = "#f7dacf";
colors['orange'][0] = "#fdede6";


//blue
colors['blue'] = new Array();
colors['blue'][7] = "#154847";
colors['blue'][6] = "#235c5b";
colors['blue'][5] = "#3b7776";
colors['blue'][4] = "#558f8e";
colors['blue'][3] = "#6da1a0";
colors['blue'][2] = "#88b5b4";
colors['blue'][1] = "#a9cbcb";
colors['blue'][0] = "#d0e5e5";

//pink
colors['pink'] = new Array();
colors['pink'][7] = "#8D4B70";
colors['pink'][6] = "#9d5f82";
colors['pink'][5] = "#ac7393";
colors['pink'][4] = "#bc88a5";
colors['pink'][3] = "#cb9eb7";
colors['pink'][2] = "#d8b4c8";
colors['pink'][1] = "#e3cad8";
colors['pink'][0] = "#f2e6ed";


//purple
colors['purple'] = new Array();
colors['purple'][7] = "#694D95";
colors['purple'][6] = "#7b60a5";
colors['purple'][5] = "#8f76b5";
colors['purple'][4] = "#a58fc6";
colors['purple'][3] = "#bba9d6";
colors['purple'][2] = "#cec0e2";
colors['purple'][1] = "#dfd5ed";
colors['purple'][0] = "#efe9f7";


//red
colors['red'] = new Array();
colors['red'][7] = "#B4504E";
colors['red'][6] = "#bf615f";
colors['red'][5] = "#cc7775";
colors['red'][4] = "#d88e8d";
colors['red'][3] = "#e5a8a7";
colors['red'][2] = "#efbfbe";
colors['red'][1] = "#f8d7d6";
colors['red'][0] = "#feeded";



function product_on(id)
{
	color = $$('body')[0].className;		
	if(time_flag)
	{
	     clearTimeout(time_flag);
	     kill_product(get_item());      
	}
	id = document.getElementById(id);
	item = id;
	id.style["borderStyle"] = "solid";
	id.style["borderWidth"] = "2px";
	id.style["borderLeftWidth"] = "18px";
	id.style["marginRight"] = "-2px";
	id.style["marginLeft"] = "-16px";
	id.style["borderColor"] = colors[color][0];
	start_fade_up();
}

function start_fade_up()
{
    count = 0;
    time_flag = setTimeout("fade_step_up()", 20);
}

function product_off(id)
{
 
    if(time_flag)
        clearTimeout(time_flag);
    id = document.getElementById(id);
    item = id;

    id.style["borderStyle"] = "solid";
    id.style["borderWidth"] = "2px";
    id.style["borderleftWidth"] = "18px";
    id.style["marginRight"] = "-2px";
    id.style["marginLeft"] = "0px";
    id.style["borderColor"] = colors[color][7];

start_fade_down();   
	
}

function fade_step_up()
{    
     num = add_count();
     if(num > 7)
        return;
     id = get_item();
     id.style["borderColor"] = colors[color][num];
     time_flag = setTimeout("fade_step_up()", 16);
}

function start_fade_down()
{
    count = 7;
    time_flag = setTimeout("fade_step_down()", 16);
}


function fade_step_down()
{
     num = minus_count();
     if(num < 0)
     {
        kill_product(get_item());
        return;
     }    
     id = get_item();
     id.style["borderColor"] = colors[color][num];
     time_flag = setTimeout("fade_step_down()", 20);
}

function kill_product(id)
{
    item = id;
    id.style["border"] = "solid 2px #fff";
    id.style["marginLeft"] = "0px";
    id.style["marginRight"] = "0px";
}

function get_item()
{
    return item;
}

function add_count()
{
    count++;
    return count;
}

function minus_count()
{
    count--;
    return count;
}