/***************************
*  Class
***************************/

function PhotoInfos()
{
	this.id;
	this.headline;
	this.description;
	this.filename;
	this.url;
	this.islandscape;
	this.datepost;
	this.nextURL;
	this.previousURL;
	this.nbComments;
	this.isReady = false;
}

/***************************
*  Global var
***************************/

var isControlsInTransition = false;
var isControlsShown = false;
var isCommentsShown = false;
var isBrowsePanelShown = false;
var controlsTimer;
var imgTimer;

var controlsList;

var previousPhoto = new PhotoInfos();
var nextPhoto = new PhotoInfos();

var baseUrl = "http://www.firewakz.net";
var photoBaseURL = "/images/";
var jsonBaseURL  = "/getphotoinfos.php?url="
var browseTemplate = "/templates/firewakz/browse_ajax_template.php";
var thumbList = "/templates/firewakz/get_thumb_list.php?";
//var commentsList = "/templates/firewakz/get_comments.php?imgid=";

var myVerticalSlide
;
/***************************
*  Browse functions
***************************/

function toggleBrowsePanel()
{
	var myBrowseFx = new Fx.Tween($('overlay_cadre'), {duration: 1200, transition: Fx.Transitions.Cubic.easeOut, });
	if( isBrowsePanelShown )
	{
		
		$$('li.menuli')[1].removeClass('menu_on');
		myBrowseFx.start('height', 810, 0);
	}
	else
	{
		$$('li.menuli')[1].addClass('menu_on');
		myBrowseFx.start('height', 0, 810);
	}
	isBrowsePanelShown = ! isBrowsePanelShown;
}

function setBrowseUI()
{
	pic1= new Image(); 
	pic1.src="http://www.firewakz.net/images/tmph.png"; 
	
	$('overlay_cadre').set('load', {onComplete: function(e){ setupBrowsePanelLink(); }});
	$('overlay_cadre').load(browseTemplate);
	//var myHTMLRequest = new Request.HTML().get(browseTemplate);
	
	$('browselink').addEvent('click', function(e){
		e.stop();
		toggleBrowsePanel()
	});
}

function deselectCategory()
{
	//cat_selected
	var linkList = $$('#categories a');
	linkList.each(function(link){
			if(link.hasClass('cat_selected'))
			{
				link.removeClass('cat_selected');

			}
	});
}

function setupBrowsePanelLink()
{
	//myVerticalSlide = new Fx.Slide('cadre_browse_img');
	addTitleEffect();
	var linkList = $$('#categories a');
	linkList.each(function(link){
			link.addEvent('click', function(e){
				e = new Event(e).stop();
				//myVerticalSlide.slideOut();
				var href = this.href;
				href = href.replace(baseUrl + "/index.php?x=browse&", "");
				$('cadre_browse_img').set('load', {onComplete: function(e){ addTitleEffect(); }});
				$('cadre_browse_img').load(thumbList + href);
				deselectCategory();
				this.addClass('cat_selected');

			});
	});
}
/***************************
*  Images functions
***************************/


