/// class PD.Manage.Modules.EntityManagementList
// using PD.Web.UI.Controls.Control

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

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

    _data: null,

    //===================================
    // PROPERTIES
    //===================================

    get_listView: function () {
        return this.get_node().find(".-pd-listview");
    },

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

    onInit: function (e) {
        this._data = new PD.BCL.List();
    },

    onActivate: function () {

        var that = this,
            list = this.get_listView(),
            data = this.get_options()["data"] || [];

        this._data = new PD.BCL.List(data);

        this._data.each(function (index, item) {
            list.append(that._getListItem(item));
        });

    },

    onComplete: function (e) {
        this.get_listView().on("click", ".-pd-listview-item", $.proxy(this._item_onClick, this));
        this._selectFirstListItem();
    },

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

    select: function (id) {

        var $item = this._getSelectedItem();

        return {
            item: $item,
            data: this._getItemData($item)
        };

    },

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

    template: function () {
        return [
            "<div>",
                "<div class='-pd-title-compact' style='border-width:0 0 1px 0;'>Entity Types</div>",
                "<div class='-pd-listview'></div>",
            "</div>"
        ];
    },

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

    _item_onClick: function (e) {

        var $list = this.get_listView(),
            $item = $(e.currentTarget),
            selectFn = this.get_options()["select"];

        if (!$item.hasClass("-pd-state-selected")) {
            $list.find(".-pd-state-selected").removeClass("-pd-state-selected");
            $item.addClass("-pd-state-selected");
            if (PD.Type.isFunction(selectFn)) {
                selectFn({
                    selection: this._getItemData($item)
                });
            }
        }

    },

    _getSelectedItem: function () {
        return this.get_listView().find(".-pd-listview-item.-pd-state-selected");
    },

    _getItemData: function ($item) {

        var id = $item.data("id"),
            result = null;

        this._data.each(function (index, item) {
            if (item.id === id) {
                result = item;
                return false;
            }
        });

        return result;

    },

    _getListItem: function (data) {
        return [
            "<div class='-pd-listview-item' data-id='" + data.id + "'>",
                data.icon ? "<div class='-pd-item-icon' style='background-image:url(" + PD.Path.resolve("~/application/icons/16x16/" + data.icon) + ");'></div>" : "",
                "<div class='-pd-item-label'>" + data.name + "</div>",
            "</div>"].join("");
    },

    _selectFirstListItem: function () {

        var $firstItem = this.get_listView().find(".-pd-listview-item:first"),
            selectFn = this.get_options()["select"];

        $firstItem.addClass("-pd-state-selected");

        if (PD.Type.isFunction(selectFn)) {
            selectFn({
                selection: this._getItemData($firstItem)
            });
        }

    }

});