$(function() {

	t.init();
	t.resize();	

	$(window).bind('resize', function() {
		t.resize();
	});

	var hash = false;

  setInterval(function() {

		if(window.location.hash == hash) return true;
		hash = window.location.hash;
				
		var rel = hash.replace('#', '');  		
		
		if(rel == '') return t.close();
		var a = t.images.find('a[rel=' + rel + ']');
		t.load(a);
  		
  }, 50);

	$(document).keydown(function(event) {
			
		switch(event.keyCode) {
			case 37: // left arrow
				t.skip(true);
				break;
			case 39: // right arrow
				t.skip(false);
				break;
			case 27: // esc
				t.close();
				break;
		}
			
	});

	$('#controls a').click(function() {
			
		switch($(this).attr('href')) {
			case '#prev':
				t.skip(true);
				break;
			case '#play-pause':
				if($(this).hasClass('play')) {
					t.diashow.start();
				} else {
					t.diashow.stop();
				}
				break;
			case '#next':
				t.skip();
				break;
			case '#close':
				t.close();
				break;			
		}
		
		return false;
	
	});

	$('#grid').find('img').each(function(i, img) {
		t.preload( $(img).attr('src'), function() {

			var w = $(img).width();
			var h = $(img).height();

			$(img).css({
				'position' : 'absolute',
				'margin-left' : -(w/2),
				'margin-top' : -(h/2)
			}).animate({'opacity' : 1}, 200);
		});						
	});

	t.images.find('a').click(function() {
		window.location.hash = '#' + $(this).attr('rel');
		return false;
	});

	$('#projectlabel a').click(function() {
		t.close();
		return false;
	});
			
});


