$(document).ready(function() {
	setLayout();
	
	nav.init();
	prodotti.init();
	backstage.listen();
	campaign.listen();	
	
	$(window).resize(function(){
		setLayout()	
	});
	
	$.preload([
		"img/grafica/sfondo-sito.jpg",
		"img/home-page/studio-pubblicitario-canale55.jpg",		
	], 
	{
	loaded_all: function(loaded, total) {
		nav.start();
		}
	});
	
});


$(window).load(function() {
	nav.start();
});


var nav = {
	curPage: 'mio',
	curIndex: 0,
	start: function() {
		$('#layout').fadeIn('slow', function() {
			$('#logo').fadeIn('slow', function() {
				$('#press-content').jScrollPane();
				mio.open();
			});
		});
	},
	init: function() {
		nav.links = $('#nav a');
		nav.pages = $('div.page');
		nav.servizi = $('#presentazione');
		nav.listen();
		nav.browse();
	},
	listen: function() {
		$(nav.links).bind('click', function() {
			if($(this).hasClass('active')) return;
			
			var _id = $(this).attr('id');
			nav.target = _id.substring(2);
			
			nav.toIndex = $(nav.pages).index($('#'+nav.target));
			
			$(nav.links).removeClass('active');
			$(this).addClass('active');

			nav.moveTo(nav.toIndex);
		});
		
		$('#l_mio').bind('click', function() {
			if(nav.curIndex == 0) return;
			nav.target = 'mio';
			$(nav.links).removeClass('active');
			nav.moveTo(0);
		});
	},
	browse: function() {
		$('a.avanti').bind('click', function() {
			var _id = $(nav.links).eq(nav.curIndex).attr('id');
			nav.target = _id.substring(2);
			
			nav.moveFwd();
		});
		
		$('a.indietro').bind('click', function() {
			eq = (nav.curIndex - 2 < 0) ? 0 : nav.curIndex - 2;
			var _id = $(nav.links).eq(eq).attr('id');
			nav.target = (eq == 0) ? 'mio' : _id.substring(2);
			nav.moveBack();
		});
	},
	moveTo: function(page) {
		if(nav.curPage == 'video') video.sleep();
		nav.sleep();
		prodotti.sleep();
		//prodotti.reset();
		if(page > nav.curIndex) {
			$(nav.servizi).animate({'marginLeft': -900}, 600, 'easeOutQuint', function() {
				nav.curIndex = page;
				$(this).css({'marginLeft': 0 });
				nav.checkPage();
			});
		}
		else {
			$(nav.servizi).css({'marginLeft':-900}).animate({'marginLeft': 0}, 'slow', 'easeOutQuint', function() {
				nav.curIndex = page;
				nav.checkPage();
			});
		}
		
		$(nav.pages).eq(page).fadeIn('slow');
		$(nav.pages).eq(nav.curIndex).fadeOut('slow');
	},
	moveFwd: function() {
		nav.sleep();
		prodotti.sleep();
		//prodotti.reset();
		if(nav.curPage == 'video') video.sleep();
		var page = nav.curIndex;
		$(nav.servizi).animate({'marginLeft': -900}, 'slow', 'easeOutQuint', function() {
			nav.curIndex++;
			$(this).css({'marginLeft': 0 });
			nav.checkPage();
		});
		
		$(nav.pages).eq(page + 1).fadeIn('slow');
		$(nav.pages).eq(page).fadeOut('slow');
		
		$(nav.links).removeClass('active').eq(page).addClass('active');
	},
	moveBack: function() {
		if(nav.curPage == 'video') video.sleep();
		nav.sleep();
		prodotti.sleep();
		//prodotti.reset();
		var page = nav.curIndex;
		$(nav.servizi).css({'marginLeft':-900}).animate({'marginLeft': 0}, 'slow', 'easeOutQuint', function() {
			nav.curIndex--;
			nav.checkPage();
		});
		
		$(nav.pages).eq(page-1).fadeIn('slow');
		$(nav.pages).eq(page).fadeOut('slow');
		
		if(nav.curIndex - 1 >= 0) $(nav.links).removeClass('active').eq(page-2).addClass('active');
		else $(nav.links).removeClass('active');
	},
	checkPage: function() {
		if(nav.curIndex == 0) $('a.indietro').fadeOut('fast');
		else $('a.indietro').fadeIn('fast');
		
		if(nav.curIndex == 1) $('a.avanti').fadeOut('fast');
		else $('a.avanti').fadeIn('fast');
		
		if(nav.target == 'video') video.startVideo();
		if(nav.target == 'elenco-clienti') {
			$('a.avanti, a.indietro').unbind('click');
			prodotti.listen();
		}
		else nav.browse();
	},
	sleep: function() {
		$('a.avanti, a.indietro').unbind('click');
	}
}


