// cufon fonts
Cufon.replace('h2, h3, h4, h5, h6');

var nr_items;
var items_index;
var sc_item_margin_x;
var sc_item_width;
var sc_items_total_width;
var sc_item_width_inc_margin;
var zoomed = false;
var allow_zoom = false;
var lights_off = false;
var is_blog = false;
var is_contact = false;
var skip_align = false;

var swf_timeout;
var swf_div_id;
var swf_img;

var is_scrolling = false;
var is_zooming = false;

var share_title = '';

$(document).ready(function() {
	init_site();
});

function loaded()
{
	$('#preloader').remove();
	init_site();
}

function init_site()
{
	init_showcase();
	init_pagers();
	
	$('ul#subslist').css('visibility','visible');
	
	$('#share a').click(click_share);

	// show logo
	var flashvars = {};
	var params = {wmode:"transparent"};
	var attributes = {};
	
	swfobject.embedSWF("/img/logo.swf", 'cliclogo', "860", "140", "9.0.0", "expressInstall.swf", flashvars, params, attributes);		

	// keep track of hash changes
	$(window).hashchange( function(){ hash_changed(); })
	
	// scroll to hash
	if (is_valid_hash())
		scroll_to_current_hash();
	else
		scroll_to(0);	
  	
	init_dock();

	if(is_blog)
		show_all_swfs();
	
	if (is_contact)
	{
		var d = new Date();
		var h = d.getHours();
		if (h<8 || h>=18)
			toggle_contact_light();
	}

	// init video
  	$("video").VideoJS();

}

$(document).keydown(function(e){
	switch (e.keyCode)
	{
		case 37:
			if (!is_zooming) scroll_items(-1);
			break; 
		case 38:
			if (!is_scrolling) toggle_zoom(); // up
			return false;
			break; 
		case 39:
			if (!is_zooming) scroll_items(1);
			break; 
		case 40:
			if (!is_scrolling) toggle_zoom(); // down
			return false;
			break; 
	}	
});

$(window).smartresize(function(){  
	align_showcase();
	align_lightbox();
});

function is_valid_hash()
{
	if (!document.location.hash || document.location.hash == '#') return false;
	return $('ul#itemlist_images li#pr_'+document.location.hash.substr(1)).length;
}

function scroll_to_current_hash()
{
	// find project
	var pr = $('ul#itemlist_images li#pr_'+document.location.hash.substr(1));
	
	if (pr.length)
	{
		if (pr.index() != items_index)
		scroll_to(pr.index());
		$(window).scrollTop(0);
		return true;
	}
	return false;
}

function hash_changed()
{
	if (is_valid_hash())
		scroll_to_current_hash();
}

function set_hash(hash)
{
	hash = hash.replace("%20", "_");
	document.location.hash = hash.toLowerCase();
}

function remove_swf()
{
	if (swf_div_id)
	{
		swfobject.removeSWF(swf_div_id);	
		swf_img.show();		
	}
		
	swf_div_id = false;
	swf_img = false;
}

function show_swf()
{
	var li = $('ul#itemlist_images li:eq('+items_index+')');
	show_swf_in_li(li);
}

function show_swf_in_li(li)
{
	// get image
	var img = li.find('img.zoom_'+(zoomed?'on':'off'));
	
	// get swf url
	var swf_url = img.attr('rel');
	
	if(swf_url)
	{	
		// get swf div id
		swf_div_id = li.attr('id')+'_swf';
		
		// create div for swf
		img.after(function() {
  return '<div id="'+swf_div_id+'"></div>';
});
		
		// store swf img
		swf_img = img;
		
		// show swf
		var flashvars = {};
		var params = {wmode:"transparent"};
		var attributes = {};
		
		// in blog? then swf width = img width
		var w = is_blog ? img.width() : "900";
		
		swfobject.embedSWF("/files/"+swf_url, swf_div_id, w, (zoomed?"609":"313"), "9.0.0", "expressInstall.swf", flashvars, params, attributes);		

		// hide img
		
		if(swfobject.hasFlashPlayerVersion("1"))
{
		swf_img.hide();
}

	}
}

function show_all_swfs()
{	
	var li = $('ul#itemlist_images li').each(function(index) {
		show_swf_in_li($(this));
  	});
}

function start_swf_timeout()
{
	swf_timeout = setTimeout('show_swf()', 500);
}

