/// <reference path="../../../../../jQuery/1.3.2/jquery-1.3.2-vsdoc.js" />


/**
 *****************************************************************
 * CLASS TEMPLATE
 *****************************************************************
 *
 * Class description :
 *
 * Author : 
 */


	//Check that namespace into which the Class definition will be creates has been defined & if not then create
	if (!mrm.global.isNamespaceDefined("mrm.lexus.display.controls")) mrm.global.createNamespace("mrm.lexus.display.controls", "1.0");


	mrm.lexus.display.controls.SelectedModels = Object.subClass(
		{
			/*
			=============================
			CONSTANTS
			=============================
			*/

			/* Item selection events */
			UPDATE_EVENT_DATA_LABEL_SCOPE: "scope",
			UPDATE_EVENT_DATA_LABEL_SELECT: "select",
			UPDATE_EVENT_DATA_LABEL_LEVEL1ID: "level1Id",
			UPDATE_EVENT_DATA_LABEL_LEVEL2ID: "level2Id",
			UPDATE_EVENT_DATA_LABEL_LEVEL3ID: "level3Id",
			UPDATE_EVENT_DATA_LABEL_SELECT: "select",

			DATA_VALUE_SCOPE_LEVEL_1: "SCOPE_LEVEL_1",
			DATA_VALUE_SCOPE_LEVEL_2: "SCOPE_LEVEL_2",
			DATA_VALUE_SCOPE_LEVEL_3: "SCOPE_LEVEL_3",


			//PANEL
			//panel-selected-models


			//ITEMS CONTAINER
			//(Total items = 5)
			//(Total items = .find('div.selected-model-item-visible').length)

			//div.selected-model-items-scroll-container
			//total-selected-items-0
			//total-selected-items-0
			//total-selected-items-0
			//total-selected-items-0
			//total-selected-items-0


			//MODEL ITEMS:
			//selected-range-' + rangeId
			//selected-model-item
			//selected-model-item-visible

			CLASS_ITEMS_SCROLL_CONTAINER: "selected-model-items-scroll-container",
			CLASS_ITEMS_CONTAINER: "selected-model-items-container",
			CLASS_ITEM: "selected-model-item",
			CLASS_ITEM_SELECTED: "selected-model-item-visible",
			CLASS_TOTAL_SELECTED_FRAGMENT: "total-selected-items-",
			CLASS_SEARCH_CRITERIA_OPEN: "search-criteria-open",

			CLASS_LINK_REMOVE: "link-remove",

			CLASS_SCROLL_BUTTON_LAST: "scroll-control-last",
			CLASS_SCROLL_BUTTON_NEXT: "scroll-control-next",

			CLASS_SCROLL_BUTTON_LAST_DISABLED: "a-button-round-arrow-left-disabled",
			CLASS_SCROLL_BUTTON_NEXT_DISABLED: "a-button-round-arrow-right-disabled",

			SCROLL_DIRECTION_LEFT: "SCROLL_DIRECTION_LEFT",
			SCROLL_DIRECTION_RIGHT: "SCROLL_DIRECTION_RIGHT",

			//CL_PHOTOFLOW_CONTAINER: ".photoflow-container ",
			//CL_CRITERIA_PANEL: ".search-criteria-open ",
			//CL_OPEN_SETTINGS_BTN: ".open-settings ",

			//When this is clicked .photoflow-container .search-criteria-open .open-settings trigger this event
			//This event is bound in the init to a function to recalculate the width
			"EV_OPEN_DISPLAY_SETTINGS": "PHOTOFLOW_OPEN_DISPLAY_SETTINGS",




			/*
			=============================
			CONFIGURATION PROPERTIES (instance configuration)
			=============================
			*/


			/*
			=============================
			CONSTRUCTOR
			=============================
			*/
			init: function (jQueryTargetString, displayManager)
			{
				var _this = this;

				this._targetString = jQueryTargetString;
				this._target = $(jQueryTargetString);
				this._displayManager = displayManager;

				this._scrollButtonLast = this._target.find("a." + this.CLASS_SCROLL_BUTTON_LAST);
				this._scrollButtonNext = this._target.find("a." + this.CLASS_SCROLL_BUTTON_NEXT);

				this._configureItems();
				this._configureDisplay();


				//Legacy jquery versions cannot determine widths of display:none elements
				//Bind event to document so when .open-settings link is clicked (see _openSearchSettings method in FlowListFeature.js) functions to calculate width are rerun
				var document = "body";
				$(document).bind(this.EV_OPEN_DISPLAY_SETTINGS, function () { _this._reTriggerScrollButtons(); });


			},



			/*
			=============================
			INTERNAL RUN-TIME PROPERTIES
			=============================
			*/

			_targetString: undefined,
			_target: undefined,

			_displayManager: undefined,

			_scrollButtonNext: undefined,
			_scrollButtonLast: undefined,

			_standardItemWidth: undefined,


			/*
			=============================
			PUBLIC METHODS
			=============================
			*/
			/*
			=============================
			UPDATE METHOD
				 
			- Called by the Global JS displayManager
			=============================
			*/

			handleItemSelectionUpdate: function (e)
			{
				var scope = e[this.UPDATE_EVENT_DATA_LABEL_SCOPE];
				var select = e[this.UPDATE_EVENT_DATA_LABEL_SELECT];
				var updateLevel1Id = e[this.UPDATE_EVENT_DATA_LABEL_LEVEL1ID];
				var updateLevel2Id = e[this.UPDATE_EVENT_DATA_LABEL_LEVEL2ID];
				var updateLevel3Id = e[this.UPDATE_EVENT_DATA_LABEL_LEVEL3ID];


				//alert(" SELECTED MODELS: \n scope = " + scope + "\n select = " + select + "\n updateLevel1Id = " + updateLevel1Id + "\n updateLevel2Id = " + updateLevel2Id + "\n updateLevel3Id = " + updateLevel3Id);


				// If Add :: extract rangeID and ALWAYS run added test, adding if not already added

				// If Remove :: ONLY if level1 remove if added

				var container = this._target.find("div." + this.CLASS_ITEMS_CONTAINER);

				var displayDirty = false;

				if (select)
				{
					// Get item via id and add
					var item = container.find("div#rge-" + updateLevel1Id);
					if (item.length > 0)
					{
						this._setItemAdded(item, true);
						displayDirty = true;
					}
				}
				else if (scope == this.DATA_VALUE_SCOPE_LEVEL_1)
				{
					// Get item via id and add
					var item = container.find("div#rge-" + updateLevel1Id);
					if (item.length > 0)
					{
						this._setItemAdded(item, false);
						displayDirty = true;
					}
				}

				if (displayDirty) { this._configureDisplay(); }

			},


			/*
			=============================
			INTERNAL METHODS
			=============================
			*/
			/*
			=============================
			EVENT HANDLERS
			=============================
			*/
			_handleScrollButtonClick: function (direction)
			{
				this._animateDisplay(direction);
			},


			/*
			=============================
			UTILITIES
			=============================
			*/
			_setItemAdded: function (itemJQueryObject, add)
			{
				var item = itemJQueryObject;

				if (add) { if (!item.hasClass(this.CLASS_ITEM_SELECTED)) item.addClass(this.CLASS_ITEM_SELECTED); }
				else if (item.hasClass(this.CLASS_ITEM_SELECTED)) item.removeClass(this.CLASS_ITEM_SELECTED);
			},


			_scrollDisplay: function ()
			{
				//						var scrollContainer_w	= this._target.find("div." + this.CLASS_ITEMS_SCROLL_CONTAINER).width();
				//						var itemsContainer_w	= this._target.find("div." + this.CLASS_ITEMS_CONTAINER).width();
				//						
				//						return ((scrollContainer_w < itemsContainer_w) ? true : false);
				//we only deal with the ranges now, as opposed to the deriviatives so this should always return true
				return true;
			},


			/* Is display scrolled to far to the right (as a result of item removal) */
			_displayOverscrolled: function ()
			{
				var container = this._target.find("div." + this.CLASS_ITEMS_CONTAINER);
				var position = container.position();
				var container_x = position.left;
				var container_w = container.width();
				var display_w = this._target.find("div." + this.CLASS_ITEMS_SCROLL_CONTAINER).width();

				var overscrollAmount = 0;
				var overscrolled = false;

				if (container_x < 0)
				{
					overscrollAmount = Math.max(0, (display_w - (container_w - Math.abs(container_x))))
					overscrolled = (overscrollAmount > 0);
				}

				return { isOverscrolled: overscrolled, amount: overscrollAmount };
			},


			_getStandardItemWidth: function ()
			{
				if (this._standardItemWidth == 0)
				{
					this._standardItemWidth = this._target.find("div." + this.CLASS_ITEM + ":visible").width();
				}

				return this._standardItemWidth;
			},



			/*
			=============================
			SETUP
			=============================
			*/
			_configureDisplay: function ()
			{
				this._disabledScrollButtons();
				this._configureDisplayDimensions();
				this._configureDisplayScrolling();
			},



			_configureItems: function ()
			{
				// Configure item remove links
				// Remove default href link
				// Add click link that points to internal broadcast level 1 update

				var items = this._target.find("div." + this.CLASS_ITEM);

				var __this = this;
				items.each(function ()
				{
					var $this = $(this);
					var id = $this.attr("id").replace("rge-", "");

					var removeLink = $this.find("a." + __this.CLASS_LINK_REMOVE);

					// Remove href
					//removeLink.removeAttr("href");

					//							// Add new link
					//							removeLink.click(function ()
					//							{
					//								__this._removeItem(id);
					//								
					//							});
				});

				//alert("items width " + items.eq(0).width());
				// Set default item width
				this._standardItemWidth = items.eq(0).width();


				/*if(settingsOpen)
				{
					this._standardItemWidth = 130;
				}
				else
				{
					this._standardItemWidth = 105;
				}
				*/
				 
				
			},



			/*
			=============================
			DISPLAY CREATION
			=============================
			*/



			/*
			=============================
			DISPLAY CONTROL
			=============================
			*/
			_configureDisplayScrolling: function ()
			{
				//alert(" OVERSCROLL : " + "\n is = " + os.isOverscrolled + "\n amount = " + os.amount);

				//if (!os.isOverscrolled)
				if (this._scrollDisplay())
				{
					this._configureScrollButtons();
				}
				else
				{
					this._disabledScrollButtons();

					var os = this._displayOverscrolled();
					if (os.isOverscrolled) this._runOverscrollResetAnimation(os.amount);
				}
			},


			_configureScrollButtons: function ()
			{
				// Setup / activate scroll buttons if required
				// Will need to re-run test every time loaded & range either added or removed
				if (!this._scrollDisplay())
				{
					this._disabledScrollButtons();
				}
				else
				{
					this._enableScrollButtons();
				}
			},


			_configureDisplayDimensions: function ()
			{
				var c = this._target.find("div." + this.CLASS_ITEMS_SCROLL_CONTAINER);
				var items = c.find("div." + this.CLASS_ITEM);
				var totalItems = items.length;

				var selectedItems = c.find("div." + this.CLASS_ITEM_SELECTED);
				var totalSelected = selectedItems.length;

				// Remove all possible total selected classnames from container
				for (var i = 0; i <= totalItems; i++)
				{
					var cn = this.CLASS_TOTAL_SELECTED_FRAGMENT + i;
					if (c.hasClass(cn)) { c.removeClass(cn) }
				}

				// Add currently selected total classname
				c.addClass(this.CLASS_TOTAL_SELECTED_FRAGMENT + totalSelected);
			},


			_enableScrollButtons: function ()
			{

				//alert("_enableScrollButtons");
				//
				// THIS NEEDS TO CHANGE :: Temp measure
				//

				var __this = this;

				var a = this._scrollButtonNext;
				var b = this._scrollButtonLast;

				//selected-model-items-container
				var container = this._target.find("div." + this.CLASS_ITEMS_CONTAINER);
				var position = container.position();
				var container_x = position.left;
				var container_w = container.width();
				//selected-model-items-scroll-container
				var display_w = this._target.find("div." + this.CLASS_ITEMS_SCROLL_CONTAINER).width();

				//alert("display_w = " + display_w + " // container_x : " + container_x + " // container_w: " + container_w);
				

				if (container_x != 0)
				{
					if (b.hasClass(this.CLASS_SCROLL_BUTTON_LAST_DISABLED)) { b.removeClass(this.CLASS_SCROLL_BUTTON_LAST_DISABLED); }

					// Attach clickEvent
					b.click(function ()
					{
						__this._handleScrollButtonClick(__this.SCROLL_DIRECTION_RIGHT);
					});
				}

				//alert("(container_w - Math.abs(container_x)) : " + (container_w - Math.abs(container_x)));
				//alert("display_w: " + display_w);
				if ((container_w - Math.abs(container_x)) > display_w)
				{
					if (a.hasClass(this.CLASS_SCROLL_BUTTON_NEXT_DISABLED)) { a.removeClass(this.CLASS_SCROLL_BUTTON_NEXT_DISABLED); }
					// Attach clickEvent
					a.click(function ()
					{
						__this._handleScrollButtonClick(__this.SCROLL_DIRECTION_LEFT);
					});
				}
			},



			_reTriggerScrollButtons: function ()
			{

				//alert("_enableScrollButtons");
				//
				// THIS NEEDS TO CHANGE :: Temp measure
				//

				var __this = this;

				var a = this._scrollButtonNext;
				var b = this._scrollButtonLast;

				

				
				
				//-----------------
				//var search_criteria_open = this._target.find(this.CLASS_SEARCH_CRITERIA_OPEN);
				var search_criteria_open = this._target.find("div." + this.CLASS_SEARCH_CRITERIA_OPEN);

				if(search_criteria_open)
				{
					//alert("search_criteria_open");
					//selected-model-items-container
					var container = $(" div." + this.CLASS_SEARCH_CRITERIA_OPEN).find(" div." + this.CLASS_ITEMS_CONTAINER);
					var position = container.position();
					var container_x = position.left;
					var container_w = container.width();
					//selected-model-items-scroll-container
					//var display_w = $(" div." + this.CLASS_SEARCH_CRITERIA_OPEN).find("div.selected-model-items-container").width();
					
				}
				else
				{

					//selected-model-items-container
					var container = this._target.find("div." + this.CLASS_ITEMS_CONTAINER);
					var position = container.position();
					var container_x = position.left;
					var container_w = container.width();
					//selected-model-items-scroll-container
					//var display_w = this._target.find("div." + this.CLASS_ITEMS_SCROLL_CONTAINER).width();
				}


				//alert("display_w = " + display_w + " // container_x : " + container_x + " // container_w: " + container_w);
				

				if (container_x != 0)
				{
					if (b.hasClass(this.CLASS_SCROLL_BUTTON_LAST_DISABLED)) { b.removeClass(this.CLASS_SCROLL_BUTTON_LAST_DISABLED); }

					// Attach clickEvent
					b.click(function ()
					{
						__this._handleScrollButtonClick(__this.SCROLL_DIRECTION_RIGHT);
					});
				}

				//alert("(container_w - Math.abs(container_x)) : " + (container_w - Math.abs(container_x)));
				//alert("display_w: " + display_w);
				if ((container_w - Math.abs(container_x)) > display_w)
				{
					if (a.hasClass(this.CLASS_SCROLL_BUTTON_NEXT_DISABLED)) { a.removeClass(this.CLASS_SCROLL_BUTTON_NEXT_DISABLED); }
					// Attach clickEvent
					a.click(function ()
					{
						__this._handleScrollButtonClick(__this.SCROLL_DIRECTION_LEFT);
					});
				}
			},


			_disabledScrollButtons: function ()
			{
				var a = this._scrollButtonNext;
				var b = this._scrollButtonLast;
				if (!a.hasClass(this.CLASS_SCROLL_BUTTON_NEXT_DISABLED)) { a.addClass(this.CLASS_SCROLL_BUTTON_NEXT_DISABLED); }
				if (!b.hasClass(this.CLASS_SCROLL_BUTTON_LAST_DISABLED)) { b.addClass(this.CLASS_SCROLL_BUTTON_LAST_DISABLED); }

				// TODO :: Remove click
				a.unbind("click");
				b.unbind("click");
			},



			/*
			=============================
			ANIMATION
			=============================
			*/

			//Settings
			ANIMATION_EASING: "easeOutCubic", // "easeOutBounce" // "easeOutCubic" // "easeLinear"

			ANIMATION_RATE_MS_PP: 25,


			_runOverscrollResetAnimation: function (amount)
			{
				this._disabledScrollButtons();

				var container = this._target.find("div." + this.CLASS_ITEMS_CONTAINER);
				var position = container.position();
				var container_x = position.left;

				var target_x = Math.min(0, (container_x + amount));

				var anim_settings = { "left": (target_x + "px") };

				//alert(" ANIMATE : \n container_x = " + container_x + "\n target_x = " + target_x + "\n duration = " + duration);

				var __this = this;
				container.animate(anim_settings, 800, this.ANIMATION_EASING, function () { __this._handleDisplayScrollComplete() });
			},



			_animateDisplay: function (direction)
			{

				//alert(direction);
				this._disabledScrollButtons();

				var d = (direction == this.SCROLL_DIRECTION_LEFT) ? true : false;

				//alert(d);

				var container = this._target.find("div." + this.CLASS_ITEMS_CONTAINER);

				var position = container.position();
				var container_x = position.left;

				//alert("container_x" + container_x);

				var itemWidth = this._getStandardItemWidth();

				var delta = (d) ? -itemWidth : itemWidth;

				//alert("delta =" + delta);

				var target_x = container_x + delta;
				//alert("target_x=" + target_x)

				var anim_settings = { "left": (target_x + "px") };

				var __this = this;
				container.animate(anim_settings, 800, this.ANIMATION_EASING, function () { __this._handleDisplayScrollComplete() });
			},





			/*
			=============================
			ANIMATION EVENT HANDLERS
			=============================
			*/

			_handleDisplayScrollComplete: function (e)
			{
				this._configureScrollButtons();
				
			},


			/*					
			function handleAnimateHeightClose(target) 
			{
			var anim_settings = { "height":target_height_closed };
							
			$(target).animate(anim_settings, anim_duration, anim_easing, handleAnimateComplete);
			}
						
						
			function handleAnimateComplete() 
			{
			//alert("Animation complete!!");
			}
			*/




			/*
			=============================
			INTERNAL EVENT HANDLERS
			=============================
			*/
			_removeItem: function (itemId)
			{
				//alert("removeItem : " + itemId);
				var updateEvent =
						{
							type: "ITEM_SELECTION_EVENT",
							scope: this.DATA_VALUE_SCOPE_LEVEL_1,
							select: false,
							level1Id: itemId,
							level2Id: -1,
							level3Id: -1
						};

				if (this._displayManager) this._displayManager.updateSelection(updateEvent);
				
			}
		}
	);
	
	//alert("SelectedModels");