/*************************************************************************************
*
*	Title: resizeHelper.js
*	Author: Burton Assembly
*	Owner: Burton Snowboards Corporation
*	Description: 
*		Some helper functions to aid with resizing
*	This javascript file assumes that jquery is loaded in before this file.
*	(probably more to come on this later.)
*
*************************************************************************************/

// This extends the Function object to allow for default parameters being passed into 
/******************************************
*	USE:::
*
*	function Foo() { this.bla = 1; }
*	Foo.prototype.foo = function(a, b) {
*	return this.bla + ':' + a + '/' + b;
*	};

*	var f = new Foo;
*	f.foo = f.foo.defaults(f, 42, 'default_b');
*
*	f.foo(10, 20); // returns "1:10/20"
*	f.foo(10); // returns "1:10/default_b"
*	f.foo(); // returns "1:42/default_b"
******************************************/
Function.prototype.defaults = function()
{
  var _f = this;
  var _a = Array(_f.length-arguments.length).concat(
    Array.prototype.slice.apply(arguments));
  return function()
  {
    return _f.apply(_f, Array.prototype.slice.apply(arguments).concat(
      _a.slice(arguments.length, _a.length)));
  }
}

// I also found an alternate method that supposedly allows for objects to be passed in as well
// need to do some testing to confirm however the above method should work fine.
/*
Function.prototype.defaults = function()
{
var _f = this;
var _a = Array(_f.length-arguments.length).concat(
Array.prototype.slice.apply(arguments));
return function()
{
return _f.apply(this, Array.prototype.slice.apply(arguments).concat(
_a.slice(arguments.length, _a.length)));
}
*/


// Javascript resizeHelper Class
function ResizeHelper() // are the any parameters that it needs to get going probably is my guess
{
	// setup all the defaults
	this._areaWidth = 0;
	this._elementWidth = 0;
	this._elementCount = 0;
	this._containerSelector = "";
	this._elementSelector = "";
	this._elementMinPadding = 0;
}

// properties
ResizeHelper.prototype._areaWidth;  // the width of the area in px that has to be filled up
ResizeHelper.prototype._areaMinWidth; // the minimum width that the area is suppoed to take up in px. (used in case user sizes browser below a certain threshold).
ResizeHelper.prototype._elementWidth; // the absolute width of a single element
ResizeHelper.prototype._elementCount; // the number of elements that there are room for
ResizeHelper.prototype._containerSelector; // (typically DOM id) the string to use to select the container JQuery Element
ResizeHelper.prototype._elementSelector; // (typically css Class name) the string to use to select all the elements that are to resized
ResizeHelper.prototype._elementMinPadding; // The minimum amount of padding that should be used to separate each element
ResizeHelper.prototype._elementMargin; 	// the margin separating elements (probably can't be directly translated in to css margin
										// value is used more for calculating the working area Width

// getters and setters for the properties
ResizeHelper.prototype.getElementWidth = function() {return this._elementWidth;}
// maybe do some validation on the setters if we really care
ResizeHelper.prototype.setElementWidth = function(value) {this._elementWidth = value;}

ResizeHelper.prototype.getAreaWidth = function() { return this._areaWidth;}
ResizeHelper.prototype.setAreaWidth = function(value) {this._areaWidth = value;}

ResizeHelper.prototype.getAreaMinWidth = function() { return this._areaMinWidth;}
ResizeHelper.prototype.setAreaMinWidth = function(value) {this._areaMinWidth = value;}

// [ASSUMPTION]: should only be passing and returning int
ResizeHelper.prototype.getElementCount = function() {return this._elementCount;}
ResizeHelper.prototype.setElementCount = function(value) {this._elementCount = value;}

// [ASSUMPTION]: should only be passing and returning string
ResizeHelper.prototype.getContainerSelector = function() {return this._containerSelector;}
ResizeHelper.prototype.setContainerSelector = function(value) {this._containerSelector = value;}

// [ASSUMPTION]: should only be passing and returning string
ResizeHelper.prototype.getElementSelector = function() {return this._elementSelector;}
ResizeHelper.prototype.setElementSelector = function(value) {this._elementSelector = value;} 

// [ASSUMPTION]: should only be passing and returning int (may have to switch to floats)
ResizeHelper.prototype.getElementMinPadding = function(){return this._elementMinPadding;}
ResizeHelper.prototype.setElementMinPadding = function(value){ this._elementMinPadding = value;}

// [ASSUMPTION]: should only be passing and returning int (may have to switch to floats)
ResizeHelper.prototype.getElementMargin = function(){return this._elementMargin;}
ResizeHelper.prototype.setElementMargin = function(value){ this._elementMargin = value;}

