var scopeid = 0;

// WILL NEED TO REWRITE THESE OBSERVES SO THAT THEY ARE CREATED WHEN IMAGES HAVE LOADED AND NOT ALL AT ONCE...




document.observe("dom:loaded", function() {

	$$('#portfolio .item').each(function(item) {

		$(item).setOpacity(0.5);
		scopeid++;
		
		// listen for images 
		
		// Hide thumbnails of image sets
		$$('#portfolio .item a .thumb').invoke('hide');
	

		// item mouseovers
		Event.observe(item, 'mouseover', function() {
		
			$(item).setOpacity(1);
			
			var itemDate  = item.getElementsBySelector('span p[class=itemNiceDate]').collect(function(date) { return date.innerHTML; });
			var itemTitle = item.getElementsBySelector('span p[class=itemDescription]').collect(function(desc) { return desc.innerHTML; });
			$('portfolioDescriptions').update('<div class="desc">' + itemTitle + '</div><div class="date">' + itemDate + '</div>');
		
		});

		Event.observe(item, 'mouseout', function() {
		
			$(item).morph('opacity:0.5', {duration: 0.2, queue:{ scope: 'scope'+scopeid}});
			$('portfolioDescriptions').update('');
		});
	});
	
	
	// initilise Lightbox
	new Lightbox();
	

});