var themeUrl = "/wp/wp-content/themes/eko-lab/";

var menu_0;
var menu_1_morph;
var menu_2_morph;
var menu_3_morph;
var lightbox_morph;
var front_page_image_morph;

/*** gallery scrollable***/
var gallery_morph;
var gallery_Pos = 0;
var gallery_centers=new Array();
var gallery_widths=new Array();
var gallery_totalWidth=0;
var gallery_cc=0;
var gallery_Total=0;



var page_state; //0->home, 1->menu_1 visible, 2->menu_2 visible, 3->gallery visible

var position_0 = -250;
var position_1 = 100;
var position_2 = 200;
var position_3 = 485;

var stopClick = function(event){event.stop();onDrag = 0;}
var onDrag = 0;

window.addEvent('domready', function(){
	
	
	$('front_page_image').setStyles({'margin-left':0});

	page_state = 0;
	gallery_Pos = 0;
	gallery_cc=0;

	//front_page_image_morph = new Fx.Morph('front_page_image', {duration: '3000', transition: 'quad:in:out'});

	menu_1_morph = new Fx.Morph('menu_1', {duration: '1000', transition: 'quad:in:out'});
	menu_2_morph = new Fx.Morph('menu_2', {duration: '1000', transition: 'quad:in:out'});
	menu_3_morph = new Fx.Morph('menu_3', {duration: '1000', transition: 'quad:in:out'});
	lightbox_morph = new Fx.Morph('lightbox_container', {duration: '500', transition: 'quad:in:out'});

	addEvents();
	init();
	
	removeLightbox();
	initGallery();
	setGallery();
	
});

function addEvents()
{

/*** menu_0 events ***/
$('menu_0').addEvent('click', function(){
		
		if($('front_page_image'))$('front_page_image').destroy();
		//front_page_image_morph.start({'margin-left': 3000});
		menu_1_morph.start({'left': position_1});
		menu_2_morph.start({'left': position_2});
		menu_3_morph.start({'left': position_3});
		page_state = 2;
});

/*** menu_1 events ***/
$('collections').addEvent('click', function(){
		$('collections_sub').setStyles({'display':'block'});
		$('everyday_sub').setStyles({'display':'none'});
});

$('everyday').addEvent('click', function(){
		$('everyday_sub').setStyles({'display':'block'});
		$('collections_sub').setStyles({'display':'none'});
});

/*** menu_2 events (gallery controlls) - for each item load a new gallery ***/
var gallery_control = $$('.menu_text_redbar a');
gallery_control.each(function(item,index){
	var cat = item.getProperty('href');
	var hash = cat.split("=");
	var loc=hash.length-1;
	var cat_id = hash[loc];
	item.setProperty('title', cat_id);
	
	
	if(item.getProperty('id') != "press")
	{
	item.removeProperty('href');
	item.addEvents({
		'click':function()
		{
		loadGallery(item.getProperty('title'));
		if (page_state <= 2)
		{
			$('menu_3').setStyles({'opacity':0});
			menu_3_morph.start({'left': position_3, 'opacity':1});
		}
		else
		{
			$('menu_3').setStyles({'opacity':0});
			setTimeout(menu_3_morph.start({'opacity':1}), 10);
		}		
		}
	});
	}
});


/*** menu_3 events (gallery) - for each item in gallery load detail overlay onmouseover ***/
var entry_el = $$('div.entry_container');
entry_el.each(function (item,index){
		item.addEvents({
		    'mouseover': function(){
		        item.getElements('div.entry_overlay').setStyle('display','block');
		    },
		    'mouseout': function(){
		        item.getElements('div.entry_overlay').setStyle('display','none');
		    },
		    'click': function(){
		    /* load the single page overlay here */
		    
		    
		    }
		});
	});
	
/*** lightbox events ***/
$('lightbox_background').addEvents({
	'click':function()
	{
		lightbox_morph.start({'opacity': 0});	//fade opacity
		setTimeout( removeLightbox, 500);		//hide div
	}
});
}

function closeLightbox()
{
	lightbox_morph.start({'opacity': 0});	//fade opacity
	setTimeout( removeLightbox, 500);		//hide div
}

function loadSingle(_permalink)
{
	if(!onDrag)
	{
	var reqUrl = _permalink;
	//console.log("permalink = "+ reqUrl);
	var request = new Request({
		url: reqUrl,
		link: 'chain',
		method:'get',
		onRequest: function() {
			$('lightbox_container').setStyles({'display':'block'});
			lightbox_morph.start({'opacity': 1});	//fade opacity up
			var html="<img id='loading' alt='loading...' src='"+themeUrl+"images/loading.gif' />";
			$('lightbox_foreground').set('html',html);
		},
		onSuccess: function(html) {
			$('lightbox_foreground').set('html',html);
		}
	});
	request.send();
	}
}

function removeLightbox()
{
	$('lightbox_container').setStyles({'display':'none'});
}

function centerElement(_id)
{
	var _el = $(_id);
	var logoHeight = _el.getStyle('height').toInt()/2.0;
	var logoWidth = _el.getStyle('width').toInt()/2.0;

	var topPos = (window.innerHeight/2.0 - logoHeight).toInt();
	var leftPos = (window.innerWidth/2.0 - logoWidth).toInt();
	
	_el.setStyles({'top': topPos, 'left': leftPos});
}