function addTitleEffect()
{
	var imgList = $$('img.thumbnails');
	var linkList = $$('div.thumb_container a');
	var pageList = $$('#pagination a');
	imgList.each(function(img){
		img.addEvent('mouseover', function(e) {
			
			e = new Event(e).stop();
			
			
			var title = new Element('div');
			var tileStr = this.getProperty('alt');
			var titleId = 'titleImg_'+Math.floor(Math.random()*1000);
			this.setProperty('title', "");
			title.setProperty('id', titleId);
			
			if(tileStr.length > 0){
				tileStr = tileStr.substr(0,15)+'...';
			}
			var newHeight = Math.floor(this.getStyle('height').toInt()*1.1);
			//title.setHTML(tileStr);
			title.innerHTML = tileStr;
			if(this.getStyle('width') == '129px'){
				title.setStyle('marginTop', '20px');
				title.setStyle('marginLeft', '5px');
			}else{
				title.setStyle('marginTop', '2px');
				title.setStyle('marginLeft', '26px');
			}
			title.setStyle('backgroundColor','#222222');
			title.setStyle('opacity', '0');
			title.setStyle('width', this.getStyle('width'));
			title.setStyle('height', '20px');
			title.setStyle('color', '#FFF');
			title.setStyle('display', 'block');
			//title.effect('opacity', {duration: 1000, transition: Fx.Transitions.Cubic.easeOut}).start('0.6');
			
			new Fx.Tween(title, {duration: 1000, transition: Fx.Transitions.Cubic.easeOut}).start('opacity', 0, 0.6);
			
			title.inject(this.getParent(), 'before');
			var arg = 'fireTitle(\''+titleId+'\')';
			imgTimer = setTimeout(arg, 1000);
			var  imgSrc= this.src;
			//var myregexp = new RegExp("/http:\\\\(\w{3,8}).firewakz.net\\thumbnails\\thumb_/", "gi").
			imgSrc = imgSrc.replace(baseUrl + "/thumbnails/thumb_", "");
			preLoad('/images/'+imgSrc);
		});
	});
	
	linkList.each(function(link){
			link.addEvent('click', function(e){
					new Event(e).stop();
					toggleBrowsePanel();
					getPhotoInfos(this.href);
				}
			);
			
	});
	
	pageList.each(function(link){
			link.addEvent('click', function(e){
				e = new Event(e).stop();
				var href = this.href;
				href = href.replace(baseUrl + "/index.php?x=browse&", "");
				$('cadre_browse_img').set('load', {onComplete: function(e){ addTitleEffect(); }});
				$('cadre_browse_img').load(thumbList + href);
				//myVerticalSlide.slideOut();
			});
	});
	
	//myVerticalSlide.slideIn();
}


function fireTitle(id){
	if($(id)){
		new Fx.Tween($(id), {duration: 1200, transition: Fx.Transitions.Cubic.easeOut, 
			onComplete: function(e){
				$(id).dispose();
			}
		}).start('opacity', 0.6, 0);
	}
	
}

function preLoad(src){
	//debugger;
	var image1 = new Image();
	image1.src = src;
}

function populatePhotInfo(photo, infos)
{
	infos.each(function(info) {
		photo.id           = info.id;
		photo.headline     = unescape(info.headline);
		photo.description  = unescape(info.description);
		photo.filename     = info.src;
		photo.url          = info.url;
		photo.islandscape  = info.islandscape;
		photo.datepost     = info.date;
		photo.nextURL      = info.nextUrl;
		photo.previousURL  = info.previousUrl;
		photo.nbComments   = info.nbComments;
		photo.isReady = true;
	});
}

function fullSwitchPhoto(photo)
{
	if( photo.isReady)
	{
						
		$$('h1.title-notes')[0].innerHTML = photo.headline;
		if( $$('#image-next a').length != 0 && photo.nextURL.length == 0)
		{
			$$('#image-next a')[0].dispose();
		}
		
		if( $$('#image-next a').length == 0 && photo.nextURL.length > 0)
		{
			createImgLink($('image-next'));
			addNextEvent();
		}
		
		
		if( $$('#image-previous a').length != 0 && photo.previousURL.length == 0)
		{
			$$('#image-previous a')[0].dispose();
		}
		
		
		if( $$('#image-previous a').length > 0 )
		{
			$$('#image-previous a')[0].href = "/photos/" + photo.previousURL;
		}
		
		if( $$('#image-next a').length > 0 ) 
		{
			$$('#image-next a')[0].href = "/photos/" + photo.nextURL;
		}
		
		switchPhoto(photo);
	}
}
function switchPhoto(photo)
{
	var myPhoto = clone(photo);
	if( isCommentsShown )
	{
		commentsSlider.toggle();
		isCommentsShown = false;
	}
	hidecontrols();
	
	new Fx.Tween($('photo'), {duration: 1200, transition: Fx.Transitions.Cubic.easeOut, 
		onComplete: function(e){
			/*var arg = 'fadeInPhoto(\''+filename+'\')';
			setTimeout(arg, 500);*/
			$('photo').src = '/images/tmph.png';
			
			fadeInPhoto(myPhoto);
		}
	}).start('opacity', 1, 0);
}

