/**
 * Example link : <span rel="../resources/OldGreenwood/swf/video_gallery.swf" class="launchOverlay" type="swf" name="swfTest" alt="grayscrossing~1~Click and drag to navigate.">media gallery</span>
 * rel		-> path to media
 * class	-> 'launchOverlay' to initiate action
 * type		-> swf or mov, depending on video type
 * name 	-> used to build overlay class
 * alt		-> for media gallery, split with '~' first is site name, second is video to load, 0 for first vid in xml, third is additional text to sit in overlay border
 * 
 * build overlay class to be 50px larger than video to be displayed
 *  
 * required files * may be updated with new media gallery
 * add'l files: resources/site/xml/videos.xml
 * add'l files: resources/site/videoFiles/vids here
 * add'l files: resources/site/videoThumbs/thumbs here
 * 
 */ 
function createOverlay(){ 
	var triggers = $(document.body).getElements('.launchOverlay');
	if(triggers){
		triggers.each(triggerOverlayEvent);
	}
}
window.addEvent('domready', function() {
	createOverlay();
});

function triggerOverlayEvent(el,index,group){
	el.addEvent('click',launchOverlay.bindWithEvent(el));
}


function launchOverlay(event){
	if(typeof event !="undefined") new Event(event).stop();
	var movieType = this.get('type');
	var moviePath = this.get('rel');
	var containerClass = this.get('name');
	var components = this.get('alt');
	showOverlay(movieType, moviePath, containerClass, components);
}


