var NAVSTATE = {
	selection:{},
	sliders: {},
    //If exists remove it, else add it!
    toggleInSet: function(set, value){
        this._createWidget(set, "set");

        //XOR "value" in the list. If called twice with the same "value" the original state is restored 
        var index= jQuery.inArray(value,this.selection[set].values);
        if(index == -1) {
	        //add "value" to the list
	        this.selection[set].values.push(value);
        } else {
        	//remove "value" from the list
        	this.selection[set].values.splice(index,1);
        }
    },
    toggleValue: function(set, value){
        delete this.selection[set];
        this._createWidget(set, "set");
        this.selection[set].values = [value];
    },
    toggleMin: function(set, value){
        this._createWidget(set, "range");
        this.selection[set].min = value;
    },
    toggleMax: function(set, value){
        this._createWidget(set, "range");
        this.selection[set].max = value;
    },
    
    _createWidget: function(set, wType){
        //Default to set type, if the widget is not specified
        if (!this.selection[set]) {
            this.selection[set] = {
                type: wType || "set",
                values : []
            };
        }
    },
    getNavState: function(x){
        var params = [];
        
        function getState(widgets){
            for (w in widgets) {
				var widgetType = widgets[w].type || "";
				
				if (widgetType == "set") {
				    for(var i=0;i<widgets[w].values.length;i++) {
				    	params.push(w + "=" + widgets[w].values[i]);
				    }
				} else {
				    if (widgetType == "range") {
				        if (widgets[w].min !=undefined) {
				            params.push(w + ".min=" + widgets[w].min);
				        }
				        if (widgets[w].max !=undefined) {
				            params.push(w + ".max=" + widgets[w].max);
				        }
				    }
				}
            }
        }
        getState(this.selection);
        
        //Frustration!! Strange but true: Array.join(params,'&') bombed in our beloved IE!!
        //Workaround 1: use the prototype method. pass in 'this' though it plays no role -Array.prototype.join.apply(this,params,'&')
        //Workaround 2: params.join('&') - I like this one!
        return params.join('&');
    },
    updateUI : function(wActive,wSelected) {
    	wSelected = wSelected || this.selection;
    	//Activate/Disable and select/Deselect, for all the multiselect controls
		$('ul.multiselect').each(function(){
			var widgetName = $(this).parent().attr('id'); //Parent div's id is the widgetname!
			
			$('li',this).each(function() {
				var listItem = $(this);
  				var data = listItem.metadata();
  				if (data && data.value) {
  					//Activate/Disable
  					if( wActive[widgetName] && jQuery.inArray(data.value, wActive[widgetName].values ) != -1) {
  						//enable it!
   						listItem.removeClass('disabled');
  					} else {
   						listItem.addClass('disabled');
	   				}

  					if( wSelected[widgetName] && jQuery.inArray(data.value, wSelected[widgetName].values ) != -1) {
   						listItem.addClass('selected');
  					} else {
  						listItem.removeClass('selected');
  					}
  				}
  			});
  		});
  		
		//There should be only one x in state[i] if it is a single select
		$('select.singleselect').each(function(){
			var sel =$(this);
			var widgetName = sel.parent().attr('id'); //Parent div's id is the widgetname!
			if( wSelected[widgetName] && wSelected[widgetName].values[0]) {
				sel.val(wSelected[widgetName].values[0]);			
			}
		});
		
		for (s in this.sliders) {
			if(wActive[s] !=undefined && wActive[s].min!=undefined && wActive[s].max !=undefined) {
				//NOTE: Set Selection is buggy (it causes the wrong value to be displayed) 
				// but calling setRange after setSelection sets it right.
				this.sliders[s].setSelection([this.selection[s].min,this.selection[s].max])
							   .setRange(wActive[s].min,wActive[s].max);
				setTimeout((function(s) {
					return function() {
					    s.refreshUI();
					}
				})(this.sliders[s]),100);
			}
		}
    }
};