function clear_swf_timout()
{
	clearTimeout(swf_timeout);
	if (!is_blog) remove_swf();
}
	
function init_dock()
{
	// fill to fit window
	var nr = $('.dock-item').length;
	var itemwidth = 30;
	var amount = Math.ceil($(window).width() / (nr * itemwidth));
	
	var html = $('.dock-container').html();
	
	for(c=1; c<amount; c++)
		$('.dock-container').append(html);
		
	$('#dock').Fisheye({
		maxWidth: 44,
		items: 'a',
		itemsText: 'span',
		container: '.dock-container',
		itemWidth: itemwidth,
		proximity: 40,
		halign : 'center'
	});
	
	$('a.dock-item img').hover(function(){		
		$(this).parent().find('.off').hide();
		$(this).parent().find('.on').show();		
	},function(){		
		$(this).parent().find('.on').hide();
		$(this).parent().find('.off').show();	
	});
	
	$('a.dock-item img.on').hide();
}

function click_share(e)
{
	if ($('#share #s2').hasClass('open'))
	{
		var pos = $('#share #s2').offset();
		
		// get click location
		var x = e.pageX - pos.left;
		var y = e.pageY - pos.top;

		if (x>74 && x<135)
		{
			// twitter share
			var u = location.href;
			window.open('http://twitter.com/home?status='+encodeURIComponent(u),'twitter');		
		}
		else if (x>0 && x<=74)
		{
			// facebook share
			var u = location.href;
			var t = document.title + ' ' + share_title;
			var r = Math.floor(Math.random()*101);
			window.open('http://www.facebook.com/sharer.php?s=100&u='+encodeURIComponent(u)+'&v='+encodeURIComponent(r),'sharer','toolbar=0,status=0,width=626,height=436');		
		}
		else
		{
			// close
			$('#share #s2').animate({width:24},500,function(){ $(this).removeClass('open'); });			
		}
	}
	else
	{
		// open
		$('#share #s2').animate({width:156}).addClass('open');
	}
	
	return false;
}

function toggle_zoom()
{
	// if (is_scrolling) return;
	
	clear_swf_timout();

	pause_videos();
		
	if (!zoomed && !allow_zoom) return;
	
	if (zoomed)
	{
		$('#showcase').animate({height:313});
		$('#showcase #mask').animate({height:313}); 

		$('#itemlist_images').animate({top:0});

		// btns
		var btn_top = 278;
		$('#nr').animate({top:btn_top});
		$('#showcase a.lamp').animate({top:btn_top});
		$('#showcase a.zoom').animate({top:btn_top});
		$('#showcase a.link').animate({top:btn_top});
		$('#showcase a.prev').animate({top:126},700);
		$('#showcase a.next').animate({top:126},700, function()
		{ 
			start_swf_timeout(); 

			// body
			$('body').css('backgroundPosition','0px 1200px');
			
			is_zooming = false;
		});
	}
	else
	{
		$('#showcase').animate({height:609});
		$('#showcase #mask').animate({height:609}); 

		$('#itemlist_images').animate({top:-319});

		// btns
		var btn_top = 579;
		$('#nr').animate({top:btn_top});
		$('#showcase a.lamp').animate({top:btn_top},600);
		$('#showcase a.zoom').animate({top:btn_top},700);
		$('#showcase a.link').animate({top:btn_top},800);	
		$('#showcase a.prev').animate({top:270},700);
		$('#showcase a.next').animate({top:270},700, function()
		{
			start_swf_timeout();
			is_zooming = false;
		});			

		// body
		$('body').css('backgroundPosition','0px 1500px');
	}
	
	skip_align = true;
	
	zoomed = !zoomed;
	
	is_zooming = true;
}

