/* ########################################################################### *
/* ***** DOCUMENT INFO  ****************************************************** *
/* ########################################################################### *
 * ##### NAME:  global.js
 * ##### VERSION: v1.0 (Masala Magic)
/* ########################################################################### *

/* ########################################################################### *
/* ***** INDEX *************************************************************** *
/* ########################################################################### *
/* ##### Global JS configuration
/* ##### Initialisation
/* ##### Custom scripts
/* ##### Rounded corners
/* ##### Article Slider
/* ##### Page tools
/* ##### Modal windows
/* ########################################################################### */

/* ########################################################################### *
/* ##### GLOBAL JS CONFIGURATION
/* ########################################################################### */
var masala_flashVersion = "9.0.28.0";
var masala_videoPlayerWidth = "309px";
var masala_videoPlayerHeight = "173px";
var masala_popupWidth = "750";
var masala_popupHeight = "700";
var flowerdale_youtubeWidth = "580px";
var flowerdale_youtubeHeight = "360px";
var flowerdale_scribdWidth = "580px";
var flowerdale_scribdHeight = "360px";
var debugOutput = false;

/* ########################################################################### *
/* ##### INITIALISATION
/* ########################################################################### */

$(document).ready(custom_init_global);
$(document).ready(masala_init_global);

function custom_init_global()
{
	// Manage left & right card navigation buttons
	custom_updateCardNavBtns();
	
	// Setup modal windows
	custom_init_modalWindows();
	
	// Mark for printing buttons
	custom_init_markForPrinting();
}

function masala_init_global()
{
	/* Round corners */
	masala_init_corners();
			
	/* Serial slider */
	masala_init_serialScroll();
	
	/* Page tools */
	masala_init_pageTools();
}


/* ########################################################################### *
/* ##### CUSTOM SCRIPTS
/* ########################################################################### */

function custom_init_markForPrinting()
{
	$('.custom_markForPrinting').click(function()
		{
			var contentItem = $(this).parents('.contentItem:first');
			if ($(contentItem).hasClass('print'))
			{
				$(contentItem).removeClass('print');
			}
			else
			{
				$(contentItem).addClass('print');
			}
			
			custom_markForPrinting_update();
		});
	
	$('.custom_markForPrinting').hover(function()
		{
			$(this).addClass('custom_markForPrinting_over');
			var contentItem = $(this).parents('.contentItem:first');
			$(contentItem).find('.tip_markForPrinting').fadeIn('fast');	
		}, function()
		{
			$(this).removeClass('custom_markForPrinting_over');
			var contentItem = $(this).parents('.contentItem:first');
			$(contentItem).find('.tip_markForPrinting').fadeOut('fast');			
		});
}

function custom_markForPrinting_update()
{
	if ($('.print').length > 0)
	{
		$('body').addClass('printOnlyMarkedItems');
	}
	else
	{
		$('body').removeClass('printOnlyMarkedItems');
	}
}

