// event observe
Event.observe(window, 'load', function() {
		/* start the CompareThem script 
		new CompareThem('shopping_cart');
		new CompareThem('administration_tool');	
		new CompareThem('template');	
		new CompareThem('template_managing');	
		new CompareThem('google_products');	
		new CompareThem('kijiji');	
		new CompareThem('administrator');	
		new CompareThem('administrator_log');	

		new CompareThem('categories');	
		new CompareThem('categories_depth');	
		new CompareThem('products');	
		new CompareThem('specials');	
		new CompareThem('translate');	
		new CompareThem('wysiwyg');	
		new CompareThem('languages');	
		new CompareThem('currencies');	

		new CompareThem('paypal_ipn');
		new CompareThem('postepay');
		new CompareThem('mark');
		new CompareThem('banking_transfer');

		new CompareThem('express_courier');	
		new CompareThem('italian_postal_service');
		new CompareThem('own_courier');
		new CompareThem('shipping_free');
		new CompareThem('home_delivery');
		new CompareThem('flat_rate');
		new CompareThem('item_rate');

		new CompareThem('stats');	
		new CompareThem('design_usability');
		new CompareThem('search_engine_keyword');


		new CompareThem('banner');	
		new CompareThem('backup');	
		new CompareThem('file_manager');
		new CompareThem('newsletter');

		new CompareThem('web_space_traffic');
		new CompareThem('email_address');
		new CompareThem('email_aliases_redirects');
		new CompareThem('daily_backup_data');
		new CompareThem('application_update');
		new CompareThem('tld');
		new CompareThem('assistance');
		new CompareThem('daily_reports');
		new CompareThem('uptime');
		//new CompareThem('');
		*/
		enable = false;
		showTab('standard_features');
		});

// CompareThem prototype class
CompareThem = Class.create();
CompareThem.prototype = {

	// costructor function 
initialize: function(nodeId){
				observeId = document.getElementById(nodeId+"_row");
				nodeIdEl = document.getElementById(nodeId+"_desc");

				observeId.timeout = false;
				observeId.timein = false;
				nodeIdEl.shown = false;
				Event.observe(observeId, 'mouseover', this.mouseover.bind(observeId, nodeIdEl), false);
				Event.observe(observeId, 'mouseout', this.mouseout.bind(observeId, nodeIdEl), false);
			},

mouseover: function(node){
			   // block the timeout
			   if(this.timeout){
				   clearTimeout(this.timeout);
				   this.timeout = false;
			   }
			   if(enable){
				   this.timein = setTimeout(CompareThem.prototype.show.bind(node), 150);
			   }
		   },

mouseout: function(node){
			  // set the timeout before hide the node
			  if(this.timein){
				  clearTimeout(this.timein);
				  this.timein = false;
			  }
			  if(enable){
				  this.timeout = setTimeout(CompareThem.prototype.hide.bind(node),401);
			  }
		  },

show: function() {
		  // show it
		  if(this.style.display=='none'){
			  Effect.toggle(this, 'blind', {duration:0.4});
		  }
	  },

hide: function() {
		  // hide it
		  if(this.style.display!='none'){
			  Effect.toggle(this, 'blind', {duration:0.4});
		  }
	  }
}


// this show and hide all the descriptions
function showDescriptions(){
	if(enable == true){
		enable = false;
		type_display = 'block';
	}
	else{
		enable = true;
		type_display = 'none';
	}
	for(i=0; i<features.length; i++){
		document.getElementById(features[i]).style.display=type_display;
	}
}

// show the tab
function showTab(selected){
	item_sel = document.getElementById(selected+"_table");
	item_li = document.getElementById(selected+"_li");
	//make de-select te item not selected
	for(i=0; i<tabs.length; i++){
		if( tabs[i]!=selected){
			act_li = document.getElementById(tabs[i]+"_li");
			child_nodes = act_li.childNodes;
			for( j=0; j<child_nodes.length; j++){
				if( ((child_nodes[j]).className).indexOf("tab_left_bg")==0 ){
					child_nodes[j].className = "tab_left_bg";
				}
				else if( ((child_nodes[j]).className).indexOf("tab_right_bg")==0 ){
					child_nodes[j].className = "tab_right_bg";
				}
				else{
					child_nodes[j].className = "tab_bg";
				}
			}
			act_item = document.getElementById(tabs[i]+"_table");
			act_item.style.display= "none";
		}
	}
	//make selected the item that receive the onclick event
	item_sel.style.display = ""; //make visible the table
	child_nodes = item_li.childNodes; //change background to the tab item
	for( i=0; i<child_nodes.length; i++){
		if( ((child_nodes[i]).className).indexOf("tab_left_bg")==0 ){
			child_nodes[i].className = "tab_left_bg tab_selected";
		}
		else if( ((child_nodes[i]).className).indexOf("tab_right_bg")==0 ){
			child_nodes[i].className = "tab_right_bg tab_selected";
		}
		else{
			child_nodes[i].className = "tab_bg tab_selected";
		}
	}
}

// set the width for the tabs
function set_width_li_item(){
	li_items = (document.getElementById('store_nav_tab')).getElementsByTagName('LI');
	width= 0;
	for( i=0; i<li_items.length; i++){
		width += li_items[i].clientWidth;
	}
	//add 1 because upper level div must be more larger than the content
	document.getElementById('store_nav_container').style.width = (width+2)+"px";
}