$(document).ready(function(){

	/** 
		Change the layout to 750px, if the resolution is less than 1000x. 
		This is done by changing the main div to doc/yui-t7 (See yui css grids for more details) 
	**/
	
	if(screen) {
		if(screen.width<1000) {
			$("#doc2").attr({'id':'doc', 'class':'yui-t7'});
			$("#right_col").remove();
		}
	}
	
	$('#price').show();

    /* This makes an ajax call and refreshes the display 
    
     Few things to note: We do *not* want to discard the older ajax responses as the browser will cache it
     and reuse it, if the same request is made again. 
     
     This means we do not want to abort any request/response but want to use the latest response.
     */
    var loadPage=(function createLoadPage(){
    	var currentRequestId=0;
        var resultsEl = $('#resultsPane');
        
        function updateDisplay(data,reqId){
	        //Has the last request come back ?
            if (reqId == currentRequestId) {
            	$('#loading').hide();
		        resultsEl.css('opacity',100);
		        resultsEl.html(data);
            }
        }
		return function(_hash) {
	        var hash = _hash || NAVSTATE.getNavState();
	        if (hash == "") {
	            return "";
	        }

            currentRequestId= currentRequestId+ 1;
            var myRequestId = currentRequestId;
	
	        resultsEl.css('opacity',0);
	        $('#loading').show();
	        $.ajax({
	            url: "Search_ajax.action",
	            data: hash,
	            dataType: "html",
	            //Copy over the requestId into local scope through a closure
	            success: (function(_myRequestId){
	                return function(data){
	                    updateDisplay(data, _myRequestId);
	                }
	            })(myRequestId),
	            error: (function(_myRequestId){
	                return function(data){
		                resultsEl.css('opacity',100);
	                }
	            })(myRequestId)
	        });
        }
    })();

	// Initialize history plugin.
    // The callback is called at once by present location.hash. 
    $.historyInit(loadPage);
    
    $('ul.singleselect').each(function() {
    	var widgetName = $(this).parent().attr('id');
    	$(this).linksCombo({
	        onchange: function(a){
	        	NAVSTATE.toggleValue(widgetName, this.value);
	            $.historyLoad(NAVSTATE.getNavState());
	        },
	        attrListToCopy: ['id','class'],
	        isDefault: function(aEl){
	            return $(aEl).is('.selected');
	        }
	    });
    });
    
    $('div.nav').each(function(){
        var widgetName = this.id;
        $('ul li', this).each(function(){
            var liEl = $(this);
			var data = liEl.metadata();
			
            $('a', this).click(function(){
				var me = $(this);
				me.blur();
				if(liEl.hasClass("disabled")) {
					return false;
				}
				
                if (data && data.value) {
	                NAVSTATE.toggleInSet(widgetName, data.value);
	                liEl.toggleClass('selected');
                    $.historyLoad(NAVSTATE.getNavState());
					
	                return false;
                }
            });
        });
    });
    
    $('.listbox').hoverIntent({
		sensitivity: 7, // number = sensitivity threshold (must be 1 or higher)    
		interval: 500, // number = milliseconds for onMouseOver polling interval    
		over: function() {
			$(this).addClass('expand');
		},
		timeout: 2000, // number = milliseconds delay before onMouseOut
		out: function() {
			$(this).removeClass('expand');
		}
	});

	$("#clearselection").click(function(){
		var clearHash;
		if(NAVSTATE.selection.location.values[0] != undefined) {
			clearHash = "location="+NAVSTATE.selection.location.values[0];
		}
		clearHash += "&store="+NAVSTATE.selection.store.values[0];
		$.historyLoad(clearHash);
		return false;
	});

	function addCommas(nStr)
	{
		nStr += '';
		x = nStr.split('.');
		x1 = x[0];
		x2 = x.length > 1 ? '.' + x[1] : '';
		var rgx = /(\d+)(\d{3})/;
		while (rgx.test(x1)) {
			x1 = x1.replace(rgx, '$1' + ',' + '$2');
		}
		return x1 + x2;
	}
	
	/** Setup Sliders */
    function setupPrice() {
		var lblMin = $('#price span.min');
		var lblMax = $('#price span.max');

		$('#price div.slider').sliderx({
			init: function (slider) {
				NAVSTATE.sliders.price = slider;
			},
			change : function ( value, selection) {
				NAVSTATE.selection.price.min = selection[0] ;
				NAVSTATE.selection.price.max = selection[1] ;
				$.historyLoad(NAVSTATE.getNavState());
			},

			slide : function ( value, selection) {
				if (value[0] >= 50000) {
					lblMin.text(addCommas(value[0]) + " Lakhs");   // Calculating laksh 
					lblMax.text(addCommas(value[1])+ " Lakhs");
				} else {
					lblMin.text(addCommas(value[0]));
					lblMax.text(addCommas(value[1]));
				}
			},
			
			steps : [100000],
			rangeMin : 0,      // min value fixing area
			rangeMax : 1000   //max value 
		});
	}
	
	setupPrice();

	function setupOdometer() {
		var lblMax = $('#odometer span.max');
		$('#odometer div.slider').sliderx({
			init: function (slider) {
				NAVSTATE.sliders.odometer = slider;
			},
			change : function ( value, selection) {
				NAVSTATE.selection.odometer.max = selection[0] ;
				$.historyLoad(NAVSTATE.getNavState());
			},
			slide : function ( value, selection) {
				lblMax.text(value[1]+" kms");
			},
			rangeMin : 0,
			rangeMax : 100
		});
	}
	
	function setupYear() {
		var lblMin = $('#year span.min');
		var lblMax = $('#year span.max');
		$('#year div.slider').sliderx({
			init: function (slider) {
				NAVSTATE.sliders.year = slider;
			},
			change : function ( value, selection) {
				NAVSTATE.selection.year.min = selection[0] ;
				NAVSTATE.selection.year.max= selection[1] ;
				$.historyLoad(NAVSTATE.getNavState());
			},
			slide : function ( value, selection) {
				lblMin.text(value[0]);
				lblMax.text(value[1]);
			},
			steps : [1],
			rangeMin : 0,
			rangeMax : 100
		});
	}
	
	//setupPrice();
	setupOdometer();
	setupYear();
	
	initMySaveList();
	
})