function toggle_light()
{
	if (lights_off)
	{
		$.post("ajax/sessiondestroy.php");
		$('#lightbox').fadeOut();	
		$('#lightbox2').fadeOut();	
		$('#itemlist_content').css({ 'z-index': 1, 'color': '#8F8F8F', 'position': 'relative'  });
		$('.block').css({ 'z-index': 9999, 'color': '#8F8F8F', 'position': 'relative' });
		$('#references ul li a').css({ 'color': '#8F8F8F' });
		$('#subslist span').css({ 'color': '#8F8F8F' });
		$('.wrapper').css({ 'z-index': '9999', 'position':'relative', 'color':'#8f8f8f' });
		$('#footer a').css({ 'color':'#8f8f8f'});
		$('ul.pager li a').removeAttr("style")
		$('ul.pager li a.on').removeAttr("style")


	}
	else
	{		
			$.post("ajax/setsession.php");
			$('#lightbox').css({ opacity: 0.9, width: '100%', height: $(document).height()+'px' }).fadeIn();
			$('#lightbox2').css({ opacity: 0.9 }).fadeIn();
			$('#itemlist_content').css({ 'z-index': 9999, 'color': '#FFF', 'position': 'relative' });
			$('.block').css({ 'z-index': 9999, 'color': '#FFF', 'position': 'relative' });
			$('#references ul li a').css({ 'color': '#FFF' });
			$('#subslist span').css({ 'color': '#FFF' });
			$('#share').css({ 'z-index': '9999', 'position':'relative' });
			$('.wrapper').css({ 'z-index': '9999', 'position':'relative', 'color':'#FFF' });
			$('#slider .wrapper').css({ 'z-index': '1', 'position':'relative' });
			$('#footer a').css({ 'color':'#fff'});
			$('ul.pager li a').css({'background':' url(img/balletjes.png) no-repeat -11px 0' })
			$('ul.pager li a.on').css({'background':' url(img/balletjes.png) no-repeat 0 0'})
	}
	
	lights_off = !lights_off;
}

function toggle_contact_light()
{
	if (lights_off)
	{
		$('#showcase').css('backgroundPosition','center bottom');		
	}
	else
	{
		$('#showcase').css('backgroundPosition','center top');
	}
	
	lights_off = !lights_off;
}

function align_lightbox()
{
	$('#lightbox').css({ height: $(document).height()+'px' });
}

function align_showcase()
{
	if (skip_align)
	{
		skip_align = false;
		return;
	}
	
	nr_items = $('ul#itemlist_images li').length;
	if (!nr_items) return;

	items_index = 0;
	
	sc_item_width = 910;
	sc_item_margin_x = Math.round(($(window).width() - sc_item_width) / 4);
	sc_item_width_inc_margin = sc_item_width + 2*sc_item_margin_x;
	sc_items_total_width = sc_item_width_inc_margin * (nr_items-1);

	$('#showcase ul#itemlist_images li').css('margin','0 '+sc_item_margin_x+'px');
	$('#showcase ul#itemlist_images').css('left', sc_item_margin_x + 'px');

	if (is_blog)
	{
		//sc_item_margin_x = 0;
		sc_item_margin_x = Math.round(($(window).width() - 910) / 2);
		sc_items_total_width = total_blog_width - 900 ;
		sc_item_width_inc_margin = sc_items_total_width / (nr_items-1);
		$('#showcase ul#itemlist_images li').css({margin:'0', width:'auto'});
		$('#showcase ul#itemlist_images li img').css({margin:'0', height:'313'});
	}
}

function init_showcase()
{
	align_showcase();

	$('#slider #btn').draggable({ 
		axis: "x",
		containment: 'parent',
		start: function() {
			if (!is_blog)
			{
				clear_swf_timout();
				remove_swf();
			}				
		},
		drag: function() {
			var perc = ($(this).position().left*100)/840;
			var l = -perc*(sc_items_total_width/100) + sc_item_margin_x;
			$('#showcase ul#itemlist_images').css('left',l);
		},
		stop: function() {
			// snap to closest
			items_index = Math.round(- ($('#showcase ul#itemlist_images').position().left - sc_item_margin_x) / sc_item_width_inc_margin);
			scroll_to(items_index);	
		}
	});
	
	$('#slider #bar').click(function(e){
	    var relativeX = e.pageX - $(this).offset().left - 36;
		var perc = (relativeX*100)/840;
		if (perc<0) perc = 0;
		if (perc>100) perc = 100;
		var l = -perc*(sc_items_total_width/100) + sc_item_margin_x;
		items_index = Math.round(- (l - sc_item_margin_x) / sc_item_width_inc_margin);
		scroll_to(items_index);		    
	})

	// scroll left/right
	$('#showcase a.prev').click(function(){ if (is_zooming) return false; scroll_items(-1); return false; });
	$('#showcase a.next').click(function(){ if (is_zooming) return false; scroll_items(1); return false; });
	
	// click item
	if (is_blog)
	{
		// show content
		$('#showcase ul#itemlist_images li img').click(function(){ 
			show_item_content($(this).parent().index());
		});
	}
	else
	{
		// click to zoom
		$('#showcase ul#itemlist_images li img').click(function(){ toggle_zoom(); });	
	}
		
	$('ul#itemlist_content li').hide();
	$('ul#itemlist_content li:eq('+items_index+')').show();
	
}

