var timer;
var init_layout = true;
var imagesToDisplay = 2;

var reveal = function(e) {
	if (init_layout) {
		$$('.pic img').setStyle('height', 'auto');
		$$('.ss-nav').setStyle('display', 'block');
		init_layout = false;
	}
}

var resized = function(e) {
	if ($$('.pic img')[0]) {
		$clear(timer);
		timer = (function() {
			$$('.ss-container').setStyle('visibility', 'hidden');	

			var viewportWidth = $(document.window).getSize().x;
			var viewportHeight = $(document.window).getSize().y;

			if (viewportHeight < minY) {
				$$('html').setStyle('overflow-y', 'auto');
				$(document.body).setStyle('overflow-y', 'auto');
				viewportHeight = minY;
				$('footer').setStyle('top', viewportHeight - 150 + 'px');
				$('right').setStyle('height', viewportHeight + 'px');
			} else {
				$$('html').setStyle('overflow-y', 'hidden');
				$(document.body).setStyle('overflow-y', 'hidden');
				$('footer').setStyle('top', 'auto');
				$('right').setStyle('height', '100%');
			}

			var imgSize = $$('.pic img')[0].getSize();
			var aspectRatio = $$('.pic img')[0].getSize().x / $$('.pic img')[0].getSize().y;
			var targetWidth = Math.ceil(viewportHeight * aspectRatio);
			var picNum = $$('.pic img').length;
			var totalWidth = targetWidth * picNum;
			var oldMargin = parseInt($$('.ss-container-inner').getStyle('margin-left'));
			var newMargin = oldMargin / $$('.pic img')[0].getSize().x * targetWidth;
			$$('.ss-container-inner').setStyle('margin-left', newMargin + 'px');
			$$('.ss-container-inner').setStyle('width', totalWidth + 'px');
			$$('.ss-container').setStyle('width', imagesToDisplay * targetWidth + 'px');
			$$('.pic img').setStyle('width', targetWidth + 'px');
			var ssnav = $$('.ss-nav')[0];
			var width_view = $(document.window).getSize().x - ssnav.getCoordinates().left;
			
			if(width_view <= (targetWidth * 2))
				ssnav.setStyle('width', width_view);
			else
				ssnav.setStyle('width', (targetWidth * 2));
			
			//$$('.ss-next').setStyle('margin-left', targetWidth-43);
			$('collection-detail-inner').setStyle('width', targetWidth-80);

			if($('collection-detail').getAttribute('detail-type') == 'collections')
				$('collection-detail').setStyle('width', targetWidth-40);
			
			reveal();

			$$('.ss-container').setStyle('visibility', 'visible');	
		}).delay(50);
	}
}

window.addEvent('load', resized);
window.addEvent('resize', resized);