var current_prod_id = 0;
var total_price = 0;
var products = [];
var custom_tray = [];
var draw = false;
var products_in_tray = [];

$(document).ready(function()
{
	$('body').append('<div id="preload" style="display:none;visibility:hidden;"></div>');
	$("#tree_box_categories li").filter(function(index)
		{
			return $('span', this).length == 0;
		}).remove();


	$("#tree_box_categories").treeview({
		animated: "fast",
		collapsed: true,
		unique: false
	});
	

	$('#search').click(function()
	{
		if($(this).val() == 'Search')
			$(this).val('');
	});
	
	$('#search').focusout(function()
	{
		if($(this).val() == '')
			$(this).val('Search');
	});
	

	$('#main_tray > div').mouseover(function()
	{
		$(this).css('opacity', 0.7);
		var id = $(this).attr('id') + '_empty';
		$('#' + id).css({'opacity' : 0.7});
	});
	
	$('#main_tray > div').mouseout(function()
	{
		$(this).css('opacity', 1);
		var id = $(this).attr('id') + '_empty';
		$('#' + id).css('opacity', 1);
	});
	
	$("#tree_box_categories span").click(function()
	{
		current_prod_id = $(this).attr('ref');
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		change_button_value('');
		close_details();
		show_details(obj);
		draw = true;
	}).mousedown(function()
	{
		current_prod_id = $(this).attr('ref');
	});
	
	$('#tray_form input[name=tray]').change(function()
	{
		if(if_full())
			change_price();
	});
	FunctionToTray();
});


/**********************************/

function FunctionToTray()
{
	$('#box0').click(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		change_button_value(1);
		if(draw)
		{
			var url = obj.images[2];
			$(this).css('background', 'none').css('background', 'url(' + url + ')');
			
			products_in_tray[0] = obj.id;
			if(if_full())
				change_price();
		}
		else
		{
			show_details(obj);
			draw = true;
		}
	}).mouseup(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		var url = obj.images[2];
		$(this).css('background', 'none').css('background', 'url(' + url + ')');
		products_in_tray[0] = obj.id;
		if(if_full())
			change_price();
	});
	
	$('#box1').click(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		change_button_value(1);
		if(draw)
		{
			var url = obj.images[1];
			$(this).css('background', 'url(' + url + ')');
			products_in_tray[1] = obj.id;
			if(if_full())
				change_price();
		}
		else
		{
			show_details(obj);
			draw = true;
		}
	}).mouseup(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		var url = obj.images[1];
		$(this).css('background', 'none').css('background', 'url(' + url + ')');
		products_in_tray[1] = obj.id;
		if(if_full())
			change_price();
	});
	
	$('#box2').click(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		change_button_value(1);
		if(draw)
		{
			var url = obj.images[4];
			$(this).css('background', 'none').css('background', 'url(' + url + ')');
			products_in_tray[2] = obj.id;
			if(if_full())
				change_price();
		}
		else
		{
			show_details(obj);
			draw = true;
		}
	}).mouseup(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		var url = obj.images[4];
		$(this).css('background', 'none').css('background', 'url(' + url + ')');
		products_in_tray[2] = obj.id;
		if(if_full())
			change_price();
	});
	
	$('#box3').click(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		change_button_value(1);
		if(draw)
		{
			var url = obj.images[3];
			$(this).css('background', 'none').css('background', 'url(' + url + ')');
			products_in_tray[3] = obj.id;
			if(if_full())
				change_price();
		}
		else
		{
			show_details(obj);
			draw = true;
		}
	}).mouseup(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		var url = obj.images[3];
		$(this).css('background', 'none').css('background', 'url(' + url + ')');
		products_in_tray[3] = obj.id;
		if(if_full())
			change_price();
	});;
	
	$('#box4').click(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		change_button_value(1);
		if(draw)
		{
			var url = obj.images[5];
			$(this).css('background', 'none').css('background', 'url(' + url + ')');
			products_in_tray[4] = obj.id;
			if(if_full())
				change_price();
		}
		else
		{
			show_details(obj);
			draw = true;
		}
	}).mouseup(function()
	{
		var obj = get_product(current_prod_id);
		if(!obj)	return;
		var url = obj.images[5];
		$(this).css('background', 'none').css('background', 'url(' + url + ')');
		products_in_tray[4] = obj.id;
		if(if_full())
			change_price();
	});;
}

/**********************************/

 function get_product(id)
 {
    for(var i = 0 ; i < products.length; i++){
      if(products[i].id == id)
		{
            return products[i];
		}
    }
    return 0;
 }
 /******************************/
 function show_details(p)
 {
	$('#test').show().animate({width : 250});
	$('#main_tray').css('border-right',  0);
	var str = '';
	str += '<div class="tray_descr">';
	str += '<div><img src="' + p.images[0] + '" border="0" width="60" height="70" align="left"/> <b>' + p.name + '</b></div><br/><br/><br/>';
	str += '<b><-- click tray to fill a section</b> <br/><br/>';
	str += p.descr + '<br/><br/>';
	str += '<div style="text-align: right;">';
	str += '<input type="button" value="No thanks!" id="close_details"/>';
	str += '</div>';
	str += '</div>';
	$('#test').html(str);
	ButtonFunctions();
 }
 
  /******************************/
  function close_details()
  {
	$('#test div').remove();
	$('#test').animate({width : 2}, 100).hide();
	$('#main_tray').css('border-right',  1);
  }
  
  /*****************************/
  function ButtonFunctions()
  {
	$('#close_details').click(function()
	{
		close_details();
		draw = false;
	});
  }
  
  /*****************************/
  function change_button_value(done)
  {
	var value = 'No thanks!';
	if(done)
		value = 'Done with this item!';
	$('#close_details').val(value);
  }
  /*****************************/
  function change_price()
  {
	for(var i = 1; i < 4; i++)
	{
		var total = 0;
		for(var x in products_in_tray)
		{
			if(products_in_tray)
			{
				var o = get_product(products_in_tray[x]);
				total += o.tray[i];	
			}
		}
		total += custom_tray[i];
		var obj;
		if(i == 1)
			obj = $('#tray_form span[name=small]');
		if(i == 2)
			obj = $('#tray_form span[name=large]');
		if(i == 3)
			obj = $('#tray_form span[name=medium]');
			
	
		obj.html('$' + total.toPrecision(2));
	}
	
	for(var i = 0; i < products_in_tray.length; i++)
	{
		var o = get_product(products_in_tray[i]);
		var num = i + 1;
		var id = '#tray_form input[name=scart_' + num + ']';

		$(id).val(o.id);		
	}
	
	$('#button').attr('disabled', false);
  }
  
    /*****************************/
	function if_full()
	{
		var id = $('#tray_form input[name=tray]').val();
		var count = 0;
		for(var x in products_in_tray)
		{
			if(products_in_tray[x])
				count++;
		}
		if(count == 5)	return true;
		return false;
	}
	
	/*****************************/


  
