/// class PD.Manage.OverviewToggle
// using PD.Web.UI.Controls.Control

PD.Manage.Modules.OverviewToggle =
PD.Web.UI.Controls.Control.extend({

    //===================================
    // FIELDS
    //===================================

    //===================================
    // PROTECTED EVENT HANDLERS
    //===================================

    onActivate: function (e) {

        var that = this;

        this.get_node().on("click", ".-pd-toggle", function (e) {
            that.select($(e.currentTarget).data("id"));
        });

    },

    onComplete: function () {

    },

    //===================================
    // PUBLIC METHODS
    //===================================

    select: function (id) {
        
        var $toggle = this.get_node().find("[data-id='" + id + "']");
        var clickFn = this.get_options().click;

        if ($toggle.length === 0) {
            return;
        }

        this._clearSelections();

        $toggle.addClass("selected");

        if (_.isFunction(clickFn)) {
            clickFn({
                id: id
            });
        }

    },

    //===================================
    // PROTECTED METHODS
    //===================================

    template: function (e) {

        return [
            "<div class='-pd-overview-toggle'>",
                "<div data-id='panel' class='-pd-toggle'></div>",
                "<div data-id='grid' class='-pd-toggle'></div>",
            "</div>"
        ];

    },

    //===================================
    // PRIVATE METHODS
    //===================================

    _clearSelections: function () {
        this.get_node().find(".-pd-toggle").removeClass("selected");
    }

});