//initiate!!
$(window).load(function(){
	var container = document.getElementById('container');
	container.siteshow = new SiteShow();
});

function SiteShow(){
	this.container = document.getElementById('container');
	this.loading = document.getElementById('loadingshield');
	this.slideshow = document.getElementById('slideshowarea');
	this.controls = document.getElementById('controlsarea');
	this.next = document.getElementById('next-slide');
	this.prev = document.getElementById('prev-slide');
	this.$centerer = $(document.getElementById('centerer'));
	this.data;
	this.defaultSlideCss = '';
	var self = this;
	
	this.initialize = function (data, status, jqXHR){
		self.vCenter();
		self.data = data.links;
		self.defaultSlideCss = 'url("'+data.defaultslides[ Math.floor(Math.random()*data.defaultslides.length) ].img_url+'") no-repeat top center';
		$(self.container).css('background', self.defaultSlideCss);
		var itemPanel = $(document.createElement('div'))
						.attr('class', 'level-1')
						.appendTo(self.controls);
		for (var id in self.data){
			var item = self.data[id];
			var href = (item.href != '')? item.href : "#"+item.locationName;
			var itemLink = $(document.createElement('a'))
							.attr("href", href)
							.attr('data-location', "#"+item.locationName)
							.html(item.name)
							.data('showStuff', {
								linkChildren: item.children,
								linkId: item.id,
								level: 1,
								locationName: item.locationName,
								slides: item.slides,
								slideshow: false
							})
							.appendTo(itemPanel);
		}
		$(document.getElementById('logo')).click(self.hideAllOpen);
		$(document.createElement('div')).addClass('clearfix').appendTo(itemPanel);
		$('a').live('click', self.clickLink);
		$('.slide').live('click', self.clickSlide);
		self.checkURL();
		self.data = null;
		$(document).keydown(function(event){
			if(event.keyCode == 37) self.prevSlide();
			if(event.keyCode == 39) self.nextSlide();
		});
		$(window).resize(self.vCenter);
		$(self.loading).fadeOut('fast');
	};
	
	this.checkURL = function(){
		if (window.location.hash != ""){
			var steps = window.location.hash.split('/');
			var path = "";
			var i;
			for ( i = 0 ; i < (steps.length-1) ; i++ ){
				path = (path == "") ? steps[i] : path+'/'+steps[i];
				var link = $('a[data-location="'+path+'"]');
				var data = link.data('showStuff');
				if ( typeof data.childrenDOM == 'undefined' ) self.buildChildren(link.get(0), data);
				self.showLinkChildren(link, data);
			}
			path = (path == "") ? steps[i] : path+'/'+steps[i];
			var link = $('a[data-location="'+path+'"]');
			link.click();
		}
	};
	
	this.clickLink = function(event){
		var data = $(this).data( 'showStuff' );
		var $this = $(this);
		
		if ( data.specialFunction != undefined ) data.specialFunction();
		else {
			if ( typeof data.childrenDOM == 'undefined' ) self.buildChildren(this, data);
			
			if ($this.is('.open')){
				self.hideLinkChildren($this);
				var prevData = $('#controlsarea a.open:last').data('showStuff');
				if (prevData){
					if ( prevData.slides ){
						if ( data.slidegroup == undefined ){
							self.createSlideGroup(prevData);
						}
						self.changeSlideGroupTo(prevData.slidegroup);
						$('.slide-links span:first', self.slideshow.active).click();
					} else {
						self.changeSlideGroupTo(false);
					}
				} else {
					self.changeSlideGroupTo(false);
					//$(self.slideshow).slideUp();
				}
			} else {
				self.showLinkChildren( $this, data );
				if ( data.slides ){
					if ( data.slidegroup == undefined ){
						self.createSlideGroup(data);
					}
					self.changeSlideGroupTo(data.slidegroup);
					$('.slide-links span:first', self.slideshow.active).click();
				} else {
					self.changeSlideGroupTo(false);
				}			
			}
		}
		
		if ($('#controlsarea a.open').length == 0){
			$(self.container).css('background', self.defaultSlideCss);
			location.hash = '';
		} else
		{
			$(self.container).css('background', '');
		}
		
	};
	
	this.changeSlideGroupTo = function(slideGroup){
		if (!slideGroup){
			self.clearActiveShow();
		} else if (self.slideshow.active == undefined ){
						self.slideshow.active = $(slideGroup).fadeIn(400, self.hideDefaultSlide).removeClass('closed').get(0);
		} else if ( self.slideshow.active != undefined &&
					self.slideshow.active.id != slideGroup.id ){
						self.hideDefaultSlide();
						$(self.slideshow.active).addClass('closed');
						self.slideshow.active = $(slideGroup).fadeIn().removeClass('closed').get(0);
		}
	};
	
	this.clearActiveShow = function()
	{
		$(self.slideshow.active).addClass('closed');
		self.slideshow.active = undefined;
		self.slideshow.jActiveSlide = undefined;
		//$(self.container).css('background', self.defaultSlideCss);
	}
	
	this.hideDefaultSlide = function()
	{
		//$(self.container).css('background', 'none');
	}
	
	this.createSlideGroup = function(data){
		data.slidegroup = $( document.createElement('div') )
							  .attr( 'class', 'slide-group' )
							  .attr( 'id', 'slidegroup-'+data.linkId )
							  .prependTo( self.slideshow )
							  .hide()
							  .get(0);
		data.slidegroup.slideCount = data.slides.length;
		data.slidegroup.slideLinks = $(document.createElement('div'))
										.attr('class', 'slide-links')
										.appendTo(data.slidegroup)
										.get(0);
		var textSlideLinks = [];
		for ( var key in data.slides ){
			if ( data.slides[key].img_url != "" ){
				var image = document.createElement('img');
				image.setAttribute( 'src', data.slides[key].img_url );
			}
			if (data.slides[key].text_content != ""){
				var text = document.createElement( 'div' );
				text.setAttribute( 'class', "text" );
				text.innerHTML = preptxtforhtml(data.slides[key].text_content);
			}
			//create Slide
			var slide = $(document.createElement('div'))
						  .attr('class', 'slide')
						  .attr('id', 'slide-'+data.slides[key].id)
						  .hide();
			//if image append it
			if (image != undefined) {
				slide.append(image).addClass('image');
				image = undefined;
			}
			//if there is text, then append it
			if ( text != undefined ) {
				slide.append(text).addClass('text');
				text = undefined;
			}
			//attach slide to the group
			slide.appendTo(data.slidegroup);
			
			var slideLink = $(document.createElement('span'))
				.click(self.goToSlide)
				.attr('data-slideid', 'slide-'+data.slides[key].id)
				.html(data.slides[key].name);
			
			/*if (isNaN(slideLink.html())) textSlideLinks.push(slideLink.get(0));
			else slideLink.appendTo(data.slidegroup.slideLinks);*/
			slideLink.appendTo(data.slidegroup.slideLinks);
		}
		for (var key in textSlideLinks){
			$(textSlideLinks[key]).appendTo(data.slidegroup.slideLinks);
		}
		if (data.slides.length < 2) $(data.slidegroup.slideLinks).hide();
	};
	
	this.showLinkChildren = function(jLink, data){
		self.hideLinkChildren(jLink);
		jLink.addClass('open');
		if ( data.childrenDOM != false ) $(data.childrenDOM).fadeIn(400).addClass('active');
	};
	
	this.hideLinkChildren = function(jLink){
		var activeLink = jLink.parent().parent().find('a.open').removeClass('open');
		var visibleChildLevel = $('.active.pane', jLink.parent()).hide().removeClass('active');
	};
	
	this.hideAllOpen = function(){
		var $pLink = $('a.open:first', self.controls).click();
	};
	
	this.buildChildren = function(parent, data){
		if (typeof data.linkChildren != 'undefined'){
			//start by creating the children container named after it's parent so that it's easy to find
			data.childrenDOM = $(document.createElement('div'))
								.attr('id', 'children-'+data.linkId)
								.attr('class', 'pane level-'+(data.level+1))
								.appendTo($(parent).parent())
								.get(0);
			data.childrenDOM.level = data.level+1;
			//setup the count so that we can make sure each column only has 5
			var count = 5;
			//next cycle through the children and append them to the columns
			for (var key in data.linkChildren){
				if (count == 5) {
					column = $(document.createElement('div')).addClass('column').appendTo(data.childrenDOM);
					count = 0;
				}
				var href = (data.linkChildren[key].href != '') ? data.linkChildren[key].href : parent.hash+'/'+data.linkChildren[key].locationName;
				var link = $(document.createElement('a'))
							.attr('href', href )
							.attr('class', 'level-'+(data.level+1))
							.attr('data-location', $(parent).attr('data-location')+'/'+data.linkChildren[key].locationName)
							.html(data.linkChildren[key].name)
							.appendTo(column)
							.get(0);
				$(link).data('showStuff', {
					linkChildren: data.linkChildren[key].children,
					linkId: data.linkChildren[key].id,
					level: data.level+1,
					locationName: data.linkChildren[key].locationName,
					slides: data.linkChildren[key].slides
				});
				count ++;
			}
			$(document.createElement('div')).addClass('clearfix').appendTo(data.childrenDOM);
		} else {
			var preRenderedChild = $('#children-'+data.linkId);
			if (preRenderedChild.length == 0) data.childrenDOM = false;
			else {
				data.childrenDOM = preRenderedChild.appendTo($(parent).parent()).get(0);
			}
		}
		return true;
	};
	
	this.clickSlide = function(e){
		//find document position of mouse
		if ( e.which == 1 && self.slideshow.jActiveSlide != undefined ) {
			var posx = 0;
			if (e.pageX) 	{
				posx = e.pageX;
			}
			else if (e.clientX) 	{
				posx = e.clientX + document.body.scrollLeft
					+ document.documentElement.scrollLeft;
			}
			//find document position of image
			var slideleft = 0;
			obj = this;
			if (obj.offsetParent) {
				do {
					slideleft += obj.offsetLeft;
				} while (obj = obj.offsetParent);
			}
			
			if ( posx-slideleft > 150 ){
				var next = $(self.slideshow.jActiveSlide.get(-1)).next('.slide');
				if (next.length == 0) next = $('.slide:first', self.slideshow.active);
				self.changeSlide(next);
			} else {
				var prev = $(self.slideshow.jActiveSlide.get(0)).prev('.slide');
				if (prev.length == 0) prev = $('.slide:last', self.slideshow.active);
				self.changeSlide(prev);
			}
		}
	};
	
	this.goToSlide = function(){
		var next = $(document.getElementById(this.getAttribute('data-slideid')));
		if (next.length > 0) {
			self.changeSlide(next);
		}
	};
	
	this.changeSlide = function(next){
		if ( self.slideshow.jActiveSlide == undefined){
			$('.slide', self.slideshow).hide();
			self.slideshow.jActiveSlide = next.fadeIn();
			$('.slide-links .active', self.slideshow.active).removeClass('active');
			$('.slide-links span[data-slideid="'+next.attr('id')+'"]').addClass('active');
		} else if (self.slideshow.jActiveSlide.attr('id') != next.attr('id')){
			if (next.not('.image').is('.text')){
				next.show();
				self.slideshow.jActiveSlide = self.slideshow.jActiveSlide.add(next);
			} else{
				var prev = self.slideshow.jActiveSlide;
				self.slideshow.jActiveSlide.not(next).fadeOut();
				self.slideshow.jActiveSlide = next;
				next.not(prev).fadeIn();
			}
			$('.slide-links .active', self.slideshow.active).removeClass('active');
			$('.slide-links span[data-slideid="'+next.attr('id')+'"]').addClass('active');
		}
	};
	
	this.vCenter = function(){
		var top = ($(window).height()-395)/2;
		$(self.container).css('top', top);
	}
	
	$('.pane').hide();
	$.ajax({
		url:'data.php?action=getjson',
		dataType:'json',
		success:this.initialize,
		error: function(jqXHR, textStatus, errorThrown){
			alert('ajax error'); 
			//location.reload(true); 
			}
	});
	
}

function preptxtforhtml(txt){
	return txt.replace("\n","<br />");
}