Koleston = {
	items : [], active : "",previous : "",
	//widths : [228,243,228,228,228,248,228],
	widths : [248,263,248,248,248,268,248],
	widths_ie : [250,265,250,250,250,280,250],
	big:{"ti1":"item_nature1_big.jpg","ti2":"item_red_big.jpg",
		"ti3":"item_supermix_big.jpg","ti4":"item_nature2_big.jpg",
		"ti5":"item_redintensive_big.jpg","ti6":"item_nature1_big.jpg",
		"ti7":"item_blonde_big.jpg"},
	small:{"ti1":"item_nature1.png","ti2":"item_red.png",
		"ti3":"item_supermix.png","ti4":"item_nature2.png",
		"ti5":"item_redintensive.png","ti6":"item_nature1.png",
		"ti7":"item_blonde.png"},
	small_ie:{"ti1":"item_nature1.gif","ti2":"item_red.gif",
		"ti3":"item_supermix.gif","ti4":"item_nature2.gif",
		"ti5":"item_redintensive.gif","ti6":"item_nature1.gif",
		"ti7":"item_blonde.gif"},		
	start : function() {
		Koleston.ilayout();		
		Koleston.items = $$('li.thumbitem');
		Koleston.view_title = $('vtitle');
		Koleston.view_thumb = $('vthumb');
		Koleston.view_name = $('vname');
		Koleston.activateThumb();
		//Koleston.json = 
		new Ajax('kp.xml',{onComplete:function(resp){
								Koleston.json = xml2json.parser(resp);}
								}).request();
		
	},
	
	ilayout : function(){
		//$('slogan2').setStyle('top','160px');
		//$('content_txt2bbb').setStyle('padding-top','45px');
		$('content_itemsbbb').setStyle('display','block');		
		$('viewer').setStyle('display','block');
	},
	
	activateThumb : function(){
		var Kmenu = Koleston.items;
		var fx = new Fx.Elements(Kmenu, {wait: false, duration: 300,  
								 		transition: Fx.Transitions.sineInOut,
										onStart:function(){
											if(Koleston.active != Koleston.previous && Koleston.previous != ""){
												$(Koleston.previous).getFirst().setStyle('display','none');
												var sm = (window.ie6) ? Koleston.small_ie[Koleston.previous] : Koleston.small[Koleston.previous];
												$(Koleston.previous).setStyle('background-image','url(images/'+sm+')');
												$(Koleston.previous).setStyle('height','110px');
											}
											//$(Koleston.active).setStyle('background-image','url(images/'+Koleston.big[Koleston.active]+')');
											//$(Koleston.active).setStyle('height','194px');											
													
										},								 
								 		onComplete:function(){
											if(Koleston.active != ""){
												$(Koleston.active).getFirst().setStyle('display','block');
												$(Koleston.active).setStyle('background-image','url(images/'+Koleston.big[Koleston.active]+')');
												$(Koleston.active).setStyle('height','194px');
											}
											Koleston.previous = Koleston.active;
												//console.log($(Koleston.active));
										
										}						
										});
		Kmenu.each(function(thumb,i){
					thumb.addEvent('mouseover',function(ev){
								Koleston.active = this.id;	
								if(Koleston.json != null)
									Koleston.view_title.setHTML(Koleston.json.kp.collection[i].name);
								ev = new Event(ev).stop();
								var obj = {};
								obj[i] = {
									'width': [thumb.getStyle('width').toInt(), (window.ie6)?Koleston.widths_ie[i]+11
																						    :Koleston.widths[i]]
								};
								Kmenu.each(function(other, j){
									if (other != thumb){
										var w = other.getStyle('width').toInt();
										if (w != 50) obj[j] = {'width': [w, 50]};
									}
								});
								fx.start(obj);
								
					})
					thumb.getFirst().getChildren()[1].getChildren().each(function(k,j){
						k.addEvent('mouseover',function(){
							Koleston.preview(thumb,j,i)
						});															  
					});
					
		});
		document.addEvent('mouseover', function(e){
			e = new Event(e);
			var rel = e.relatedTarget;
			if (!rel) return;
			if (rel.hasClass && (rel.hasClass('thumbitem') || rel.hasClass('thumbitem') 
			   || rel.hasClass('thumbmenu') || rel.id == 'content_itemsbbb')){
				var obj = {};
				Kmenu.each(function(other, j){
					obj[j] = {'width': [other.getStyle('width').toInt(), 80]};
				});
				if(Koleston.active != "") $(Koleston.active).getFirst().setStyle('display','none');	
				Koleston.active = "";
				fx.start(obj);
			};
		});	
	},
	preview:function(t,li,ci){  //t: li element a: index of li
		//console.log(">>>"+ci+">>>"+li);
		try{			
			var tm =Koleston.json.kp.collection[ci].shades.shade[li].img;
			Koleston.view_thumb.setStyle('background','url(images/kpshades/'+tm+'.jpg)');
			Koleston.view_name.setHTML(Koleston.json.kp.collection[ci].shades.shade[li].name);
		}catch(e){
			//Koleston.view_name.setHTML("loading data...");	
		}
		//console.log("this: "+this.id+", t: "+t+" , a: "+a+" ,p: "+p.id);
		//vt.setHTML(collection);
	},
	showBig:function(thumb){
		var len = thumb.length;
		var s1 = thumb.substr(0,len-5);
		var s2 = thumb.substr(-5);
		return s1+"_big"+".jpg)";
	}
}


window.addEvent('domready',Koleston.start);