function custom_init_modalWindows()
{

	var modalHtml = '<div id="customModal"><h1 class="title"></h1></div>';
	
	$('.modalWindow').click(function (e) 
	{
		e.preventDefault();
		
		// HANDLE YOUTUBE CONTENT
		
		// Grab the video ID
		var itemId = $(this).parents('li:first').attr('id');
		var itemType = $('#' + itemId + ' .tool_itemType').html();	
		var itemTitle = $('#' + itemId + ' h3 a').html();
		var itemDesc = $('#' + itemId + ' .tool_videoDesc').html();
		
		// Set modalHtml
		var modalHtml = '';
		switch (itemType)
		{
			case 'youtube':
				itemTitle = $('#' + itemId + ' .tool_title').html();
				modalHtml = '<div id="customModal"><div class="object"><object width="' + flowerdale_youtubeWidth + '" height="' + flowerdale_youtubeHeight + '"><param name="movie" value="http://www.youtube.com/v/' + itemId + '&hl=en&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/' + itemId + '&hl=en&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="' + flowerdale_youtubeWidth + '" height="' + flowerdale_youtubeHeight + '"></embed></object></div><h1 class="title">' + itemTitle + '</h1><p>' + itemDesc + '</p></div>';
			break;
			case 'scribd':
				itemTitle = $('#' + itemId + ' .tool_title').html();
				var itemAccessKey = $('#' + itemId + ' .tool_accessKey').html();
				modalHtml = '<div id="customModal"><div class="object"><object codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" id="doc_659644119336682" name="doc_659644119336682" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="' + flowerdale_scribdWidth + '" height="' + flowerdale_scribdHeight + '"><param name="movie"	value="http://d.scribd.com/ScribdViewer.swf?document_id=' + itemId + '&access_key=' + itemAccessKey + '&page=1&version=1&viewMode="><param name="quality" value="high"><param name="play" value="true"><param name="loop" value="true"><param name="scale" value="showall"><param name="wmode" value="opaque"><param name="devicefont" value="false"><param name="bgcolor" value="#ffffff"><param name="menu" value="true"><param name="allowFullScreen" value="true"><param name="allowScriptAccess" value="always"><param name="salign" value=""><embed src="http://d.scribd.com/ScribdViewer.swf?document_id=' + itemId + '&access_key=' + itemAccessKey + '&page=1&version=1&viewMode=" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" play="true" loop="true" scale="showall" wmode="opaque" devicefont="false" bgcolor="#ffffff" name="doc_659644119336682_object" menu="true" allowfullscreen="true" allowscriptaccess="always" salign="" type="application/x-shockwave-flash" width="' + flowerdale_scribdWidth + '" height="' + flowerdale_scribdHeight + '"></embed></object></div><h1 class="title">' + itemTitle + '</h1><p>' + itemDesc + '</p></div>';
			break;
		
		default:
			break;
		}

		$(modalHtml).modal({
				overlayId: 'modalOverlay',
				containerId: 'modalContainer',
				onOpen: customModal.open,
				onShow: customModal.show,
				onClose: customModal.close
		});

	});
	
	var customModal = {
		message: null,
		open: function (dialog) {
			dialog.overlay.show(1, function () {
				dialog.container.fadeIn(500, function () {
					dialog.data.fadeIn(500, function () {
						//$('#customModal .title').html(this.videoId);
					});
				});
			});
		},
		show: function (dialog) {
		},
		close: function (dialog) {
			$('#customModal').remove();
			dialog.container.fadeOut(500, function () {
				dialog.overlay.fadeOut(500, function () {
					$.modal.close();
				});
			});
		}
	};	

}

function custom_updateCardNavBtns()
{
	// Set the left / right alignment of buttons and assign to window resize
	custom_updateCardNavBtns_align();
	$(window).resize(function()
	{
  		custom_updateCardNavBtns_align();
	});

}

function custom_updateCardNavBtns_align()
{
	var prev = $('#content .nav_card_prev');
	var next = $('#content .nav_card_next');
	var navBtnOffset = 1;
	var windowWidth = $('body').width();
	var windowWidthOffset = 1030;
	var contentWidth = $('body #content').width();
	
	if (windowWidth > windowWidthOffset)
	{
		navBtnOffset = Math.ceil((windowWidth - contentWidth - 80) / 2);
	}

	// Set left & right button alignment
	//$(prev).css('left', navBtnOffset + 'px');
	$(prev).animate({ 
		left: navBtnOffset + 'px'
	  }, 100 );	
	
	//$(next).css('right', navBtnOffset + 'px');
	$(next).animate({ 
		right: navBtnOffset + 'px'
	  }, 100 );
}

/* ########################################################################### *
/* ##### Rounded corners
/* ########################################################################### */

function masala_init_corners()
{
	// Rounded corners with jQuery corner plugin version 1.92
	var cornerNodes_all = ".corners";
	$(cornerNodes_all).corner("");
}


/* ########################################################################### *
/* ##### Article Slider
/* ########################################################################### */

jQuery.easing.easeOutQuart = function (x, t, b, c, d) {
	 return -c * ((t=t/d-1)*t*t*t - 1) + b;
};

function masala_init_serialScroll()
{
	// If the first item in the nav is selected, hide the previous button
	if ($('#nav_primary li:first').hasClass('active'))
	{
		// Remove hidden from previous link
		$('.nav_card_prev a').removeClass('hidden');
		$('.nav_card_prev').hide();
	}
	else
	{
		// Remove hidden from previous link
		$('.nav_card_prev a').removeClass('hidden');	
	}
	
	// Setup SerialScroll
	if ($("#cards").length > 0)
	{	
		// Call SerialScroll plugin on serialScroll class
		$('#cards').serialScroll({
			items:'li.card',							//slide LI items
			prev:'.nav_card_prev a',					//the reference to the elements which will move the slider
			next:'.nav_card_next a',					//the reference to the elements which will move the slider
			onBefore: function ( e, target, pane, current, targetIndex) 
				{
					custom_serialScroll_onBefore(target, pane, targetIndex); 
				},
			constant: false,
			onAfter: function() {  },
			offset:0, 									//when scrolling to photo, stop offset before reaching it (from the left)
			start:0, 									//as we are centering it, start at the 2nd
			duration:1500,								//slide duration
			force:true,									//force the scroll to the first element on start ?
			stop:true,									//stop animation and start a new one when clicked during animation
			lock:false,									//allow slider to respond to events
			cycle:false, 								//pull back once you reach the end
			easing:'easeOutQuart', 						//use this easing equation for a funny effect
			exclude:0									//don't include the last two elements in scrolling
		});
	}
	
	// Setup primary navigation (#nav_primary)
	$('#nav_primary li a').click( function()
	{
		custom_nav_getThisIndex(this);
		return false;	
	});
	
	// Setup tooltip hovers
	$('.nav_card_prev .tip, .nav_card_next .tip').hide().removeClass('hidden');
	$('.nav_card_prev a, .nav_card_next a').hover(custom_nav_showTip, custom_nav_hideTip);
}