function fadeInPhoto( myPhoto )
{
	
	if( myPhoto.islandscape == 1 || myPhoto.islandscape == 2)
	{
		$('cadre_img').setStyle('height', '533px');
		$('cadre_img').setStyle('width', '918px');
		//
		
		$('mask').setStyle('height', '533px');
		$('mask').setStyle('width', '800px');
		
		$('image-previous').setStyle('padding-top', '266px');
		$('image-next').setStyle('padding-top', '266px');
		
		
	}
	else
	{
		$('cadre_img').setStyle('height', '800px');
		$('cadre_img').setStyle('width', '651px');
		
		$('mask').setStyle('width', '533px');
		$('mask').setStyle('height', '800px');
		
		$('image-previous').setStyle('padding-top', '400px');
		$('image-next').setStyle('padding-top', '400px');
		
	}
	//debugger;
	if( myPhoto.islandscape == 2 )
	{
		$('photo').setStyle('margin-top', "100px");
	}
	else
	{
		$('photo').setStyle('margin-top', "0px");
	}
	$('photo').src = "/images/" + myPhoto.filename;
	$$('h1.title-notes')[0].innerHTML = myPhoto.headline;
	$('image-notes').innerHTML = myPhoto.description;
	//$$('#commentsBtn h2')[0].innerHTML = "Commentaires("+myPhoto.nbComments+")";
	
	new Fx.Tween($('photo'), {duration: 600, transition: Fx.Transitions.Cubic.easeOut, 
		onComplete: function(e){
			getOtherPhotosInfos();
			//feedComments(myPhoto.id);
		}		
	}).start('opacity', 0, 1);
		
	
}

/***************************
*  UI/Controls functions
***************************/

function hidecontrols()
{
	if( ! isCommentsShown )
	{
		isControlsInTransition = true;
		controlsList.each(function(ctl){
			/*ctl.effect('opacity', {duration: 1000, transition: Fx.Transitions.Cubic.easeOut, 
			onComplete: function(e){
				isControlsInTransition = false;
			}
		
		
			}).start('0');*/
			
			ctl.fade(0);
		});
		isControlsInTransition = false;
		
		
		clearTimeout(controlsTimer);
		isControlsShown = false;
	}
	else
	{
		clearTimeout(controlsTimer);
		controlsTimer = setTimeout(hidecontrols, 10000);
	}
}

function initControlsUI()
{
	//$('menu'),
	controlsList = [
			$('image-info'),
			$('image-next'),
			$('image-previous')
		   	];
		   	
	controlsList.each(function(ctl){
			ctl.setStyle('opacity', '0');
	});
	
	
	$(document.body).addEvent('mousemove', function(e) {
		if( ! isControlsShown && ! isControlsInTransition)
		{
			controlsList.each(function(ctl){
					//ctl.effect('opacity', {duration: 1000, transition: Fx.Transitions.Cubic.easeOut}).start('1');
					ctl.fade(1);
			});
			
			isControlsShown = true;
		}
		else
		{
			clearTimeout(controlsTimer);
			
		}
		controlsTimer = setTimeout(hidecontrols, 10000);
			
	});
		
}

/***************************
*  Comments functions
***************************/

function initCommentsForm()
{
	/*if($('commentsContainer')){
					
		commentsSlider = new Fx.Slide('commentsContainer', {duration: 500});
		addCommentsShowHideEvent($('commentsBtn'));
		commentsSlider.hide();
		//console.debug('Height Comments: '+commentsDivLenght);
	}
	new SmoothScroll();
	addEventContactForm();*/
}

function addCommentsShowHideEvent(obj){
	//obj.setProperty('href', 'javascript:void(0)');
	/*obj.addEvent('click', function(e) {
		e = new Event(e).stop();
		commentsSlider.toggle();
		isCommentsShown = ! isCommentsShown;
	});*/
	

}

