function trace() {
	var debug = document.getElementById('debug');
	if (!debug) {
		var debug = document.createElement('div');
		debug.setAttribute('id', 'debug');
		document.body.appendChild(debug);
	
		debug.onclick = function() {
			if (this.closed) {
				this.style.height = '200px';
				this.closed = false;
			} else {
				this.style.height = '2px';
				this.closed = true;
			}
		}

	}
	if (debug) {
		var o = '';
		o = 'arguments.length = ' + arguments.length + '<br />';
		o += arguments;
		for (var i=0; i<arguments.length; i++) {
			o += '<div style="margin-left: 16px;">';
			o += arguments[i];
			for (j in arguments[i]) {
				o += '<div style="margin-left: 16px;">';
				o += '<b>' + j +'</b>&nbsp;=&nbsp;' + String(arguments[i][j]).split('<').join('&lt;').split('>').join('&gt;').split('\"').join('&raquo;');
				o += '</div>';
			}				
			o += '</div>';
		}
		debug.innerHTML = o;
	}
}
function alignHolder(imageRatio){
		var margin_y = 0;
		var margin_x = 200;
		var canvasWidth = $(this).width() - (margin_x*2) +80;
		var canvasHeight = $(this).height()-(margin_y*2) -150;
		$('div.item').css({
			width: canvasWidth
			,height: canvasHeight
			,top: margin_y 
			,left: margin_x
		})
		

		var canvasRatio = canvasWidth/canvasHeight

		if(imageRatio/canvasRatio >= 1){

			$('div.item img').attr('width', $('div.item').width()) 		
			$('div.item img').attr('height', $('div.item').width() / imageRatio)
					
			$('div.item img').css({
				'margin-left': 0,
					'margin-top': 0
				//	'margin-top': (  $('div.item').height() - parseInt($('div.item').width() / imageRatio) ) / 2
			})					
		}else{
			$('div.item img').attr('width',  $('div.item').height() * imageRatio) 		
			$('div.item img').attr('height', $('div.item').height())
			
			$('div.item img').css({
				'margin-top': 0,
				//'margin-left': (  $('div.item').width() - parseInt($('div.item').height() * imageRatio) ) / 2,
				'margin-left':0
			})					
		}

}

function showImage(src, callback, index){

	if (typeof imageTimer!="undefined") window.clearTimeout(imageTimer)
	
	
	if (src == parseInt(src)){
		
		currentIndex = parseInt(src);

		src = $('.thumbs a[rel='+src+']').attr('href')

		
	}else{
	
		currentIndex = parseInt($('.thumbs a[href='+src+']').attr('rel'))
	
	}
	//alert(currentIndex)

	$('div.item').empty().append('<img src="'+src+'" />')
	
	
	$('body').addClass('loading')
	imageRatio = $('div.item img').width()/$('div.item img').height()
	$('div.item img').css({opacity: 0})
	
	$('.thumbs').removeClass('current')
	$('.thumbs img').css({'opacity': 0.3})

	$('.thumbs a[rel='+currentIndex+'] img').css({'opacity': 1})
	
	$('.thumbs a[rel='+currentIndex+']').addClass('current')

	if ($('.ideaitem').length < 1){
		$('div.titles').empty().html($('.thumbs a[rel='+currentIndex+'] span').html())

	}
	$('div.item img').load(function(){
		
		imageRatio = $('div.item img').width()/$('div.item img').height()

		alignHolder(imageRatio);
		
		$('div.item img').animate({opacity: 1}, 2000, function(){
			$('body').removeClass('loading')
			if (callback) callback.call(callback)
			
			if ($('.ideaitem').length < 1){
				

				imageTimer = setTimeout(function(){showNext()}, 5000)
			}
		})	
	})

} 

jQuery(window).load(function(){

	$('a[@rel*=lightbox]').lightBox();

	var imageRatio = 0

	$('ul.main-nav li:has("ul") > a').click(function(){
		$('ul.main-nav ul').toggle(400)
	})
	if ($('#portfolio').length > 0) $('ul.main-nav ul').show()
	
	$('ul.main-nav li').hover(function(){
		$(this).addClass('over')
	}, 	function(){
		$(this).removeClass('over')
	})
	
	
	initThumbs = function(){
		numImages = $('.thumbs a').length
		$('.thumbs a').click(function(){

			var index = $(this).attr('rel')
			showImage(index)
			$('div.titles').empty().html($('span', this).html())
			return false		
		})

		$('.thumbs img').css({'opacity': 0.3})

		$('.thumbs a').hover(function(){
			$('img',this).animate({'opacity': 1}, 50)
		}, function(){
			if (!$(this).hasClass('current'))
				$('img',this).animate({'opacity': 0.3}, 300)
		})		
		
		
		
		showImage(1)
		
		
	}

	$(window).bind("resize", function(){
			imageRatio = $('div.item img').width()/$('div.item img').height()
			alignHolder(imageRatio);
	});
	

	slideShow = function(i, num, speed){
		
		var items = $('div.ideaitem')
	
		var data = $('span', items[i-1]).html();
	
		var src1 = $('a', items[i-1]).attr('href');
		var src2 = '/idea/idea_'+i+'b.jpg';
		var src3 = '/idea/idea_'+i+'c.jpg';
		
		$('div.titles').empty().html(data)					

		showImage(src1, function(){
			setTimeout(function(){				
				$(insptext).clone().appendTo('div.titles')	
				$('div.titles small').hide()			
				showImage(src2, function(){
					setTimeout(function(){
						$('div.titles i').hide()					
						showImage(src3, function(){
							setTimeout(function(){
								i++
								if (i==num+1) i=1;
								slideShow(i, num, 5000)
								
								clearTimeout()							
							},speed)
						})
					}, speed)
				})
			}, speed)

		})
		
		
	}
	
	showNext = function(){
		clearTimeout(imageTimer);
		if (currentIndex  == numImages ){
			showImage(1);
			return false;	
		}else{
			showImage(currentIndex + 1);	
			return false;	
		} 

	}

	showPrev = function(){
		clearTimeout(imageTimer);
		if (currentIndex -1 <= 0){
			showImage(numImages + 1);
			return false;	
		}else{
			showImage(currentIndex - 1);		
			return false;	
		}
	}

	$('.next').click(function(){
		showNext()
		return false;
	})

	$('.prev').click(function(){
		showPrev();
		return false;
	})

	

});