/***********************************************************************************************
	
	
	TYP functionality

	2011 Erik Verheijden
	
	
***********************************************************************************************/

// Declare TYP global namespace and methods

var TYP = window.TYP || {};

TYP.layoutController = {
	
	fixedPageHeight : true,																	// when true the article height within an accordion content page is fixed, when false it will attempt to resize according to the calculated outerHeight
	fixedPageHeightValue : 326,																// set desired height as a height value in pixels ( optionally set also in css selector .ui-accordion .ui-accordion-content ) 
	
	updateHeaderColors : function (sClassList) {
		
		var colorIndex = sClassList.charAt(sClassList.indexOf('accordion-header-') + 17),		// not so impressive way to get a color reference
			bizCardUrl = '', 
			titleColor = '';
			
		// console.info(colorIndex);
		// change title colors and change bizcard image
		// todo : change to spritesheet and change position ( = preloaded cards )
		switch (colorIndex) {
			case '1':
				bizCardUrl = 'url("static/style/resources/bizcard-orange.png")';
				titleColor = '#FF6600';
				break;
			case '2':
				bizCardUrl = 'url("static/style/resources/bizcard-yellow.png")';
				titleColor = '#ffa800';
				break;
			case '3':
				bizCardUrl = 'url("static/style/resources/bizcard-pink.png")';
				titleColor = '#ff0066';
				break;
			case '4':
				bizCardUrl = 'url("static/style/resources/bizcard-brown.png")';
				titleColor = '#ac3e23';
				break;
			case '5':
				bizCardUrl = 'url("static/style/resources/bizcard-purple.png")';
				titleColor = '#51008a';
				break;
		}
		// console.info(bizCardUrl);
			
		// $('.bizcard').fadeOut(0).css('background-image', bizCardUrl).fadeIn(400);
		$('.bizcard').css('background-image', bizCardUrl);
		$('.title').css('color', titleColor);
	},
	
	toggleSplash : function (sHome) {
		
		// fadeOut splash info if it's visible
		if ($('.splash').css('display') !== 'none') {
			$('.splash').fadeOut();
		}
		
		//show splash in case of home or acc collapsed
		var AccState = 'collapsed';
		function showSplash() {
			$('.ui-accordion-content').each(function () {
				if ($(this).css('display') !== 'none') {
					AccState = 'expanded';
				}
			});
			if (AccState === 'collapsed') {
				if ($.browser.msie) {
					// skip animations for IE 
					$('.splash').css('display', 'block');
				} else {
					$('.splash').fadeIn();
				}
			}
		}
		// wait for it...
		setTimeout(showSplash, 600);
		
		
		
	},
	
	changeNavIndex : function (element) {
		
		// fadeIn articles
		// nr of links should match nr of articles, loop through them according to index
		
		// handle highlighting
		$(element).parents('.nav').find('a').removeClass('nav-selected');
		$(element).addClass('nav-selected');
		
		var index = $(element.parentNode).index(),
			oAccordionPage = $(element).parents('.centered-1280')[0],
			jArticles = $('.article', oAccordionPage);
		
		// handle bullets-nav highlighting
		$('.nav-bullets a', oAccordionPage).removeClass('nav-selected').eq(index).addClass('nav-selected');
		
		
		
		jArticles.css('display', 'none');
		if ($.browser.msie) {
			// skip animations for IE 
			$(jArticles[index]).css('display', 'block');
		} else {
			$(jArticles[index]).fadeIn();
		}
		
		if (this.fixedPageHeight === true) {
		
			$(oAccordionPage.parentNode).animate({height: this.fixedPageHeightValue});
			
		} else {
		
			var newHeight = $(jArticles[index]).outerHeight(true) + 50;
			// console.info(newHeight);
			$(oAccordionPage.parentNode).animate({height: newHeight});
		}
	},
	
	changeNavButtonIndex : function (element) {
	
		// fadeIn articles
		// nr of links should match nr of articles, loop through them according to index
		
		// handle highlighting
		$(element).parents('.nav-bullets').find('a').removeClass('nav-selected');
		$(element).addClass('nav-selected');
		
		var index = $(element.parentNode).index(),
			oAccordionPage = $(element).parents('.centered-1280')[0],
			jArticles = $('.article', oAccordionPage);
		
		// handle nav highlighting
		$('.nav a', oAccordionPage).removeClass('nav-selected').eq(index).addClass('nav-selected');
		
		
		jArticles.css('display', 'none');
		if ($.browser.msie) {
			// skip animations for IE 
			$(jArticles[index]).css('display', 'block');
		} else {
			$(jArticles[index]).fadeIn();
		}
		
		if (this.fixedPageHeight === true) {
		
			$(oAccordionPage.parentNode).animate({height: this.fixedPageHeightValue});
			
		} else {
		
			var newHeight = $(jArticles[index]).outerHeight(true) + 50;
			// console.info(newHeight);
			$(oAccordionPage.parentNode).animate({height: newHeight});
		}
		
	}

};			