var mio = {
	open: function() {
		nav.curPage = 'mio';
		$('#mio').show();
		$('#mio h2').fadeIn('slow', function() {
			$('#press').hide();
			$('#mio #canale55').fadeIn('slow', function() {
				$('#mio .avanti').fadeIn('slow', function() {
					mio.listen();
				});
			});
		});
	},
	listen: function() {
		$('#mio .avanti').bind('click', function() {
			var _id = $(nav.pages).eq(0).attr('id');
			nav.target = _id.substring(2);
			
			mio.close(nav.target);
		});
	},
	close: function(target) {
		$('#mio .avanti').unbind().fadeOut('slow', function() {
			$('#mio #canale55').fadeOut('slow', function() {
				$('#mio h3').fadeOut('slow', function() {
					$('#mio h2').fadeOut('slow', function() {
						$('#mio').hide();
						nav.openPage(target);
					});
				});
			});
		});
	}
}


var press = {
	open: function() {
		nav.curPage = 'press';
		$('#press').show();
		$('#press h2').fadeIn('slow', function() {
			$('#press h3').fadeIn('slow', function() {
				$('#press-content').fadeIn('slow', function() {
					$('#press .indietro').fadeIn('slow');
					$('#press .avanti').fadeIn('slow', function() {
						press.listen();
					});
				});
			});
		});
	},
	close: function(target) {
		$('#press .indietro').fadeOut('slow');
		$('#press .avanti').fadeOut('slow', function() {
			$('#press-content').fadeOut('slow', function() {
				$('#press h3').fadeOut('slow', function() {
					$('#press h2').fadeOut('slow', function() {
						$('#press').hide();
						nav.openPage(target);
					});
				});
			});
		});
	},
	listen: function() {
		$('#press .avanti').bind('click', function() {
			var _id = $(nav.pages).eq(1).attr('id');
			nav.target = _id.substring(2);
			
			press.close(nav.target);
		});
		
		$('#press .indietro').bind('click', function() {
			nav.target = 'mio';
			
			press.close(nav.target);
		});
	}
}


var backstage = {
	listen: function() {
		backstage.thumbs = $('#backstage ul.thumbs');
		backstage._h = $('#backstage #thumbsservizi').height();
		
		$('#backstage .vecchia img').show();
		
		$('#backstage #thumbsservizi').bind('mouseenter', function(e) {
			var m_top = $(this).offset();
			$(this).mousemove(function(e){
			    backstage.mouseY = (e.pageY - m_top.top) / backstage._h;
			});

			h = setInterval("backstage.detectMouse()", 1);
		});
		
		$('#backstage #thumbsservizi').bind('mouseleave', function() {
			clearTimeout(h);
		});
		
		$('a', $(backstage.thumbs)).click(function(e) {
			e.preventDefault();
			$('a', $(backstage.thumbs)).removeClass('active');
			$(this).addClass('active');
			backstage.openImg($(this).attr('href'));
		})
			.hover(function() {
				$('img', $(this)).stop().fadeTo(400, 1);
			}, function() {
				$('img', $(this)).stop().fadeTo(400, 0.4);
			});
	},
	detectMouse: function() {
		if(backstage.mouseY > 0.7) {
			backstage.moveSlider(-1);
		}
		else if(backstage.mouseY < 0.3) {
			backstage.moveSlider(1);
		}
	},
	moveSlider: function(dir, speed) {
		var mt = parseInt($(backstage.thumbs).css("top"));
		mt += dir;
		
		if((backstage._h - mt < $(backstage.thumbs).height()) && (mt < 0)) $(backstage.thumbs).css({'top' : mt});
		
		//$('#log').text(backstage._h - mt);
	},
	openImg: function(src) {
		var pic = new Image();
		$('#backstage .vecchia img').fadeOut('fast', function() {
			$(this).remove();
		});

		$(pic).load(function(){
			$('#backstage .vecchia')
				.append(pic)
				.find('img')
				.fadeIn('slow')
			});

		$(pic).attr({src:src})
	}
}


