$(document).ready(function() {

/* set globals */
	var vpVars = new Object();
	vpVars.padVar = 50;
	vpVars.spinner = 70;
	vpVars.playerPath = 'code/viewport2/player.swf';
	vpVars.vidPath = '../../';
	vpVars.playerPath = 'js/viewport2/player.swf';
	vpVars.vidPath = '../../';
	var mediaSet = new Array();
	

/* handle link click */	
	$('.viewport2').live ('click', function() {
		var clkLink = $(this);
		startVP(clkLink);
		return false;
	});


/* nav events */
	$('#navcls').live('click', function() {
		closeVp();
		return false;
	});
	$('#navdn').live('click', function() {
		navDn();
		return false;
	});

	$('#navup').live('click', function() {
		navUp();
		return false;
	});
	
	$('#vpbg').live('click', function() {
		closeVp();
		return false;
	});
		
/* start viewport */

	function startVP(clkLink) {
		mediaSet = new Array();
		
		clkLink.addClass('vpclkd');
		setupBG();
		$('#vpbg').show().animate({'opacity':.7},500);
		
		var relStr = clkLink.attr('rel');
		var relVars = relStr.split(',');
		
		if (typeof relVars[1]=='undefined') {
			relVars[1]='x';
		}
		createMediaSet(clkLink, relVars);
			
		switch (relVars[0]) {
			case 'image':
				setupPhoto();
			break;
			
			case 'youtube':
			case 'vimeo':
			case 'longtail':
			case 'jwplayer':
			case 'jwplayer600':
			case 'google':
			case 'multivu':
			case 'webcastr':
				setupVideo(relVars[0]);
			break;
		}

		addNavPanel();		
	}


/* make dark bg */
	function setupBG() {
		$('body').append('<div id="vpbg">');
		$('#vpbg').css({'opacity':0});
		resizeBG();
		
	}

/* make dark bg fit page */
	function resizeBG() {
		var vpht = ($(document).height() > $(window).height()) ? $(document).height()  :  $(window).height() ;
		var vpwd = ($(document).width() > $(window).width()) ? $(document).width()  :  $(window).width() ;
		
		$('#vpbg').css({'height': vpht, 'width': vpwd});
	}


/* close vids, fade out then close images and bg */
	function closeVp() {
		$('#vpvid').remove();
		$('#vpbg, #vpimg, #vpnav').fadeOut(500, function() {
			$('#vpbg, #vpimg, #vpnav').remove();
		});
		$('.vpclkd').removeClass('vpclkd');
	}


/* create array with media info */
	function createMediaSet(clkLink, relVars) {
		
		var relStr = (relVars[1]=='x')? relVars[0] : relVars[0]+','+relVars[1];
		vpVars.index = 0;
		
		if (relVars[0]=='image') {
			$('a[rel='+relStr+']').each (function(i) {
				mediaSet[i] = new Array();
				mediaSet[i]['href'] = this.getAttribute('href');						   
				mediaSet[i]['title'] = (this.getAttribute('title')== null) ? this.getAttribute('href') : this.getAttribute('title');
				if (this.getAttribute('class').indexOf('vpclkd')>-1) vpVars.index=i;
			});
		} else {
			mediaSet[0] = new Array();
			mediaSet[0]['href'] = clkLink.attr('href');						   
			mediaSet[0]['title'] = (clkLink.attr('title')== null) ? clkLink.attr('href') : clkLink.attr('title');
		}
	}



/* load, resize, and position photo */
	function setupPhoto() {

		loadSpinner(1);
		
		photohref = mediaSet[vpVars.index]['href'];
		$('#vpimg').remove();

		var vpht = $(window).height();
		var vpwd = $(window).width();
		var vptop = $(window).scrollTop();


		$('body').append('<img id="vpimg">');
		
		var imgTmp = new Image();
		imgTmp.onload = function() {
			var imgaspect = this.width/this.height;
			
			if (this.height > vpht - (vpVars.padVar*2)) {
				var imght = vpht - (vpVars.padVar*2);
				var imgwd = (vpht - (vpVars.padVar*2))*imgaspect;
				var imgleft = ((vpwd-imgwd)/2);
				var imgtop = ((vpht-imght)/2)+vptop;
			} else {
				var imght = this.height;
				var imgwd = this.width;
				var imgleft = ((vpwd-imgwd)/2);			
				var imgtop = ((vpht-imght)/2)+vptop;
			}
			
			loadSpinner(0);

			$('#vpimg').attr('src', photohref).css({'height':imght, 'width': imgwd, 'top': imgtop,
			'left': imgleft }).fadeIn(500);
		};

		imgTmp.src = photohref;
	
	}	

/* load video depending on type */
/* call in specific embed code */

	function setupVideo(type) {
		loadSpinner(1);

		vidhref = mediaSet[vpVars.index]['href'];
		
		switch(type) {
			case 'youtube':
				var embedData = getYouTubeData(vidhref);
				break;
			case 'vimeo':
				var embedData = getVimeoData(vidhref);
				break;		
			case 'longtail':
			case 'jwplayer':
			case 'jwplayer600':
				var embedData = getLongtailData(vidhref, type);
				break;	
			case 'google':
				var embedData = getGoogleData(vidhref);
				break;	
			case 'multivu':
				var embedData = getMultivuData(vidhref);
				break;	
			case 'webcastr':
				var embedData = getWebcastrData(vidhref);
				break;	
			}

		if (embedData == "") return false;

		var vpht = $(window).height();
		var vpwd = $(window).width();
		var vptop = $(window).scrollTop();

		var imgaspect = embedData.imgwd/embedData.imght;
		$('body').append('<div id="vpvid">');

		var imgleft = ((vpwd-embedData.imgwd)/2);			
		var imgtop = ((vpht-embedData.imght)/2)+vptop;

		loadSpinner(0);

		$('#vpvid').html(embedData.imgcode).css({'height':embedData.imght, 'width': embedData.imgwd, 'top': imgtop,
		'left': imgleft }).fadeIn(500);
	}	

/*  navigation panel */
	function addNavPanel() {

		/* create */
		navStr = '<div id="vpnavinner"><a href="#" id="navdn">&nbsp;</a><a href="#" id="navcls">(x)</a><a href="#" id="navup">&nbsp;</a></div><div id="vpname">xx</div>';
		$('body').append('<div id="vpnav">');
		$('#vpnav').html(navStr);
		
		/* position */
		var vpwd = $(window).width();
		var vptop = $(window).scrollTop();

		var elleft = ((vpwd-$('#vpnav').width())/2);			
		var eltop = vptop;			

		$('#vpnav').css({'left': elleft, 'top' : eltop}).fadeIn(500);

			
		updateNavPanel();

	}

	function updateNavPanel() {
		$('#navdn').html('&nbsp;');
		$('#navup').html('&nbsp;');
		$('#vpname').html(mediaSet[vpVars.index]['title']);
		if (mediaSet.length>0) {
			if (vpVars.index>0) $('#navdn').html('&lt;&lt;'); 
			if (mediaSet.length > vpVars.index+1) $('#navup').html('&gt;&gt;');
		}		
	}
	

	function navUp() {
		if (vpVars.index < mediaSet.length-1) {vpVars.index++;} else {return false;};
		setupPhoto();
		updateNavPanel();		
	}


	function navDn() {
		if (vpVars.index>0) {vpVars.index--;} else {return false;}
		setupPhoto();
		updateNavPanel();		
	}


	/*-- set left right and esc keys for nav --*/
	$(document).unbind('keyup').keyup(function(event){
		if (event.keyCode == 27) {
			closeVp();
			return false;
		}
		if (event.keyCode == 37) {
			navDn();
			return false;
		}
		if (event.keyCode == 39) {
			navUp();
			return false;
		}
	});	


	function loadSpinner(flag) {

		switch(flag) {
			case 0:
				$('#vpspinner').hide().remove();
				break;
			case 1:
				$('body').append('<div id="vpspinner">');
				
				var vpht = $(window).height();
				var vpwd = $(window).width();
				var vptop = $(window).scrollTop();
				
				var imgleft = ((vpwd - vpVars.spinner)/2);
				var imgtop = ((vpht - vpVars.spinner)/2)+vptop;
				
				$('#vpspinner').css({'top': imgtop,'left': imgleft, 'opacity':0 }).show().animate({'opacity':1}, 500);


			break;
		}
	}

/* ===================================================================================================== */
/* VIDEO/FLASH EMBED HTML COLLECTION */
/* ===================================================================================================== */

	function getYouTubeData(vidhref) {

			vidhref = vidhref.replace('watch?v=', 'v/');

			var embedData = new Object();
			
			embedData.imgcode = '<object width="480" height="385">'
			+'<param name="movie" value="'
			+vidhref
			+'&hl=en_US&fs=1&rel=0&autoplay=1"></param>'
			+'<param name="allowFullScreen" value="true"></param>'
			+'<param name="allowscriptaccess" value="always"></param>'
			+'<embed src="'
			+vidhref
			+'&hl=en_US&fs=1&rel=0&autoplay=1" '
			+'type="application/x-shockwave-flash" allowscriptaccess="always" '
			+'allowfullscreen="true" width="480" height="385">'
			+'</embed></object>';

			embedData.imght = 385;
			embedData.imgwd = 480;
			return embedData;
	}
		

	function getVimeoData(vidhref) {

			vidhref = vidhref.replace('http://vimeo.com/', '');
			vidhref = vidhref.replace('http://www.vimeo.com/', '');

			var embedData = new Object();
			
			embedData.imgcode = '<object width="400" height="296"><param name="allowfullscreen" value="true" />'
			+'<param name="allowscriptaccess" value="always" />'
			+'<param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id='
			+vidhref
			+'&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1&autoplay=1 " />'
			+'<embed src="http://vimeo.com/moogaloop.swf?clip_id='
			+vidhref
			+'&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1&autoplay=1 " '
			+'type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="400" height="296"></embed>'
			+'</object>';

			embedData.imght = 296;
			embedData.imgwd = 400;
			return embedData;
	}
	
	function getLongtailData(vidhref, type) {
			
			vidhref = vidhref.replace('http://vimeo.com/', '');
			vidhref = vidhref.replace('http://www.vimeo.com/', '');
			
			var embedData = new Object();

			if (type=='jwplayer600') {
				embedData.imght = 450;
				embedData.imgwd = 600;
			} else {
				embedData.imght = 300;
				embedData.imgwd = 400;
			}
			


			
			embedData.imgcode = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="'+embedData.imgwd+'" height="'+embedData.imght+'" id="player1" name="player1">'
		   +'<param name="movie" value="'+vpVars.playerPath+'">'
		   +'<param name="allowfullscreen" value="true">'
		   +'<param name="allowscriptaccess" value="always">'
		   +'<param name="flashvars" value="file='+vpVars.vidPath+vidhref+'&autostart=true">'
		   +'<embed id="player1" '
				  +'name="player1" '
				  +'src="'+vpVars.playerPath+'" '
				 +' width="'+embedData.imgwd+'" '
				  +'height="'+embedData.imght+'" '
				  +'allowscriptaccess="always" '
				  +'allowfullscreen="true" '
				  +'flashvars="file='+vpVars.vidPath+vidhref+'&autostart=true" '
		   +'/>	</object>';
		

			return embedData;
	}

	
	function getGoogleData(vidhref) {
			
			vidhref = vidhref.replace('videoplay', 'googleplayer.swf');

			var embedData = new Object();
			
			embedData.imgcode = '<embed id=VideoPlayback src='+vidhref+'&hl=en&autoplay=1&fs=true style=width:400px;height:326px allowFullScreen=true '
			+'allowScriptAccess=always type=application/x-shockwave-flash> </embed>';
		
			embedData.imght = 326;
			embedData.imgwd = 400;
			return embedData;
	}


	function getMultivuData(vidhref) {

			vidhref = vidhref.replace('http://multivu.prnewswire.com/mnr/', 'playlistpath=');
			var embedData = new Object();						
			
			embedData.imgcode = '<object type="application/x-shockwave-flash" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" '
			+'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" '
			+'id="player-single" width="320" height="320">'
			+'<param name="movie" value="http://multivu.prnewswire.com/mnr/mnr_lib/201002/players/player-single.swf" />'
			+'<param name="allowScriptAcess" value="sameDomain" />'
			+'<param name="quality" value="high" />'
			+'<param name="wmode" value="transparent" />'
			+'<param name="flashvars" value="'+vidhref+'" />'
			+'<embed src="http://multivu.prnewswire.com/mnr/mnr_lib/201002/players/player-single.swf" '
			+'flashvars="'+vidhref+'" quality="high" name="player-single" '
			+'wmode="transparent" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" '
			+'pluginspage="http://www.macromedia.com/go/getflashplayer" width="320" height="320">'
			+'</embed></object>';
			
			embedData.imght = 320;
			embedData.imgwd = 320;
			return embedData;

	}


	function getWebcastrData(vidhref) {

		var embedData = new Object();	

		if (vidhref=='http://www.webcastr.com/videos/news/dana-delaney-single-sexy-and-confident.html') {
			vidhref='guid=03437924-18EB-4671-925F-BB3AA3094714&title=Dana+Delaney%3a+Single%2c+Sexy%2c+and+Confident&videoid=84462&pubId={4}';	
		}

		embedData.imgcode = '<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="480" height="360" id="wcstr">'
		+'<param name="scale" value="noscale"></param>'
		+'<param name="movie" value="http://www.webcastr.com/Flash/WebcastrPlayer_Embed_4x3.swf"/>'
		+'<param name="allowFullScreen" value="true"/>'
		+'<param name="menu" value="false"/>'
		+'<param name="flashvars" value="'+vidhref+'"/>'
		+'<param name="allowscriptaccess" value="always"/> '
		+'<embed src="http://www.webcastr.com/Flash/WebcastrPlayer_Embed_4x3.swf" id="wcstr" '
		+'type="application/x-shockwave-flash" menu="false" allowfullscreen="true" '
		+'width="480" height="360" scale="noscale" '
		+'flashvars="'+vidhref+'" allowscriptaccess="always">'
		+'</embed>'
		+'</object> ';

		
		embedData.imght = 360;
		embedData.imgwd = 480;
		return embedData;

	}







});