/*
 * Franklin Lancaster, 2008
 *
 */


//create a box the size of the article + 20px

var Viewer = new Class({

	initialize: function(parent) {
	
		var me = this;
		
		$$('.article_link').each(function(item){
			item.onclick = function() { me.display(item.href,''); return false; };
		});
	
	},
	
	display: function(source, dims){
	
	var me = this;
	var maxImageWidth = windowWidth - 100;
	
		var pages = new Array();
		var location = source.split('&pages=')[0];
		source.split('&pages=')[1].split(',').each(function(item){
			pages.push(location + item);
		});
		
		var container = document.createElement('div');
		var overlay = new Element('div', {'class':'roundedBox', 'styles': {'background': '#333', 'padding': 10, 'color': '#fff', 'text-align':'center'} });			
		//var frame = document.createElement('div');
		var contents = document.createElement('div');
		var handle = new Fx.Morph(container, {duration:300, wait:false});

		var header = document.createElement('div');
		header.style.height = '20px';
		header.style.width = '100%';
	
	
		var hide = new Element('img', {'src': '/images/gallery_nav/close_off.png', 'styles' : {'float':'right', 'margin':'0 0 4px 0', 'cursor':'default'}});
		/*
		var hide = document.createElement('img');
		hide.src = '/images/gallery_nav/close_off.png';
		hide.style.float= 'right';
		hide.style.margin = '0 0 4px 0';
		hide.style.cursor = 'default';
		*/
		header.appendChild(hide);

		hide.onmouseover = function(){ this.src = '/images/gallery_nav/close_on.png'; };
		hide.onmouseout = function(){ this.src = '/images/gallery_nav/close_off.png'; };
		hide.onclick = function() { me.close(container); }
		
		
		container.appendChild(overlay);
		$('gallery').appendChild(container);
				
		/*overlay.className = "";
		overlay.setStyle('background', '#333');
		overlay.setStyle('padding', 10);
		*/
		
		container.setStyles({'position': 'absolute','zIndex': indexLevel++, 'width': 100, 'opacity': 0, 'left': (windowWidth - 100)/2, 'top':50});
		
		overlay.set('text','loading...');
		handle.start({'opacity': [0, .95], 'display' : 'block'});

		
		var images = new Asset.images(pages, {
			onComplete: function(){
				images.each(function(item){
					if (item.width > maxImageWidth) {
						var newWidth = maxImageWidth;
						var newHeight = item.height * (maxImageWidth / item.width);
						item.width = newWidth;
						item.height = newHeight;
					}
					contents.appendChild(item);
				});
				
				overlay.empty();
				
				var frame = new Element('div', {'styles': {'overflow': 'hidden', 'height': windowHeight - 100 - 20, 'width': images[0].width} });			
				
				
				frame.appendChild(contents);
				overlay.appendChild(header);
				overlay.appendChild(frame);
				container.appendChild(overlay);
				//$('gallery').appendChild(container);
				
				overlay.className = "roundedBox";
				overlay.setStyle('background', '#333');
				overlay.setStyle('padding', 10);
				
				
			/*
				frame.setStyle('overflow', 'hidden');
				frame.setStyle('height', windowHeight - 100 - 20);
				frame.setStyle('width', images[0].width);
			*/	
				container.setStyle('position', 'absolute');
				container.setStyle('zIndex', indexLevel++);
				//container.setStyle('height', windowHeight - 100);
				container.setStyle('width', images[0].width + 20);
				//container.setStyle('opacity', 0);
				container.style.left = (windowWidth - (images[0].width + 20))/2 + 'px';
				container.style.top = 50 + 'px';
				
				//handle.start({'opacity': [0, .95], 'display' : 'block'});
				
				var articleScroller = new scrollBar(container, contents, frame);
				articleScroller.show();
		
			}
		});
		
	
	},
	
	close: function(container){
	
		container.empty();
		
	
	}

});