Portfolio = Class.create();
Portfolio.prototype = {
		
	loaded: false,    
	view:  null,

	images: null,
	
	next: null,

	initialize: function() {
		this.images = new Object();
		this.next = new Object();
	},
	
	close: function() {
		if (this.view) {
			new Effect.Morph(this.view, {
				style: {
					width: '1px'
				},
				duration:0.5
			});
			this.view = null;
		}
	},
	
	view_for_element: function(elem) {
		
		var elem = elem.parentNode;
		
		while (!$(elem).hasClassName('thumbs')) elem = elem.parentNode;
		
		while (!$(elem).hasClassName('view')) elem = $(elem.next('li'));
		
		elem = $(elem).cleanWhitespace().childNodes[0];
		
		return elem;
	},
		
	remove_hover: function(sender) {
		var elem = sender.parentNode;
		while (!$(elem).hasClassName('thumbs')) elem = elem.parentNode;
		$(elem).removeClassName('hover');
	},
	
	full_width: function() {
		var childNodes = $('portfolio_gallery').cleanWhitespace().childNodes;
		var w = 0;
		for (var i=0; i<childNodes.length; i++) {
			w += Element.getDimensions(childNodes[i]).width + 20;
		}

		return w;
	},
	
	
	current_view: null,
	scroll_to: function(li,full,duration) {
		
		if (!duration) duration = 1.0;
		
		var offset = -8;
		
		// album: margin right
		offset += 20;
		
		var ul = li.parentNode;
		
		this.current_view = ul;
		
		while (li = $(li).previous('li')) {
			offset += Element.getDimensions(li).width;
		}
		while (ul = $(ul).previous('ul')) {
			offset += Element.getDimensions(ul).width;
			if (!full) offset -= Element.getDimensions($(ul).cleanWhitespace().childNodes[1]).width;
			// album: margin right
			offset += 20;
		}

		offset *= -1;
		
		offset += 'px';

		new Effect.Morph($('portfolio_gallery'),{
			style: {
				left: offset
			},
			duration:duration
		});
		
	},
	
	scroll_forward: function() {

		if (this.current_view) {
			var ul = this.current_view;
			if (ul = $(ul).next('ul')) {
				this.scroll_to($(ul).cleanWhitespace().childNodes[1],'full',0.5);
			}
		}
		else {
			this.scroll_to($($('portfolio_gallery').cleanWhitespace().childNodes[0]).cleanWhitespace().childNodes[1],'full',0.5);
		}		
	},
	
	scroll_backward: function() {
		if (this.current_view) {
			var ul = this.current_view;
			if (ul = $(ul).previous('ul')) {
				this.scroll_to($(ul).cleanWhitespace().childNodes[1],'full',0.5);
			}
		}
	},
	
	last_image: null,
	last_sender: null,
	last_url: null,
	load: function(sender,url) {
						
		wait = 0;                 
				
		this.last_url = url;			
		this.last_sender = sender;
							
		var target 		= this.view_for_element(sender); 
		if (this.last_image) {
			var last_target	= this.view_for_element(this.last_image);


			if (target != last_target || !url) {
				
				this.remove_hover(sender);

				Effect.Fade(last_target.parentNode);
				new Effect.Morph(last_target.parentNode, {
					style: {
						width: '0px',
						borderLeftWidth:'0px',
						borderRightWidth:'0px'
					},
					duration: 0.75
				});
				Effect.Fade(last_target,{duration:0.75, to:0.01});
				
				wait = 500;
			}
			else {
				Effect.Fade(last_target,{duration:0.2, to:0.01});
			}                 


		}
		else {
			this.remove_hover(sender);
		}
				
				
		if (!url) return;
				
		//target.innerHTML = '';
				
		this.scroll_to(target.parentNode);
				
						
		var obj = this;
		setTimeout(function(){ 

			var i = new Image;
			obj.last_image = sender;
																		
			i.onload = function() {
                            

				

				var f  = 480/i.height;
				i.height = 480;
			
				var w = i.width * f;
				
				Effect.Appear(target.parentNode);
				new Effect.Morph(target.parentNode, {
					style: {
						width: w+'px',
						borderLeftWidth:Portfolio.border_left+'px',
						borderRightWidth:Portfolio.border_right+'px'
					},
					//afterFinish: function(r) {
					//	target.innerHTML = '<img src="'+url+'" border="0" alt="" \/>';
					//},
					duration: 0.75
				});         
				
				setTimeout(function() {
					target.style.backgroundImage = 'url('+url+')';
					//target.style.backgroundRepeat = 'no-repeat';
					Effect.Appear(target,{duration:0.5});
			  	},200); 
			   
			}
			

			i.src = url;


		},wait);
	},
	
	load_next: function() {
		//if(this.next[this.last_url]) {
			this.load(this.last_sender,this.next[this.last_url]);
		//}
		//else {
		//	
		//}
	},
		
	awake: function() {
		this.last_image = null;
		this.current_view = null;
	},
	
	load_content: function() {
		new Ajax.Updater('portfolio', 'parts/portfolio.php',{
			asynchronous: false,
			evalScripts: true
		});
		this.loaded = true;
	}
	
}

portfolio   = new Portfolio();

Portfolio.border_left 	= 0;
Portfolio.border_right	= 0;