var plugin
var main
var vid
var stage_width
var media_loaded
var updateTimeCodesInt
var video_directory="http://mediadl.microsoft.com/mediadl/www/I/ireland/casestudies/"
var videoArr=new Array("NCH","Eircom","IFG","UTV","UCC","BelfastTrust","NissanServer","Hertz","essential","Clarehill","waterford","IPA","donohoe","masonary","mchugh","origo")
var imageArr=new Array("NCH","eircom","IFG","UTV","UCC","BelfastTrust","nissan-virtualisation","Hertz","Ess_Design","Harlequin","Waterford","IPA","donohoe","Masonry","Mchugh","origo")
var image_directory="images/"
var redirect_directory="redirects/"



var tile_img_width=159
var tile_img_height=100
var tile_spacing=200

var tile_top=0
var tile_scale=1
var tile_z=0
var tile_scale_up_to=2

var tileObjsArr=new Array()

//var videoTilePropsArr=new Array()

for(i=0;i<videoArr.length;i++) {

	tileObjsArr[i]=new Object()
	
	tileObjsArr[i].x=i*tile_spacing
	tileObjsArr[i].y=tile_top	
	tileObjsArr[i].z=tile_z
	
	tileObjsArr[i].width=tile_img_width
	tileObjsArr[i].height=tile_img_height
	
	tileObjsArr[i].scale=tile_scale
	tileObjsArr[i].center_x=tile_img_width/2
	tileObjsArr[i].center_y=tile_img_height/2
	
	
	if(i<Math.floor(videoArr.length/2)) {
		if(i==((videoArr.length-1)/2)) {
			tile_z=videoArr.length-1
		}
		else {
			tile_z+=1
		}
		//tile_scale+=0.2

	}
	else {
		tile_z-=1
		//tile_scale-=0.2
	}
	
	
}


tileHolder_width=tileObjsArr[videoArr.length-1].x + tileObjsArr[videoArr.length-1].width
//tileHolder_width=i*tile_spacing


function mainCanvasLoaded(s) {

	//alert("main loaded")
	vid=s.findName("videoElement")	
	main=s.findName("mainCanvas")
	plugin = s.getHost()
	
	//stage_width=plugin.content.actualWidth	
	stage_width=plugin.width	
	
	scrollerConstraints=new Array()
	scrollerConstraints["myScroller1"]=new Object()
	scrollerConstraints["myScroller1"].container="tilesHolder" //name of container in xaml you want to scroll
	scrollerConstraints["myScroller1"].direction="H"
	scrollerConstraints["myScroller1"].world_offset=22 //scrubber distance from main left edge 10+12 (10 from main canvas, 12 from parent canvas) - you can figure this out by script if you'd like
	scrollerConstraints["myScroller1"].local_offset=12 //scrubber distance from parent left
	scrollerConstraints["myScroller1"].track_length=336 //2 less than visual track BG, 2 because trackbar is 2 px longer than scrubbing area (just for aesthetics)
	scrollerConstraints["myScroller1"].start_scroll=22.5
	scrollerConstraints["myScroller1"].mask_length=400 // should be same value as contentHolderClip rect width property in xaml
	scrollerConstraints["myScroller1"].content_length=2950 // 820 is content width, either calculated by script when content is generated or entered by hand in xaml
	scrollerConstraints["myScroller1"].scroll_amount=3  //ex: 1-20
	
	//hide scroll bar if content isnt big enough to scroll
	if(scrollerConstraints["myScroller1"].content_length<=scrollerConstraints["myScroller1"].mask_length) {
		main.findName("myScroller1_Container").visibility="Collapsed"
	}

	scrubberRef=main.findName("myScroller1_Scrubber")
	//comment out next line if you want a fixed width scrubber, this line makes the scrubber size relative to how much content needs to be scrolled, like a "real" scrollbar
	//scrubberRef.width= (scrollerConstraints["myScroller1"].mask_length/scrollerConstraints["myScroller1"].content_length) * scrollerConstraints["myScroller1"].track_length
	
	
	
	vid.addEventListener("downloadProgressChanged", handleDownloadProgressChanged)
	vid.addEventListener("bufferingProgressChanged", handleBufferProgressChanged)
	buildImages()
}






