/**************************************************************************
	Created by Chris Murphy
	CDW
	2008/04/28

	Modified by Steve Veerman
	2010/03/01

	Slider 1.03

	Div Slider function
	This function 'slides' the underlying div either left or right.

	Required framework - jQuery +

	CSS/HTML Layout -
		<a href="javascript: void(0)" id="btnSlideLeft" >left </a>
		<a href="javascript: void(0)" id="btnSlideRight" > right</a>


		<div id="slider" style="width: 375px; height: 100px; border: 1px solid #999; overflow: hidden; position: relative;">
			<div id="movieSliderContent" style="position: relative;">
				<!-- Build these dynamically and set the width property of 'movieSliderContent' to match the total width of your content -->

				<div id="box1" style="float: left; width: 375px; height: 100px; border-right: 0px dashed red; background-color: #ccc;">box 1</div>
				<div id="box2" style="float: left; width: 375px; height: 100px; border-right: 0px dashed red; background-color: #ddd;">box 2</div>
				<div id="box3" style="float: left; width: 375px; height: 100px; border-right: 0px dashed red; background-color: #eee;">box 3</div>

				<!-- /Build these dynamically -->
			</div>
		</div>

	JS Code -
		<script language='javascript'>

			var mySlider = new Slider('slider', 'movieSliderContent', 10);

			$('btnSlideLeft').onclick = function() { mySlider.slideLeft('mySlider'); };
			$('btnSlideRight').onclick = function() { mySlider.slideRight('mySlider'); };

		</script>

	REVISIONS -
		1.02 - Added motionLength(ms) parameter to constructor
		1.03 - Added ability to slide up and down
*/

// Deprecated, use MultiSlider2
function Slider (parent, child, items, motionLength)
{
		// id of parent div that must have overflow: hidden;
		this.parent = parent;
		// id of div to slide
		this.child = child;
		// first location of object to show - 0 Based
		this.step = 1;
		//total number of steps
		this.totalSteps = items;
		// size of slide - px
		this.stepSize = jQuery('#'+this.parent).width();
		// left start position for motion - px
		this.motionStartPosition = this.step * this.stepSize;
		// left end position for motion - px
		this.motionEndPosition = null;
		// current position of motion - px
		this.motionCurrentPosition = this.step * this.stepSize;
		// timer used to make motion
		this.motionTimer = null;

		// total length of motion - milliseconds
		if(motionLength > 0)
			this.motionLength = motionLength;
		else
			this.motionLength = 500;
		// time motion was started
		this.startTime = null;
		// frame rate
		this.speed = 40; // 1000ms/'40ms' = 25fps

		// number of items to show ( sets the width of the child element based on the parents 'window' )
		// do not use the jQuery.css() method, as it breaks when mapquest maps are included on the same page (as in the movie guide)
		document.getElementById(this.child).style.left = '-' + this.step * this.stepSize + 'px';
		document.getElementById(this.child).style.width = items * this.stepSize + 'px';
		//jQuery('#'+this.child).css('left',"-" + this.step * this.stepSize + "px");
		//jQuery('#'+this.child).css('width',items * this.stepSize + "px");

		// width of div to slide
		this.sliderWidth = jQuery('#'+this.child).width();

	this.slideLeft = function(obj) {
		// clear the timer in case someone clicks before motion is complete
		clearInterval(this.motionTimer);

		// check current position
		var currentPosition = this.step * this.stepSize;

		if(this.step > 0) {
			// update step
			this.step--;

			// calculate new position
			var newPosition = this.step * this.stepSize;

			// set start position
			this.motionStartPosition = currentPosition;

			// set current position
			this.motionCurrentPosition = currentPosition;

			// set end position
			this.motionEndPosition = newPosition;

			// start motion
			this.motionTimer = setInterval(obj + ".startMotion()", this.speed);
		}
	}

	this.slideRight = function(obj) {
		// clear the timer in case someone clicks before motion is complete
		clearInterval(this.motionTimer);

		// check current position
		var currentPosition = this.step * this.stepSize;

		// calculate new position
		this.step++;
		var newPosition = this.step * this.stepSize;

		// slide it if the newPosition is within the visible slider
		if(newPosition <= this.sliderWidth - this.stepSize) {
			// set start position
			this.motionStartPosition = currentPosition;

			// set current position
			this.motionCurrentPosition = currentPosition;

			// set end position
			this.motionEndPosition = newPosition;

			// start motion
			this.motionTimer = setInterval(obj + ".startMotion()", this.speed);
		}
		else {
			// decrement the step or it will affect the other calls
			this.step--;
		}

	}
	this.startMotion = function() {
		if(!this.startTime) {
			// set motion start time
			this.startTime=new Date().getTime();
			//this.startTimeSet = true;
		}

		// get elapsed motion time
		var elapsedTime = new Date().getTime() - this.startTime;

		if(elapsedTime < this.motionLength) {
			// motion is still active
			if(this.motionStartPosition > this.motionEndPosition) {
				// move to the left

				// get percentage increment (cos)
				var increment = (1-Math.cos((elapsedTime/this.motionLength)*Math.PI)) / 2;

				// set new position
				this.motionCurrentPosition = this.motionStartPosition - (increment * this.stepSize);
			}
			else {
				// move to the right

				// get percentage increment (cos)
				var increment = (1-Math.cos((elapsedTime/this.motionLength)*Math.PI)) / 2;

				// set new position
				this.motionCurrentPosition = this.motionStartPosition + (increment * this.stepSize);
			}

			// update object
			document.getElementById(this.child).style.left = "-" + this.motionCurrentPosition  + "px";
			//jQuery('#'+this.child).css('left',"-" + this.motionCurrentPosition  + "px");
		}
		else {
			// motion should be complete
			clearInterval(this.motionTimer);

			// reset startTime
			this.startTime = null;

			// update object to ensure at end position
			if(this.motionEndPosition + this.stepSize == this.sliderWidth)
			{
			   //on the last frame (last frame is a duplicate of first frame
			   document.getElementById(this.child).style.left = '-' + this.stepSize + 'px';
			   //jQuery('#'+this.child).css('left',"-" + this.stepSize + "px");
			   this.step = 1;
			}
			else if(this.step == 0)
			{
			    this.step = this.totalSteps - 2;
				document.getElementById(this.child).style.left = "-" + (this.step * this.stepSize) + "px";
			    //jQuery('#'+this.child).css('left',"-" + (this.step * this.stepSize) + "px");

			}
			else
				document.getElementById(this.child).style.left = "-" + this.motionEndPosition  + "px";
			    //jQuery('#'+this.child).css('left',"-" + this.motionEndPosition  + "px");
		}
	}
}

