/*************************************************************************************
NOTICE: This software is authored and owned soley by Common Link, LLC 
Any use of this software, outside of Common Link staff, without 
express written autorization of Common Link, LLC, is strictly forbidden.
*************************************************************************************/
// Morph will animate an object from any startWidth & startHeight and "morph"
// it into the endWidth & endHeight.

// Morph only works with one layer "type" for each instance.

function Morph(defaultWidth, defaultHeight)
{
	this.defaultWidth = defaultWidth;
	this.defaultHeight = defaultHeight;

	// Get the length and width of the current layer (W & H need to be set on the inline style to get these values).
	Morph.prototype.getLayerDimensions = function() {
		this.curWidth = parseInt(this.layerObj.style.width);
		this.curHeight = parseInt(this.layerObj.style.height);
	}

	// Set's the start and end widths & heights to the default width and height.
	// if any of the values are not set.

	Morph.prototype.setLayerStartEnd = function() {
		if (this.startWidth == "") {
			this.startWidth = this.defaultWidth;
		}

		if (this.startHeight == "") {
			this.startHeight = this.defaultHeight;
		}

		if (this.endWidth == "") {
			this.endWidth = this.defaultWidth;
		}

		if (this.endHeight == "") {
			this.endHeight = this.defaultHeight;
		}
	}

	// Lengths and Widths can grow or shrink independently.
	// The entire box doesn't always grow or always shrink. 

	Morph.prototype.getDirection = function() {
		this.setLayerStartEnd();

		if (this.startWidth > this.endWidth) {
			// Shrinking width.		
			this.wDirection = -1;
			this.wSpan = this.startWidth - this.endWidth;
		} else if (this.startWidth < this.endWidth) {
			// Growing width.
			this.wDirection = 1;
			this.wSpan = this.endWidth - this.startWidth;
		}

		if (this.startHeight > this.endHeight) {
			// Shrinking height.
			this.hDirection = -1;
			this.hSpan = this.startHeight - this.endHeight;
		} else if (this.startHeight < this.endHeight) {
			// Growing height.
			this.hDirection = 1;
			this.hSpan = this.endHeight - this.startHeight;
		}
	}

	Morph.prototype.movObject = function() {
		var wDone = "";
		var hDone = "";

		if (this.newWidth == "") {
			this.newWidth = this.startWidth;
		}

		if (this.newHeight == "") {
			this.newHeight = this.startHeight;
		}

		this.newWidth = this.newWidth + (this.wDirection * this.wPixelsPerTic);
		this.newHeight = this.newHeight + (this.hDirection * this.hPixelsPerTic);

		if (this.wDirection == -1) {
			if (this.newWidth <= this.endWidth) {
				this.newWidth = this.endWidth;
				wDone = 1;
			}
		} else {
			if (this.newWidth >= this.endWidth) {
				this.newWidth = this.endWidth;
				wDone = 1;
			}
		}

		if (this.hDirection == -1) {
			if (this.newHeight <= this.endHeight) {
				this.newHeight = this.endHeight;
				hDone = 1;
			}
		} else {
			if (this.newHeight >= this.endHeight) {
				this.newHeight = this.endHeight;
				hDone = 1;
			}
		}

		// Set the Dims with the new size, then check to see if we're done.
		this.layerObj.style.width = this.newWidth + "px";
		this.layerObj.style.height = this.newHeight + "px";

		if (wDone == 1 && hDone == 1) {
			this.stopAnim();
			return;
		}
	}

	Morph.prototype.startAnim = function(startWidth, startHeight, endWidth, endHeight, morphTime) {
		this.stopAnim(); // stop any running animations before starting a new one.
		this.startWidth = startWidth;
		this.startHeight = startHeight;
		this.endWidth = endWidth;
		this.endHeight = endHeight;
		this.morphTime = morphTime; // Time for the entire Morph animation to occur.
		this.morphTics = 40; // Number of loops that will occur in the morphTime.

		this.layerObj = document.getElementById(this.layerName);

		// Tells us if the width & height are shrinking, expanding, etc...
		this.getDirection();

		// Set the layer to the beginning width/height.
                this.layerObj.style.width = this.startWidth + "px";
                this.layerObj.style.height = this.startHeight + "px";

		this.newWidth = "";
		this.newHeight = "";

		// Calculate the delay for setInterval.
		this.delay = Math.round(this.morphTime/this.morphTics);

		// Get the amount of pixels the Width & Height will change each clock tic.
		this.wPixelsPerTic = Math.ceil(this.wSpan/this.morphTics) + 1;
		this.hPixelsPerTic = Math.ceil(this.hSpan/this.morphTics) + 1;

		var thisClass = this; // For the "scope" problem and window.setTimeout & window.setInterval

		this.timerId = window.setInterval(function(e) {  
			thisClass.movObject() 
		}, this.delay)
	}

	Morph.prototype.stopAnim = function() {
		clearInterval(this.timerId);
		return;
	}
}