var t = {

	fades : 200,
	showtime : 7000,
	images : [],
	active : [],
	loop : false,
	running : false,

	init : function() {
		if($.browser.msie) t.fades = 0;
		this.images = $('#grid.gallery li').not('.placeholder');
		this.diashow.start();
	},

	load : function(a) {
	
		var a  = $(a);

		if(t.active.length > 0) t.active.removeClass('active');
		t.active = a.parent().addClass('active');

		$('#detail').remove();			

		$('#content').addClass('loading');
		$('#grid').fadeOut(t.fades);

		if($('#controls').hasClass('hide')) {
			$('#controls').removeClass('hide');
		}

		var src = a.attr('href');
		var txt = a.parent().find('div.text').html();
		var data = a.attr('data');
					
		t.preload(src, function(img) {
		
			img.attr('data', data);
			t.diashow.reset();

			$('#detail').remove();
			$('#content').append('<div id="detail"><a class="nav prev" href="#prev"></a><a class="nav next" href="#next"></a></div>');
			$('#detail').append(img);
			$('#description').html(txt);
			$('#content').removeClass('loading');
			$('#detail .prev').click(function() {
				t.skip(true);
				return false;
			});
			$('#detail .next').click(function() {
				t.skip(false);
				return false;
			});

			t.resize();

			$('#detail')
				.css('opacity', 0)
				.stop()
				.animate({'opacity' : 1}, 300);

		});
		
		t.smartload( a.parent() );		
	
	},

	resize : function() {

		var box  = $('#content');
		var img  = $('#detail img').first();
									
		if(img.length == 0) {
			t.iefix();
			return true;	
		}

		var data   = img.attr('data').split('|');
		var width  = img.innerWidth();
		var height = img.innerHeight();
		var add    = 0;				

		if((height/width) < 0.25) {
			box.addClass('panorama');
			add = 50;
		} else {
			box.removeClass('panorama');
		}

		t.iefix();

		var imgMaxWidth  = parseInt(data[0]);
		var imgMaxHeight = parseInt(data[1]);

		var boxMaxWidth  = box.innerWidth();
		var boxMaxHeight = box.innerHeight();

		var maxWidth  = (imgMaxWidth > boxMaxWidth) ? boxMaxWidth : imgMaxWidth;
		var maxHeight = (imgMaxHeight > boxMaxHeight) ? boxMaxHeight : imgMaxHeight;
		var ratio  		= width/height;
			 
		var width     = maxWidth;
		var height    = Math.round(width/ratio);

		if(width > maxWidth) {
			var width  = maxWidth;
			var height = Math.round(width/ratio);
		}
		
		if(height > maxHeight) {
			var height = maxHeight;
			var width  = Math.round(height*ratio);
		}

		img.css({
			'width' : width, 
			'height' : height,
			'position' : 'absolute',
			'top' : '50%',
			'margin-top' : (Math.round(height/2)+add)*-1,
			'left' : '50%',
			'margin-left' : Math.round(width/2)*-1
		});
			
	},
	
	iefix : function() {
	
		if($.browser.webkit) return true;
	
		var wwidth  = $(window).width(); 
		var wheight = $(window).height(); 
		var cheight = (wheight - 108);
		var pan     = ($('#content').hasClass('panorama')) ? true : false;
					
		$('#page').css({
			'width' : wwidth,
			'height' : (cheight)
		});

		$('#controls').css({
			'width' : (wwidth-330)
		});

		$('#content').css({
			'left' : (pan) ? 10 : 350,
			'width' : (pan) ? wwidth-20 : (wwidth-350),
			'height' : (cheight - 35)
		});

		$('#detail').css({
			'width' : ($('#content').hasClass('panorama')) ? wwidth-20 : (wwidth-350),
			'height' : (cheight - 35)
		});

		$('#side').css({
			'height' : (cheight - 35)
		});
		
		$('#footer').css({
			'width' : (wwidth - 10)
		});

		var grid    = $('#grid');
		var gwidth  = grid.width();
		var gheight = grid.height();
		var ccheight = (cheight - 35);
		var ccwidth  = (wwidth - 350);

		$('#grid').css({
			'top' : (Math.round(ccheight/2) - Math.round(gheight/2)),
			'left' : (Math.round(ccwidth/2) - Math.round(gwidth/2)),
			'margin-left' : 0,
			'margin-top' : 0
		});
						
	
	},
	
	preload : function(src, onload) {
		$('<img src="' + src + '">').load(function() {
			if(onload) onload.call(this, $(this));
		});
	},
	
	prev : function(element) {
		var prev = $(element).prevAll().not('.placeholder').first();
		if(prev.length == 0) {
			var prev = t.images.last();
		}
		return prev;
	},
	next : function(element) {
		var next = $(element).nextAll().not('.placeholder').first();
		if(next.length == 0) {
			var next = t.images.first();
		}						
		return next;
	},
	skip : function(back) {
		if($('#detail').length == 0) return;

		var next = (back) ? t.prev(t.active) : t.next(t.active);

		if(t.diashow.running) t.diashow.reset();
		next.find('a').trigger('click');		        
	},
	smartload : function(element) {
		var prev = this.prev(element);
		var next = this.next(element);
						
		var iprev = prev.find('img').attr('src').replace('/thumbs/', '/');
		var inext = next.find('img').attr('src').replace('/thumbs/', '/');

		this.preload(iprev);
		this.preload(inext);
	},
	diashow : {
		start : function() {
			$('#controls a.play-pause').removeClass('play');			
			if(this.running) return true;
			this.running = true;		
			this.loop = setInterval(function() {
				t.skip(false);
			}, t.showtime);
		},
		stop : function() {
			$('#controls a.play-pause').addClass('play');
			clearInterval(this.loop);
			this.running = false;
		},
		reset : function() {
			clearInterval(this.loop);
			if(this.running) this.loop = setInterval(function() {
				t.skip(false);
			}, t.showtime);						
		}
	},
	close : function() {

		window.location.hash = '#';

		$('#content').removeClass('panorama');
		$('#description').empty();

		t.iefix();

		this.diashow.stop();

		$('#grid').fadeIn(t.fades);
		$('#detail').fadeOut(t.fades, function() {
			$(this).remove();
		});

		$('#controls').addClass('hide');

	}

};