/********************************************

	Digital Freedom - Portfolio Viewer 
	Author: Chris Erwin
	Date: January 13, 2009

*********************************************/

var PortfolioViewer = new Class({
	arrImages: null,
	containerAnimation: null,
	currImage: null,
	imageFadeOpacity: 0.27,
	
	// CONSTRUCTOR ----------------------------------------------------------------------------------------------
    initialize: function(){
		// assign vars
    	this.arrImages = $$('#photo_container img');
		this.containerAnimation = new Fx.Tween('photo_container', {duration : 1000, link: 'cancel', transition: Fx.Transitions.Quart.easeInOut});
		
		// setup image animations
		this.arrImages.each(function(image, index){
			//console.log(image);
			image.set('tween', {duration : 1000, transition: Fx.Transitions.Quart.easeInOut});
			image.setStyle('opacity', this.imageFadeOpacity);
		}, this);
		
		// add events
		this.arrImages.addEvent('click', function(e){
			target = this.getEventTarget(e);			
			this.viewImage(target);
		}.bind(this));
		
		$('previous_link').addEvent('click', this.goPrevious.bind(this));
		$('next_link').addEvent('click', this.goNext.bind(this));
		
		// start running
		this.viewImage(this.arrImages[0]);
    },
	
	// GET EVENT TARGET -----------------------------------------------------------------------------------------
	getEventTarget : function(e) {
		var targ;
		if (!e) var e = window.event;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;
		if (targ.nodeType == 3) // defeat Safari bug
			targ = targ.parentNode;
		return targ;
	},
	
	// VIEW IMAGE -----------------------------------------------------------------------------------------------
	viewImage : function(imageElement) {
		if (imageElement != this.currImage) {
			photoContainer = $('photo_container');
			windowWidth = window.getSize().x;
			imageCoords = imageElement.getCoordinates(photoContainer);
			
			// calculate postions
			windowCenterPos = (windowWidth / 2) - (imageCoords.width / 2);
			imageContainerPos = (imageCoords.left - windowCenterPos) * -1;		
			imageContainerPos = (imageContainerPos > 195) ? 195 : imageContainerPos; 
			
			// start animations
			this.containerAnimation.start('left', imageContainerPos);
			if (this.currImage) 
				this.currImage.tween('opacity', this.imageFadeOpacity);
			imageElement.tween('opacity', 1);
			
			// set the new currImage
			this.currImage = imageElement;
		}
	},
	
	// GO NEXT --------------------------------------------------------------------------------------------------
	goNext : function(){
		var currIndex = this.arrImages.indexOf(this.currImage);
		newIndex = (currIndex >= 0 && currIndex != (this.arrImages.length - 1)) ? currIndex + 1 : 0;
		this.viewImage(this.arrImages[newIndex]);
	},
	
	// GO PREVIOUS ----------------------------------------------------------------------------------------------
	goPrevious : function() {
		var currIndex = this.arrImages.indexOf(this.currImage);
		newIndex = (currIndex > 0) ? currIndex - 1 : (this.arrImages.length - 1);
		this.viewImage(this.arrImages[newIndex]);
	}
});

window.addEvent('domready', function() {
	portfolio_viewer = new PortfolioViewer;									 
});