(function(window){

function Navigation(){
	this.initialize.apply(this,arguments);
}
var p = Navigation.prototype;
	p.buttonAry = null;
	p.range = null;
	
	p.initialize = function(range){
		this.buttonAry = [];
		this.range = range;
	}
	p.show = function(id){
		this.buttonAry[id].show();
	}
	p.add = function(button1Element,button2Element,area,clickFunc){
		this.buttonAry.push(new Button(button1Element,button2Element,area,clickFunc));
	}
	p.onScroll = function(value)
	{
		var i,l = this.buttonAry.length;
		for(i = 0; i < l; i++)
		{
			var target = this.buttonAry[i];
			if(value < target.range) target.change(0);
			else target.change(1);
		}
		i,l = this.range.length - 1;
		for(i = 0; i < l; i++)
		{
			if(this.range[i] < value && this.range[i+1] >= value) this.buttonAry[i].current(true);
			else this.buttonAry[i].current(false);
		}
	}

function Button(){
	this.initialize.apply(this,arguments);
}
var p = Button.prototype;
	p.button1 = null;
	p.button2 = null;
	p.imageElement = null;
	p.normalSrc = "";
	p.hoverSrc = "";
	p.range = null;
	p._current = false;
	p.currentButtom = 0;
	p.initialize = function(button1Element,button2Element,range,clickFunc){
		this.button1 = new Button1(button1Element);
		this.button2 = new Button2(button2Element);
		this.range = range;
		this.imageElement = button2Element.getElementsByTagName('img')[0];
		this.normalSrc = this.imageElement.getAttribute('src');
		var ftype = this.normalSrc.substring(this.normalSrc.lastIndexOf('.'), this.normalSrc.length);
		this.hoverSrc = this.normalSrc.replace(ftype, '_o'+ftype);
		if(document.addEventListener){
			button1Element.addEventListener("click", function(){ clickFunc();},false);
			button2Element.addEventListener("click", function(){ clickFunc();},false);
		}
		else if(document.attachEvent){
			button1Element.attachEvent("onclick",function(){ clickFunc();});
			button2Element.attachEvent("onclick",function(){ clickFunc();});
		}
	}
	p.show = function(){
		this.button1.show();
	}
	p.change = function(num){
		if(num == 0 && this.currentButtom != 0){
			this.currentButtom = 0;
			this.button1.show();
			this.button2.hide();
		}
		else if(num == 1 && this.currentButtom != 1){
			this.currentButtom = 1;
			this.button1.hide();
			this.button2.show();
		}
	}
	p.current = function(bool){
		if(this._current != bool){
			this._current = bool;
			if(bool) this.imageElement.setAttribute('src',this.hoverSrc);
			else this.imageElement.setAttribute('src',this.normalSrc);
		}
	}


function Button1(){
	this.initialize.apply(this,arguments);
}
var p = Button1.prototype;
	p.element = null;
	p.showLeft = 0;
	p.showTop = 0;
	p.hideLeft = 0;
	p.hideTop = 0;
	p._top = 0;
	p._left = 0;
	p.moveTimerId = 0;

	p.initialize = function(element){
		this.element = element;
		this.element.style.display="block";
		var style = element.currentStyle || document.defaultView.getComputedStyle(element, '');
		this.showLeft = parseFloat(style.left);
		this.showTop = parseFloat(style.top);
		this.hideLeft = this.showLeft + 200;
		this.hideTop =  this.showTop - 60;
		this.left(this.hideLeft);
		this.top(this.hideTop);
	}
	p.show = function(){
		clearInterval(this.moveTimerId);
		this.update(this.left(),this.showLeft,this.top(),this.showTop,new Date().getTime(),0.8);
	}
	p.hide = function(){
		clearInterval(this.moveTimerId);
		this.update(this.left(),this.hideLeft,this.top(),this.hideTop,new Date().getTime(),0.8);
	}
	p.update = function(fromLeft,toLeft,fromTop,toTop,startTime,time)
	{
		var currentTime = (new Date().getTime() - startTime)/1000;
		this.left(this.easing(currentTime,fromLeft,toLeft-fromLeft,time));
		this.top(this.easing(currentTime,fromTop,toTop-fromTop,time));
		var self = this;
		if(currentTime < time ) this.moveTimerId = setTimeout(function(){self.update.call(self,fromLeft,toLeft,fromTop,toTop,startTime,time)},10);
		else {
			this.left(toLeft);
			this.top(toTop);
		}
	}
	p.easing = function(t, b, c, d ) {
		var s = 0.7; if ((t /= d / 2) < 1) { return c / 2 * (t * t * (((s * 1.525) + 1) * t - s * 1.525)) + b; } return c / 2 * ((t -= 2) * t * (((s * 1.525) + 1) * t + s * 1.525) + 2) + b;
	}
	p.left = function(value){
		if(typeof value !== "undefined"){
			this._left = value;
			this.element.style.left = value + "px";
		}
		return this._left;
	}
	p.top = function(value){
		if(typeof value !== "undefined"){
			this._top = value;
			this.element.style.top = value + "px";
		}
		return this._top;
	}

function Button2(){
	this.initialize.apply(this,arguments);
}
var p = Button2.prototype;
	p.element = null;
	p.showLeft = 0;
	p.showTop = 0;
	p.hideLeft = 0;
	p.hideTop = 0;
	p._top = 0;
	p._left = 0;
	p.moveTimerId = 0;

	p.initialize = function(element){
		this.element = element;
		this.element.style.display="block";
		var style = element.currentStyle || document.defaultView.getComputedStyle(element, '');
		this.showLeft = parseFloat(style.left);
		this.showTop = parseFloat(style.top);
		this.hideLeft = this.showLeft + 200;
		this.hideTop =  this.showTop;
		this.left(this.hideLeft);
		this.top(this.hideTop);
	}
	p.show = function(){
		clearInterval(this.moveTimerId);
		this.update(this.left(),this.showLeft,this.top(),this.showTop,new Date().getTime(),0.8);
	}
	p.hide = function(){
		clearInterval(this.moveTimerId);
		this.update(this.left(),this.hideLeft,this.top(),this.hideTop,new Date().getTime(),0.8);
	}
	p.update = function(fromLeft,toLeft,fromTop,toTop,startTime,time)
	{
		var currentTime = (new Date().getTime() - startTime)/1000;
		this.left(this.easing(currentTime,fromLeft,toLeft-fromLeft,time));
		this.top(this.easing(currentTime,fromTop,toTop-fromTop,time));
		var self = this;
		if(currentTime < time ) this.moveTimerId = setTimeout(function(){self.update.call(self,fromLeft,toLeft,fromTop,toTop,startTime,time)},10);
		else {
			this.left(toLeft);
			this.top(toTop);
		}
	}
	p.easing = function(t, b, c, d ) {
		var s = 0.7; if ((t /= d / 2) < 1) { return c / 2 * (t * t * (((s * 1.525) + 1) * t - s * 1.525)) + b; } return c / 2 * ((t -= 2) * t * (((s * 1.525) + 1) * t + s * 1.525) + 2) + b;
	}
	p.left = function(value){
		if(typeof value !== "undefined"){
			this._left = value;
			this.element.style.left = value + "px";
		}
		return this._left;
	}
	p.top = function(value){
		if(typeof value !== "undefined"){
			this._top = value;
			this.element.style.top = value + "px";
		}
		return this._top;
	}

window.Navigation = Navigation;

}(window))