[% WRAPPER base.tt2 %]
[% ctx.page_title = l('Vandelay Match Sets') %]
<div dojoType="dijit.layout.ContentPane" layoutAlign="client">
    <div dojoType="dijit.layout.ContentPane" layoutAlign="top" class="oils-header-panel">
        <div>[% ctx.page_title %]</div>
        <div>
            <button dojoType="dijit.form.Button"
                onClick="vms_grid.showCreateDialog()">[% l('New Match Set') %]</button>
            <button dojoType="dijit.form.Button"
                onClick="vms_grid.deleteSelected()">[% l('Delete Selected') %]</button>
        </div>
    </div>
    <div>
        [% l('Show sets owned at or below:') %]
        <select dojoType="openils.widget.OrgUnitFilteringSelect"
            jsId="context_org_selector"></select>
    </div>
    <table jsId="vms_grid"
        dojoType="openils.widget.AutoGrid"
        query="{id: '*'}"
        defaultCellWidth="'16em'"
        fmClass="vms"
        fieldorder="['name', 'owner']"
        suppressEditFields="['id']"
        showPaginator="true"
        editOnEnter="true">
        <thead>
            <tr>
                <th field="name" get="field_plus_id" formatter="tree_editor_link"></th>
                <th field="owner" get="openils.widget.AutoGrid.orgUnitGetter">
                </th>
            </tr>
        </thead>
    </table>
</div>
<div class="hidden">
    <select dojoType="dijit.form.FilteringSelect" jsId="mtype_selector">
        [%# for the origin of these hard coded options, see the definition
        of vandelay.match_set.mtype in 012.schema.vandelay.sql %]
        <option value="biblio">[% l('biblio') %]</option>
        <option value="authority">[% l('authority') %]</option>
        <!-- XXX: nah <option value="mfhd">[% l('mfhd') %]</option> -->
    </select>
</div>

<script type="text/javascript">
    dojo.require("dijit.form.FilteringSelect");
    dojo.require("openils.widget.AutoGrid");
    dojo.require("openils.widget.OrgUnitFilteringSelect");

    var context_org;

    function load_grid(search) {
        if (!search) search = {"id": {"!=": null}};

        vms_grid.loadAll({"order_by": {"vms": "name"}}, search);
    }

    function field_plus_id(rowIndex, item) {
        if (!item) return null;
        var datum = {};
        datum[this.field] = this.grid.store.getValue(item, this.field);
        datum.id = this.grid.store.getValue(item, "id");
        return datum;
    }

    function tree_editor_link(datum) {
        if (!datum) return "";
        return '<a href="[% ctx.base_path %]/conify/global/vandelay/match_set_tree?match_set=' +
            datum.id + '">' + datum.name + '</a>';
    }

    openils.Util.addOnLoad(
        function() {
            new openils.User().buildPermOrgSelector(
                "ADMIN_IMPORT_MATCH_SET", context_org_selector,
                null, function() {
                    context_org_selector.onChange = function() {
                        context_org = this.attr("value");
                        vms_grid.resetStore();
                        load_grid({
                            "owner": aou.descendantNodeList(context_org, true)
                        });
                    };
                }
            );

            vms_grid.overrideEditWidgets.mtype = mtype_selector;
            vms_grid.overrideEditWidgets.mtype.shove = {"create": "biblio"};
            load_grid();
        }
    );
</script>
[% END %]