// Deprecated, use MultiSlider2
function MultiSlider(sliderwindow, content, item, items, show, motionLength) {
        // the visible section
        this.sliderWindow = sliderwindow;
        // id of div to slide
        this.content = content;
        // first location of object to show - 0 Based
        this.step = show - 1;
        // total number of steps
        this.totalSteps = items;
        // How many steps show at one time.
        this.showSteps = show;
        // size of slide - px
        this.stepWidth = jQuery("#"+item).outerWidth();
        // left start position for motion - px
        this.motionStartPosition = this.step * this.stepWidth;
        // left end position for motion - px
        this.motionEndPosition = null;
        // current position of motion - px
        this.motionCurrentPosition = this.step * this.stepWidth;
        // timer used to make motion
        this.motionTimer = null;
        // width of div to slide
        this.sliderWidth = this.stepWidth * this.totalSteps;

        // total length of motion - milliseconds
        if (motionLength > 0)
            this.motionLength = motionLength;
        else
            this.motionLength = 500;
        // time motion was started
        this.startTime = null;
        // frame rate
        this.speed = 40; // 1000ms/'40ms' = 25fps

        // moves the visible items to the appropriate starting location
        jQuery('#'+this.sliderWindow).css('width',this.showSteps * this.stepWidth + "px");

        // number of items to show ( sets the width of the child element based on the parents 'window' )
        jQuery('#'+this.content).css('left',"-" + this.step * this.stepWidth + "px");
        jQuery('#'+this.content).css('width',this.sliderWidth + "px");



        this.slideLeft = function(obj) {
        // clear the timer in case someone clicks before motion is complete
        clearInterval(this.motionTimer);

        if (this.step > 0) {
            // check current position
            var currentPosition = this.step * this.stepWidth;

            // update step
            this.step--;

            // calculate new position
            var newPosition = this.step * this.stepWidth;

            // set start position
            this.motionStartPosition = currentPosition;

            // set current position
            this.motionCurrentPosition = currentPosition;

            // set end position
            this.motionEndPosition = newPosition;

            // start motion
            this.motionTimer = setInterval(obj + ".startMotion()", this.speed);
        }
        else {
            this.step = this.totalSteps - this.showSteps;
            jQuery('#'+this.content).css('left',"-" + this.step * this.stepWidth + "px");

            // check current position
            var currentPosition = this.step * this.stepWidth;
            this.step = this.totalSteps - this.showSteps - 1;

            // calculate new position
            var newPosition = this.step * this.stepWidth;

            // set start position
            this.motionStartPosition = currentPosition;

            // set current position
            this.motionCurrentPosition = currentPosition;

            // set end position
            this.motionEndPosition = newPosition;

            // start motion
            this.motionTimer = setInterval(obj + ".startMotion()", this.speed);
        }
    }

    this.slideRight = function(obj) {
        // clear the timer in case someone clicks before motion is complete
        clearInterval(this.motionTimer);

        // check current position
        var currentPosition = this.step * this.stepWidth;

        // calculate new position
        this.step++;
        var newPosition = this.step * this.stepWidth;

        // slide it if the newPosition is within the visible slider
        if (newPosition <= this.sliderWidth - this.stepWidth) {
            // set start position
            this.motionStartPosition = currentPosition;

            // set current position
            this.motionCurrentPosition = currentPosition;

            // set end position
            this.motionEndPosition = newPosition;

            // start motion
            this.motionTimer = setInterval(obj + ".startMotion()", this.speed);
        }
        else {
            // decrement the step or it will affect the other calls
            this.step--;
        }
    }

	this.startMotion = function() {
        if (!this.startTime) {
            // set motion start time
            this.startTime = new Date().getTime();
            //this.startTimeSet = true;
        }

        // get elapsed motion time
        var elapsedTime = new Date().getTime() - this.startTime;

        if (elapsedTime < this.motionLength) {
            // motion is still active
            if (this.motionStartPosition > this.motionEndPosition) {
                // move to the left

                // get percentage increment (cos)
                var increment = (1 - Math.cos((elapsedTime / this.motionLength) * Math.PI)) / 2;

                // set new position
                this.motionCurrentPosition = this.motionStartPosition - (increment * this.stepWidth);
            }
            else {
                // move to the right

                // get percentage increment (cos)
                var increment = (1 - Math.cos((elapsedTime / this.motionLength) * Math.PI)) / 2;

                // set new position
                this.motionCurrentPosition = this.motionStartPosition + (increment * this.stepWidth);
            }

            // update object
            jQuery('#'+this.content).css('left',"-" + this.motionCurrentPosition + "px");
        }
        else {
            // motion should be complete
            clearInterval(this.motionTimer);

            // reset startTime
            this.startTime = null;

            // update object to ensure at end position
            if (this.motionEndPosition + this.stepWidth == this.sliderWidth) {
                //on the last frame (last frame is a duplicate of first frame
                if (this.showSteps > 1) {
                    jQuery('#'+this.content).css('left',"-" + this.stepWidth + "px");
                    this.step = 1;
                }
                else {
                    jQuery('#'+this.content).css('left',"-" + this.step * this.stepWidth + "px");
                    this.step = 0;
                }
            }
            else if (this.step < 0) {
                this.step = this.totalSteps - ((this.showSteps - 1) * 2) - 1;
                jQuery('#'+this.content).css('left',"-" + (this.step * this.stepWidth) + "px");

            }
            else if (this.step > (this.totalSteps - this.showSteps - 1)) {
                this.step = 0;
                jQuery('#'+this.content).css('left', "-" + this.step * this.stepWidth + "px");
            }
            else {
                jQuery('#'+ this.content).css('left',"-" + this.motionEndPosition + "px");
            }
        }
    }
}

