Slider = {
  create: function(options_user) {
  	var o = new Slider.Obj();
  	o.create(options_user);
  },
  
  Obj: function() {
  	this.options = {
      id: "fblikebox",
      pos: "fixed",
      side: "left",
      container_w: 292,
      container_h: 290,
      handle_w: 31,
      handle_h: 103
    };
    this.location = 0;
    this.locationFloat = 0;
    this.mainElem = null;
    this.handleElem = null;
  	this.create = function(options_user) {
	    if (typeof(options_user) != 'undefined')
	      $.extend(this.options, options_user);
	    
	    this.mainElem = $("#" + this.options.id);
	    this.handleElem = $(".handle", this.mainElem);
	    
	    this.mainElem.css('z-index', 10000);
	    this.mainElem.css('width', this.options.container_w + 'px');
	    this.mainElem.css('height', this.options.container_h + 'px');
	    this.locationFloat = this.location = (-1 * this.options.container_w);
	    this.mainElem.css((this.options.side == 'left' ? 'left' : 'right'), this.location + 'px');
	    this.mainElem.css('position', this.options.pos);
	        
	    this.handleElem.css('z-index', 10000);
	    this.handleElem.css('width', this.options.handle_w + 'px');
	    this.handleElem.css('height', this.options.handle_h + 'px');
	    this.handleElem.css((this.options.side == 'left' ? 'right' : 'left'), (-1 * this.options.handle_w) + 'px');
	    this.handleElem.css('position', 'absolute');
	    
	    var _this = this;
	    this.mainElem.hover(
	      function() {
	      	_this.animate(0, (_this.options.container_w / (300/10)),
		      	function(){
		      		_this.mainElem.css('z-index', 10002);
	    			_this.handleElem.css('z-index', 10002);
		      	},
		      	function(){
		      		_this.mainElem.css('z-index', 10001);
	    			_this.handleElem.css('z-index', 10001);
		      	}
	      	);
	        return false;
	      },
	      function() {
	      	_this.animate((-1 * _this.options.container_w), -1 * (_this.options.container_w / (300/10)),
		      	function(){
		      		_this.mainElem.css('z-index', 10000);
	    			_this.handleElem.css('z-index', 10000);
		      	},
		      	function(){}
	      	);
	        return false;
	      }
	    );
	    this.mainElem.show();
	};
	this.interval = null;
	this.target = null;
	this.delta = null;
	this.finishCb = null;
	this.animate = function(target, delta, startCb, finishCb) {
		this.stop();
		
		this.finishCb = finishCb;
		this.target = target;
		this.delta = delta;
		this.locationFloat = this.location;
		startCb();
		
		var _this = this;
		this.interval = setInterval(function(){
			_this.step();
		}, 10);
	};
	this.step = function() {
		this.locationFloat += this.delta;
		
		if (this.delta < 0)
			this.locationFloat = Math.max(this.locationFloat, this.target);
		else
			this.locationFloat = Math.min(this.locationFloat, this.target);
		
		this.location = Math.round(this.locationFloat);
		
	    this.mainElem.css(this.options.side, this.location + 'px');
		
		if (this.location == this.target)
			this.stop();
	};
	this.stop = function() {
		try {
			clearInterval(this.interval);
		}
		catch (exc) {}
		if (this.finishCb !== null)
			this.finishCb();
		this.finishCb = null;
	};
  }
}