TYP.overlayController = {

	displayOverlayMsg : function (sHeader,sParagraph) {
		
		// creating overlay viewnode here :
		var overlayView = '<div id="overlay_msg"><div class="overlay_window"><div class="overlay_top"></div><div class="overlay_mid">';
		overlayView += '<h2>';
		overlayView += sHeader;
		overlayView += '</h2>';
		overlayView += '<p>';
		overlayView += sParagraph;
		overlayView += '</p>';
		overlayView += '<button style="margin:0 215px;" onclick="TYP.overlayController.closeOverlayMsg();">Ok</button>';
		overlayView += '</div><div class="overlay_btm"></div></div></div>';
		
		document.getElementById('overlaySpace').innerHTML = overlayView;	
		$('#overlaySpace').find('button').button();
		$('#overlaySpace').find('button:first').focus();
	},
	
	closeOverlayMsg : function () {
		document.getElementById('overlaySpace').innerHTML = '';
	},
	
	showDisclaimer : function () {
		this.displayOverlayMsg('Disclaimer', 'Dit is de disclaimer text');
	},
	
	showPrivacy : function () {
		this.displayOverlayMsg('Privacy', 'Dit is de privacy text');
	},
	
	showContact : function () {
		this.displayOverlayMsg('Contact', 'Dit is de contact text');
	}
	
};






//  init
$(document).ready(function () {
	
	// init custom jQuery accordion
	$('.accordion', 'body').accordion({ collapsible: true }, { active: 'false' });
	
	// add event handler to update header colors and hide/show splash
	$('.ui-accordion-header').click(function () {
		TYP.layoutController.updateHeaderColors($(this).attr('class'));
		TYP.layoutController.toggleSplash();
	});
	
	// attach click handlers to nav links
	$('.nav a', 'body').click(function () {
		TYP.layoutController.changeNavIndex(this);
	}); 
	// attach click handlers to nav-button links
	$('.nav-bullets a', 'body').click(function () {
		TYP.layoutController.changeNavButtonIndex(this);
	}); 
	
	// set the fixedHeight to accordion	entries
	// $('.ui-accordion .ui-accordion-content', 'body').css('height', this.fixedPageHeightValue+'px');
	
	// cache header images
	var a = ['url("static/style/resources/bizcard-orange.png")', 
			 'url("static/style/resources/bizcard-yellow.png")',
			 'url("static/style/resources/bizcard-purple.png")',
			 'url("static/style/resources/bizcard-brown.png")',
			 'url("static/style/resources/bizcard-pink.png")'];
	for (var i = 0; i < a.length; i++) {
		// console.info(a[i]);
		$('img-cache', 'body').css('background-image', a[i]);
		// $('.bizcard').css('background-image', a[i]);
	}
	
});