function debug(msg)
{
	$('#debug').html(msg);
}

function scroll_items(dir)
{
	items_index += dir;
	if (items_index<0) items_index = nr_items - 1;
	if (items_index>=nr_items) items_index = 0;

	scroll_to(items_index);
	
	
}

function scroll_to(i)
{	
	if (is_zooming) return;
	is_scrolling = true;
	
	items_index = i;
	
	clear_swf_timout();
	
	// scroll to image
	if (is_blog)
	{
		var l = -blog_widths[items_index] + sc_item_margin_x;
	} else {
		var l = -items_index * sc_item_width_inc_margin + sc_item_margin_x;
	}
			var title = $('ul#itemlist_content li:eq('+items_index+') h2').attr('title');
		$('#test').attr('content', title);

	
	$('#showcase ul#itemlist_images').stop().animate({left: l}, 500, function(){
		
		if (!is_blog)
			start_swf_timeout();

		is_scrolling = false;

	});

	// scroll slider
	var one_item_perc = 100/(nr_items-1);
	var perc_to_scroll_to = items_index * one_item_perc;
	var l = Math.round((perc_to_scroll_to*840)/100);
	
	$('#slider #btn').stop().animate({left: l}, 300);

	show_item_content(items_index);
	
	if (!is_blog)
	{	
		// update nr
		$('span#items_index').html(items_index+1);
		
		// update link btn
		var link = $('ul#itemlist_images li:eq('+items_index+')').attr('rel');
		if (link)
		{
			$('a.link').show();
			$('a.link').attr('href',link);
		}
		else
		{
			$('a.link').hide();
		}


		// update zoom btn
		var zoom = $('ul#itemlist_images li:eq('+items_index+') .zoom_on');
		if (zoom.length)
		{
			$('a.zoom').css('left','856px');
			allow_zoom = true;
		}
		else
		{
			$('a.zoom').css('left','-3000px');
			allow_zoom = false;
			if (zoomed) toggle_zoom();
		}
		
	}

	// update hash
	var hash = $('ul#itemlist_images li:eq('+items_index+')').attr('id').substr(3);
	if (hash)
		set_hash(hash);
	else
		set_hash('');
	
	pause_videos();
}
function pause_videos()
{
	// pause videos
	for(c=0; c<$("video").length; c++)
		if ($("video")[c].player)
			$("video")[c].player.pause();
}

function show_item_content(i)
{
	// show text
	$('ul#itemlist_content li').hide();
	$('ul#itemlist_content li:eq('+i+')').show();
	
	// store title for share links
	share_title = $('ul#itemlist_content li:eq('+i+') h2').html();
}

function init_pagers()
{
	// init subs pagers
	$('ul#pager_subslist.pager').each(function(){
	
		// get related list id
		var id_list = $(this).attr('id').substr(6);
		
		// get related list
		var ul = $('ul#'+id_list);
		
		if (ul.length)
		{
			// init pager buttons
			$(this).find('a').click(function(){
	
				// class 'on'
				$(this).parent().parent().find('.on').removeClass('on');
				$(this).addClass('on');
				
				var index = $(this).html() - 1;

				ul.find('li').hide();
				ul.find('li:eq('+index+')').show();
			
				return false;
			});
			
			$(this).find('a:last').click();
		}
	});
	
	// init bg pager
	$('ul#pager_bgs.pager a').click(function(){

		// class 'on'
		$('ul#pager_bgs.pager a').removeClass('on');
		$(this).addClass('on');
		
		// get image
		var img = $(this).attr('rel');
			
		for(c=1; c<10; c++) $('body').removeClass('color'+c);
		$('body').addClass(img);
		
		Cufon.refresh();
		
		// store chosen color in session
		$.get('/?a=store-color&color='+img, function(data) {});
		
		return false;
	});
		
	// click first color (body class_
	$('a[rel="'+$('body').attr('class')+'"]').click();
	
}