function buildImages() {

	var tileHolder_str = '<Canvas Name="tilesHolder" Canvas.Left="80" Canvas.Top="440">';	
	
	for(i=0;i<videoArr.length;i++) {
	
		//tileObjsArr[i]=new Object()
		
		
		tileHolder_left=tileObjsArr[i].x
		tileHolder_top=tileObjsArr[i].y
		tile_z=tileObjsArr[i].z
		
		tileHolderReflection_top=(tileObjsArr[i].height*2)
		
		tile_img_width=tileObjsArr[i].width
		tile_img_height=tileObjsArr[i].height
		
		scale_x=scale_y=tileObjsArr[i].scale
		center_x=tileObjsArr[i].center_x
		center_y=tileObjsArr[i].center_y
		
		
		tileHolder_str += 		'<Canvas Name="tileHolder_'+i+'" Canvas.Left="'+tileHolder_left+'" Canvas.Top="'+tileHolder_top+'" Canvas.ZIndex="'+tile_z+'">'
		
		tileHolder_str += 		'	<Canvas Name="imgHolderReflection_'+i+'" Canvas.Top="'+tileHolderReflection_top+'">'
		tileHolder_str += 		'		<Canvas.OpacityMask>'
		tileHolder_str += 		'			<LinearGradientBrush  StartPoint="0,0" EndPoint="0,1">'           
		tileHolder_str += 		'	      		<GradientStop Offset="0.37" Color="#00000000"  />'      
		tileHolder_str += 		'	      		<GradientStop Offset="1" Color="#88000000"  />'
		tileHolder_str += 		'	      	</LinearGradientBrush>'          
		tileHolder_str += 		'		</Canvas.OpacityMask>'
		tileHolder_str += 		'		<Canvas.RenderTransform><TransformGroup><ScaleTransform Name="ReflectionScaleTransform_'+i+'" ScaleY="-1" ScaleX="1" CenterX="0" CenterY="0" /></TransformGroup></Canvas.RenderTransform>'
		tileHolder_str +=		'		<Image Name="imgReflection_'+i+'" Stretch="Fill" Width="'+tile_img_width+'" Height="'+tile_img_height+'" Source="'+image_directory+imageArr[i]+'.jpg" />'
		tileHolder_str +=		'	</Canvas>'
		
		tileHolder_str += 		'	<Canvas Name="imgHolder_'+i+'"  >'
		tileHolder_str += 		'		<Image Name="img_'+i+'" Stretch="Fill" Width="'+tile_img_width+'" Height="'+tile_img_height+'" MouseEnter="tileEnter" MouseLeave="tileLeave" MouseLeftButtonDown="tilePress" Source="'+image_directory+imageArr[i]+'.jpg" />'
		tileHolder_str +=		'	</Canvas>'
		tileHolder_str +=		'	 <Canvas.RenderTransform><ScaleTransform Name="st_'+i+'" ScaleX="'+scale_x+'" ScaleY="'+scale_y+'" CenterX="'+center_x+'" CenterY="'+center_y+'"/></Canvas.RenderTransform>'	
		tileHolder_str +=		'</Canvas>'	
	
	
		
		//tileObjsArr[i].scale_x=scale_x
		//tileObjsArr[i].scale_y=scale_y
		tileObjsArr[i].parent="tileHolder_"+i
		tileObjsArr[i].scaleTransform="st_"+i
		
	
	}

	tileHolder_str += '</Canvas>';	           
	//alert(tileHolder_str)
	tileHolderTag=plugin.content.createFromXaml(tileHolder_str)
	main.children.add(tileHolderTag)

}


function tilePress(s,e) {
//media_loaded=false
	resetPlayHead(s,e)
	vid=s.findName("videoElement")
	s.findName("videoHolder").opacity=1
	var index=s.name.split("_")[1]
	
	vid.source=video_directory+videoArr[index]+".wmv"
	vid.autoPlay=true
	
	
	
	//alert ("paul2")
    // defaults for iframe, display div
    ifrmId = "buffer"; 
	divId = "display"; 
    if ( window.frames[ifrmId] ) {
        // Could use location.replace method if you do not want back button to load previous iframe url 
        //window.frames[ifrmId].location.replace(url);
        window.frames[ifrmId].location = redirect_directory+imageArr[index]+".html";
        var lyr = document.getElementById? document.getElementById(divId): null;
        if ( lyr && bLoadMsg ) { // Option to display message while retrieving data 
            lyr.innerHTML = '<p>Retrieving data. Please wait ...</p>';
            lyr.style.display = 'block'; 
        }
        return false;
    } 
    return true; // other browsers follow link
}


function tileEnter(s,e) {

	time_to_scale_tile=1.0
	
	var ind=s.name.split("_")[1]
	var me=tileObjsArr[ind]
	
	var par=s.findName(me.parent)
	var st=s.findName(me.scaleTransform)

	for(i=0;i<videoArr.length;i++) {
		//s.findName("tileHolder_"+i)["Canvas.ZIndex"]=0
	}
	
	par["Canvas.ZIndex"]=50
	
	if(me.tweenS2) {
		me.tweenS2.stop()
		me.tweenY2.stop()
	}
	
	me.tweenS = new Tween(new Object(),'s',Tween.strongEaseOut,st.scaleX,tile_scale_up_to,time_to_scale_tile)
	
	me.tweenS.onMotionChanged = function(event){	
		st.scaleX = event.target._pos
		st.scaleY = event.target._pos
	}
	
	me.tweenS.start()		
	


	me.tweenY = new Tween(new Object(),'y',Tween.strongEaseOut,par["Canvas.Top"],40,time_to_scale_tile)
	
	me.tweenY.onMotionChanged = function(event){	
		par["Canvas.Top"] = event.target._pos
	}
	
	me.tweenY.start()	



}


function handleDownloadProgressChanged(s, e) {
	//window.status="handle dpc called"
	updateDownloadProgress(s,e)
}

