// JavaScript Document//

var criteriaSlider;
var infoSlider;

//*General loader
// 	div to update
//	address to load
function loadContent(div,address,type)
{
	if($('main') !=null && div == 'main_zone'){
		//dans ce cas de figure on sait qu'on veut charger un élément dans la zone main déjà ouverte.
	}
	//dans le cas ou les criterias sont ouverts, on les ferme
	if(criteriaSlider != undefined && criteriaSlider['open'] == true){
		//criteriaSlider.hide();
	}
	
	
	var options = {
			url: address, 	
			method : 'get', 
			update: $(div),
			evalScripts: true,					
			onRequest: function() {	
				if(type == 'grey'){ var icon = 'loadinfo_grey.gif';}else{var icon = 'loadinfo.gif'}
				$(div).innerHTML='<img src="gfx/'+icon+'" width="16px" height="16px" border="0" alt="loading" style="width:16px;height:16px;margin:5px;">';
				
			},									
			onSuccess: function() {	
				$(div).fade('hide').fade('in');	
				/*
				if($('overview')!= null){
					$('overview_zone').setStyles({
						position:"relative",
						width:"990px",
						top:"0px"
					});
				}
				*/
				
				//we must hide criterias when content is loaded
				if(criteriaSlider!=null){
					criteriaSlider.hide();
				}
				
				//REPOSITIONNEMENT LORSQU'ON CHARGE UN NOUVEAU PROJET
				
				if($('main')!=null && div == 'main_zone')
				{
					
					var status = {
						'true': 'open',
						'false': 'close'
					};
					if(navigator.appName == 'Microsoft Internet Explorer'){
						window.setTimeout("IE_timout()",500);
					}
					var pos_top = (parseInt($('main_zone').offsetHeight)+30) + "px";//"697px";
					//alert(pos_top);
					if(status[infoSlider.open] == 'open'){
						pos_top = (parseInt($('main_zone').offsetHeight)+30) + "px";
						//alert(pos_top);
						}
					$('overview_zone').setStyles({
						position:"absolute",
						width:$('overview_zone').offsetWidth+"px",
						top:pos_top
					});
				}
				
			}
		};									
	var monObjetAjax= new Request.HTML(options);
	monObjetAjax.send();
}


function IE_timout(){
	var pos_top = (parseInt($('main_zone').offsetHeight)+37) + "px";//"697px";
		//alert(pos_top);
		if(status[infoSlider.open] == 'open'){
			pos_top = (parseInt($('main_zone').offsetHeight)+37) + "px";
			//alert(pos_top);
			}
		$('overview_zone').setStyles({
			position:"absolute",
			width:$('overview_zone').offsetWidth+"px",
			top:pos_top
		});
	}

//*Criteria loader
// 	div to update
//	address to load
function refreshContent(div,address,type)
{
	//alert("charged "+address);
	var options = {
			url: address, 	
			method : 'get', 
			update: $(div),
			evalScripts: true,					
			onRequest: function() {	
				if(type == 'grey'){ var icon = 'loadinfo_grey.gif';}else{var icon = 'loadinfo.gif'}
				$(div).innerHTML='<img src="gfx/'+icon+'" width="16px" height="16px" border="0" alt="loading" style="width:16px;height:16px;margin:5px;">';
			},									
			onSuccess: function() {	
				$(div).fade('hide').fade('in');	
			}
		};									
	var monObjetAjax= new Request.HTML(options);
	monObjetAjax.send();
}


//*Switch view
//	div to fadeout
//	div to update
//	address to load

function switchContent(div_to_fade,div,address)
{
	//make sure that we don't have any projects infos open
	if($('infos')!= null){
		//closeit('infos');
	}
	
	if($(div_to_fade) != null){
		
		if($('overview')!= null){
			//alert("ok");
			closeit('overview');
			
		}
		
		var effect = new Fx.Tween(div_to_fade,  { 
						property: 'opacity',
						duration: 500, 
						transition:  Fx.Transitions.linear, 
						onStart: function(){ 
						}, 
						onComplete: function(){ 
							//pour remettre le
							//!! mais ça n'enlève pas le CSS, du coup il y a un espace
							$(div_to_fade).innerHTML ='';
							var el = this;
							el['element'].id=null;
							
						
							var options = {
									url: address, 
									method : 'get', 
									update: $(div),
									evalScripts: true,					
									onRequest: function() {	
										$(div).innerHTML='<img src="gfx/loadinfo.gif" width="16px" height="16px" border="0" alt="loading" style="width:16px;height:16px;margin:5px;">';
									},									
									onSuccess: function() {
										
										$(div).fade('hide').fade('in');
										
											//on efface la session du project_id
											var NewOptions = {
												url: 'php/session.php?session=p_id&value=close', 
												method : 'get', 
												evalScripts: true
											};		
											new Request.HTML(NewOptions).send();
										}
								};									
							var monObjetAjax= new Request.HTML(options);
							monObjetAjax.send();
							
						} 
					}); 
		effect.start(0);
	}else{
		loadContent(div,address,'black');
		}
}

	
//*load each project thumbnail
//	array with all images address

