var Superlayer;
var base = $('aspectconfigurator');
var zoom = {
	exterior : initialState.view.aspect.extzmimg.$,
	interior : initialState.view.aspect.intzmimg.$
}
/**/

var setEvents = function() {
	

	var samples = ['paintSamples','sheetSamples'];
	samples.each(function(sample){
		$(sample).getElements('.sampleList li').forEach(function(element) {
			element.addEvent('mouseenter',function(){
				showSample(sample, this);
				tipIt(this);
			});
			element.addEvent('mouseleave',function(){
				hideSample(sample, this);
				removeTip();
			});
		});
	});

/*	
	$('paintSamples').getElements('.sampleList li').forEach(function(element) {
		
		element.addEvent('mouseover',showSample);
		element.addEvent('mouseout',hideSample);
	});
	
*/	

	base.getElements('.sampleList li').forEach(function(element) {
		element.addEvent('click',remoteCall);
	});
	
	base.getElement('#resetConfigurator').addEvent('click',resetToDefault);
	
	Superlayer = new Layer(window,new Element('div',{id:'zoomImg'}));
	
	base.getElements('.zoom').forEach(function(element) {
		element.addEvent('click',function() {
			showLayer(element);
		});
	});
	
}




/**


	JSON Stuffs

/**/
var remoteCall  = function() {
	var id = this.id;
	var state = this.state;
	var criteriaNextState = !this.hasClass('CHOSEN');
	var line = getParent(this, {nodeName:'DIV',className:'line'});
	var elms = $(line).getElements('li');
	
	var line = getParent(this, {nodeName:'DIV',className:'line'});
	var elms = $(line).getElements('li');
	elms.each(function(elm){
		elm.className = '';
	});
	var url = setup.url+'&criteria='+id+'&select='+criteriaNextState+'&update=';
	new Ajax(url, {
		method: 'get',
		onSuccess : handleData,
		onFailure : handleFailure
	}).request();
	
}

var resetToDefault = function() {
	var url = setup.url+'&reset=';
	new Ajax(url, {
		method: 'get',
		onSuccess : handleData,
		onFailure : handleFailure
	}).request();
}


var handleData = function(responseText) {
	var aspectdata;
	var data = Json.evaluate(responseText);
	if(data.view) {
		aspectdata = data.view.aspect;
	} else {
		aspectdata = data.diff.aspect;
	}
	updateCarPicture(aspectdata);
	updateInteriorPicture(aspectdata);
	updatePaintPicture(aspectdata);
	updateSheetPicture(aspectdata);
	updateSamplesState(aspectdata);	
}

var handleFailure = function() {

}

/**

	View updaters


/**/

var fetchAllChoices = function(dataset) {
	var fetchedChoices = [];
	var choiceGroups = fixArray(dataset.cgs);
	choiceGroups.forEach(function(choiceGroup) {
		var choices = fixArray(choiceGroup.cg);
		choices.forEach(function(choice) {
				var items = fixArray(choice.c);		
				items.forEach(function(item) {
					//Last level, everythin is an array, so pushing it back
					fetchedChoices.push(item);
			});
		});
	});
	return fetchedChoices;
}


var updateSamplesState = function(datas) {
	
	var choices = fetchAllChoices(datas);
	//console.log(choices);
	for (var i=0; i<choices.length; i++){
		var id = choices[i].v.$;
		if (!id) return;
		var elm = $(id);
		var statut = choices[i].st.$;
		//console.log(elm, statut)
		elm.className = statut;
		elm.setAttribute("sheetSrc", setup.context + choices[i].selimg.$);
	}
}

var updateInteriorPicture = function(datas) {
	var target = $('interiorPicture');
	var picture = target.getElement('img');
	picture.set({src:setup.context+datas.intimg.$});
	
	zoom.interior = datas.intzmimg.$
}

var updateCarPicture = function(datas) {
	var target = $('carPicture');
	var picture = target.getElement('img');
	picture.set({src:setup.context+datas.extimg.$});
	
	zoom.exterior = datas.extzmimg.$
}

var updatePaintPicture = function(datas) {
	var target = $('paintSamples');
	var picture = target.getElement('p img');
	var label = target.getElement('p span');
	
	picture.set({src:setup.context+datas.pimg.$});
	label.setHTML(datas.pimglab.$);
}

var updateSheetPicture = function(datas) {
	var target = $('sheetSamples');
	var picture = target.getElement('p img');
	var label = target.getElement('p span');
	
	picture.set({src:setup.context+datas.sadimg.$});
	label.setHTML(datas.dashimglab.$);

}




var showLayer = function(element) {
	var newImg = new Element('img');
	
	newImg.addEvent('load',function() {
		Superlayer.content.empty()
		Superlayer.content.adopt(this);
		Superlayer.show();
	});
	
	//Using the id on the .zoom element to
	//know if it's a zoom or an interior picture
	//References are in the object <zoom>
	
	newImg.set({src:setup.context+zoom[element.id]});
}


var showSample = function(elm, li) {

	var sheetViewer = $(elm).getElement('p.sheetViewer');
	
	var sheetImg = sheetViewer.getElement('img');
	var sheetLabel = sheetViewer.getElement('span');
	
	
	sheetImg.set({src : li.getAttribute('sheetSrc')});
	sheetLabel.setHTML(li.getAttribute('rel'));
	
	
	
	
	sheetViewer.removeClass('hidden');

}

var hideSample = function(elm, li) {
	var sheetViewer = $(elm).getElement('p.sheetViewer');
	
	sheetViewer.addClass('hidden');
}

var tipIt = function(li){
	if (!li.hasClass('FORBIDDEN')) return;
	var catchedMessage = $('messageTipBoxForbidden').getText();
		//creation layer
		var layer = new Element('span', {id:"tipBox"}).setText(catchedMessage);
		$('body').adopt(layer);
		//positioning layer
		var coordLi = li.getCoordinates();
		var coordBody = $('body').getCoordinates();
		layer.setStyles({
			'top': (coordLi.top - coordBody.top) + coordLi.height/2,
			'left': (coordLi.left - coordBody.left) + coordLi.width
		});
		//test de l'espace suffisant
		if (layer.getCoordinates().bottom > document.documentElement.clientHeight){
			layer.setStyle('top', (coordLi.top - coordBody.top) - (layer.getCoordinates().height - coordLi.height/2))
		}
		if (layer.getCoordinates().right > document.documentElement.clientWidth){
			layer.setStyle('left', (coordLi.left - coordBody.left) - (layer.getCoordinates().width))
		}
}
var removeTip = function(){
	var tipBox = $('tipBox');
	if (tipBox){
		tipBox.remove();
	}
}
/**

	Technical Helpers

/**/


var isArray = function(obj) {
	if(obj instanceof Array)
		return true
	else
		return false
}

var fixArray = function(obj) {
	if(!isArray(obj)){
	var array = new Array();
		array.push(obj);
		return array;
		//return [obj];	
	}
		
	else {
		return obj;
	}
		
}

var filterNotNull = function(item) {
	return item != null;
}

/**

	Functionnal Helpers

/**/


var getSelectedPaint = function() {
	var selected = $$('.paints').getElement('li.CHOSEN').filter(filterNotNull)[0];
	
	return (selected != null) ? selected.id : null;
}


var getSelectedSaddlery = function() {
	var selected = $('saddleries').getElement('li.CHOSEN');
	
	return (selected != null) ? selected.id : null;
}

var getSelectedDashboard = function() {
	var selected = $('dashboards').getElement('li.CHOSEN');
	
	return (selected != null) ? selected.id : null;
}

/**

	Initialization

**/




window.addEvent('load',setEvents);