﻿// Class ResultsPane
// Base class: AjaxPane


// mapState : MapState Object - passed to results snippet
// resultsSelectBox : Selector - filters results

BenefulMap.ResultsPane = BenefulMap.AjaxPane.extend({
    init: function(snippet, pane, slug, mapState, resultsSelectBox) {
        var params = {};
        params.id = mapState.toJSON();

        this._super(snippet, pane, params, slug);
        this.mapState = mapState;
        this.resultsSelectBox = resultsSelectBox;

        this.resultsUpdateListener();
        this.resultsInvalidListener();
        this.populate();
    },
    getMapState: function() {
        return this.mapState;
    },
    setMapState: function(mapState) {
        this.mapState = mapState;
    },
    updateMapState: function(mapState) {
        var params = {};
        params.id = mapState.toJSON();
        this.setParams(params);
        this.setMapState(mapState);
    },
    getResultsSelectBox: function() {
        return this.resultsSelectBox;
    },
    selectBoxListener: function() {
        var self = this;
        $(this.getResultsSelectBox()).unbind();
        $(this.getResultsSelectBox()).bind('change', function(event) {
            var mapState = self.getMapState();
            mapState.setSortOrder($(self.getResultsSelectBox() + " option:selected").val());
            mapState.resetPage();
            mapState.setGoButtonClicked(false);
            self.updateMapState(mapState);

            self.populate();
            $(document).trigger('pagination.update', [mapState]);
        });
    },
    populatedListener: function() {
        var self = this;
        $(document).bind('populated.' + this.getSlug(), function(event) {
            console.info("Pane " + self.getSlug() + " populated");
            var mapState = self.getMapState();
            if (mapState.isValid()) {
                self.selectBoxListener();
                console.log("this is where map.update would be triggered");
                $(document).trigger("tellFriend.resultsPopulated", [mapState]);
                $(document).trigger('linkTo.resultsPopulated', [mapState]);
                $(document).trigger('map.update', [mapState]);
            } else {
                $(document).trigger('map.invalid', [mapState]);
            }
            $("#add-spot-wrap").show();
        });
    },
    resultsUpdateListener: function() {
        var self = this;
        $(document).bind('results.update', function(event, mapState) {
            self.updateMapState(mapState);
            self.populate();
        });
    },
    resultsInvalidListener: function() {
        var self = this;
        $(document).bind('results.invalid', function(event, mapState) {
            mapState.inputError();
            self.updateMapState(mapState);
            self.populate();
        });
    }
});