function custom_nav_showTip()
{
	// Select the tip
	$(this).prev().fadeIn('fast');
}

function custom_nav_hideTip()
{
	$(this).prev().fadeOut('fast');	
}

function custom_nav_getThisIndex(node)
{
	// Deactive current
	$('#nav_primary li').removeClass('active');
	
	// Get index of the clicked nav item
	var index = $('#nav_primary li a').index(node);
	
	// Mark the active LI
	$('#nav_primary li:nth-child(' + (index + 1) + ')').addClass('active');
	
	// SerialScroll to the target index
	$('#cards').trigger('goto',index);
}

function custom_serialScroll_onBefore(target, pane, targetIndex)
{
	var index = pane.index(target);
	var nodes = $(pane);
	var totalItems = ($(pane).find('li.card').length);
	
	// Hide / show horizontal navigation arrows
	custom_serialScroll_updateCardNavBtns(totalItems, targetIndex);
	
	// Activate the primary nav
	custom_serialScroll_activatePrimaryNav(targetIndex);
	
	// Start scrolling the footer
	custom_serialScroll_scrollFooter(targetIndex);
}

function custom_serialScroll_scrollFooter(targetIndex)
{
	var footer = $('#footer');
	var footerWidth = $(footer).width();
	var totalCards = $('#cards li.card').length;
	var minWindowWidth = 1024; // Target 1024 as a minimum
	var windowWidth = $(window).width();
	windowWidthOffset = (minWindowWidth < windowWidth) ? windowWidth : minWindowWidth;
	
	// Get the target position of the footer
	var targetFooterOffset = (Math.round((footerWidth - 100 - windowWidthOffset) / totalCards) * targetIndex);
	
	// Animate the footer
	$(footer).animate({ 
		left: '-' + targetFooterOffset + 'px'
	  }, { duration: 1500, easing: 'easeOutQuart', queue: false });	

}

function custom_serialScroll_updateCardNavBtns(totalItems, targetIndex)
{
	var prev = $('#content .nav_card_prev');
	var next = $('#content .nav_card_next');
	
	// Show / hide previous button
	if (targetIndex == 0)
	{
		$(prev).fadeOut();	
		$('.nav_card_prev .tip').fadeOut();	
	}
	else
	{
		$(prev).fadeIn();
	}
	
	if (targetIndex == (totalItems - 1))
	{
		$(next).fadeOut();	
		$('.nav_card_next .tip').fadeOut();	
	}
	else
	{
		$(next).fadeIn();	
	}
}

function custom_serialScroll_activatePrimaryNav(index)
{
	// Deactivate current
	$('#nav_primary li').removeClass('active');
	
	// 
	$('#nav_primary li:nth-child(' + (index + 1) + ')').addClass('active');
	//$('#nav_primary li:nth-child(' + (index + 2) + ')').addClass('active');
	//$('#nav_primary li:nth-child(' + (index + 3) + ')').addClass('active');
}


/* ########################################################################### *
/* ##### PAGE TOOLS
/* ########################################################################### */

// Page tools plus generic popups (email a colleague and print page)
function masala_init_pageTools() 
{
	// Generic popup link
	$('.masala_popupLink').click(function (e) {
		e.preventDefault();
		var targetHref = $(this).attr('href');
		var newWindow = window.open(targetHref,"window_popup","height=" + masala_popupHeight + ",width=" + masala_popupWidth + ",toolbar=no,menubar=yes,location=no,scrollbars=yes,status=no");
		newWindow.focus();
		
		// Prevent click
		return false;
	});

	// Print page popup link
	$('.masala_printPagePopupLink').click(function (e) {
		e.preventDefault();
		var targetHref = $(this).attr('href');
		var newWindow = window.open(targetHref,"window_print","height=" + masala_popupHeight + ",width=" + masala_popupWidth + ",toolbar=no,menubar=yes,location=no,scrollbars=yes,status=no");
		newWindow.focus();
		newWindow.print();

		// Prevent click
		return false;
	});
	
}




/* FIN */
