var Bang_Mover_UpDown = new Class({
	Implements: [Events, Options],
	options: {
		"ul_tag":"ul",
		"duration":500
	},
	initialize: function(mover_id,top_id,down_id,options){
		this.setOptions(options);
		this.top_index = 0;
		this.ul_tag = this.options.ul_tag;
		this.mover = $(mover_id);
		this.top_bn = $(top_id);
		this.down_bn = $(down_id);
		this.ul = this.mover.getChildren(this.ul_tag)[0];
		this.lis = this.ul.getChildren();
		this.down_index = this.lis.length-1;
		this.ul_height = 0;
		this.lis.each(function(item,index){
			this.ul_height += this.get_height(item);
		}.bind(this));
		this.ul.set("styles",{	"height":this.ul_height,
														"top":0	});
		this.ul_clone = this.ul.clone().inject(mover_id);
		this.ul_clone.set("styles",{	"top":this.ul_height	});
		var duration = this.options.duration;
		this.ul_fx = new Fx.Tween(this.ul, {	"property": 'top',	"duration": duration, "transition": Fx.Transitions.Quart.easeInOut});
		this.ul_clone_fx = new Fx.Tween(this.ul_clone, {	"property": 'top',	"duration": duration, "transition": Fx.Transitions.Quart.easeInOut});
		this.top_bn.addEvent("click",function(e){
			this.top_bn_click();
		}.bind(this));
		this.down_bn.addEvent("click",function(e){
			this.down_bn_click();
		}.bind(this));
	},
	get_height: function(element){
		if(element.getStyle("height")){
			var ls_height	=	parseInt(element.getStyle("height"));
		}else{
			var ls_height	=	0;
		}
		if(element.getStyle("margin-top")){
			var ls_top	=	parseInt(element.getStyle("margin-top"));
		}else{
			var ls_top	=	0;
		}
		if(element.getStyle("margin-down")){
			var ls_down	=	parseInt(element.getStyle("margin-down"));
		}else{
			var ls_down	=	0;
		}
		var height	=	ls_height + ls_top + ls_down ;
		return height;
	},
	top_bn_click:function(){
		var index = 0;
		if(this.top_index>this.lis.length-1){
			this.top_index = 0;
			this.down_index = this.lis.length-1;
		}
		index = this.top_index;
		var ul_x = this.ul.getStyle("top").toInt();
		var ul_to = ul_x - this.get_height(this.lis[index]);
		this.ul_fx.start(ul_x,ul_to).chain(function(){
			if(this.top_index>=this.lis.length){
				this.ul.set("styles",{"top":0});
				this.ul_clone.set("styles",{"top":this.ul_height});
			}
		}.bind(this));
		var ul_clone_x = this.ul_clone.getStyle("top").toInt();
		var ul_clone_to = ul_clone_x-this.get_height(this.lis[index]);
		this.ul_clone_fx.start(ul_clone_x,ul_clone_to);
		this.top_index++;
		this.down_index = this.top_index-1;

	},
	down_bn_click:function(){
		if( this.down_index == this.lis.length-1){
			this.ul_clone.set("styles",{ "top":this.ul_height*(-1)});
		}
		var index = 0;
		index = this.down_index;
		var ul_x = this.ul.getStyle("top").toInt();
		var ul_to = ul_x + this.get_height(this.lis[index]);
		this.ul_fx.start(ul_x,ul_to).chain(function(){
			if(this.down_index>=this.lis.length-1){
				this.ul.set("styles",{"top":0});
				this.ul_clone.set("styles",{"top":this.ul_height});
			}
		}.bind(this));
		var ul_clone_x = this.ul_clone.getStyle("top").toInt();
		var ul_clone_to = ul_clone_x+this.get_height(this.lis[index]);
		this.ul_clone_fx.start(ul_clone_x,ul_clone_to);
		this.down_index--;
		if(this.down_index<0){
			this.down_index = this.lis.length-1;
			this.top_index = 0;
		}else{
			this.top_index = this.down_index+1;
		}
	}
});