function startPosition()
{
	$('menu_1').setStyles({'left': position_0});
	$('menu_2').setStyles({'left': position_0});
/* 	$('menu_3').setStyles({'width':150, 'left':'position_0', 'overflow':'hidden'}); */
}

function init() {
	
	var hash=window.location.href.split("=");
	var loc=hash.length-1;
	
	if(hash.length > 1)
	{
		//console.log(hash[loc]);

		loadGallery(hash[loc]);
		page_state = 2;
		$('menu_1').setStyles({'left': position_1});
		$('menu_2').setStyles({'left': position_2});
	}
	else
	{
		page_state = 0;
		startPosition();
	}
}

function showOverlay(_this)
{
 var el = _this.getElements('div.entry_overlay');
el.setStyles({'display':'block'});
}

function hideOverlay(_this)
{
var el = _this.getElements('div.entry_overlay');

el.setStyles({'display':'none'});
}

function loadGallery(_cat)
{
	
	var reqUrl = "";
	reqUrl="?cat="+_cat;

	var request = new Request({
		url: reqUrl,
		link: 'chain',
		method:'get',
		onRequest: function() {
			var html="<img id='loading' alt='loading...' src='"+themeUrl+"images/loading.gif' />";
			$('gallery_items').set('html',html);
			$('gallery_left').setStyles({'display':'none'});
			$('gallery_right').setStyles({'display':'none'});
		},
		onProgress: function(event, xhr) {
       	//var loaded = event.loaded, total = event.total;
        //console.log("onProgress"+parseInt(loaded / total * 100, 10));
    	},
		onSuccess: function(html) {
			//console.log("gallery loaded");
			
			$('gallery_items').set('html',html);
			setTimeout(setGallery, 6000);
			setTimeout(function(){
				//$('gallery_left').setStyles({'display':'block'});
				$('gallery_right').setStyles({'display':'block'});
				}, 3000);
			setTimeout(timeoutHideMenus,1000);
		}
	});
	request.send('cat='+_cat);
}

function setGallery()
{
	gallery_cc = 0;
	gallery_totalWidth = 0;
	
	gallery_Total = $('gallery_items').childNodes.length;
	//console.log("gallery_Total : " + gallery_Total);
	//console.log("gallery" + $('gallery_items'));

	for (var i=0; i<gallery_Total; i++){
		if($('gallery_items').childNodes[i].nodeType==1){
			//console.log($('gallery_items').childNodes[i]);
			if ($('gallery_items').childNodes[i].offsetWidth < 20) gallery_widths[gallery_cc]=200;	// make it default to 200 if not loaded
			else gallery_widths[gallery_cc]=$('gallery_items').childNodes[i].offsetWidth;	
			gallery_centers[gallery_cc]=gallery_totalWidth;
			gallery_totalWidth+=gallery_widths[gallery_cc]+5;		
			gallery_cc++;			
		}
	}
		//console.log("gallery_cc : " + gallery_cc);
		gallery_Pos = 0;
		//console.log("gallery_Total_width : " + gallery_totalWidth);
		gallery_morph.set({
		    'left':'0px'
		});
}
//$('gallery_right').setStyles({'display':'none'});


function initGallery()
{
	$('gallery_left').setStyles({'display':'none'});
	
	gallery_morph = new Fx.Morph( $('gallery_items') , {
		duration: 500,
		transition: 'quad:in:out'
	});	
		
	$('gallery_right').onclick = function(){
	
		//console.log("gallery_Pos Right : "+gallery_Pos);
		
		$('gallery_left').setStyles({'display':'block'});
		
		gallery_Pos +=1;
		
		gallery_Pos %= gallery_cc;
		
		if(gallery_Pos == 0) $('gallery_left').setStyles({'display':'none'});

		gallery_morph.start({
			'left': -1*gallery_centers[gallery_Pos],
		});
	};

	
	$('gallery_left').onclick = function(){ 
		//console.log("gallery_Pos Left : "+gallery_Pos);
		
		$('gallery_right').setStyles({'display':'block'});
		if(gallery_Pos>0)gallery_Pos--;
		
		if(gallery_Pos == 0) $('gallery_left').setStyles({'display':'none'});
		
		gallery_morph.start({
			'left':-1*gallery_centers[gallery_Pos],
		});
	};
	
		var galleryDrag = new Drag( $('gallery_items'), {
	    onSnap: function(el){
	    // console.log("onSnap");
		 el.addEvent('click', stopClick);
	    },
	    onDrag: function(el) {
	    	onDrag = 1;

	        el.style.top='0px';
	        if(el.getStyle('left').toInt()>0)el.style.left='0px';
	        else if(el.getStyle('left').toInt()<-gallery_totalWidth+1000) el.style.left=-gallery_totalWidth+1000+'px';        
	    },
		onComplete: function(el) {
			
			//console.log("complete");
			setTimeout(function(){el.removeEvent('click', stopClick);}, 50 );
	    }
	});
	
}

function timeoutHideMenus(){
		menu_1_morph.start({'left': position_0});
		menu_2_morph.start({'left': position_0});
		menu_3_morph.start({'left': position_1});
}