function initMySaveList() {

	//Click handler for remove item
	$('#save_list img').click(function() {
		var params = $(this).metadata();
		
		$.ajax({
		    url: "SaveList_remove.action",
		    type : "POST",
		    data: {listName : NAVSTATE.selection.store.values[0], itemValue : params.value},
		    dataType: "html",
		    //Copy over the requestId into local scope through a closure
		    success: function(data){
	    		$('#save_list_content')
	    		.html(data);
		    }
		});
		
		
		
		return false;
	});
	
	$('#save_list li').hover(function() {
		$(this).addClass('hover');
	}, function() {
		$(this).removeClass('hover');
	});
	
}


function init() {
  
	$('ul.srch_result li').hover(
		function() {
			$(this).addClass('hover');
		},
		function() {
			$(this).removeClass('hover');
		}
	);
	
	$('span.paging a').click(function() {
		var pgMeta = $(this).metadata();
		var pageNum = pgMeta ? pgMeta.page || -1 : -1;
		if(pageNum != -1) {
			NAVSTATE.toggleValue('page',pageNum);
			$.historyLoad(NAVSTATE.getNavState());
			return false;
		}
	});
	
	$('#restoreOld').click(function(){
		$.historyLoad(NAVSTATE.lastHash); 
		return false;
	});
	
	$('.addtocompare').click(function() {
		var params = $(this).metadata();
		
		$.ajax({
		    url: "SaveList_listing_add.action",
		    data: {listName : NAVSTATE.selection.store.values[0], itemValue : params.value},
		    type : "POST",
		    dataType: "html",
		    //Copy over the requestId into local scope through a closure
		    success: function(data){
	    		var sl=$('#save_list_content');
	    		var bgCol=$('#save_list').css('background-color');
	    		sl.html(data)
	    		.animate({ backgroundColor : "#ff8c1c" }, 500)
	    		.animate({ backgroundColor : bgCol }, 500)
		    }
		});
		
		return false;
		
	});
}
