/* -------------------------------------------------------------------
	Terrasanta - User interface Javascript Library
------------------------------------------------------------------- */


/* -- INDEX ------------------

[0.0] - Funzioni principali di setup
[1.0] - Funzioni animazione aree
[2.0] - Funzioni setup riquadri
[3.0] - Funzioni apri riquadri
--------------------------- */




/* 0.0 - FUNZIONI PRINCIPALI DI SETUP
-------------------------------------------------------------------------------------------------------------------------------------------------------- */

// Questa è la funzione che gestisce il setup generale della pagina
function setupGenerale() {
  areeSetup("li","sub-menu-aperto","sub-menu-chiuso",45);
  areeSetup("div","riquadro-aperto","riquadro-chiuso",34);
}

/* 1.0 - FUNZIONI ANIMAZIONI AREE
-------------------------------------------------------------------------------------------------------------------------------------------------------- */


// Questa è la funzione che calcola le iterazioni necessarie alle animazioni dei pannelli
function iterationsCalculator (startPoint, endPoint) {
	
	// Creo un array temporaneo per immagazzinare i risultati dei calcoli ed una variabile per le iterazioni
	var temp_array = new Array();
	var iterations = 0;
	
	// Imposto una variabile per simulare la dimensione dell'elemento durante i calcoli
	var actualPoint = startPoint;
	
	// Con un ciclo calcolo ed immagazzino nell'array "step_details" gli incrementi necessari all'animazione dell'elemento
	while (actualPoint < endPoint) {
		var difference = Math.ceil((endPoint-actualPoint)/2);	
		temp_array[iterations] = difference;
		actualPoint = actualPoint + temp_array[iterations];
		iterations++;
	}
	// Restituisco i valori calcolati
	return temp_array;
}


// Questa è la funzione che gestisce l'animazione verticale dei pannelli
// I parametri sono:
// - element: il pannello da aprire o chiudere
// - action: l'azione da compiere, che può essere "open" o "close"
// - start: il frame di partenza dell'animazione, se servisse iniziare da più avanti. Di solito è 0
// - calling_link: il riferimento al link che ha invocato l'animazione
// - calling_link_onclick: il parametro "onclick" del link che ha invocato l'animazione
// - dependent_div: il riferimento ad un altro div dipendente che si deve muovere insieme all'elemento (esempio: la sezione inStore del browser) per il comportamento anomalo di IE6 e IE7
function verticalAnimation(element, action, start, calling_link, calling_link_onclick, dependent_div) {
	
	// Inizio annullando l'onclick del tasto che ha attivato l'animazione, così da evitare effetti spiacevoli
	calling_link.onclick = null;
	
	// In base all'azione aumento o diminuisco l'altezza dell'incremento equivalente al valore di start
	if (action == "open") {
		element.style.height = parseInt(element.offsetHeight) + element.step_details[start] + "px";
	} else if (action == "close") {
		element.style.height = parseInt(element.offsetHeight) - element.step_details[start] + "px";
	}
	
	// Controllo se c'è un div dipendente e ne riassegno la classe. Fonte: http://stackoverflow.com/questions/1228427/elements-positioned-relatively-dont-move-when-the-dom-is-updated-ie6-and-ie7
	if (dependent_div != null) {
		dependent_div.className = dependent_div.className;
	}
	
	// Aumento start di 1, così da proseguire all'incremento successivo
	start++;
	
	// Creo la funzione da richiamare con il setTimeout
	function call() {
		verticalAnimation(element, action, start, calling_link, calling_link_onclick, dependent_div);
	}
	
	// Controllo se l'animazione ha già effettuato tutte le sue iterazioni. In questo caso interrompo il temporizzatore e riattivo l'onclick originale del link
	if (start==element.iterations) {
		clearTimeout(timer);
		calling_link.onclick = calling_link_onclick;
		return;
	}
	
	// Con questa istruzione faccio ripetere questa stessa funzione
	timer = setTimeout(call,50);
}


/* 2.0 - SETUP ARREE CHIUSE
-------------------------------------------------------------------------------------------------------------------------------------------------------- */


// Questa è la funzione che gestisce il setup delle areeda chiudere
// 
// Variabili: 
// elementType: tipo di elemento da chiudere (div, p e simili)
// classOpen : classe elemento da chiudere
// classClosed: classe elemento una volta chiuso
// closeHeight : altezza elemento quando è chiuso

function areeSetup(elementType,classOpen,classClosed,closeHeight) {
	// Creo un elenco di tutti i div e con un ciclo cerco quelli che hanno la classe "riquadro"
	var div_list = document.getElementsByTagName(elementType);
	for (loop=0; loop<div_list.length; loop++) {
		if (div_list[loop].className == classOpen) {
			
			// Di questi calolo l'altezza naturale aperta e la imposto come variabile "natural_height". Imposto anche una variabile corrispondente all'altezza artificiale chiusa pari a closeHeight
			div_list[loop].natural_height = div_list[loop].offsetHeight;
			div_list[loop].artificial_height = closeHeight;
			div_list[loop].current_status = 0;
			
			// All'elemento imposto una proprietà "iterations" che serve a contenere progressivamente il numero di step richiesti per l'animazione fluida dell'apertura
			// e un array che conterrà gli incrementi per ogni step
			div_list[loop].iterations = 0;
			div_list[loop].step_details = new Array();
			
			// Lancio la funzione che svolga i calcoli e riempia l'array
			div_list[loop].step_details = iterationsCalculator(div_list[loop].artificial_height, div_list[loop].natural_height);
			//alert(div_list[loop].step_details);
			
			// E mantengo il numero delle iterazioni in una variabile custom
			div_list[loop].iterations = div_list[loop].step_details.length;
			
			// Poi applico le azioni di setup
			div_list[loop].style.height = div_list[loop].artificial_height + "px";
			div_list[loop].className = classClosed;
		}
	}
}


/* 3.0 - MOSTRA RIQUADRI
-------------------------------------------------------------------------------------------------------------------------------------------------------- */

function mostraRiquadro(element) {
		riquadroDaAprire = element.parentNode.parentNode;
		if (riquadroDaAprire.current_status == 0) {	
		riquadroDaAprire.current_status = 1;
		verticalAnimation(riquadroDaAprire, "open", 0, element, element.onclick);
		riquadroDaAprire.className = "riquadro-aperto";
	} else if (riquadroDaAprire.current_status == 1) {
		riquadroDaAprire.current_status = 0;
		verticalAnimation(riquadroDaAprire, "close", 0, element, element.onclick);
		riquadroDaAprire.className = "riquadro-chiuso";
	}
}

/* 4.0 - MOSTRA MENU
-------------------------------------------------------------------------------------------------------------------------------------------------------- */


function mostraMenu(element) {
		riquadroDaAprire = element.parentNode;
		if (riquadroDaAprire.current_status == 0) {	
		riquadroDaAprire.current_status = 1;
		//verticalAnimation(riquadroDaAprire, "open", 0, element, element.onclick);
		riquadroDaAprire.style.height = riquadroDaAprire.natural_height + "px";
		
		riquadroDaAprire.className = "sub-menu-aperto";
	} else if (riquadroDaAprire.current_status == 1) {
		riquadroDaAprire.current_status = 0;
		//verticalAnimation(riquadroDaAprire, "close", 0, element, element.onclick);
		riquadroDaAprire.className = "sub-menu-chiuso";
		riquadroDaAprire.style.height = riquadroDaAprire.artificial_height + "px";
	}
}