﻿// Class SearchBar

// searchResultsPage: Selector - go button behavior changes based on current page
// form: Selector - to prevent default form behavior
// searchField: Selector - the text field for address
// goBtn: Selector - go button next to text field
// checkboxes: Selector - filter checkboxes
// advancedToggle: Selector - what makes the bar open and close
// toggedDiv: Selector - the bit that toggles

BenefulMap.SearchBar = Class.extend({
	init: function(searchResultsPage, form, searchField, goBtn, checkboxes, advancedToggle, toggledDiv) {
        this.searchResultsPage = searchResultsPage;
        this.defaultAddressText = BenefulMap.Constants.Strings.ADDRESS_FIELD_TEXT;
        this.mapsForm = $(form).eq(0);
        this.searchField = searchField;
        this.goBtn = goBtn;
        this.checkboxes = checkboxes;
        this.advancedToggle = advancedToggle;
        this.toggledDiv = toggledDiv;
        
        // this.formSubmitBlocker();
        this.autoCompleteListener();
        this.searchFieldListener();
        this.checkboxListener();
        this.toggleListener();
        this.enterKeyListener();
        this.goBtnListener();
        this.setCheckboxesListener();

	},
	getSearchResultsPage: function() {
	   return this.searchResultsPage;
	},
	getDefaultAddressText: function() {
	   return this.addressText;
	},
	getMapsForm: function() {
	   return this.mapsForm;
	},
	getSearchField: function() {
	   return this.searchField;
	},
	getGoBtn: function() {
	   return this.goBtn;
	},
	getCheckboxes: function() {
	   return this.checkboxes;
	},
	getAdvancedToggle: function() {
	   return this.advancedToggle;
	},
	getToggledDiv: function() {
	   return this.toggledDiv;
	},
	autoCompleteListener: function() {
	   $(this.getSearchField()).autocompleteArray(autoCompleteArray());
	},
	searchFieldListener: function() {
	    var self = this;
	    $(this.getSearchField()).blur( function() {
            if ($(this).val() == '') {
                $(this).val(self.getDefaultAddressText());
            }
        });
        $(this.getSearchField()).focus( function() {
        	$(this).val('');
        });
	},
	checkboxListener: function() {
	    var checkboxes = this.getCheckboxes();
        var self = this;
        $(checkboxes).click( function(event) {
            var allOff = true;
            $(checkboxes).each(function() {
            	if (this.checked == true) allOff = false;
            });
            if (allOff) {
            	$(checkboxes).each(function() {
            		this.checked = true;
            	});
            }
            
            if ($(self.getSearchResultsPage()).length) { // if we're on the seach results page
    	           self.triggerSearchOnPage(); // trigger an event to fire the search
    	       }
        });
	},
	toggleListener: function() {
        var self = this;
        $(this.getAdvancedToggle()).click( function(event) {
            event.preventDefault();
            $(this).toggleClass("hide-categories");
            $(self.getToggledDiv()).slideToggle();
        });
	},
	updateInputFieldListener: function() {
	   var self = this;
	   $(document).bind('update.searchbar', function(event, location) {
	      self.updateInputField(location); 
	   });
	},
	updateInputField: function(location) {
	  	console.log(location);
		if (location != "the U.S.") {
			$(this.getSearchField()).val(location);
		}
	},
	formSubmitBlocker: function() {  //Nathan, Dan: is this what is preventing the Edit-Profile page form from doing a .NET postback?
	    $(this.getMapsForm()).submit( function(event) {
    		event.preventDefault();
    	});
	},
	enterKeyListener: function() {
        var self = this;
        $(this.getSearchField() + ", .ac_results li").keypress( function(event) { 
            // the second part of the above selector is for autocompleter
            if (event.which == 13) {
                event.preventDefault();
                $(self.getGoBtn()).click();
            }
        });
	},
	goBtnListener: function() {
	   var self = this;
	   $(this.getGoBtn()).click( function(event) {
	       event.preventDefault();
	       console.log("clicked go button");
	       console.log("search results page: ", $(self.getSearchResultsPage()))
	       if ($(self.getSearchResultsPage()).length) { // if we're on the seach results page
	           self.triggerSearchOnPage(); // trigger an event to fire the search
	       } else {
	           self.redirectToSearchResultsPage(); // otherwise redirect with ?search= in query string
	       }
	   });
	},
	triggerSearchOnPage: function() {
	    var address = $(this.getSearchField()).val();
		$(document).trigger('map.search', [address]); // TODO either add map state back or let the map keep track of its own state
	},
	redirectToSearchResultsPage: function() {
	    var loc = $(this.getSearchField()).val();
        var categories = []; 
        var elements = this.getCheckboxes();
        $(elements).each( function() {
            if (this.checked == true) {
                var catNum = parseInt(this.name.replace(BenefulMap.Constants.Strings.CATEGORY_FILTER_PREFIX,''));
                categories.push(catNum);
            }
        });
        if (categories.length == 0) {
            categories.push(0);
        }
        
        var catsString = JSON.stringify(categories)
        var newPage = BenefulMap.Constants.Snippets_PAGE_SEARCH_RESULTS;
		var pageContext = $("#page-context-wrap input").val();
        newPage = newPage.replace("%LOC%", loc)
        newPage = newPage.replace("%CATS%", catsString);
		newPage = newPage.replace("%REF%", pageContext);
        window.location = newPage;
    },
    setCheckboxesListener: function() {
        var self = this;
        $(document).bind('search_bar.set_checkboxes', function(event, categories) {
           self.setCheckboxes(categories); 
        });
    },
    setCheckboxes: function(categories) {
        console.log("setting checkboxes according to: ", categories);
        var checkboxes = this.getCheckboxes();
        $(checkboxes).each( function() {
            this.checked = false;
        });
        jQuery.each(categories, function(i, val) {
            console.log(i, val);
            switch (val) {
             case 1:
                     $("#parks").get(0).checked = true;
                     break;
             case 2:
                     $("#restaurants").get(0).checked = true;
                     break;
             case 3:
                     $("#hotels").get(0).checked = true;
                     break;
             default:
                 $(checkboxes).each( function() {
                     this.checked = true;
                 });
            }
        });
    }
});