function showOverlay(movieType, moviePath, containerClass, components){
	var docBody 		= $(document.body);	
	var dimmer			= create_Dimmer();
	var addlComponents 	= components.split('~')
	if(addlComponents.length == 3){
		var addlTitleText = addlComponents[2];
		var addlTitle = new Element('span', {
				'id':'addlTitle',
				'html':addlTitleText
			});
	}
	//dimmer.inject(docBody,'bottom').setStyle('opacity',.75);
	dimmer.inject(docBody,'bottom');
	
	/* CREATE AND INJECT OVERALL CONTAINER */
	var overlayContent = create_OverlayContent(containerClass);
	overlayContent.inject(docBody,'bottom');
	/* if additional (instructional) text passed, place it at top of container */
	if(addlTitle){
		addlTitle.inject(overlayContent, 'top');
	}
	/* GET HEIGHT TO TWEEN BACK UP TO */
	//var newHeight = overlayContent.getScrollSize().y;
	var newHeight = overlayContent.getCoordinates().height;
	
	/* CREATE AND INJECT MOVIE CONTAINER */
	var overlayMovieContent = create_MovieContent(containerClass);
	overlayMovieContent.setStyles({
	    height:(overlayContent.getCoordinates().height)-50,
	    width: (overlayContent.getCoordinates().width)-50
	});
	
	/* ADJUST FOR SYSTEMS */
	var browser = getSystem();
    if(browser == "mac_safari" || browser == 'mac_ff'){
    	scrollDown();
    	overlayContent.setStyles({
    		'opacity':1
		});
    }else{
		overlayContent.setStyle('opacity',.8);
    }
	overlayContent.setStyle('height',0);
	overlayContent.setStyle('overflow','hidden');
	
	// center
	centerElement(overlayContent);
	var elTop = overlayContent.getCoordinates().top;
	
	var tweenContainer = new Fx.Morph(overlayContent, {duration: 250, transition: Fx.Transitions.linear, 
		onComplete: function(){
			//overlayMovieContent.inject(overlayContent,'top');
			overlayContent.adopt(overlayMovieContent);
			if(getSystem() == 'mac_ff'){
				overlayMovieContent.setStyle('opacity',1);
			}else{
				overlayMovieContent.setStyle('opacity',0);
			}

			/* CREATE VIDEO, INJECT AND TWEEN IN */
			var movieContent = create_Video(movieType, moviePath, overlayMovieContent, components);
			var video = new Element('div',{'id':'video'});
			/* CREATE VIDEO, INJECT AND NO TWEEN FOR MAC FF */
			/*if(getSystem() == 'mac_ff' && movieType == 'swf'){
				overlayMovieContent.setStyle('opacity',1);
				//movieContent.write(overlayMovieContent);
				movieContent.write(video);
				video.inject(overlayMovieContent);
			}else{*/
//				movieContent.inject(video,'top');
//				video.inject(overlayMovieContent,'top');
				movieContent.inject(overlayMovieContent,'top');
				var tweenMovie = new Fx.Morph(overlayMovieContent, {duration: 250, transition: Fx.Transitions.linear}) 
				tweenMovie.start({
				    'opacity': 1
				});
			/*}*/
			/* create and inject close button */
			var closeBtn = new Element('span', {
				'id':'closeBtn',
				'class':'close',
				'html':'&nbsp;',
			    'events': {
			    	'click':removeOverlay.bindWithEvent([overlayContent,dimmer])
			    }
			});
			closeBtn.inject($('overlayContentContainer'),'top');
		}
	});
	tweenContainer.start({
	    'height': [0,newHeight],
	    'opacity': 1,
	    'top': elTop-(newHeight/2)
	});
	
	
	// TODO - WE will need to show and hide select boxes in IE6 and also the mapContainer for the yahooMap API in all browsers. //
	
	/* *** CLOSE OVERLAY ******************************************************************************* */
	dimmer.addEvent('click',removeOverlay.bindWithEvent([overlayContent,dimmer]));
	 
	window.addEvent('resize',function(){
		centerElement(overlayContent);
	});
}
/* *** GET BROWSER ************************************************************************************* */
function getSystem(){ //BROWSER CHECK TO GET AROUND SAFARI AND FF MAC BUGS
	var os;
	var browser;
	if(Browser.Platform.mac) {
		os = 'mac'
	}else if(Browser.Platform.win) {
		os = 'pc'
	}	
	if(Browser.Engine.webkit){
		browser = 'safari';
	}else if(Browser.Engine.trident){
		browser = 'ie';
	}else if(Browser.Engine.gecko){
		browser = 'ff';
	}else {
		os = 'pc';
		browser = 'ie';
	}
	return os+'_'+browser;
}
/* *** CREATE NEW MOVIE ******************************************************************************** */
function create_Video(movieType, moviePath, overlayMovieContent, components){
	if(components){
		var extras = components.split('~');
		var site   = extras[0];
		(extras[1]) ? filter = extras[1] : filter=0;
	}else{
		site = 'grayscrossing';
		filter = 0;
	}
	/* *** Subract 6px to make up for css double border on #overlayMovieContainer *** */
	var mHeight = ($('overlayMovieContainer').getCoordinates().height)-6;
	var mWidth  = ($('overlayMovieContainer').getCoordinates().width)-6;
	
	 /* set up new video types here based on OS, Browser and Video Type */
	var browser = getSystem();
	
	/* hack to get around problems with mootool's swiff object in mac firefox, using swfobject to create movie. */
	/*if(browser == 'mac_ff' && movieType == 'swf'){
		var movieContent = new SWFObject(moviePath, "newOverlayMovie", +mWidth, mHeight, 9);
		//movieContent.addParam('wmode', 'opaque'); 
		movieContent.addVariable('siteBase', site);
		movieContent.addVariable('firstVideo', filter);
	} else */if(movieType == 'swf'){
		var movieContent = new Swiff(moviePath, {
		    id: 'newOverlayMovie',
		    height: mHeight,
		    width:  mWidth,
		    vars: {
		        'siteBase': site,
		        'firstVideo': filter
		    },
		    params: {
		        wmode: 'opaque'
		    }
		});
	} else if(movieType == 'mov'){
			var movieContent = new Element('div'); 
			/*if(browser == "mac_safari" || browser == "pc_safari"){
		    	movieContent.innerHTML = '<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="'+mWidth+'" height="'+mHeight+'" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab"> <param name="src" value="'+moviePath+'"> <param name="autoplay" value="true"> <param name="controller" value="false"> <embed src="'+path+'" width="'+mWidth+'" height="'+mHeight+'" autoplay="true" controller="false" pluginspage="http://www.apple.com/quicktime/download/"> </embed> </object>';
		    	movieContent.addParam("wmode", "transparent ");
			}else{*/
			    value = '<object CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="'+mWidth+'" height="'+mHeight+'" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">';
			    value += '<param name="src" value="'+moviePath+'">';
			    value += '<param name="autoplay" value="true">';
			    value += '<param name="controller" value="false">';
			    value += '<embed src="'+moviePath+'" width="'+mWidth+'" height="'+mHeight+'" autoplay="true" controller="true" pluginspage="http://www.apple.com/quicktime/"></embed>';
			    value += '</object>';
			    movieContent.innerHTML = value; 
			/*}*/
	} else if(movieType == 'customJavaApp'){
		var movieContent = new Element('div'); 
		if(!navigator.javaEnabled()){
			value = '<div style="margin:50px; color:#666;">Enable your Java to experience this webcam or install it from here: <a href="http://java.com/" target="_blank">Install Java</a></div>';
		}else{
		    value = '<applet codebase="http://24.32.24.41/program/"'; 
			value += ' code="javaviewer.Viewer.class"';
			value += ' archive="SonyNetworkCameraViewer.jar"';
			value += ' name="viewer"';
			/* additional parameters conrol the frame, background & date text color, respectively */
			value += ' ParamColorPictFrame="ffffff"';
			value += ' ParamColorCtrlBack="ffffff"';
			value += ' ParamColorDateFore="666666"';
			value += ' width="'+mWidth+'" height="'+mHeight+'">';
			value += ' </applet>';
		}	
	    movieContent.innerHTML = value; 
	}
	return movieContent;
}
function activateJavaAppletAuto() {
    document.write("<applet codebase=\"/program/\"");
    document.write(" code=\"javaviewer.Viewer.class\"");
    document.write(" archive=\"SonyNetworkCameraViewer.jar\"");
    document.write(" name=\"viewer\"");
    document.write(" width=\"840\" height=\"680\">");
}
/* *** CREATE OVERLAY CONTAINER & MOVIE CONTAINER ****************************************************** */
function create_OverlayContent(containerClass){
	var overlayContentContainer = new Element('div',{id:'overlayContentContainer','class':containerClass});
	return overlayContentContainer;
}