function loadprojects(elements)
{
	var im = new Array();
	for(var i in elements){
		if(elements[i].src != undefined){
			im.push(elements[i].src);
		}
	}
	
	var loader = new Asset.images(im,{
				  onProgress: function(counter,index){
						$('tempo_loading').innerHTML='<img src="gfx/loadinfo_grey.gif" width="16px" height="16px" border="0" alt="loading" style="width:16px;height:16px;margin:5px;">';
					  },
				  onComplete: function(){
					  //scrollTo(0,document.body.clientHeight);
						$('tempo_loading').innerHTML='';
						el = $$('#allProjects span');
						var myChain = new Chain();
						el.each(function(item, index){ 
							myChain.chain(function(){item.fade(0); });	
						});
						var runChain = function(){
							myChain.callChain();
							if (myChain.giveChains() == 0) { runChain = $clear(timer); } 
						}
						var timer = runChain.periodical(50); // original = 200
					}
				  });
}


//* toggle the criterias panel
//	div to update
var bigSlider;
function toggleCriterias(div)
{
	
	if($('main')!=null && (criteriaSlider ==null ||criteriaSlider['open'] == false)){
		//alert("main view is open");
		$('overview_zone').setStyles({
			position:"relative",
			top:"auto"
		});
		scrollTo(0,0);
		bigSlider = new Fx.Slide('main').toggle().chain(function(){
			 $('main_zone').innerHTML='';
			 bigSlider.show();
			// erase the project_session
			//store session for remember
			var options = {
				url: 'php/session.php?session=p_id&value=close', 
				method : 'get', 
				evalScripts: true
			};		
			var monObjetAjax= new Request.HTML(options).send();
		});
	}
	criteriaSlider = new Fx.Slide(div).toggle();
	if(navigator.appName == 'Microsoft Internet Explorer'){
		window.setTimeout("IE_pos()",200);
	}
}

function IE_pos(){
	$('allProjects').setStyles({
			position:"relative",
			top:"0px"
		});
	}

//* toggle the infos panel
//	div to update
function toggleInfo(div)
{
	
	$('overview_zone').setStyles({
		position:"relative",
		width:$('overview_zone').offsetWidth+"px",
		top:"0px"
	});
	
	infoSlider = new Fx.Slide(div).toggle();
	infoSlider.addEvent('complete', function() {
		var status = {
			'true': 'open',
			'false': 'close'
		};
		//store session for remember
		var options = {
			url: 'php/session.php?session=infobox&value='+status[infoSlider.open], 
			method : 'get', 
			evalScripts: true
		};		
		var monObjetAjax= new Request.HTML(options).send();
	});
}


//*close the div
//	div to be closed

function closeit(div){
	//$(div).fade('out');
	var effect = new Fx.Tween(div,  { 
					property: 'opacity',
					duration: 200, 
					transition:  Fx.Transitions.linear, 
					onStart: function(){ 
					}, 
					onComplete: function(){ 
						//si c'est le calque overview, on annule le style de son parent
						if(div =='overview'){
							$('overview_zone').setStyles({
								position:"relative",
								width:$('overview_zone').offsetWidth+"px",
								top:"0px"
							});
						}
						//on fait bien attention "d'annuler" la box, comme ça on ne recharche pas la box infos
						var mySlide = new Fx.Slide(div,{duration:200, onComplete:function(){ var el = this;el['element'].id = null;}}).slideOut();
					}
				 });
	effect.start(0);
	
}






//VIDEO TAG REPLACEMENT
 
