var Bang_Mover = new Class({
	Implements: [Events, Options],
	options: {
		"ul_tag":"ul",
		"duration":500
	},
	initialize: function(mover_id,left_id,right_id,options){
		this.setOptions(options);
		this.left_index = 0;
		this.ul_tag = this.options.ul_tag;
		this.mover = $(mover_id);
		this.left_bn = $(left_id);
		this.right_bn = $(right_id);
		this.ul = this.mover.getChildren(this.ul_tag)[0];
		this.lis = this.ul.getChildren();
		this.right_index = this.lis.length-1;
		this.ul_width = 0;
		this.lis.each(function(item,index){
			this.ul_width += this.get_width(item);
		}.bind(this));
		this.ul.set("styles",{	"width":this.ul_width,
														"left":0	});
		this.ul_clone = this.ul.clone().inject(mover_id);
		this.ul_clone.set("styles",{	"left":this.ul_width	});
		var duration = this.options.duration;
		this.ul_fx = new Fx.Tween(this.ul, {	"property": 'left',	"duration": duration, "transition": Fx.Transitions.Quart.easeInOut});
		this.ul_clone_fx = new Fx.Tween(this.ul_clone, {	"property": 'left',	"duration": duration, "transition": Fx.Transitions.Quart.easeInOut});
		this.left_bn.addEvent("click",function(e){
			this.left_bn_click();
		}.bind(this));
		this.right_bn.addEvent("click",function(e){
			this.right_bn_click();
		}.bind(this));
		this.after_initialize();
	},
	after_initialize:function()
	{
		//console.log("after_initialize");
	},
	get_width: function(element){
		var width = element.getSize().x + element.getStyle("margin-left").toInt() + element.getStyle("margin-right").toInt();
		//console.log(width);
		return width;
	},
	left_bn_click:function(){
		var index = 0;
		if(this.left_index>this.lis.length-1){
			this.left_index = 0;
			this.right_index = this.lis.length-1;
		}
		index = this.left_index;
		var ul_x = this.ul.getStyle("left").toInt();
		var ul_to = ul_x - this.get_width(this.lis[index]);
		this.ul_fx.start(ul_x,ul_to).chain(function(){
			if(this.left_index>=this.lis.length){
				this.ul.set("styles",{"left":0});
				this.ul_clone.set("styles",{"left":this.ul_width});
			}
		}.bind(this));
		var ul_clone_x = this.ul_clone.getStyle("left").toInt();
		var ul_clone_to = ul_clone_x-this.get_width(this.lis[index]);
		this.ul_clone_fx.start(ul_clone_x,ul_clone_to);
		this.left_index++;
		this.right_index = this.left_index-1;
		this.after_left_bn_click();
	},
	after_left_bn_click:function()
	{
		
	},
	right_bn_click:function(){
		if( this.right_index == this.lis.length-1){
			this.ul_clone.set("styles",{ "left":this.ul_width*(-1)});
		}
		var index = 0;
		index = this.right_index;
		var ul_x = this.ul.getStyle("left").toInt();
		var ul_to = ul_x + this.get_width(this.lis[index]);
		this.ul_fx.start(ul_x,ul_to).chain(function(){
			if(this.right_index>=this.lis.length-1){
				this.ul.set("styles",{"left":0});
				this.ul_clone.set("styles",{"left":this.ul_width});
			}
		}.bind(this));
		var ul_clone_x = this.ul_clone.getStyle("left").toInt();
		var ul_clone_to = ul_clone_x+this.get_width(this.lis[index]);
		this.ul_clone_fx.start(ul_clone_x,ul_clone_to);
		this.right_index--;
		if(this.right_index<0){
			this.right_index = this.lis.length-1;
			this.left_index = 0;
		}else{
			this.left_index = this.right_index+1;
		}
		this.after_right_bn_click();
	},
	after_right_bn_click:function()
	{
	
	}
});