$(function(){
//	var container_width = $('#content_items').width(); // hard code to 725 since opera 10 and chrome misread this
//	var container_height = $('#content_items').height(); // hard code to 330 since opera 10 and chrome misread this
	var container_width = 725; // hard code to 725
	var container_height = 330; // hard code to 330
	var borderWidth = 5;

	$('.tile').hover(function(){
			$(this).css('border-color','#EEE');
			onImg = $('img', this).attr('src').split('_');
			onImg = onImg[0]+'.jpg';
			$('img', this).attr('src',onImg);
		},
		function(){
			$(this).css('border-color','#B2AD9A');
			offImg = $('img', this).attr('src').split('.');
			offImg = offImg[0]+'_off.jpg';
			$('img', this).attr('src',offImg);
		}
	);
	
	$('div.tile').each(function(){	
		$(this).append($(this).clone().attr('id',$(this).attr('id')+'_clone').removeClass('tile').addClass('clone'));
		var cloneID = $(this).attr('id')+'_clone';
		$('#'+cloneID).click(function(e){
			e.stopPropagation();
			$('#'+cloneID+' p').animate({opacity:0},300);
			$('#'+cloneID).animate({
					padding:0,
					top:-borderWidth+'px',
					left:-borderWidth+'px',
//					width:'225px',height:'150px'},{duration: 900,easing:'easeInOutExpo',complete:function(){$('#'+cloneID).css('z-index','-1')}});
					width:'225px',height:'150px'},600,function(){$('#'+cloneID).css('z-index','-1')});
		})
	});

	$('div.tile p').hide(); // Hide the item paragraphs on the tile class divs
	$('div.clone p').show(); // Show them on the clones

	$('div.tile').click(function(){
		var position = $(this).position();
		var cloneID = $(this).attr('id')+'_clone';
		$('#'+cloneID+' p').css('opacity','0').animate({opacity:1},1250);
		$('#'+cloneID).css('z-index','1').animate({
			padding:'10px',
			top:-position.top-borderWidth,
			left:-position.left-borderWidth,
			width:container_width-(borderWidth*2)-20, // The additional 20 is for the padding we're adding
			height:container_height-(borderWidth*2)-20
			},300);
	});

	$('.clone a').click(function(e){e.stopPropagation();});
	/* What we're up to rotator */
/*
	var item = 0;
	$('#wwut p:not(:first)').hide();
	$('#wwut p').css('position','absolute');

	function slideNews()
	{
//		ct1=setTimeout(function(){$('#wwut p:eq('+item+')').fadeOut(2750)},10000);
		ct1=setTimeout(function(){$('#wwut p:eq('+item+')').animate({top:'160px',opacity:0},4000)},10000);
		ct2=setTimeout(function()
			{
				item++;
				if(item==$('#wwut p').length) item=0;
				$('#wwut p:eq('+item+')').css({'left':$('#wwut').width(),'top':'0px','opacity':1});
				$('#wwut p:eq('+item+')').fadeIn().animate({'left':'0'},{duration: 2000,easing: 'easeOutExpo'});
				slideNews();
			},10000);
	};

	$('#wwut').mouseenter(function(){clearTimeout(ct1);clearTimeout(ct2)}).mouseleave(function(){slideNews();});
	slideNews();
*/
	var item = 0;
	$('#wwut p:not(:first)').hide();
	$('#wwut p').css('position','absolute').width(550);
	$('#wwut').append('<div id="wwutcount"><span id="wwutprev">&laquo; prev</span> <span id="wwutnext">next &raquo;</span> (<span id="current">1</span> of '+$('#wwut p').length+')</div>');
	$('#wwutprev').hover(function(){$(this).css('border-bottom','1px dotted #faa')},function(){$(this).css('border-bottom','none')});
	$('#wwutnext').hover(function(){$(this).css('border-bottom','1px dotted #faa')},function(){$(this).css('border-bottom','none')});

	function next()
	{
		$('#wwut p:eq('+item+')').animate({top:$('#wwut').height()+'px',opacity:0},250);
		item++;
		if(item==$('#wwut p').length) item=0;
		$('#current').text(item+1).hide().fadeIn();
		$('#wwut p:eq('+item+')').css({'left':$('#wwut').width(),'top':'0px','opacity':1}).show().animate({'left':'0'},{duration: 500,easing: 'easeOutExpo'});
	};
	
	function prev()
	{
		$('#wwut p:eq('+item+')').animate({left:$('#wwut').width()+'px',opacity:0},250);
		if(item<=0) item=$('#wwut p').length;
		item--;
		$('#current').text(item+1).hide().fadeIn();
		$('#wwut p:eq('+item+')').show().css({'top':$('#wwut').height()+'px','left':'0','opacity':'1'}).animate({'top':'0'},{duration: 500,easing: 'easeOutExpo'});
	};


	$('#wwutnext').click(function(){next()});
	$('#wwutprev').click(function(){prev()});
});

var img1 = new Image(225,150);
var img2 = new Image(225,150);
var img3 = new Image(225,150);
var img4 = new Image(225,150);
var img5 = new Image(225,150);
var img6 = new Image(225,150);
img1.src = 'http://www.notonebit.com/images/sml.jpg';
img2.src = 'http://www.notonebit.com/images/killbot.jpg';
img3.src = 'http://www.notonebit.com/images/services.jpg';
img4.src = 'http://www.notonebit.com/images/scratch.jpg';
img5.src = 'http://www.notonebit.com/images/dlm.jpg';
img6.src = 'http://www.notonebit.com/images/jquery.jpg';