String.prototype.namespace = function(separator) {
	
	if(Object.isUndefined(separator)) {
		separator = ".";
	}
	var namespaces = this.split(separator);
	var obj = window;
	for(var i=0; i<namespaces.length; i++) {
		if(Object.isUndefined(obj[namespaces[i]])) {
			obj[namespaces[i]] = {};
		}
		obj = obj[namespaces[i]];
	}
	return obj;
};
"org.gul.components".namespace();

org.gul.components.Carrousel = Class.create( {
	initialize : function(element, options) {
		this.element = $(element);
		this.options = Object.extend( {
			ancestorSelector : "*",
			subElementsSelector : "li",
			docked : "left",
			interval: 0.1
		}, options || {});
		
		this.ancestor = this.element.up(this.options.ancestorSelector);
		this.firstSubElement = this.element.down(this.options.subElementsSelector);
		this.lastSubElement = this.element.select(this.options.subElementsSelector).last();
		this.nbSubElements = this.element.select(this.options.subElementsSelector).length;
		this.containerPos = this.ancestor.cumulativeOffset();
		this.containerDim = this.ancestor.getDimensions();
		
		this.firstThird = this.containerPos.left + (this.containerDim.width / 3);
		this.lastThird = this.containerPos.left + (2 * this.containerDim.width / 3);
		
		this.anElementOccupyWidth = this.lastSubElement.getDimensions().width + parseInt(this.lastSubElement.getStyle("margin-left").replace(/px/gi, "")) + parseInt(this.lastSubElement.getStyle("margin-right").replace(/px/gi, ""));
		if(this.options.docked == "left") {
			this.minMarge = Math.min((this.containerDim.width - this.lastSubElement.positionedOffset().left), 0);
		} else {
			this.minMarge = Math.min((this.containerDim.width - this.anElementOccupyWidth * this.nbSubElements), 0);
		}
		this.ancestor.observe("mousemove", this.handleMove.bindAsEventListener(this));
		this.ancestor.observe("mouseout", this.handleOut.bindAsEventListener(this));
		this.state=0;
		this.executer = new PeriodicalExecuter(this.move.bindAsEventListener(this), this.options.interval);
	},
	
	move : function() {
		var margin = parseInt(this.element.getStyle("margin-" + this.options.docked).replace(/px/gi, ""));
		var newMarge = Math.max(this.minMarge, Math.min(0,(margin + this.state)));
		
		this.element.setStyle({marginRight : newMarge + "px"});
	},
	
	handleOut : function(e) {
		var y = e.pointerY();
		var x = e.pointerX();
		if(y < this.containerPos.top || y > (this.containerPos.top + this.containerDim.height) ||
		x < this.containerPos.left || x > (this.containerPos.left + this.containerDim.width)) {
			this.state = 0;
		}
	},
	
	handleMove : function(e) {
		var x = e.pointerX();
		if(x < this.firstThird) {
			if(this.options.docked == "left") {
				this.state = this.firstThird - x;
			} else {
				this.state = x - this.firstThird;
			}
		} else if(x > this.lastThird) {
				if(this.options.docked == "left") {
					this.state = -1 * (x - this.lastThird);
				} else {
					this.state = (x - this.lastThird);
				}
		} else {
			this.state = 0;
		}
		this.state = Math.round(this.state / 5);
	}

} );


handleAjaxLink = function(e) {
	e.stop();
	if(this.hasClassName("withEffect")) {
		new Ajax.Request(this.href, {
			method: "get",
			parameters: {
				ajax: "true"
			}, onComplete : function(t) {
				var finalTarget = $("ajaxTarget").down(".ajaxContained");
				new Effect.Fade(finalTarget, {
					duration:0.25,
					afterFinish : function() {
						finalTarget.update(t.responseText);
						bindLinksAjaxEvents(finalTarget.select("a.ajax"));
						bindImagesEffects(finalTarget.select(".vignette"));
						new Effect.Appear(finalTarget);
						
					}
				});
                                if(pageTracker) {
					pageTracker._trackPageview(this.href);
				}
			}
		});	
	} else {
		new Ajax.Updater("ajaxTarget", this.href, {
			method:"get", 
			parameters:{
				ajax: "true"
			}, 
			onComplete : function(t) {
				var finalTarget = $("ajaxTarget").down(".ajaxContained");
				bindLinksAjaxEvents(finalTarget.select("a.ajax"));
				bindImagesEffects(finalTarget.select(".vignette"));
                                if(pageTracker) {
                                        pageTracker._trackPageview(this.href);
                                }
			}
		});
	}
};

bindLinksAjaxEvents = function(elements) {
	elements.each(function(link) {
		link.observe("click", handleAjaxLink.bindAsEventListener(link));
	});
};

bindImagesEffects = function(elements) {
	elements.each(function(image) {
		image.setOpacity(0.4);
		image.observe("mouseover", function(e){new Effect.Opacity(e.element(), {to:1, duration:0.3});});
		image.observe("mouseout", function(e){new Effect.Opacity(e.element(), {to: 0.4, duration:0.8});});
	});
}

Event.observe(window, "load", function() {
	var ajaxTarget = $("ajaxTarget");
	if( ajaxTarget ) {
		var ajaxTargetDim = ajaxTarget.getDimensions();
		ajaxTarget.relativize().setStyle( {
			width: ajaxTargetDim.width + "px",
			height: ajaxTargetDim.height + "px"
		});
		
		$$(".projects ul").each( function(elem) {
			new org.gul.components.Carrousel(elem, {docked: "right", interval: 0.1});
		});
	
		
		bindImagesEffects($$(".vignette"));
		bindLinksAjaxEvents($$("a.ajax"));
	}
});