function html5_video_replace(video, index) {
	
	 
    /* get info about the video */
    var video_id = video.getAttribute("id");
    var video_width = video.getAttribute("width");
    var video_height = video.getAttribute("height");
    var video_autoplay = video.getAttribute("autoplay") != null;
	var video_loop = video.getAttribute("loop") != null;
    var video_autobuffer = video.getAttribute("autobuffer") != null;
    var video_controls = (video.getAttribute("controls") != null) ? {autoHide:"always",hideDelay:1000} : null;
	var video_title = video.getAttribute("title");
 
 	$('viewer').removeChild(video);
 
    /* create a dummy div for Flowplayer to use */
    $('viewer').innerHTML = "<div id=video" + index + "fallback style=" +
                      "width:" + video_width + "px;" + 
                      "height:" + video_height + "px></div>";
    //$("video" + index + "fallback").innerHTML = '<object width="'+video_width +'" height="'+video_height+'"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id='+video_title+'&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id='+video_title+'&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="'+video_width+'" height="'+video_height+'"></embed></object>';
	var v_autoplay = 0;
	var v_loop = 0;
	if(video_autoplay == true){v_autoplay=1;}
	if(video_loop == true){v_loop=1;}
	
	//!!! new iPad Check
	
	var agent=navigator.userAgent.toLowerCase();
	//var is_iphone = (agent.indexOf('iphone')!='-1');
	var is_ipad = (agent.indexOf('ipad')!='-1');
	/*if (is_iphone) {
	$('video' + index + 'fallback').innerHTML ='<video src="http://www.vimeo.com/play_redirect?clip_id=' + video_title + '&quality=mobile" controls="controls" width="'+ video_width + '" height="' + video_height + '"></video>';
	}else*/
	if (is_ipad) {
		$('video' + index + 'fallback').innerHTML = '<video src="http://www.vimeo.com/play_redirect?clip_id=' + video_title + '&quality=hd" controls="controls" width="'+ video_width + '" height="' + video_height + '"></video>';
	}else{
	
	var so = new SWFObject("http://vimeo.com/moogaloop.swf?clip_id="+video_title+"&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1&amp;loop="+v_loop+"&amp;autoplay="+v_autoplay, "movie"+index, video_width, video_height, "8", "#FFFFFF");
	so.addParam("quality", "high");
	so.addParam("align", "middle");
	so.addParam("wmode", "transparent");
	so.addParam("allowfullscreen", "true");
	so.write("video" + index + "fallback");
	
	}
	
}

function html5_video_init() {
	
	/*
	
		OGG browser compatibility
		
		Mozilla Firefox 3.5 and later versions
		Google Chrome as of version 3.0.182.2 
		SeaMonkey as of version 2.0
		Opera experimental video build
		Future versions of Konqueror
	
	*/
	
	var nAgt = navigator.userAgent;
	//alert(nAgt);
	var browserName;
	if ((verOffset=nAgt.indexOf("Opera"))!=-1) {
	 browserName = "Opera";
	 fullVersion = nAgt.substring(verOffset+6);
	}
	// In Chrome, the true version is after "Chrome" 
	else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) {
	 browserName = "Chrome";
	 fullVersion = nAgt.substring(verOffset+7);
	}
	// In Safari, the true version is after "Safari" 
	else if ((verOffset=nAgt.indexOf("Safari"))!=-1) {
	 browserName = "Safari";
	 fullVersion = nAgt.substring(verOffset+7);
	}
	// In Firefox, the true version is after "Firefox" 
	else if ((verOffset=nAgt.indexOf("Firefox"))!=-1) {
	 browserName = "Firefox";
	 fullVersion = nAgt.substring(verOffset+8);
	}
	// In SeaMonkey, the true version is after "Firefox" 
	else if ((verOffset=nAgt.indexOf("SeaMonkey"))!=-1) {
	 browserName = "SeaMonkey";
	}
	
	var videos = document.getElementsByTagName("video");
	var sources = videos[0].getElementsByTagName("source");
	var playvimeo = false;
	for (var i = 0; i < sources.length; i++) {
		var source = sources[i];
		var type = source.getAttribute("type");
		type = type.toLowerCase();
		type = type.split(";", 1)[0];
		if (type == "video/mp4" && (browserName == "Safari" || browserName == "Chrome")) {
			playvimeo = false;
			break;
		}else if(type == "video/ogg" && (browserName == "Firefox" || browserName == "Chrome" || browserName == "Opera"  || browserName == "SeaMonkey")){
			playvimeo = false;
			break;
			}else{
				playvimeo = true;
				}
	}
	
	// check if we have to replace the video by VIMEO
	
  if (!!!document.createElement('video').canPlayType || playvimeo == true || sources.length == 0) {
	
	// no HTML5 video support; let's try Flash 
    var videos = document.getElementsByTagName("video");

    for (var i = 0; i < videos.length; i++) {
      var video = videos[i];
      if (!!video.getAttribute("id")) {
        video.id = "video" + i;
      }
      html5_video_replace(video, i);
    }
  }
	
}