// UTILITY METHODS
// This method calculates the number of elements that can fit assuming the minimum amount of padding
// use this to figure the baseline... padding is applied to the elements later  so that this._areaWidth is the actual width that is taken up while 
// preserving the liquid layout requirements.
// this function updates this._elementCount value... probably should only use this method as opposed to the getters and setters for the elementCount property
// as it's not resource intensive, just a simple math calculation.
ResizeHelper.prototype.numberOfElements = function(areaWidth) { // Default value of 0
	// calculate the number of elements that can fit within the area.
	
	areaWidth = (this.getAreaWidth() < this.getAreaMinWidth()) ? this.getAreaMinWidth() : this.getAreaWidth();

	this.setElementCount(Math.floor(areaWidth / (this.getElementWidth() + this.getElementMargin())));
	
	return this.getElementCount();		
};//.defaults(0);

/***************************************
*	handleResize:
*	this is where all the magic happens
*	
*	May need to pass in some parameters 
*	but not too sure right now
*	There probably needs to be some allotment of whether or not the first and last element should padding on the outer side
****************************************/
ResizeHelper.prototype.handleResize = function() {
	// declare some local variables
	var leftOver = 0;
	var leftOverPerItem = 0;
	var actualWidth = 0;
	var tempAreaWidth = 0; // temp variable incase actual width is smaller than the min width.
	
	// recalculate number of Elements
	this.numberOfElements();
	tempAreaWidth = this.getAreaWidth();
	
	if(tempAreaWidth  < this.getAreaMinWidth())
		{tempAreaWidth = this.getAreaMinWidth();}
	
	
	leftOver = tempAreaWidth - ((this.getElementWidth() + this.getElementMargin()) * this.getElementCount()) + this.getElementMargin(); // add the first 10 pixels back in. 
	
	//alert("AreaWidth: " + tempAreaWidth+". LeftOver: " + leftOver + ". Number of Elements: " + this.getElementCount());
	
	if(leftOver >= 0.0) 
	{
		leftOverPerItem = (leftOver / this.getElementCount()) /2;
		//alert("LeftOverPerItem: "+ leftOverPerItem);
		if(leftOverPerItem < Math.floor(leftOverPerItem) + .5)//leftOverPerItem - .25 == Math.floor(leftOverPerItem))
		{
			leftOverPerItem -= .1;	
		}
		else //if(leftOverPerItem - . == Math.floor(leftOverPerItem)
		{
			leftOverPerItem -= .002;
		}
		actualWidth = (this.getElementWidth() + this.getElementMargin() + (leftOverPerItem * 2)) * this.getElementCount() - this.getElementMargin();
		//alert(actualWidth + " == " + $(this.getContainerSelector()).width());
		$(this.getElementSelector()).css("padding-left", leftOverPerItem + "px");
		$(this.getElementSelector()).css("padding-right", leftOverPerItem + "px");
	}
	else 
	{
		// default padding
		$(this.getElementSelector()).css("padding-left", this.getElementMinPadding() + "px");
		$(this.getElementSelector()).css("padding-right", this.getElementMinPadding() + "px");
	}
	//alert("did it run through");
};

// for ease sake I'm going to kinda hack it and come back 
// later to rework it into one function call that can handle a bunch of instances
ResizeHelper.prototype.handleSmartResize = function() {
	// declare some local variables
	var leftOver = 0;
	var leftOverPerItem = 0;
	var actualWidth = 0;
	var tempAreaWidth = 0; // temp variable incase actual width is smaller than the min width.
	
	// recalculate number of Elements
	this.numberOfElements();
	tempAreaWidth = this.getAreaWidth();
	//alert("TempAreaWidth: " + tempAreaWidth + ", AreaMin Width: " + this.getAreaMinWidth());
	if(tempAreaWidth  < this.getAreaMinWidth())
		{tempAreaWidth = this.getAreaMinWidth();}
	
	// try manually setting the width:
	$(this.getContainerSelector()).css("width", (tempAreaWidth-10) + "px");
	$(this.getContainerSelector()+"-cell").css("width", (tempAreaWidth-10) + "px");
	leftOver = tempAreaWidth - ((this.getElementWidth() + this.getElementMargin()) * this.getElementCount()) + this.getElementMargin(); // add the first 10 pixels back in. 
	//alert("Number of Elements: " + this.getElementCount() + ", leftOver: " + leftOver);
	if(leftOver > 0.0) 
	{
		leftOverPerItem = (leftOver / this.getElementCount()) /2;
		
		actualWidth = (this.getElementWidth() + this.getElementMargin() + (leftOverPerItem * 2)) * this.getElementCount();
		$(this.getElementSelector()).css("padding-left", leftOverPerItem + "px");
		$(this.getElementSelector()).css("padding-right", leftOverPerItem + "px");
	}
	else 
	{
		// default padding
		$(this.getElementSelector()).css("padding-left", this.getElementMinPadding() + "px");
		$(this.getElementSelector()).css("padding-right", this.getElementMinPadding() + "px");
	}
};