function MultiSlider2(frame, content, item, steps, show, motionLength, move, axis) {
	// the visible section
	this.frame = frame;
	// id of div to slide
	this.content = content;
	// first location of object to show - 0 Based
	this.step = 0;
	// current step position
	this.currentStep = this.step;
	// total number of steps
	this.totalSteps = steps;
	// How many steps show at one time.
	this.showSteps = show;
	// How many steps to move at one time.
	this.moveSteps = move;
	// timer used to make motion
	this.motionTimer = null;
	// Direction to move
	this.direction = null;
	// Axis of slider horizontal (default) vs vertical
	this.axis = axis;

	// Get each item
	this.items = new Array();
	for (x = 0; x < this.totalSteps; x++) {
		this.items[x] = jQuery('#'+item + "_" + x);
	}

	// size of slide - px. find max width/height of item
	this.stepWidth = 0;
	for (x = 0; x < this.totalSteps; x++)
		if (this.items[x].width() > this.stepWidth)
			this.stepWidth = this.items[x].width();
	this.stepHeight = 0;
	for (x = 0; x < this.totalSteps; x++)
		if (this.items[x].height() > this.stepHeight)
			this.stepHeight = this.items[x].height();

	// width of content div.  Contains all items and extra width on each side
	this.sliderWidth = (this.moveSteps * this.stepWidth);
	this.sliderHeight = (this.moveSteps * this.stepHeight);

	// Motion Start
	this.startPosition = 0;
	// Motion End
	this.endPosition = this.startPosition;
	// Current motion position
	this.currentPosition = this.startPosition;
	// number of end items that have been moved to the front
	this.itemsMoved = 0;

	// total length of motion - milliseconds
	if (motionLength > 0)
		this.motionLength = motionLength;
	else
		this.motionLength = 500;
	// time motion was started
	this.startTime = null;
	// frame rate
	this.speed = 80; // 1000ms/'40ms' = 25fps

	// moves the visible items to the appropriate starting location
	if (this.axis == "vertical")
	{
		jQuery('#'+this.frame).css('width',this.stepWidth + "px");
		jQuery('#'+this.frame).css('height',(this.showSteps * this.stepHeight) + "px");
		// number of items to show ( sets the height of the child element based on the parents 'window' )
		jQuery('#'+this.content).css('height',(this.totalSteps * this.stepHeight) + "px");
	}
	else //horizontal
	{
		jQuery('#'+this.frame).css('width',(this.showSteps * this.stepWidth) + "px");
		jQuery('#'+this.frame).css('height',this.stepHeight + "px");
		// number of items to show ( sets the width of the child element based on the parents 'window' )
		jQuery('#'+this.content).css('width',(this.totalSteps * this.stepWidth) + "px");
	}

	// Set the size and position of each item
	this.shifts = new Array();
	for (x = 0; x < this.totalSteps; x++) {
		if (this.axis == "vertical")
		{
			this.shifts[x] = ((this.stepHeight * x));
			this.items[x].css('top',this.shifts[x] + "px");
		}
		else
		{
			this.shifts[x] = ((this.stepWidth * x));
			this.items[x].css('left',this.shifts[x] + "px");
		}
		this.items[x].css('width',this.stepWidth + "px");
		this.items[x].css('height',this.stepHeight + "px");
	}

	this.slide = function(obj,direction) {
		if (this.direction == null) {
			// clear the timer in case someone clicks before motion is complete
			clearInterval(this.motionTimer);

			// update position
			if ((direction == "left") || (direction == "up"))
			{
				this.step -= this.moveSteps;
				if (this.step < 0)
					this.step = this.totalSteps + this.step;

				// Direction to move
				if (direction == "up")
					this.endPosition = this.startPosition + (this.stepHeight * this.moveSteps);
				else
					this.endPosition = this.startPosition + (this.stepWidth * this.moveSteps);
			}
			else //direction = "right" or "down"
			{
				this.step += this.moveSteps;
				// loop around to the beginning
				if (this.step > this.totalSteps)
					this.step = this.step - this.totalSteps;

				// Direction to move
				if (direction == "down")
					this.endPosition = this.startPosition - (this.stepHeight * this.moveSteps);
				else
					this.endPosition = this.startPosition - (this.stepWidth * this.moveSteps);
			}

			this.direction = direction;
			this.currentPosition = this.startPosition;

			// start motion
			this.motionTimer = setInterval(obj + ".startMotion()", this.speed);
		}
	}

	this.slideLeft = function(obj) {
		this.slide(obj,"left");
	}

	this.slideRight = function(obj) {
		this.slide(obj,"right");
	}

	this.slideUp = function(obj) {
		this.slide(obj,"up");
	}

	this.slideDown = function(obj) {
		this.slide(obj,"down");
	}

	this.startMotion = function() {
		if (!this.startTime) {
			// set motion start time
			this.startTime = new Date().getTime();
			//this.startTimeSet = true;
		}

		// get elapsed motion time
		var elapsedTime = new Date().getTime() - this.startTime;
		var increment = (1 - Math.cos((elapsedTime / this.motionLength) * Math.PI)) / 2;

		if (elapsedTime < this.motionLength) {
			if (this.direction == "left") { // Move left
				this.currentPosition = this.startPosition + (increment * (this.sliderWidth));
					if (this.currentPosition <= this.endPosition) {
					// Move each item right
					for (x = this.totalSteps - 1; x >= 0; x--) {
						var left = this.shifts[x] + this.currentPosition;
						if (left > ((this.totalSteps - 1) * this.stepWidth)) {
							this.itemsMoved++;
							this.shifts[x] = (-1 * this.itemsMoved) * this.stepWidth;
							left = this.shifts[x] + this.currentPosition;
						}
						this.items[x].css('left',left + "px");
					}
				}
			}
			else if (this.direction == "right") { // Move right
				this.currentPosition = this.startPosition - (increment * (this.sliderWidth));
				if (this.currentPosition >= this.endPosition) {
					// Move each item left
					for (x = 0; x < this.totalSteps; x++) {
						var left = this.shifts[x] + this.currentPosition;
						if (left <= (-1 * this.stepWidth)) {
							this.shifts[x] = (this.shifts[x] + (this.totalSteps * this.stepWidth));
							left = this.shifts[x] + this.currentPosition;
						}
						this.items[x].css('left',left + "px");
					}
				}
			}
			else if (this.direction == "up") { // Move up
				this.currentPosition = this.startPosition + (increment * (this.sliderHeight));
				if (this.currentPosition <= this.endPosition) {
					// Move each item down
					for (x = this.totalSteps - 1; x >= 0; x--) {
						var top = this.shifts[x] + this.currentPosition;
						if (top > ((this.totalSteps - 1) * this.stepHeight)) {
							this.itemsMoved++;
							this.shifts[x] = (-1 * this.itemsMoved) * this.stepHeight;
							top = this.shifts[x] + this.currentPosition;
						}
						this.items[x].css('top',top + "px");
					}
				}
			}
			else if (this.direction == "down") { // Move down
				this.currentPosition = this.startPosition - (increment * (this.sliderHeight));
				if (this.currentPosition >= this.endPosition) {
					// Move each item up
					for (x = 0; x < this.totalSteps; x++) {
						var top = this.shifts[x] + this.currentPosition;
						if (top <= (-1 * this.stepHeight)) {
							this.shifts[x] = (this.shifts[x] + (this.totalSteps * this.stepHeight));
							top = this.shifts[x] + this.currentPosition;
						}
						this.items[x].css('top',top + "px");
					}
				}
			}
		}
		else {
			// motion should be complete
			clearInterval(this.motionTimer);

			// reset startTime
			this.startTime = null;

			// set the current position
			this.currentStep = this.step;

			// Complete the move for each item
			for (x = 0; x < this.totalSteps; x++) {
				if (this.axis == "vertical")
				{
					this.shifts[x] += this.endPosition
					if (this.shifts[x] <= (-1 * this.stepHeight)) {
						this.shifts[x] += (this.totalSteps * this.stepHeight);
					}
					this.items[x].css('top',this.shifts[x] + "px");
				}
				else //horizontal
				{
					this.shifts[x] += this.endPosition
					if (this.shifts[x] <= (-1 * this.stepWidth)) {
						this.shifts[x] += (this.totalSteps * this.stepWidth);
					}
					this.items[x].css('left',this.shifts[x] + "px");
				}
			}
			this.startPosition = 0;
			this.currentPosition = 0;
			this.endPosition = 0;
			this.itemsMoved = 0;
			this.direction = null;
		}
	}
}