// Class NearbySpots
// Base class: AjaxPane


// location: GLatLng - Location the spots are near
// spotId : Int - to prevent the spot from appearing in nearby spots.
// filterCheckboxes: Selector - the checkboxes that filter nearby spots snippet
// sortSelect: Selector - the Select box that reorders nearby spots snippet

BenefulMap.NearbySpotsPane = BenefulMap.AjaxPane.extend({
	init: function(snippet, pane, params, slug, location, spotId, filterCheckboxes, sortSelect) {
        this._super(snippet, pane, params, slug);
        
        this.mapState = new BenefulMap.MapState(location.lat(), location.lng(), "", "", 1, 15, 1, [], [1,2,3], 0, 0, []);
        this.spotId = spotId;
        this.filterCheckboxes = filterCheckboxes;
        this.sortSelect = sortSelect;

        this.extendInitialParams();
        this.populate();
	},
	getMapState: function() {
		return this.mapState;
	},
	setMapState: function(newMapState) {
		this.mapState = newMapState;
	},
	getSpotId: function() {
		return this.spotId;
	},
	setSpotId: function(spotId) {
		this.spotId = spotId;
	},
	getFilterCheckboxes: function() {
		return this.filterCheckboxes;
	},
	getSortSelect: function() {
		return this.sortSelect;
	},
	extendInitialParams: function() {
	   var mapState = this.getMapState();
	   var newParams = {};
	   newParams.spotId = this.getSpotId();
	   newParams.id = mapState.toJSON();
	   this.extendParams(newParams);
	},
	populatedListener: function() {
	   var self = this;
	   $(document).bind('populated.' + this.getSlug(), function(event) {
	       event.stopPropagation();
	       console.info("Pane " + self.getSlug() + " populated");
	       self.filterCategoriesListener();
	       self.sortSpotsListener();
   	  });
	},
	resetCheckboxesIfAllOff: function() {
		var checkboxes = this.getFilterCheckboxes();
		var allOff = true;
		$(checkboxes).each(function() {
			if (this.checked == true) allOff = false;
		});
		if (allOff) {
			$(checkboxes).each(function() {
				this.checked = true;
			});
		}
	},
	filterCategoriesListener: function() {
		var self = this;
		var mapState = this.getMapState();
		var checkboxes = this.getFilterCheckboxes();
		$(checkboxes).unbind();
		$(checkboxes).click( function(event) {
			self.resetCheckboxesIfAllOff();
			mapState.scrapeCategories(checkboxes);
			self.setMapState(mapState);
			self.populate();
		});
	},
	sortSpotsListener: function() {
		var self = this;
		var select = this.getSortSelect();
		var mapState = this.getMapState();
		var spotId = this.getSpotId();
		$(select).unbind();
		$(select).bind('change', function(event) { 
            mapState.setSortOrder( $(select + " option:selected").val() );
            self.setMapState(mapState);
            self.populate();
		});
	},
	populate: function() {
		var self = this;
		var mapState = this.getMapState();
		var params = {};
		params.id = mapState.toJSON();
        params.spotId = this.getSpotId();
		$.ajax({
			type: "GET",
			cache: false,
			url: self.getSnippet(),
			data: params,
			success: function(data, textStatus) {
				$(self.getPane()).html(data);
				$(document).trigger( 'populated.' + self.getSlug());
			},
			error: function(XMLHttpRequest, textStatus, errorThrown) {
				var msg = textStatus + " loading: " + BenefulMap.Constants.Snippets.PANE_RESULTS;
			},
			dataType: "html"
		});	
	}
});