/**
 * Used to scroll through children in a visible list, one or more children
 * at a time.
 */
var Slider = base2.Base.extend(
{
    /**
     * Constructs the slide region. Params:
     *
     * viewport:  The DIV inside which the child elements slide.
     * path:      The path relative to the containing DIV to the individual
     *            elements to be slid.
     * speed:     The number of milliseconds that the slide should take.
     * units:     The number of child units to slide each time.
     */
    constructor : function(viewport, path, speed, units)
    {
        this.viewport = viewport;
        this.path = path;
        this.speed = speed;
        this.units = units; // This currently doesn't work
        this.timer = null;
        this.processing = false;
        this.initialized = false;
		
		this.easing = "easeInOutBack";
		this.easing = "easeInOutQuad";
    },

    /**
     * Slides the panel based on the number of units, speed and direction.
     */
    slide : function(direction)
    {
        if (this.processing)
            return;
            
        if (!direction)
            throw Exception("Direction unspecified");
      
        var viewport = $(this.viewport);
        var kids = $(this.path, viewport);
        if (kids.length <= 1)
            return;

        var container = kids.parent();
        if (((direction == Slider.Direction.LEFT || direction == Slider.Direction.RIGHT) &&
             viewport.innerWidth() >= container.outerWidth()) ||
            ((direction == Slider.Direction.UP || direction == Slider.Direction.DOWN) &&
             viewport.innerHeight() >= container.outerHeight()))
            return;

		var amount = this.units;


        var outer = this;
        var kid, change;
        this.processing = true;
        if (direction == Slider.Direction.LEFT)
        {
			change = 0;
			for (i = 0; i < amount; i++) {
				kid = kids.eq(i);
				change += kid.outerWidth({margin: true});
				container.append(kid.clone(true));
			}

            container.animate({left: -change + "px"}, this.speed, this.easing, function()
            {
				for (i = 0; i < amount; i++) {
					kid = kids.eq(i);
	                kid.remove();
				}
                container.css("left", "0px");
                outer.processing = false;
            });
        }
        else if (direction == Slider.Direction.UP)
        {
            kid = kids.eq(0);
            change = kid.outerHeight({margin : true});
            container.append(kid.clone(true));

            container.animate({top: -change + "px"}, this.speed, this.easing, function()
            {
                kid.remove();
                container.css("top", "0px");
                outer.processing = false;
            });
        }
        else if (direction == Slider.Direction.RIGHT)
        {
			change = 0;
			for (i = 1; i <= amount; i++) {
				kid = kids.eq(kids.length - i);
				change += kid.outerWidth({margin: true});
				
				container.prepend(kid.clone(true));
				container.css("left", -change + "px");
			}

            container.animate({left: "0px"}, this.speed, this.easing, function()
            {
				for (i = 0; i < amount; i++) {
					//alert(kids.length - 1 - i);
					kid = kids.eq(kids.length - 1 - i);
					kid.remove();
					outer.processing = false;
				}
            });
        }
        else if (direction == Slider.Direction.DOWN)
        {
            kid = kids.eq(kids.length - i);
            change = kid.outerHeight({margin : true});

            container.prepend(kid.clone(true));
            container.css("top", -change + "px");

            container.animate({top: "0px"}, this.speed, this.easing, function()
            {
                kid.remove();
                outer.processing = false;
            });
        }
    }
},
{
    Direction : {LEFT : 1, RIGHT : 2, UP : 3, DOWN : 4}
});


/**
 * Inherits the SlideRegion to include automatic timed sliding.
 */
var AutoSlider = Slider.extend(
{
    /**
     * Constructs the slide region. Params:
     *
     * viewport:  The DIV inside which the child elements slide.
     * path:      The path relative to the containing DIV to the individual
     *            elements to be slid.
     * wait:      The number of seconds to wait per tick.
     * speed:     The number of milliseconds that the slide should take.
     * direction: The direction enumeration value {@see Ticker.Direction}.
     * units:     The number of child units to slide each time.
     */
    constructor : function(viewport, path, speed, units, wait, direction)
    {
        this.base(viewport, path, speed, units);

        this.wait = wait;
        this.direction = direction;
		
		this.started = false;
    },
    
    
    /**
     * Starts the ticker.
     */
    start : function()
    {
        var outer = this;
		if (!this.started) {
			this.timer = setTimeout(function(){
				outer.slide()
			}, this.wait * 1000);
			this.started = true;
		}
    },
    
    /**
     * Stops the ticker.
     */
    stop : function()
    {
            clearTimeout(this.timer);
            this.timer = null;
			this.started = false;
    },

    /**
     * Slides the panel based on the number of units, speed and direction.
     */
    slide : function(direction)
    {
        if (direction)
            this.direction = direction;
            
        this.stop();
        this.base(this.direction);
        this.start();
    },
    
    /**
     * Sets the direction that the ticker should slide units.
     */
    setDirection : function(direction)
    {
        this.direction = direction;
    }
});