Masking = Class.create();
Masking.prototype = {
	
	mode: 'folowOnMouseover',
	duration: 0.3,
	followElement: window,
	queue: ["bounce","followOnMouseOver"],
	
	initialize: function(container){
		this.container = $(container);
		this.one = this.container.select("div.one").first();
		this.img = this.one.select("img").first();
		this.h = this.img.getHeight();
		this.one.clonePosition(this.container);
		this.queuePosition = 0;
		//create the frame div
		this.container.select("div").each(function(i){
			i.makeClipping();
		});
		
		//start the animation queue
	},
	
	startQueue: function(){
		//TODO there has to be a better way to call functions by a variable's value in JS
		eval('this.'+this.queue[0]+'();');
	},
	
	nextQueue: function(){

		if (this.queuePosition < (this.queue.size()-1)){
			this.queuePosition++;
			//TODO there has to be a better way to call functions by a variable's value in JS
			eval('this.'+this.queue[this.queuePosition]+'()');
		}
	},
	
	followOnMouseover: function(){
		Event.observe(this.followElement,"mousemove",(function(ev){
			var y = Event.pointerY(ev) - this.one.cumulativeOffset()["top"];
			Event.stop(ev);
			if ((y >0) && (y < this.h)){
				this.one.setStyle({height:y+"px"});
			}
		}).bind(this));
	},
	
	//tweenToCursor is fired once when the mouse motion begins - tweens from current position to mouse arrow position
	tweenToCursor: function(){
		Event.observe(this.followElement,"mousemove",(function(ev){
			var y = Event.pointerY(ev) - this.one.cumulativeOffset()["top"];
			Event.stop(ev);
			if ((y > 0) && (y < this.h)){
				new Effect.Tween(this.one,this.one.getHeight(),y, {duration:0.3 * this.duration * (Math.abs(y-this.one.getHeight())/100 ),
					afterFinish:(function(){
						Event.stopObserving(this.followElement, "mousemove");
						this.nextQueue();
				}).bind(this)},
				 (function(v){
					this.one.setStyle({height:v+"px"})
				}).bind(this));
			}
		}).bind(this));
	},
	
	//springy bounce animation, fired on load
	bounce: function(){
		var hh = this.h * 0.9;
		new Effect.Tween(this.one,0,this.h * 0.05,{
			duration:this.duration * 5, 
			transition:Effect.Transitions.sinoidal, 
			afterFinish:(function(){
				this.nextQueue();
			}).bind(this)
		}, 
			(function(v){
				this.one.setStyle({height:hh-(Math.cos(v)*((this.h * 0.05)-v))+"px"});
			}).bind(this)
		);
	}		
}