function updateDownloadProgress(s,e) {

	bgBar=s.findName("ToBeLoadedPath")
	progressBar=s.findName("LoadedPath")
	//window.status=s.downloadProgress
	progressBar.width = bgBar.width * s.downloadProgress
}

function handleBufferProgressChanged (s,e) {

	s.findName("bufferMsgText").Text="Buffering Video: "+Math.floor(s.bufferingProgress*100)+"%"
	
	if(s.bufferingProgress >0 && s.bufferingProgress <1) {
		s.findName("bufferMsg").opacity=0.8
	}
	else {
		s.findName("bufferMsg").opacity=0
	}

}

function mediaLoaded(s){ 

	//alert("mediaLoaded")	
	media_loaded=true
	vid=s.findName("videoElement")
	main=s.findName("mainCanvas")
	
	updateTimeCodesInt=setInterval("updateTimeCodes()", 40)
}


function mediaEnd(s){ 
	s.stop()
	s.findName("playPauseText").Text="play"
	s.findName("playPauseText")["Canvas.Left"]=12
}

function resetPlayHead(s,e) {

	s.findName("playPauseText").Text="pause"
	s.findName("playPauseText")["Canvas.Left"]=6
	s.findName("Playhead")["Canvas.Left"]=0
	
	s.findName("TimeText").Text=""
	s.findName("TimeText2").Text=""
}


function updateTimeCodes() { 

	if(media_loaded) {
		var currentPosition = 0;
	
	
		var position = vid.position;
	
		//window.status=position

		if (position != null) {
			currentPosition = position.seconds;
		}
	
	
		vidTime1=main.findName("TimeText")
		vidTime2=main.findName("TimeText2")
		
		vidTime1.Text = formatTime(currentPosition * 1000);
		vidTime2.Text = formatTime2(currentPosition );
		
		this.updatePlayhead(currentPosition);
	}
}

function updatePlayhead(time) {
	var offset = 0;
	
	var naturalDuration = vid.naturalDuration;
	
	if (naturalDuration != null) {
		var mediaDuration = naturalDuration.seconds;
		
		var percent = time / mediaDuration;
		
		var playhead_width = main.findName("Playhead").width;
		var playarea_width = main.findName("ToBeLoadedPath").width - playhead_width;
		
		offset = playarea_width * percent;
	}

	//main.findName("Playhead")["Canvas.left"] = offset;	
}




function playPauseBtnPress(sender, args) {

    if(sender.findName("playPauseText").Text=="pause") {
    	sender.findName("videoElement").pause();
    	sender.findName("playPauseText")["Canvas.Left"]=12
    	sender.findName("playPauseText").Text="play"	
    }
    else {
    	sender.findName("videoElement").play();
    	sender.findName("playPauseText")["Canvas.Left"]=6
    	sender.findName("playPauseText").Text="pause"
    }   
}

function formatTime(time) {
	var timeString = "";
	timeString += Math.floor(time / 60000);
	if (timeString.length == 1) {
		timeString = "0" + timeString;
	}
	timeString += ":";
	var seconds = Math.floor(time / 1000.0) % 60;
	if (seconds < 10) {
		timeString += "0";
	}
	timeString += seconds;
	
	return timeString;
}


function formatTime2(time) {
	
	
	time_num=Math.ceil(vid.naturalDuration.seconds)
	
	elapsedM = Math.floor(time_num/60);
	remaining = time_num-(elapsedM*60);

	elapsedS = Math.floor(remaining);
	remaining = time_num-(elapsedS);

	if (elapsedM<10) {
		minutes = "0"+elapsedM.toString();
	} 
	else {
		minutes = elapsedM.toString();
	}
	if (elapsedS<10) {
		seconds = "0"+elapsedS.toString();
	} 
	else {
		seconds = elapsedS.toString();
	}
	
	return minutes+":"+seconds;
}
function tileLeave(s,e) {


	time_to_scale_tile=0.5
	
	var ind=s.name.split("_")[1]
	var me=tileObjsArr[ind]
	
	var par=s.findName(me.parent)
	var st=s.findName(me.scaleTransform)

	for(i=0;i<videoArr.length;i++) {
		//s.findName("tileHolder_"+i)["Canvas.ZIndex"]=0
	}
	
	par["Canvas.ZIndex"]=49
	
	me.tweenS.stop()
	me.tweenY.stop()
	
	me.tweenS2 = new Tween(new Object(),'s',Tween.strongEaseOut,st.scaleX,me.scale,time_to_scale_tile)
	
	me.tweenS2.onMotionChanged = function(event){	
		st.scaleX = event.target._pos
		st.scaleY = event.target._pos
	}
	
	me.tweenS2.onMotionFinished = function(event){	
		par["Canvas.ZIndex"]=me.z
	}	
	
	me.tweenS2.start()	
	
	
	me.tweenY2 = new Tween(new Object(),'y',Tween.strongEaseOut,par["Canvas.Top"],0,time_to_scale_tile)
	
	me.tweenY2.onMotionChanged = function(event){	
		par["Canvas.Top"] = event.target._pos
	}
	
	me.tweenY2.start()	
		
}