function create_MovieContent(containerClass){
	var overlayMovieContainer = new Element('div',{id:'overlayMovieContainer'});
	return overlayMovieContainer;
	
}
/* *** CENTER ELEMENT *********************************************************************************** */
function centerElement(el){
	el = $(el);
	if(el){
		var elDemensions = el.getCoordinates();
		var windowDemensions = window.getCoordinates();
		var topDiff = (windowDemensions.height - elDemensions.height)/2;
		var leftDiff = (windowDemensions.width - elDemensions.width)/2;
		
		if(topDiff < 0) topDiff = 0;
		if(leftDiff < 0) leftDiff = 0;
		if(getSystem() == 'mac_ff'){
			setTop = 530;
		}else {
			setTop = topDiff+window.getScroll().y;
		}
		el.setStyles({
			//top: setTop,
			top: topDiff+window.getScroll().y,
			left: leftDiff
		});
	}
}
/* *** DIMMER ******************************************************************************************* */
function create_Dimmer(){
	if(getSystem() == 'mac_ff'){
		marqueeState('hidden');
	}
	if(getSystem() == 'mac_ff' ){
		opacityType = 'opacity_image';
	}else {
		opacityType = 'opacity_filter';
	}
	var windowSize = window.getScrollSize();
	var dimmer = new Element('div',{
		'id':'dimmer',
		'class':opacityType
	});
	dimmer.setStyles({
		width: windowSize.x,	
		height: windowSize.y
		//opacity: .5
	});
	window.addEvent('resize',function(){
		windowSize = window.getScrollSize();
		dimmer.setStyles({
			width: windowSize.x,	
			height: windowSize.y
			//opacity: .5
		});
	});
	return dimmer;
}
/* *** REMOVE OVERLAY ****************************************************** */
function removeOverlay(event){
	if(getSystem() == 'mac_ff'){
		marqueeState('visible');
	} 
	var browser = getSystem();
    if(browser == "mac_safari" || browser == 'mac_ff'){
		scrollTop()
    }
	new Event(event).stop();
	this.each(function(el){
		// problem removing quicktime in ie6, sound continues to play //
		el.setStyle('display','none');
		el.dispose();
	});	
}
/* *** SET MARQUEE STATE****************************************************** */
function marqueeState(state){ //SHOW-OR-HIDE MARQUEE WHEN IN MAC_FF
$('main_flash').setStyle('visibility',state);
}

/* *** SCROLL CONTENT TO AVOID FLASH OVER FLASH IN MAC *********************** */
function scrollDown(){ //SOLVES THE SAFARI LAYERING ISSUE WITH FLASH
	window.scrollTo(0,440);
	changeScrollBars('hidden');
}
function scrollTop(){ //RESET BROWSER TO TOP ON CLOSE IN SAFARI & FF ON MAC
	window.scrollTo(0,0);
	changeScrollBars('auto');
}
/* *** DEAL WITH SCROLL BARS ************************************************* */
function changeScrollBars(visibility){
    var browser = getSystem();
        var html = document.getElementsByTagName('html');
        html = html[0];
        html = $(document.body).getFirst();
        html.style.overflow= visibility;
}

/* *** WEBCAM APPLET ********************************************************* */
function activateActiveXAuto ( codec )
{
  document.write('<object id="SonyMultiViewer" classid="CLSID:6E49B4EF-9FE5-44DF-8D04-445AA94F83DB" codebase="/program/SonyNetworkCameraViewer.cab' + '#version=' + version + '">');
  
  if( codec == "mpeg4")
  {
    document.write('<param name="ParamCodec" value="PRM_CODEC_MPEG">');
  }
  else if( codec == "jpeg")
  {
    ;
  }
  
  document.write('</object>');
}

function activateJavaAppletAuto () {
	var player;
	var target = document.getElementById('leftcol_two_to_three');
	player = '<applet codebase="http://24.32.24.228:6000"'; 
	player += ' code="javaviewer.Viewer.class"';
	player += ' archive="SonyNetworkCameraViewer.jar"';
	player += ' name="viewer"';
	player += ' width="820" height="680">';
	player += ' </applet>';
	//player.inject(target);
	target.set('html', player);
}