[% WRAPPER 'default/base.tt2' %]

<div id='oils-acq-list-header' class='container'>
    <div id='oils-acq-list-header-label'>Funds</div>
</div>

<!-- load the page-specific JS -->
<script src='[% ctx.media_prefix %]/js/ui/default/acq/financial/list_funds.js'> </script>

<script type="text/javascript">
    function createFund(fields) {
        /** Creates a new fund source */
        openils.acq.Fund.create(
            fields, 
            function(fundId) {
                var evt = openils.Event.parse(fundId);
                if(evt) {
                    alert(evt); /* XXX */
                    return;
                } else {
                    location.href =  /* go to the details page for this fund */
                        '[% ctx.base_uri %]/acq/fund/view/'+fundId;
                }
            }
        );
    }
</script>

<div class='oils-acq-actions-div'>
    <div dojoType="dijit.form.DropDownButton">
        <span>New Fund</span>

        <div dojoType="dijit.TooltipDialog" execute="createFund(arguments[0]);">
            <script type='dojo/connect' event='onOpen'>
                openils.acq.CurrencyType.loadSelectWidget(fundCurrencySelector);
                new openils.User().buildPermOrgSelector('ADMIN_FUND', fundOwnerSelect);
            </script>

            <table class='dijitTooltipTable'>
                <tr>
                    <td><label for="name">Name: </label></td>
                    <td><input dojoType="dijit.form.TextBox" name="name"/></td>
                </tr>
                <tr>
                    <td><label for="name">Code: </label></td>
                    <td><input dojoType="dijit.form.TextBox" name="code"/></td>
                </tr>
                <tr>
                    <td><label for="year">Year: </label></td>
                    <td><input dojoType="dijit.form.TextBox" name="year"/></td>
                </tr>
                <tr>
                    <td><label for="currency_type">Currency Type: </label></td>
                    <td>
                        <input jsId='fundCurrencySelector' name="currency_type" 
                            dojoType="dijit.form.FilteringSelect" searchAttr='code' labelAttr='code'>
                        </input>
                    </td>
                </tr>
                <tr>
                    <td valign='top'><label for="org">Owning Location: </label></td>
                    <td>
                        <input dojoType="openils.widget.OrgUnitFilteringSelect" jsId='fundOwnerSelect'
                            searchAttr="shortname" name="org" autocomplete="true" labelAttr='shortname'> </input>
                    </td>
                </tr>
                <tr>
                    <td colspan='2' align='center'>
                        <button dojoType=dijit.form.Button type="submit">Create</button>
                    </td>
                </tr>
            </table>
        </div>
    </div> 

    <button dojoType="dijit.form.Button" 
            onclick="openils.acq.Fund.deleteFromGrid(
                fundListGrid, function(){location.href = location.href})">
        Delete Selected
    </button>

    <label>Year</label>
    <select dojoType='dijit.form.FilteringSelect' onchange='filterGrid();' style='width:100px;'
        jsId='fundFilterYearSelect' labelAttr='year' searchAttr='year'> </select>
</div>

<!-- The main grid lives here -->
<script>
    function getName(rowIndex) {
        data = fundListGrid.model.getRow(rowIndex);
        if(!data) return;
        return '<a href="[% ctx.base_uri %]/acq/fund/view/'+data.id+'">'+data.name+'</a>';
    }

    var fundListGridStructure = [{
        cells : [[
            {name: 'ID', field: 'id'},
            {name: 'Name', width:'auto', get:getName}, 
            {name: 'Code', field:'code'},
            {name: 'Year', field: "year"}, 
            {name: 'Location', get:getOrgInfo}, 
            {name: 'Currency Type', field: "currency_type"},
            {name: 'Combined Balance', get:getBalanceInfo}
        ]]
    }];
</script>
<div jsId='fundListGrid' dojoType="dojox.Grid" structure='fundListGridStructure'></div>
[% END %]