var HTMLController =
{
	workXML						:null,
	directorsXML				:null,
	initialVisit				:true,
	currentHash					:'',
	deeplinkValue1				:'',
	deeplinkValue2				:'',
	deeplinkValue3				:'',
	hideDirectorListInterval	:null,
	onDirectorsPage				:false,
	returnDeeplink				:null,
	cardPositions				:Array('B1', 'C1', 'D1', 'E1', 'A2', 'B2', 'D2', 'E2', 'A3', 'B3', 'C3', 'E3', 'A4', 'C4', 'D4', 'E4', 'A5', 'B5', 'C5', 'D5', 'E5'),
	
	init:function()
	{
		this.loadXML();
	},
	
	getWindow:function()
	{
		return window;
	},
	
	setHash:function(hashValue)
	{
		if(hashValue == '/')
		{
			this.getWindow().location.hash = '';
		}
		else
		{
			this.getWindow().location.hash = '#' + hashValue;
		}
	},
	
	checkHash:function()
	{
		if(this.currentHash != this.getWindow().location.hash)
		{
			//	Prep hash value
			this.currentHash = this.getWindow().location.hash;
			var temp = this.currentHash.split('#');
			var deeplinks;
			if(temp.length > 1)
			{
				var hashValue = temp[1];
				deeplinks = hashValue.split('/');
			}
			else
			{
				deeplinks = new Array(null);
			}
			
			//	This strips out empty values
			deeplinks = jQuery.grep(deeplinks,function(n,i){
				return(n);
			});
			
			this.deeplinkValue1 = (deeplinks[0] != null) ? deeplinks[0] : 'work';
			this.deeplinkValue2 = (deeplinks[1] != null) ? deeplinks[1] : null;
			this.deeplinkValue3 = (deeplinks[2] != null) ? deeplinks[2] : null;

			//jQuery('#debug').html(this.deeplinkValue1+', '+this.deeplinkValue2+', '+this.deeplinkValue3+', '+this.deeplinkValue4);
			
			if(this.deeplinkValue1 == 'work')
			{
				//	Set menu
				jQuery('#hyperactive-card > a').removeClass('showActive');
				jQuery('#work-list-card > a').addClass('showActive');
				jQuery('#director-list-card > a').removeClass('showActive');
				jQuery('#contact-info-card > a').removeClass('showActive');
				
				//	Set director submenu
				this.hideDirectorList();
				jQuery('#director-submenu-card > ul').find('li').each(function(idx){
					jQuery('a', this).removeClass('showActive');
				});
				
				//	Hide pages
				jQuery('#about-page').fadeOut();
				jQuery('#contact-page').fadeOut();
				
				//	Set thumbnail view
				this.loadWorkThumbnails(this.initialVisit, !this.onDirectorsPage);
				
				if(this.deeplinkValue2 != null)
				{
					this.showVideo('/');
				}
				
				this.onDirectorsPage = false;
			}
			else if(this.deeplinkValue1 == 'about-us')
			{
				//	Set menu
				jQuery('#hyperactive-card > a').addClass('showActive');
				jQuery('#work-list-card > a').removeClass('showActive');
				jQuery('#director-list-card > a').removeClass('showActive');
				jQuery('#contact-info-card > a').removeClass('showActive');
				
				//	Set director submenu
				this.hideDirectorList();
				jQuery('#director-submenu-card > ul').find('li').each(function(idx){
					jQuery('a', this).removeClass('showActive');
				});
				
				//	Hide pages
				jQuery('#contact-page').fadeOut();
				
				//	Set thumbnail view
				this.loadWorkThumbnails(this.initialVisit, !this.onDirectorsPage);
				
				//	Show about page
				jQuery('#about-page').fadeIn();
				
				this.onDirectorsPage = false;
			}
			else if(this.deeplinkValue1 == 'contact-us')
			{
				//	Set menu
				jQuery('#hyperactive-card > a').removeClass('showActive');
				jQuery('#work-list-card > a').removeClass('showActive');
				jQuery('#director-list-card > a').removeClass('showActive');
				jQuery('#contact-info-card > a').addClass('showActive');
				
				//	Set director submenu
				this.hideDirectorList();
				jQuery('#director-submenu-card > ul').find('li').each(function(idx){
					jQuery('a', this).removeClass('showActive');
				});
				
				//	Hide pages
				jQuery('#about-page').fadeOut();
				
				//	Set thumbnail view
				this.loadWorkThumbnails(this.initialVisit, !this.onDirectorsPage);
				
				//	Show about page
				jQuery('#contact-page').fadeIn();
				
				this.onDirectorsPage = false;
			}
			else if(this.deeplinkValue1 == 'directors' && this.deeplinkValue2 != null)
			{
				this.onDirectorsPage = true;
				
				//	Set menu
				jQuery('#hyperactive-card > a').removeClass('showActive');
				jQuery('#work-list-card > a').removeClass('showActive');
				jQuery('#director-list-card > a').addClass('showActive');
				jQuery('#contact-info-card > a').removeClass('showActive');
				
				//	Set director submenu
				this.showDirectorList();
				jQuery('#director-submenu-card > ul').find('li').each(function(idx){
					jQuery('a', this).removeClass('showActive');
				});
				jQuery('#director-link-' + this.deeplinkValue2 + ' > a').addClass('showActive');
				
				//	Hide pages
				jQuery('#about-page').fadeOut();
				jQuery('#contact-page').fadeOut();
				
				//	Set thumbnail view
				this.loadDirectorThumbnails(this.initialVisit);
				
				if(this.deeplinkValue3 != null)
				{
					this.showVideo('/directors/' + this.deeplinkValue2 + '/' );
				}
			}
		}
		else if(this.initialVisit)	//	Initial page visit to landing page
		{
			//	Set menu
			jQuery('#hyperactive-card > a').removeClass('showActive');
			jQuery('#work-list-card > a').addClass('showActive');
			jQuery('#director-list-card > a').removeClass('showActive');
			jQuery('#contact-info-card > a').removeClass('showActive');
			
			//	Hide pages
			jQuery('#about-page').fadeOut();
			jQuery('#contact-page').fadeOut();
				
			//	Set thumbnail view
			this.loadWorkThumbnails();
		}
		
		//	Fade in all the images
		for(a = 0; a < this.cardPositions.length; a++)
		{
			ThumbnailCard.initShow('thumbnailcard-' + this.cardPositions[a]);
		}
		
		//	This is no longer the initial visit
		this.initialVisit = false;
	},
	
	loadWorkThumbnails:function(skipAnimation, skipDirectorColumnFadeIn)
	{
		skipDirectorColumnFadeIn = (skipDirectorColumnFadeIn == null) ? false : skipDirectorColumnFadeIn;

		jQuery(HTMLController.workXML).find('item').each(function(idx){
			var id = 'thumbnailcard-' + HTMLController.cardPositions[idx]; 
			jQuery('#image-' + HTMLController.cardPositions[idx]).html('<img src="images/user/' + jQuery(this).find('thumbnail').text() + '" alt=""/>');	
			ThumbnailCard.enableInNormalState(id);
		});
		
		for(a = 1; a <= 5; a++)
		{
			if(skipDirectorColumnFadeIn)
			{
				//alert('if');
				jQuery('#thumbnailcard-E' + (a) + ' > .thumbnailimage').stop().animate( { 'opacity' : 1 }, 250 );
			}
			else
			{
				//alert('else');
				jQuery('#thumbnailcard-E' + (a) + ' > .thumbnailimage').stop().animate( { 'opacity' : 0 }, 0 ).animate( { 'opacity' : 1 }, 250 );
			}
		}
	},
	
	loadDirectorThumbnails:function(skipAnimation)
	{	
		var skipThese = Array();	
		
		//	Load the director column
		jQuery(HTMLController.directorsXML).find('director').each(function(idx){
			if(jQuery(this).attr('urlslug') == HTMLController.deeplinkValue2)
			{ 		
				jQuery(this).find('item').each(function(i){
					skipThese.push('E' + (i + 1));
					
					//	Set content
					jQuery('#image-E' + (i+1)).html('<img src="images/user/' + jQuery(this).find('thumbnail').text() + '" alt=""/>');
					jQuery('#thumbnailcard-E' + (i+1) + ' > .title-display > .clientname').html(jQuery(this).find('client').text());
					jQuery('#thumbnailcard-E' + (i+1) + ' > .title-display > .titlename').html(jQuery(this).find('title').text());
					var urlslug = jQuery(this).attr('urlslug');
					jQuery('#thumbnailcard-E' + (i+1)).click(function(){
						HTMLController.setHash('/directors/' + HTMLController.deeplinkValue2 + '/' + urlslug + '/');
					});
					
					//	Fade in
					jQuery('#thumbnailcard-E' + (i+1) + ' > .thumbnailimage').stop().animate( { 'opacity' : 0 }, 0 ).animate( { 'opacity' : 1 }, 250 );
				});
			}
		});
		
		//	Load the non-director columns
		jQuery(HTMLController.workXML).find('item').each(function(idx){
			var id = 'thumbnailcard-' + HTMLController.cardPositions[idx]; 
			if(jQuery.inArray(HTMLController.cardPositions[idx],skipThese) == -1)
			{
				jQuery('#image-' + HTMLController.cardPositions[idx]).html('<img src="images/user/' + jQuery(this).find('thumbnail').text() + '" alt=""/>');	
				ThumbnailCard.disabledInRolloverState(id, skipAnimation);
			}
		});
	},
	
	loadXML:function()
	{
		//	Work
		jQuery.ajax({
			type: 'GET',
		   	url: 'data/work.xml',
		   	dataType: 'xml',
			async: false,
		   	success: function(xml){
				HTMLController.workXML = xml;
				jQuery(xml).find('item').each(function(idx){

					var id = 'thumbnailcard-' + HTMLController.cardPositions[idx];
					var thumbnailCardHTML = '<div id="' + id + '" onclick="HTMLController.setHash(\'/work/' + jQuery(this).attr('urlslug') + '/\');ThumbnailCard.enableInNormalState(\''+id+'\')">';
					thumbnailCardHTML += '<div class="title-display">';
					thumbnailCardHTML += '<div class="clientname">' + jQuery(this).find('client').text() + '</div>';
					thumbnailCardHTML += '<div class="titlename">' + jQuery(this).find('title').text() + '</div>';
					thumbnailCardHTML += '</div>';
					thumbnailCardHTML += '<div class="thumbnailimage" id="image-'+HTMLController.cardPositions[idx]+'"></div>';
					thumbnailCardHTML += '</div>';
					jQuery('#thumbnails-container').append(thumbnailCardHTML);
					ThumbnailCard.init(id);
				});
			}
		});
		
		//	Directors
		jQuery.ajax({
			type: 'GET',
		   	url: 'data/directors.xml',
		   	dataType: 'xml',
			async: false,
		   	success: function(xml){
				HTMLController.directorsXML = xml;
				
				//	Put the submenu together
				var submenuHTML = '<ul>';
				jQuery(xml).find('director').each(function(idx){
					submenuHTML += '<li id="director-link-' + jQuery(this).attr('urlslug') + '"><a href="javascript:void(HTMLController.setHash(\'/directors/' + jQuery(this).attr('urlslug') + '/\'))">' + jQuery(this).attr('dname') + '</a></li>';
				});
				submenuHTML += '</ul>';
				jQuery('#director-submenu-card').html(submenuHTML);
			}
		});
	
		if(this.initialVisit)
		{
			setInterval('HTMLController.checkHash()', 250);
		}
	}, 
	
	showDirectorList:function()
	{
		clearTimeout(HTMLController.hideDirectorListInterval);
		jQuery('#director-submenu-card').fadeIn();
		jQuery('#director-list-card > a').addClass('showActive');
	},
	
	hideDirectorList:function()
	{
		clearTimeout(HTMLController.hideDirectorListInterval);
		if(HTMLController.deeplinkValue1 != 'directors')
		{
			jQuery('#director-submenu-card').fadeOut();
			jQuery('#director-list-card > a').removeClass('showActive');
		}
	},
	
	startCountdownToHideDirectorList:function()
	{
		clearTimeout(HTMLController.hideDirectorListInterval);
		HTMLController.hideDirectorListInterval = setTimeout(HTMLController.hideDirectorList, 1000);
	},
	
	showMap:function()
	{
		jQuery('#contact-map').stop().fadeIn();
		jQuery('#contact-map > div.close-button').stop().fadeIn();
		jQuery('#map-image').stop().fadeIn();
	},
	
	hideMap:function()
	{
		jQuery('#contact-map').stop().fadeOut();
		jQuery('#contact-map > div.close-button').stop().fadeOut();
		jQuery('#map-image').stop().fadeOut();
	}, 
	
	showVideo:function(returnToThisDeeplink)
	{
		this.returnDeeplink = returnToThisDeeplink;
		
		//	Go through work XML and find video to play
		if(this.deeplinkValue1 == 'work')
		{
			jQuery(HTMLController.workXML).find('item').each(function(idx){
				if(jQuery(this).attr('urlslug') == HTMLController.deeplinkValue2)
				{
					//	Set video
					var myVideoPath = 'videos/' + jQuery(this).find('video').text(); 
					var videoWidth = parseInt(jQuery(this).find('video').attr('width'));
					var videoHeight = parseInt(jQuery(this).find('video').attr('height'));
					var htmlCode = QT_GenerateOBJECTText(myVideoPath, videoWidth + 'px', videoHeight + 'px', '', 'SCALE', 'tofit', 'obj#ID', 'movie1', 'obj#name', 'movie1', 'emb#ID', 'movieEMBED1', 'emb#name', 'movie1', 'AUTOPLAY', 'True', 'EnableJavaScript', 'True', 'postdomevents', 'True');
					jQuery('#videoplayer').html(htmlCode);	

					//	Set data
					var videoDataHTML = 'Client: ' + jQuery(this).find('client').text() + '<br/>Title: ' + jQuery(this).find('title').text() + '<br/>Agency: ' + jQuery(this).find('agency').text() + '<br/>Director: ' + jQuery(this).find('director').text();
					jQuery('#videodata').html(videoDataHTML);
					
					//	Set description
					var videoDescriptionHTML = jQuery(this).find('description').text();
					jQuery('#videodescription').html(videoDescriptionHTML);
					
					//	Position
					var videoHalfWidth = Math.round(parseInt(jQuery(this).find('video').attr('width')) / 2);
					jQuery('#videoplayer').css('left', (450 - videoHalfWidth) + 'px');
					jQuery('#htmlvideo > #videobox > .close-button').css('left', (450 + videoHalfWidth + 10) + 'px');
					jQuery('#videodata').css({top:(videoHeight + 10) + 'px', left:(450 - videoHalfWidth) + 'px'});
					jQuery('#videodescription').css({top:(videoHeight + 10) + 'px', left:(450 + videoHalfWidth - 325) + 'px'});
					
					return false;
				}
			})
		}
		else if(this.deeplinkValue1 == 'directors')
		{
			var breakOut = false;
			jQuery(HTMLController.directorsXML).find('director').each(function(idx){
				if(jQuery(this).attr('urlslug') == HTMLController.deeplinkValue2)
				{
					var dname = jQuery(this).attr('dname');
					jQuery(this).find('item').each(function(idx){
						if(jQuery(this).attr('urlslug') == HTMLController.deeplinkValue3)
						{
							//	Set video
							var myVideoPath = 'videos/' + jQuery(this).find('video').text(); 
							//alert(myVideoPath);
							var videoWidth = parseInt(jQuery(this).find('video').attr('width'));
							var videoHeight = parseInt(jQuery(this).find('video').attr('height'));
							var htmlCode = QT_GenerateOBJECTText(myVideoPath, videoWidth + 'px', videoHeight + 'px', '', 'SCALE', 'tofit', 'obj#ID', 'movie1', 'obj#name', 'movie1', 'emb#ID', 'movieEMBED1', 'emb#name', 'movie1', 'AUTOPLAY', 'True', 'EnableJavaScript', 'True', 'postdomevents', 'True');
							jQuery('#videoplayer').html(htmlCode);	
		
							//	Set data
							var videoDataHTML = 'Client: ' + jQuery(this).find('client').text() + '<br/>Title: ' + jQuery(this).find('title').text() + '<br/>Agency: ' + jQuery(this).find('agency').text() + '<br/>Director: ' + dname;
							jQuery('#videodata').html(videoDataHTML);
							
							//	Set description
							var videoDescriptionHTML = jQuery(this).find('description').text();
							jQuery('#videodescription').html(videoDescriptionHTML);
							
							//	Position
							var videoHalfWidth = Math.round(parseInt(jQuery(this).find('video').attr('width')) / 2);
							jQuery('#videoplayer').css('left', (450 - videoHalfWidth) + 'px');
							jQuery('#htmlvideo > #videobox > .close-button').css('left', (450 + videoHalfWidth + 10) + 'px');
							jQuery('#videodata').css({top:(videoHeight + 10) + 'px', left:(450 - videoHalfWidth) + 'px'});
							jQuery('#videodescription').css({top:(videoHeight + 10) + 'px', left:(450 + videoHalfWidth - 325) + 'px'});
							
							breakOut = true;
							return false;
						}
					});
				}
				if(breakOut)
				{
					return false;
				}
			});
		}
		
		jQuery('#htmlvideo').fadeIn();
	},
	
	hideVideo:function()
	{
		jQuery('#htmlvideo').fadeOut();
		jQuery('#videoplayer').html('');
		this.setHash(this.returnDeeplink);
	}
}