$(document).ready(function start() { venice.init('api/content/scroll-primo-piano.xml'); });

var venice = {
	
	theme: '',
	items: [],
	
	mainscroll: null,
	
	startingposition: 0,
	endingposition: 0,
	
	startingtime: 0,
	endingtime: 0,
	
	intevalid: 0,
	
	init: function init(url) {
		
		venice.reset();
						
		venice.items = [];
		venice.data.xmlurl = url;
		venice.data.get();			
	},
	
	reset: function reset() {
				
		$('#scroller ul li').unbind('click', venice.handler.clickScroll);
		$('#speaker_mask').unbind('click', venice.handler.clickMask);
		
		$('#scroller')
			.unbind('dragstart', venice.handler.dragstart)
			.unbind('dragstop', venice.handler.dragstop)
		
		$(window).unbind('resize', venice.handler.resize);
		
		venice.handler.clicked = false;
		
		$('#speaker_mask').empty().hide();
		$('#scroll_mask').hide();
		$('#scroller ul').empty();
	},
	
	data: {
		
		xmlurl: '',
			
		get: function get() {
						
			var target = venice.data.xmlurl; 

			$.ajax({	
				type: 'GET',
				url: target,
				async: true,
				dataType: 'xml',
				success: function(data) {					
					data = $.xml2json(data);
					if(data.items.item.length != undefined) {
						$.each(data.items.item, function(i, item) { venice.items.push(item); });
						venice.data.sort();
					} else {
						venice.items.push(data.items.item);
					}
					venice.ui.init();
				}
			});
		},

		sort: function sort() {
			
			var sort = [];
			var n = venice.items.length;
			var n2 = Math.ceil(n/2);
			
			var exception = (n%4 == 3);
			
			for (var i = 0; i < n; i++) {
				
				var index = 0;
				var offset = Math.floor(n/4);
				
				switch(i%4) {
					case 0:
						index = offset + Math.floor(i/4);
						//console.log('i ' + i + ', case 0: offset + Math.floor(i/4) --> ' + offset + ' + ' +  Math.floor(i/4) + ' = ' + index);
						break;
					case 1:
						index = offset + n2 + Math.floor(i/4);
						//console.log('i ' + i + ', case 1: offset + Math.ceil(n/2) + Math.floor(i/4) --> ' + offset + ' + ' + n2 + ' + ' +  Math.floor(i/4) + ' = ' + index);
						break;
					case 2:
						if (i != n-1) {
							index = offset - (Math.floor(i/4) + 1);
							//console.log('i ' + i + ', case 2: offset - (Math.floor(i/4) + 1) --> ' + offset + ' - (' +  Math.floor(i/4) + ' + 1) = ' + index);
						} else if (exception) {
							index = offset + Math.ceil(i/4);
							//console.log('i ' + i + ', case 2 exception: offset + Math.ceil(i/4) --> ' + offset + ' + ' +  Math.ceil(i/4) + ' = ' + index);
						}
						break;
					case 3:
						index = offset + n2 - (Math.floor(i/4) + 1);
						//console.log('i ' + i + ', case 3: offset + Math.ceil(n/2) - (Math.floor(i/4) + 1) --> ' + offset + ' + ' + n2 + ' - (' +  Math.floor(i/4) + ' + 1) = ' + index);
						break;
				}
				sort[index] = venice.items[i];
			}
			venice.items = sort;
		}	
	},
	
	ui: {
				
		elemW: 192,
		elemH: 150,
				
		init: function init() {
							
				venice.ui.createList();
	
				var isiPad = navigator.userAgent.match(/iPad/gi);
				var isiPhone = navigator.userAgent.match(/iPhone/gi);
				
				if (isiPad || isiPhone)
					venice.ui.mobileInit();
				else
					venice.ui.desktopInit();
				
				$('#scroller ul li').bind('click', venice.handler.clickScroll);
				$('#speaker_mask').bind('click', venice.handler.clickMask);
		},
		
		createList: function createList() {
		
			var arr = [];			
			var ie6 = ($.browser.msie && parseInt($.browser.version) == 6);
		
			$.each(venice.items, function(i, item) {
				
				//console.log(item.name);
				
				arr.push('<li class="scroll_speaker">');
				arr.push('<div class="disabled"></div>');
				arr.push('<img class="scroll_thumb" src="' + item.image + '" width="' + venice.ui.elemW + 'px" height="' + venice.ui.elemH + 'px" />');
				
				if (item.logo != '') {
					if (ie6)
						arr.push('<img class="scroll_logo" src="' + item.logo + '.gif" width="34px" height="32px" />');
					else
						arr.push('<img class="scroll_logo" src="' + item.logo + '.png" width="34px" height="32px" />');
				}
				
				if (item.name != '') {
					arr.push('<span></span>');
					if (item.name.highlight)
						arr.push('<p class="scroll_name veniceblue">' + item.name.text + '</p>');
					else
						arr.push('<p class="scroll_name">' + item.name + '</p>');
				}
				
				arr.push('</li>');
			});
			
			var row =  Math.ceil(venice.items.length/2);
			var w = venice.ui.elemW * row;
			
			var $scroller = $('#scroller');
						
			$('ul', $scroller)
				.html(arr.join(''))
				.width(w)
				.parent().width(w)
				
			$.each($('ul li', $scroller), function(i, li) {
				$(li).data('item', venice.items[i]);
				if (i < row)
					$(li).data('top', true);
				else
					$(li).data('top', false);
			});
						
			if (venice.theme != '')
				venice.ui.checkTheme();	
		},
		
		checkTheme: function checkTheme() {
						
			$.each($('#scroller ul li'), function(i, li) {
				
				$disabled = $('div.disabled', $(li));
				if ($(li).data().item.themes.indexOf(venice.theme) < 0)
					$disabled.show();
				else
					$disabled.hide();
			});
		},
		
		createOver: function createOver(elem) {
											
				var item = $(elem).data().item;
				var top = $(elem).data().top;
				
				var portrait = [];
				var info = [];
				var ie6 = ($.browser.msie && parseInt($.browser.version) == 6);
				
				portrait.push('<img class="scroll_thumb" src="' + item.image + '" width="' + venice.ui.elemW + 'px" height="' + venice.ui.elemH + 'px" />');
				
				if (item.logo != '') {
					if (ie6)
						portrait.push('<img class="scroll_logo" src="' + item.logo + '.gif" width="34px" height="32px" />');
					else
						portrait.push('<img class="scroll_logo" src="' + item.logo + '.png" width="34px" height="32px" />');
				}
				
				if (item.name != '') {
					portrait.push('<span></span>');
					if (item.name.highlight)
						portrait.push('<p class="scroll_name veniceblue">' + item.name.text + '</p>');
					else
						portrait.push('<p class="scroll_name">' + item.name + '</p>');
				}
								
				if (item.speech != '' || item.abstract != '') {
					info.push('<div class="scroll_info">');
					info.push('<p class="scroll_title">' + item.speech + '</p>');
					info.push('<p class="scroll_abstract">' + item.abstract +'</p>');
					info.push('</div>');
				}
				
				var $wrapper = $('#scroll_wrapper');
				var $scroll_mask = $('#scroll_mask');
				var $speaker_mask = $('#speaker_mask');
				
				if (top)
					$speaker_mask.append('<div id="scroll_speaker">' + portrait.join('') + info.join('') + '</div>');
				else
					$speaker_mask.append('<div id="scroll_speaker">' + info.join('') + portrait.join('') + '</div>');
				
				var $scroll_speaker = $('#scroll_speaker');
				
				if (item.speech == '' && item.abstract == '') {
					
					$scroll_speaker.height(venice.ui.elemH);
					if(!top)
						$scroll_speaker.css('top', venice.ui.elemH + 'px');
				
				} else {
					
					if (top) {
						$('span', $scroll_speaker).css('bottom', venice.ui.elemH + 'px');
						$('p.scroll_name', $scroll_speaker).css('bottom', venice.ui.elemH + 'px');
						$('div.scroll_info', $scroll_speaker).css('top', venice.ui.elemH + 'px');
					} else {
						$('img.scroll_logo', $scroll_speaker).css('top', (venice.ui.elemH + 5) + 'px');
					}
				}
				
				if (item.name == '') {
					$('span', $scroll_speaker).remove();
					$('p.scroll_name', $scroll_speaker).remove();
				}
				
				$scroll_speaker.data(elem);
								
				if ($('#scroller').width() > $(window).width()) {
					$scroll_speaker.css('left', $(elem).offset().left + 'px');
					$scroll_mask.css('left', 0);
				} else {
					$scroll_speaker.css('left', $(elem).position().left + 'px');
					$scroll_mask.css('left', $wrapper.position().left + 'px');
				}
					
				if (item.link != '') {	
					$('#scroll_speaker').bind('click', function() {
						window.location.href = item.link;
					});
				}
				
				var isiPad = navigator.userAgent.match(/iPad/gi);
				var isiPhone = navigator.userAgent.match(/iPhone/gi);
				
				if (isiPhone || isiPad) {
					
					$scroll_mask.css('top', ($wrapper.offset().top));
					$speaker_mask.css('top', ($wrapper.offset().top));
					
					$scroll_speaker.css('left', $(elem).offset().left + 'px');
					
					var is3_ = navigator.userAgent.match(/3_/gi);
					
					if (is3_) {
					
						$scroll_mask.css('top', ($wrapper.offset().top - window.scrollY) + 'px');
						$speaker_mask.css('top', ($wrapper.offset().top - window.scrollY) + 'px');
					
						//elements position with <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
						/*if ($(window).width() < $wrapper.width()) {
						
							$scroll_mask.width(($wrapper.width() + window.scrollX));
							$speaker_mask.width(($wrapper.width() + window.scrollX));
					
							$scroll_mask.css('left', ($scroll_mask.offset().top - window.scrollX) + 'px');
							$speaker_mask.css('left', ($speaker_mask.offset().top - window.scrollX) + 'px');
					
						} else {
						
							$scroll_mask.width($wrapper.width());
							$speaker_mask.width($wrapper.width());
						
							$scroll_mask.css('left', 0);
							$speaker_mask.css('left', 0);
						}*/
					
						//elements position with <meta name="viewport" content="maximum-scale=1.0" />
						$scroll_mask.width(($wrapper.width() + window.scrollX));
						$speaker_mask.width(($wrapper.width() + window.scrollX));
					
						$scroll_mask.css('left', (0 - window.scrollX) + 'px');
						$speaker_mask.css('left', (0 - window.scrollX) + 'px');
					}
				} else {
					
				}		
					
				$scroll_mask.show();
				$speaker_mask.show();				
		},
				
		desktopInit: function desktopInit() {
			
			var $scroller = $('#scroller');
						
			$scroller.draggable({
				axis: 'x'
			});
			
			$scroller
				.bind('dragstart', venice.handler.dragstart)
				.bind('dragstop', venice.handler.dragstop)
			
			venice.handler.centerscroll = true;
			$(window).bind('resize', venice.handler.resize);
			venice.handler.resize();
		},
					
		mobileInit: function mobileInit() {
			
			var $page = $('#page');	
			var $wrapper = $('#scroll_wrapper');
			var $scroller = $('#scroller');
			var $scroll_mask = $('#scroll_mask');
			var $speaker_mask = $('#speaker_mask');
			
			$scroll_mask.width($wrapper.width());
			$scroll_mask.height($wrapper.height());

			$speaker_mask.width($wrapper.width());
			$speaker_mask.height($wrapper.height());
			
			if (venice.mainscroll != null)
				venice.mainscroll.destroy(false);
						
			if (venice.items.length > 10) {
				$scroller.css('left', 'auto');				
				$scroller.bind('touchmove', function(e) { e.preventDefault(); }, false);
				venice.mainscroll = new iScroll('scroller', {
					checkDOMChanges: false,
					hScrollbar: false,
					vScrollbar: false,
					bounceLock: true,
					bounce: false
				});
				venice.mainscroll.scrollTo(($(window).width()-$scroller.width())/2,0,1);
			} else {
				$scroller.css('left', -($scroller.position().left) + 'px');
			}
		}
	},
		
	handler: {
		
		scrollout: 0,
		clicked: false,
		dragged: false,
		moving: false,
		centerscroll: false,
		
		clickScroll: function clickScroll(e) {
						
			var $target = $(e.target).parent();
			
			if (venice.handler.dragged) {
				venice.handler.dragged = false;
			} else if (!venice.handler.clicked && !$('div.disabled', $target).is(':visible')) {
				
				if (venice.handler.moving) {					
					venice.handler.moving = false;
					clearInterval(venice.interval);
				} else {
					venice.handler.clicked = true;
					venice.ui.createOver($target);
				}
			}
		},
		
		clickMask: function clickMask(e) {
						
			var speakerclick = false;
			
			$.each($('#scroll_speaker').children(), function(i, child) {
				if ($(child).html() == $(e.target).html())
					speakerclick = true;
			});
			
			if (!speakerclick) {
				venice.handler.clicked = false;
				venice.handler.dragged = false;
				$('#scroll_speaker').unbind();
				$('#speaker_mask').empty().hide();	
				$('#scroll_mask').hide();
			}
		},
		
		dragstart: function dragstart() {
			
			clearInterval(venice.interval);
			
			venice.handler.dragged = true;
			
			venice.startingposition = parseInt($('#scroller').css('left'), 10);
			venice.startingtime = new Date().getTime();
		},

		dragstop: function dragstop() {
			
			venice.handler.clicked = false;
			venice.handler.moving = true;
			
			venice.endingposition = parseInt($('#scroller').css('left'), 10);
			venice.endingtime = new Date().getTime();
			
			venice.handler.inertial();
		},
		
		inertial: function inertial() {
			
			var $scroller = $('#scroller');
			var velocity = (venice.endingposition - venice.startingposition) / (venice.endingtime - venice.startingtime);						
						
			if (velocity > 2.7)
				velocity = 2.7;
			else if (velocity < -2.7)
				velocity = -2.7;
			
			venice.interval = setInterval(function() {
				
				var offset = velocity * 50;
				var left = $scroller.position().left + offset;
				
				if (left > 2.7 || left < ($(window).width() - $scroller.width()))
					velocity = 0;
					
				if (left > 2.7)	
					left = 0;
				else if (left < ($(window).width() - $scroller.width()))
					left = $(window).width() - $scroller.width();
				
			  $scroller.css('left', left + 'px');
				velocity = velocity * 0.9;
				
				if (Math.abs(velocity) < 0.05) {
					clearInterval(venice.interval);
					venice.handler.moving = false;
				}
				
			}, 50);
		},
		
		resize: function resize() {
					
			var redo = false;
							
			var $wrapper = $('#scroll_wrapper');
			var $scroller = $('#scroller');
			var $speaker = $('#scroll_speaker');
			var $scroll_mask = $('#scroll_mask');
			var $speaker_mask = $('#speaker_mask');
			
			var windowW = $(window).width();
			var wrapperW = $wrapper.width();
			var scrollerW = $scroller.width();
			
			if (scrollerW < windowW) {
				
				$wrapper.width(scrollerW);
				
				$wrapper.css('left', (windowW-scrollerW)/2 + 'px');
				$scroll_mask.css('left', (windowW-scrollerW)/2 + 'px');
				$speaker_mask.css('left', (windowW-scrollerW)/2 + 'px');
				
				var ie6o7 = ($.browser.msie && (parseInt($.browser.version) == 6 || parseInt($.browser.version) == 7));
				if (ie6o7)
					$wrapper.css('left', 0);
				
				$scroll_mask.width(scrollerW);
				$scroll_mask.height($wrapper.height());
				$scroll_mask.css('top', $wrapper.offset().top);
				
				$speaker_mask.width(scrollerW);
				$speaker_mask.height($wrapper.height());
				$speaker_mask.css('top', $wrapper.offset().top);
				
				$scroller.draggable('option', 'disabled', true);
				$scroller.css({
					left: 0,
					cursor: 'pointer'
				});
				
				if($speaker.length > 0)
					$speaker.css('left', $($speaker.data()).position().left + 'px');
								
			} else {
				
				var scrollpos = $scroller.position();
				var scrollout = wrapperW-scrollpos.left;

				if (scrollerW < scrollout) {					
					var left = scrollpos.left + (windowW-wrapperW) + (scrollout-venice.handler.scrollout);
					$scroller.css('left', left + 'px');
				}
				
				venice.handler.scrollout = scrollout;
				if (windowW-wrapperW > 50) {
					venice.handler.scrollout = scrollerW;
					redo = true;
				}
				
				$wrapper.width(windowW);
				wrapperW = $wrapper.width();
				
				$wrapper.css('left', 0);
				$scroll_mask.css('left', 0);
				$speaker_mask.css('left', 0);
				
				$scroll_mask.width(windowW);
				$scroll_mask.height($wrapper.height());
				$scroll_mask.css('top', $wrapper.offset().top);
				
				$speaker_mask.width(windowW);
				$speaker_mask.height($wrapper.height());
				$speaker_mask.css('top', $wrapper.offset().top);
			
				var offset = (windowW - wrapperW)/2;
				$scroller.draggable('option', 'disabled', false);
				$scroller.draggable('option', 'containment', [(-scrollerW+offset+wrapperW), $wrapper.position().top, offset, ($wrapper.position().top + $wrapper.height())]);
				$scroller.css('cursor', 'move');
				
				if (venice.handler.centerscroll) {
					$scroller.css('left', ($(window).width()-$scroller.width())/2 + 'px');
					venice.handler.centerscroll = false;
				}

				if($speaker.length > 0)
					$speaker.css('left', $($speaker.data()).offset().left + 'px');				
				
				if (redo)
					venice.handler.resize();
			}
		}
	},
	
	siteonly: {
		
		toggleMenu: function toggleMenu(elem) {
			$('#' + elem).slideToggle(300);
			return false;
		},
		
		changeTheme: function changeTheme(sender, theme) {
			//$('#themeMenuItems').slideToggle(300);
			$('#themeMenuItems').toggle();
			$('#inp').val($(sender).text());
			venice.theme = theme;
			venice.ui.checkTheme();
		},
		 
		changeSession: function changeSession(sender, url) {
			//$('#sessionMenuItems').slideToggle(300);
			$('#sessionMenuItems').toggle();
			$('#inpSession').val($(sender).text());
			if (venice.data.xmlurl != url)
				venice.init(url);
		}
	}
}
