/*
 * jQuery FilmV (vertical)
 *
 * Copyright 2011, Marco Poglie
 * THINKPLACE scripts.
 * http://www.thinkplace.it
 * http://www.poglie.com
 * 
 */

(function($) {

    var ScrollVert = function(element, options){
		
		//Defaults are below
		var settings = $.extend({}, $.fn.scrollV.defaults, options);
		
        
        //Trigger the onStart callback
        settings.onInit(this);
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															INIT-SETTING
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
        
		// --------[ ELEMENT base ]-------
		var _element = $(element); // l'oggetto selezionato Jquery
		var figli; // figli vengono calcolati solo dopo aver gestito il 'creaListaPagine'
		var lunghezzaElement = 0;
		
		//  ------- gli oggetti ------
		var pageContent;
		var mainContent;
		
		var pagine = [];
		var posTopPagine = [];
		var posLeftProgressivePagine = [];
		
		//  ------- controllo dei ink ------
		var pageSelect = 0; // l'indice del bottone scelo - In questo caso è subito il primo
		var old_pageSelect; // l'indice del bottone precedentemente scelto
		
		var elements = settings.elements;
		
		//  ------- riferimento dimensione 'screen'  'element' ------
		var refScreen;
		
		if(settings.resizeType=='screen'){
			refScreen = $(window);
		}else if(settings.resizeType=='element'){
			refScreen = _element;
		
		}
		var isOpen = false;
		var scrollo = true;
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//														Pagina	APRO - CHIUDO - POSIZIONO
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		// 
		var chiudiPaginaVecchia = function(end){
			//window.alert($('#'+elements[old_pageSelect]).data('chiudi'));
			if($('#'+elements[old_pageSelect]).data('chiudi') ) $('#'+elements[old_pageSelect]).data('chiudi')(function(){if(end) end();});
		}
		var apriPaginaNuova = function(end){
			
			if($('#'+elements[pageSelect]).data('init')) $('#'+elements[pageSelect]).data('init')(function(){if(end) end();});
		}
		var posizionaPagina = function(alResize){
			if(!alResize) alResize = false; 
			//window.alert(refScreen.height());
			
			//window.alert(pageContent);
			
			if(pageContent){
				
				var totaleAltezzaPagine = ((refScreen.height()-settings.Hfoot)*elements.length)+7;
				
				// è il mainContent (element) che è alto come la videata! ...pageContent va su e giu!!
				mainContent.css({'height':refScreen.height()-settings.Hfoot/*totaleAltezzaPagine*/+'px', 'width':refScreen.width()});
				
				
				if(settings.resizeType=='screen'){
					pageContent.css('width',(refScreen.width())+'px');
					
				}else if(settings.resizeType=='element'){
					pageContent.css({'width':(refScreen.width())+'px'});
				}
				
				
				
				//if(alResize) scrollWin(pageSelect);
				//
				pageContent.children().each(function(j) {
														if($(this).is('div') && $(this).attr('class') == "section"){
															//
															if(settings.resizeType=='screen'){
																$(this).css({'width':refScreen.width()+'px'});
																$(this).css({'height':(refScreen.height()-settings.Hfoot)+'px'});
															}else if(settings.resizeType=='element'){
																$(this).css({'width':refScreen.width()+'px'});
																$(this).css({'height':(refScreen.height())+'px'});
															}
															//
															
															// poLeftPagine è la raccolta della posizione di ogni pagina usata nello spostamento
															
															
															posTopPagine[j] = -$(this).position().top;
															
															
														}
										  });
				
				pageContent.stop().animate({'top':posTopPagine[pageSelect]}, 1000, 'easeInOutExpo', function(){});
				
				
				//
				//posScroll(true);
				//
			}
		};
		
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															SCROLLING
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		// 
		var posScroll = function(direct, jump){
			
			if(direct){
				
				pageContent.css('top',posTopPagine[pageSelect]);
			
			}else{
				pageContent.delay(0).animate({
				top: posTopPagine[pageSelect]
				}, 1000, 'easeInOutQuint', function(){	
														// Apro l'elemento nuovo...................................................
														
														//window.alert(pagine[indicePage].data('chiudi'));
														apriPaginaNuova(function(){
																				 
																				 if(jump>=0){
																					 if($('#'+elements[pageSelect]).data('show')) $('#'+elements[pageSelect]).data('show')(jump, true);
																					 //window.alert(jump);
																				 }
																				 //window.alert(pageSelect+" -"+$('#'+elements[pageSelect]).data('show'));
																				 
																				 });
														
													});
				}
		};
		
		var scrollWin = function (i, direct, jumpIndex) {
			if(!direct) direct = false;
			//window.alert(pagine[i].offset().top);
			
			var indicePage = i;
			
			
			
			old_pageSelect = pageSelect;
			pageSelect = i;
			//window.alert($('#'+elements[old_pageSelect]).attr('id'));
			// Svuoto l'elemento vecchio.............................................................................................
			chiudiPaginaVecchia(function(){
										 	//window.alert(pageSelect);
											posScroll(direct, jumpIndex);
										 });
			
			
			isOpen = true;
			//window.alert(pageSelect+' - '+posTopPagine[pageSelect]);
			//$('#header').append(pageSelect+' - '+posTopPagine[pageSelect]);
			
		}
		
		
		
		
		
        //
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//																INIT
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		// 
		var init = function(setting){
			// ciclo i figli di element
			figli.each(function() { 
				var figlio = $(this);
				mainContent = _element; // <--- 
				
				
				// ho posizionato page-content
				if(figlio.attr('id') == "page-content"){
					var sottofigli = figlio.children();
					
					
					if(settings.resizeType=='screen'){
						mainContent.css({'height':(refScreen.height()-settings.Hfoot)+'px', 'width':(refScreen.width())});
					}else if(settings.resizeType=='element'){
						mainContent.css({'height':(refScreen.height())+'px', 'width':(100)});
					}
					
					// ---[ #page-content ]---
					pageContent = figlio;
					//
					posizionaPagina(); // metto a tutto schermo le pagine e il suo contenitore è lungo come tutte le pagine e posPagine[] viene riempito
					//
					// ciclo i figli di pagecontent
					figlio.children().each(function(j) {
						var sottofiglio = $(this);
						//
						//
						//
						// ---[ #page-content section ]---
						if(sottofiglio.is('div') && sottofiglio.attr('class') == "section"){
							var section = sottofiglio; // <--- 
							
							
							pagine[j] = section;
							
							
							
							
						} // end if : section
						
					}); // end each
				
				}; // end if page-content
																							
																						
				// posiziono da BASSO verso l'ALTO l'elemento 
				//
				pageContent.css('top',0);
				_element.css('left',$(window).width()); //metto fuori dallo schermo
				_element.delay(1000+settings.delay).animate({'left':0}, 2000, 'easeInOutExpo',function(){
																					//
																					//////////////////////////////////////////////////////////////////
																					
																					//apre la prima pagina al''apertura iniziale  <=========
																					/*apriPaginaNuova(function(){
																											 //
																											 //accendiScroll(true);// -INIZIO-
																											 //
																											 });*/
																					//////////////////////////////////////////////////////////////////
																					
																					// ho posizionato page-content
																					if(figlio.attr('id') == "page-content"){
		
																							//window.alert('xxx');
																							//window.alert(figlio.children().length);
																							
																							// ---[ #page-content ]---
																							// ciclo i figli di pagecontent
																							figlio.children().each(function(j) {
																								var sottofiglio = $(this);
																								//
																								//
																								//
																								// ---[ #page-content section ]---
																								if(sottofiglio.is('div') && sottofiglio.attr('class') == "section"){
																									var section = sottofiglio; // <--- 
																									
																									// poLeftPagine è una raccolta della posizione di ogni pagina
																									// è contenuto anche in posizionaPagina ...
																									posTopPagine[j] = -section.offset().top;
																									/*posLeftProgressivePagine[j] = posLeftProgressivePagine[j-1]+section.offset().top;*/
																								} // end if : section
																								
																							}); // end each
																							
																							
																						
																						} // end if : page-contet
																						
																						//
																					
																					settings.onStart();
																					cancellaLoading(function(){
																											 
																											 
																											 
																											 });
																				 });// end animate e functionComplete-animate
				
				
				
			}); // end each
		}
		
       
		
		
		
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//														  CHIUDI - CANCELLA
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		var chiudi = function(){
			
			
			
		}
		
		
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//														   LOAD la pagina
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		var loadPagina = function(i, elem, pageUrl, end){
			//
			//
			
			
			if(pageUrl!="#"){
			   elem.load(pageUrl, function(response, status, xhr) {			//window.alert(elem.attr('id'));	
																			  if (status == "error") {
																					var msg = "Sorry but there was an error: ";
																					$(this).append(msg + xhr.status + " " + xhr.statusText);
																			  }else{
																				  	//window.alert(response);
																					if(end) end(i);
																			  }
																	   });
			   }else{
				   // se l' href è '#' si chiude..
					
				
			   }
			
			
		}
		
		
		
	
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//														  CREA LISTA PAGINE
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		var creaListaPagine = function(){
			//
			creaLoading(); // creo il loading in mezzo allo schermo
			//
			/* 
			Devo vedere se esiste la lista in sostituzione dell'array, se uso la lista verrà comunque trasformata in arrai elements[]
			*/
			
			// 1 - controllo l' ul
			if(_element.children().length>0) _element.children().each(function(){	// 2 - se è pieno, lo ciclo
																					// 
																					if($(this).is('ul') && $(this).attr('id') == "elements"){
																						// reinizializzo svuotando elements
																						elements.length = 0;
																						// ok è un <UL> che si chiama "elements"..
																						//window.alert('ul '+$(this).children().length);	
																						$(this).children().each(function(i){
																											// allora ne ciclo i <LI>
																											//window.alert('li '+$(this).text());
																											// 3 - e ne ricavo l'array elements[] quindi: proseguo come prima
																											elements[i] = $(this).text();
																											 });
																						// alla fine disintegro l'<ul> e i suoi <li>
																						_element.empty();
																					}
																							
																				})
			//$('#header').append('page_'+elements[pageSelect]+'.php');
			//
			_element.append("<div id='page-content'>"); // <--- 
			//
			var countLoaded = 0;
			for(var i = 0; i<elements.length ; i++){
				//window.alert(i);
				
				$('#page-content').append("<div id="+elements[i]+" class='section'>"+"</div>");	
				$('#'+elements[i]).data('name',elements[i]);
				
				//if(i==elements.length-1)window.alert("load "+i);
				
				// --- LOAD --- //
				//
				loadPagina(i, $('#'+elements[i]), settings.site_url+elements[i]+"?isload=true", function(k){
																												//$("#address").append(" - "+k);
																												
																												if(k==elements.length-1){
																													
																													//window.alert("init!");
																												}
																										 	});
				if(i==elements.length-1){
					//$('#page-content').append("<div class='clear'></div>");	
				}
			}
			
			_element.append("</div>");
			
			$('#page-content').data('_obj',settings);
			
			
			figli = _element.children();
			lunghezzaElement = figli.length;
		
			init(settings);
			
		}
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															  MOSTRA
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		
		var creaLoading = function(){
			//	
			$('body').append('<div id="loading-pages"></div>');
			//
			$('#loading-pages').css({
									left: ($(window).width()/2)-($('#loading-pages').width()/2),
									top: $(window).height()+100
									});
			$('#loading-pages').delay(600).animate({'top':($(window).height()/2)-($('#loading-pages').height())}, 700, "easeOutExpo");
		}
		var cancellaLoading = function(end){
			
			$('#loading-pages').delay(1000).animate({'opacity':0}, 1000, "easeInExpo", function(){
																				   if(end) end();
																				   $(this).remove();
																				   });
		}
		
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															  MOSTRA
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		var mostra = function(){
			
			
			
		}
		
		
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															NASCONDI
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		var nascondi = function(){
			
			
			
		}
		
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															RESIZING
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		
		var scala = function(){
			
				posizionaPagina(true);
				
				// se esiste data('chiudi') all'interno di un'elemento della lista ..lo uso
				for(var i = 0; i<elements.length ; i++){
					
					//$('#address').append(($('#'+elements[i]).data('scala'))+' - ');
					if($('#'+elements[i]).data('scala')) $('#'+elements[i]).data('scala')();	
					
				}
				
		}
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//													   permalink > index
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		var permalinktoindex = function(permalink, wsi){
			//window.alert(wsi+" - "+permalink);
			var indexRestituito;
			
			if($('#'+elements[wsi]).data('permalinktoindex')) indexRestituito = $('#'+elements[wsi]).data('permalinktoindex')(permalink); // è in page_webstyle e anche in page_portfolio
			
			return indexRestituito
		}
	
		
		/*********************************************************[ PUBBLIC Data.vars ]**********************************************/
		var vars = {
			// 
			'scrollWin':scrollWin,
			'permalinktoindex':permalinktoindex,
			'scala':scala,
			
			'mostra':mostra,
			'nascondi':nascondi
			//
		};
		_element.data('vars',vars)
		/***********************************************************************************************************************/
		
		
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//															GOOOOOOO
		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		//
		
		creaListaPagine();
		
		// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
		
		return this;
    };
        
    $.fn.scrollV = function(options) {
		
    	//
        return this.each(function(key, value){
            var element = $(this);
			//
            // Rientro anticipato dell'attrubuto se questo elemento ha già un plugin istanza
            if (element.data('scrollV')) return element.data('scrollV');
            
			// COSTRUTTORE: -----------------------------
            var film_v = new ScrollVert(this, options);
			// ------------------------------------------
			
            // memorizzo il l'istanza in data
            element.data('scrollV', film_v);
        });

	};
	
	//Default settings
	$.fn.scrollV.defaults = {
		site_url:"",
		
		delay: 0,
		
		Hfoot:0,
		
		resizeType:'screen',
		
		elements: [],
		
		onInit: function(){},
		onScroll: function(){},
		onStart: function(){}
	};
	
	$.fn._reverse = [].reverse;
	
})(jQuery);
