ColorTouch = {
	
	start:function(){
		ColorTouch.ilayout();
		ColorTouch.cols = $$('ul.thumbcol');
		ColorTouch.view_thumb = $('vthumb');
		ColorTouch.view_name = $('vname');
		ColorTouch.activateThumb();
		new Ajax('ct.xml',{onComplete:function(resp){
											   ColorTouch.json = xml2json.parser(resp);}
											   }).request();
	},
	
	ilayout:function(){
		$('viewer').setStyle('display','block');
	},
	
	activateThumb:function(){
		var ctcols = ColorTouch.cols;
		var id =0;
		ctcols.each(function(i){
							 var li =i.getChildren();
							 li.each(function(c){
												//console.log(c);// li element
												imgEl = c.getFirst();
												imgEl.setProperty('id','ct'+id++);
											  	imgEl.addEvent('mouseover',function(e){
																				ColorTouch.preview(e);});
											  	}
									 
									 )
							 
							 	}
							 
					);
	},
	
	preview:function(e){
		var id = (window.ie6 || window.ie) ? e.srcElement.id : e.target.id;		
		try{
			var indx = id.substr(2);
			var tm = ColorTouch.json.ct.shades.shade[indx].img;
			ColorTouch.view_thumb.setStyle('background-image','url(images/ctshades/'+tm+'.jpg)');
			ColorTouch.view_name.setHTML(ColorTouch.json.ct.shades.shade[indx].name);																
		}catch(e){
			
		}
		
	}
	
}

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