function addEventContactForm(){
	if($('frmContact')){
		 
		 $('frmContact').setProperty("action", "post_contact.php");
		$('frmContact').addEvent('submit', function(e) {
			/**
			 * Prevent the submit event
			 */
			new Event(e).stop();
		 
			/**
			 * This empties the log and shows the spinning indicator
			 */
			var log = document.createElement('div');
			log.addClass('ajaxLoading');
			log.inject($('frmContact'),'before');
			//var log = $('msgOnsending').empty().addClass('ajaxLoading');
			var img = document.createElement('img');
			img.id = "imgLoading";
			img.src="/images/loading.gif";
			img.inject(log);
			
			/**
			 * send takes care of encoding and returns the Ajax instance.
			 * onComplete removes the spinner from the log.
			 */
			this.send({
				update: $('msgContactSent'),
				onComplete: function() {
					//log.removeClass('ajaxLoading');
					
					$('imgLoading').remove();
					log.remove();
				}
			});
		});
	}
}


/***************************
*  Naviguation functions
***************************/

function getPhotoInfos(url)
{
	jurl = jsonBaseURL + url;
	var request = new Request.JSON({ url: jurl, 
		onComplete: function(jsonObj) {
			var myPhoto =  new PhotoInfos();
			populatePhotInfo(myPhoto, jsonObj.image);
			fullSwitchPhoto(myPhoto)
		}
	}).send();
}

function feedComments(photoid)
{
	//$('comments').load(commentsList + photoid);
}

function getOtherPhotosInfos()
{
	//alert($$('image-previous a'));
	if( $$('#image-previous a').length > 0 )
	{
		
		previousPhoto.isReady = false;
		jurl = jsonBaseURL + $$('#image-previous a')[0].getProperty('href');
		var request = new Request.JSON({ url: jurl, 
			onComplete: function(jsonObj) {
				
				populatePhotInfo(previousPhoto, jsonObj.image);
				$('previouscache').src = photoBaseURL + previousPhoto.filename;
			}
		}).send();
	}
	
	//preLoad(photoBaseURL + previousPhoto.filename);
	
	
	//alert($$('image-next a'));
	if( $$('#image-next a').length > 0 )
	{
		nextPhoto.isReady = false;
		jurl = jsonBaseURL + $$('#image-next a')[0].getProperty('href');
		var request = new Request.JSON({url: jurl, 
			onComplete: function(jsonObj) {
				populatePhotInfo(nextPhoto, jsonObj.image);
				$('nextcache').src = photoBaseURL + nextPhoto.filename;
			}
		}).send();
	}
	
	//preLoad(photoBaseURL + nextPhoto.filename);
	//$('comments').set('load', {onComplete: function(e){ setupBrowsePanelLink(); }});
	
}

function addPreviousEvent()
{
	if( $$('#image-previous a').length > 0 )
	{
		$$('#image-previous a')[0].addEvent('click', function(e) {
				
				e = new Event(e).stop();
				
				fullSwitchPhoto(previousPhoto)
				
			});
	}
	
}

function addNextEvent()
{
	if( $$('#image-next a').length > 0 )
	{
		$$('#image-next a')[0].addEvent('click', function(e) {
				
				e = new Event(e).stop();
				
				fullSwitchPhoto(nextPhoto)
				
		});
	}
}

function addNavEvent()
{
	addPreviousEvent();
	addNextEvent();
}

function createImgLink(objToAddIn)
{
	var link = new Element('a');
	link.inject(objToAddIn);
}

function clone(srcInstance)
{
	if(typeof(srcInstance) != 'object' || srcInstance == null)
	{
	return srcInstance;
	}
	
	var newInstance = new PhotoInfos();

	for(var i in srcInstance)
	{
	newInstance[i] = clone(srcInstance[i]);
	}
	
	newInstance.id           = srcInstance.id;
	newInstance.headline     = srcInstance.headline;
	newInstance.description  = srcInstance.description;
	newInstance.filename     = srcInstance.filename;
	newInstance.url          = srcInstance.url;
	newInstance.islandscape  = srcInstance.islandscape;
	newInstance.datepost     = srcInstance.datepost;
	newInstance.nextURL      = srcInstance.nextURL;
	newInstance.previousURL  = srcInstance.previousURL;
	newInstance.isReady      = srcInstance.isReady;
	
	return newInstance;
}