var campaign = {
	open: function() {
		nav.curPage = 'campaign';
		$('#campaign').show();
		$('#campaign h2').fadeIn('slow', function() {
			$('#campaign .thumbs').fadeIn('slow', function() {
				$('#campaign .vecchia img').fadeIn('slow', function() {
					$('#campaign .indietro').fadeIn('slow');
					$('#campaign .avanti').fadeIn('slow', function() {
						campaign.listen();
					});
				});
			});
		});
	},
	close: function(target) {
		$('#campaign .indietro').fadeOut('slow');
		$('#campaign .avanti').fadeOut('slow', function() {
			$('#campaign .vecchia img').fadeOut('slow', function() {
				$('#campaign .thumbs').fadeOut('slow', function() {
					$('#campaign h2').fadeOut('slow', function() {
						$('#campaign').hide();
						nav.openPage(target);
					});
				});
			});
		});
	},
	listen: function() {
		campaign.thumbs = $('#campaign ul.thumbs');
			
		$('#campaign .vecchia img').show();
			
		$('a', $(campaign.thumbs)).click(function(e) {
			e.preventDefault();
			$('a', $(campaign.thumbs)).removeClass('active');
			$(this).addClass('active');
			campaign.openImg($(this).attr('href'));
		})
		.hover(function() {
			$('img', $(this)).stop().fadeTo(400, 1);
			}, function() {
			$('img', $(this)).stop().fadeTo(400, 0.4);
		});
	},
	openImg: function(src) {
		var pic = new Image();
		$('#campaign .vecchia img').fadeOut('fast', function() {
			$(this).remove();
		});
	
		$(pic).load(function(){
			$('#campaign .vecchia')
				.append(pic)
				.find('img')
				.fadeIn('slow')
			});
		$(pic).attr({src:src})
	}
}


var video = {
	width: 500,
	height: 306,
	open: function() {
		nav.curPage = 'video';
		$('#video').show();
		$('#video h2').fadeIn('slow', function() {
			$('#video .indietro, #video .avanti').fadeIn('slow');
			video.startVideo();
			video.listen();
		});
	},
	startVideo: function() {
		if(!$('#videoHolder *').length) {
				
			$('#videoHolder')
				.media({
					bgColor: 'transparent',
					width: video.width,
					height: video.height,
					autoplay: true,
					params:    {wmode : 'transparent',scale:'noscale', allowfullscreen:'true'},
					attrs :	{ id : 'player', wmode : 'transparent',scale:'noscale', allowfullscreen:'true' },
					flashvars:  {file: '', skin: 'swf/uno.swf', autostart: true, controlbar: 'over', frontcolor :"ffffff", backcolor: "000000", lightcolor : "FFFFFF", overstretch : false, bufferlength : 5, usefullscreen : true},
					src:       'swf/player.swf',
					caption:   false
				});
			}
		
		$('#video #share').fadeIn('slow');
	},
	listen: function() {
		$('#video .avanti').bind('click', function() {
			nav.target = 'backstage';
			video.close(nav.target);
		});
		
		$('#video .indietro').bind('click', function() {
			nav.target = 'campaign';
			video.close(nav.target);
		});
	},
	close: function(target) {
		$('#video .indietro').fadeOut('slow');
		$('#video .avanti').fadeOut('slow', function() {
			$('#video #share').fadeOut('slow', function() {
				//$('#video').hide();
				nav.openPage(target);
			});
		});
	},
	sleep: function() {
		if($('#videoHolder *').length) {
			var player = window.document["player"];
			player.sendEvent('STOP');
		}
	}
}


