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


/**
 *****************************************************************
 * CoreDisplayControls
 *****************************************************************
 *
 * General display controls and logic for various pages 
 *
 * Encapsulated basic functionality (common and page specific)
 *
 * Author : Liam Prescott
 */

	//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")) mrm.global.createNamespace("mrm.lexus.display", "1.0");
	
	mrm.lexus.display.CoreDisplayControls = Object.subClass(
		{
			/*
			 =============================
			 CONSTANTS
			 =============================
			 */
				CLASS_MAIN_CONTAINER		: "main-container",
				CLASS_PAGE_RANGE_DETAILS	: "range-container",
			
				
				// Display state switching classes (common)
				CLASS_DISPLAY_STATE_MENU		: "display-state-menu",
				CLASS_DISPLAY_STATE_CONTAINER	: "display-state-menu",
				
				CLASS_FRAGMENT_DISPLAY_STATE	: "display-state-",
				
				
				// 
				CLASS_RANGE_DETAIL_ITEM_OPTIONS_OPEN : "item-options-open",
				
				
				
			/*
			 =============================
			 CONFIGURATION PROPERTIES (instance configuration)
			 =============================
			 */
			
			
			
			/*
			 =============================
			 CONSTRUCTOR
			 =============================
			 */
				init : function ()
				{
					//if ($("div." + this.CLASS_MAIN_CONTAINER + " div." + this.CLASS_PAGE_RANGE_DETAILS).length > 0)
					
					// Setup range details page features
					if ($("div." + this.CLASS_PAGE_RANGE_DETAILS).length > 0) this._setupRangeDetails();
					
					
				},
			
			
			
			/*
			 =============================
			 INTERNAL RUN-TIME PROPERTIES
			 =============================
			 */
			
			
			
			/*
			 =============================
			 PUBLIC METHODS
			 =============================
			 */
			
			
			
			/*
			 =============================
			 INTERNAL METHODS
			 =============================
			 */
				/*
				 =============================
				 UTILITIES
				 =============================
				 */
			
			
			
				/*
				 =============================
				 SETUP
				 =============================
				 */
					_setupRangeDetails : function ()
					{
						// Data Driven graph display switching
						var tgtStringExploreRangeContainer = "div." + this.CLASS_PAGE_RANGE_DETAILS + " div.explore-range-container"
						
						this._configureDisplayStateMenu(tgtStringExploreRangeContainer);
						
						// Range item options open / close and z-index
						var tgtStringModelsItemsContainer = "div." + this.CLASS_PAGE_RANGE_DETAILS + " div.available-models-container div.model-items-container"
						
						this._configureModelZOrder(tgtStringModelsItemsContainer);
						this._configureModelOptionsDisplay(tgtStringModelsItemsContainer);
					},
					
					
					
					/*
					 =============================
					 RANGE DETAIL PAGE SPECIFIC
					 =============================
					 */
					 
						_configureDisplayStateMenu : function (target)
						{
							var __this				= this;
							var displayContainer	= $(target);
							var links				= $(target + " div." + this.CLASS_DISPLAY_STATE_MENU + " a");
							var linkCount			= links.length;
							
							//Assignment utilising a function closure to avoid closure referencing of value i (otherwise always resolves to last definition of i)
							for (var i = 0; i < linkCount ; i++) (
								function (id) 
								{
									// Get item
									var link = $(links[id]);
								
									// Add item hover
									link.click(function ()
									{
										__this._setDisplayState(displayContainer, (id + 1), linkCount);
									});
								}
							)(i);
						},
						
						
						_configureModelZOrder : function (target)
						{
							var itemOptions	= $(target + " div.model-item");
							var totalItems  = itemOptions.length;
							
							for (var i = 0; i < totalItems; i++)
							{
								var item	= $(itemOptions[i]);
								var zIndex	= (totalItems - i).toString();
								
								item.css("z-index", zIndex);
							}
						},
						
						
						_configureModelOptionsDisplay : function (target)
						{
							var __this		= this;
							var container	= $(target);
							var itemOptions	= container.find("div.model-item > div.item-options");
							
							itemOptions.hover
							(
								function ()
								{
									var $this = $(this);
									if(!$this.hasClass(__this.CLASS_RANGE_DETAIL_ITEM_OPTIONS_OPEN)) $this.addClass(__this.CLASS_RANGE_DETAIL_ITEM_OPTIONS_OPEN);
								},
								function ()
								{
									var $this = $(this);
									if($this.hasClass(__this.CLASS_RANGE_DETAIL_ITEM_OPTIONS_OPEN)) $this.removeClass(__this.CLASS_RANGE_DETAIL_ITEM_OPTIONS_OPEN);
								}
							);
						},
					
					
					
					/*
					 =============================
					 AAAA
					 =============================
					 */
					
					
						
					
				/*
				 =============================
				 DISPLAY CREATION
				 =============================
				 */
			
			
			
				/*
				 =============================
				 GENERIC DISPLAY CONTROL
				 =============================
				 */
					_setDisplayState : function (targetJQueryObject, targetState, totalStates)
					{
						var target = targetJQueryObject;
						
						for (var i = 1; i <= totalStates; i++)
						{
							var c = this.CLASS_FRAGMENT_DISPLAY_STATE + i;
							
							if (i != targetState) { if (target.hasClass(c)) target.removeClass(c); }
							else if (i == targetState) { if(!target.hasClass(c)) target.addClass(c); }
						}
					}
			
			
			
				/*
				 =============================
				 INTERNAL EVENT HANDLERS
				 =============================
				 */
		}
	);