var prodotti = {
	curLeft: 0,
	visible: 2,
	distance: 350,
	init: function() {
		prodotti.slider = $('ul#prodotti');
		prodotti.els = $('ul#prodotti>li');
		
		$('#prodotti>li').eq(0).show();
		$('#prodotti>li').eq(1).show();
				
		$('ul.prod_thumbs a').each(function() {
			/*var _src = $('img', $(this)).attr('src');
			var _parent = $(this).parent().parent().parent().parent();
			var _thumbs = $(this).parent().parent();
			
			$(this).css({'background': 'url('+_src+') 0 0 no-repeat'});			
			
			$(this).bind('mouseenter', function() {
				$(this)
					.append('<p/>')
					.find('p')
					.css({'background': 'url('+_src+') 0 -50px no-repeat'})
					.fadeIn('fast');
			});
			
			$(this).bind('mouseleave', function() {
				$('p', $(this)).fadeOut('fast', function() {
					$(this).remove()
				});
			});*/
			
			var _parent = $(this).parent().parent().parent().parent();
			var _thumbs = $(this).parent().parent();
			
			$('img', $(this)).css({'opacity': 0.5});
			
			$(this).bind('mouseenter', function() {
				$('img', $(this)).stop().fadeTo('fast', 1);
			});
			
			$(this).bind('mouseleave', function() {
				$('img', $(this)).stop().fadeTo('fast', 0.5);
			});
					
			$(this).bind('click', function(e) {
				e.preventDefault();
				
				if($(this).hasClass('active')) return;
				
				$('a', $(_thumbs)).removeClass('active');
				$(this).addClass('active');
				
				//$('img.dettagli', $(_parent)).hide();
				var imgsrc = $(this).attr('href');
				
				var pic = new Image();
				$('img.dettagli', $(_parent)).fadeOut('slow', function() {
					$(this).remove();
				});
				
				$(pic).load(function(){
				$(_parent)
					.append(pic)
					.find('img.dettagli')
					.hide()
					.fadeIn('slow')
				});
				
				$(pic).attr({src:imgsrc}).addClass('dettagli');
				
			});
			
		});
	},
	reset: function() {
		$('#prodotti>li').hide();
		$('#prodotti>li').eq(0).show();
		$('#prodotti>li').eq(1).show();
		prodotti.curLeft = 0;
	},	
	listen: function() {
		$('a.avanti').bind('click', function() {
			//find avanti item
			var itemIndex = prodotti.curLeft + prodotti.visible;
			
			if(itemIndex >= $(prodotti.els).length) {
				nav.sleep();
				nav.target = 'campaign';
				nav.moveFwd();
				return;
			}
			var el = $(prodotti.els).eq(itemIndex);
			var imgs = $('img.dettagli', el);
			prodotti.loadItem(imgs, 1);
		});
		
		$('a.indietro').bind('click', function() {
			//find avanti item
			var itemIndex = prodotti.curLeft - 1;

			if(itemIndex < 0) {
				nav.sleep();
				nav.target = 'press';
				nav.moveBack();
				return;
			}
			
			var el = $(prodotti.els).eq(itemIndex);
			var imgs = $('img', el).eq(0);
			prodotti.loadItem(imgs, -1);
		});
		
		$('a.realizzazione-siti-web', $(prodotti.els)).each(function(i) {
			$(this).bind('click', function() {
				if(i == prodotti.curLeft) prodotti.openInfo('right', i);
				
				else prodotti.openInfo('left', i);
			});
		});	
		
	},
	sleep: function() {
		//$('#elenco-clienti a.avanti, #elenco-clienti a.indietro, a.realizzazione-siti-web').unbind();
		$('a.realizzazione-siti-web', $(prodotti.els)).unbind();
	},
	loadItem: function(els, dir) {
		var images = [];
		var loadedImages = [];
		
		$(els).each(function(i){
			images[i] = new Image();
		 });
		 
		 $(images).each(function(i) {
		 	$(this).bind('load', function(i){
			 	if ($.inArray(i, loadedImages) < 0){ 
					loadedImages.push(i);
				}
				
				if(loadedImages.length == els.length) {
					prodotti.moveSlider(dir);
				}
			});
			$(this).attr({src:$(els).eq(i).attr('src')});
		}); //end each
	},
	moveSlider: function(dir) {
		if(dir == 1) {
			var toShow = prodotti.curLeft + prodotti.visible - 1 + dir;
			var toHide = prodotti.curLeft;
			var newLeft = prodotti.curLeft += dir;
		}
		else {
			var newLeft = prodotti.curLeft += dir;
			var toShow = newLeft;
			var toHide = prodotti.curLeft + prodotti.visible
		}
		
		prodotti.closeInfo();
		$(prodotti.slider).animate({'marginLeft': -prodotti.distance * newLeft}, 600, 'easeOutQuint', function() {
			prodotti.curLeft = newLeft; 
		});
		$(prodotti.els).eq(toShow)
			.css({'visibility':'visible', 'display':'none'})
			.fadeIn('slow');
		$(prodotti.els).eq(toHide).fadeOut('slow', function() {
			$(this).css({'visibility':'hidden', 'display':'block'});
				
		});
	},
	openInfo: function(pos, index) {
		var html = $('div.prod_desc').eq(index).html();
		
		var _class = (pos == 'left') ? 'info_left' : 'info_right';
		
		$('#prodservizi')
			.append('<div id="info" class="'+_class+'"><a class="info_close"></a></div>')
			.find('#info')
			.append(html)
			.fadeIn('fast', function() {
				$('a.info_close', $(this)).bind('click', function() {
					prodotti.closeInfo();
				});
			});
	},
	closeInfo: function() {
		$('#info').fadeOut('fast', function() {
			$(this).remove();
		});
	},
	close:function(target) {
		prodotti.sleep();
		$('#elenco-clienti .indietro').fadeOut('slow');
		$('#elenco-clienti .avanti').fadeOut('slow', function() {
			$('#prodotti>li').eq(prodotti.curLeft + 1).fadeOut('slow');
			$('#prodotti>li').eq(prodotti.curLeft).fadeOut('slow', function() {
				$('#elenco-clienti').hide();
				nav.openPage(target);
			});
		});
	}
}

function setLayout(){
	h_wp=$(window).height()-29;
	w_wp=$(window).width();
	m_top = Math.round((lt_h - h_wp) / 2);
	m_left = ((lt_w - w_wp) / 2);
	
	//position logo
	var l_lft = ( w_wp - 377 ) / 2;
	var l_top = ( h_wp - 164 ) / 2;

	$('#layout').height(h_wp);
	$('#logo').css({top: 282 - m_top});
	$('#nav').css({top: 824 - m_top});
	$('#schermo').css({'top': 347 - m_top});
	$('#info-sito').css({top:h_wp, visibility:'visible'});
	
	//$('#log').text(m_top);
};

var lt_h = 1176; //layout background height
var lt_w = 1900; //layout background width


function loadXML() {
	$.ajax({
        type: "GET",
        url: "data.xml",
        dataType: "xml",
        success: function(xmlData) {
			prodotti.xmlFile = xmlData;
			},
		error:function(){
			alert('Error loading xml data. Please, reload this page and try again.')
			}	
		});
}