[% WRAPPER 'default/base.tt2' %]
<script src='[% ctx.media_prefix %]/js/ui/default/acq/picklist/bib_search.js'> </script>
<style>
    @import "[% ctx.media_prefix %]/js/dojo/dojox/form/resources/CheckedMultiSelect.css";
</style>

<script>
    var searchOffset = 0;
</script>

<div id='oils-acq-search-block' class='container'>

    <form dojoType='dijit.form.Form' action='' method=''>
        <script type="dojo/method" event="onSubmit">
            doSearch(this.getValues());
            return false; /* don't redirect */
        </script>
        <div id='oils-acq-search-sources-block'>
            <div id='oils-acq-search-sources-label'>Search Sources</div>
            <select style='overflow-y:auto;' id='oils-acq-search-source-select' 
                    multiple='true' jsId="bibSourceSelect" dojoType="dojox.form.CheckedMultiSelect">
                <option selected='selected' value='native-evergreen-catalog'>Evergreen Catalog</option>
            </select>
        </div>
        <div id='oils-acq-search-form-block'>
            <div id='oils-acq-search-fields-label'>Search Fields</div>
            <div id='oils-acq-search-fields'>
            </div>
            <table>
                <tbody id='oils-acq-search-fields-tbody'>
                    <tr id='oils-acq-search-fields-template'>
                        <td name='label'> </td>
                        <td name='input'> </td>
                    </tr>
                    <tr id='oils-acq-seach-fields-count-row'>
                        <td name='label'>Hits Per Source</td>
                        <td><input name='limit'
                            dojoType='dijit.form.NumberSpinner'
                            constraints='{min:5,max:50}'
                            value='10'></input>
                        </td>
                    </tr>
                    <tr id='oils-acq-search-fields-submit-block'>
                        <td><div dojoType='dijit.form.Button' type='submit'>Submit</div></td>
                        <td><div dojoType='dijit.form.Button' onclick='clearSearchForm()'>Clear Form</div></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </form>
</div>

<div id='oils-acq-pl-search-results'>
    <div dojoType="dijit.layout.ContentPane" layoutAlign="top" class='oils-header-panel'>
        <div>Search Results</div>
        <div>
            <div dojoType='dijit.form.Button' onClick='showDiv("oils-acq-search-block");'>New Search</div>
            <div dojoType="dijit.form.DropDownButton">
                <span>Save Results</span>
                <div dojoType="dijit.TooltipDialog" execute="saveResults(arguments[0]);">
                    <script type='dojo/connect' event='onOpen'>
                        loadPLSelect(); 
                    </script>
                    <table class='dijitTooltipTable'>
                        <tr>
                            <td colspan='2'>
                                <input dojoType="dijit.form.RadioButton" name="which" type='radio' checked='checked' value='selected'/>
                                <label for="name">Save selected</label>
                                <input dojoType="dijit.form.RadioButton" name="which" type='radio' value='all'/>
                                <label for="name">Save all</label>
                            </td>
                        </tr>
                        <tr><td colspan='2'><hr/></td></tr>
                        <tr>
                            <td><label for="new_name">Save as Selection List: </label></td>
                            <td><input dojoType="dijit.form.TextBox" name="new_name"/></td>
                        </tr>
                        <tr>
                            <td><label for="existing_pl">Add to Selection List: </label></td>
                            <td>
                                <input jsId='plAddExistingSelect' dojoType="dijit.form.FilteringSelect" 
                                    name="existing_pl" searchAttr='name' displayAttr='name'/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan='2' align='center'>
                                <button dojoType='dijit.form.Button' type="submit">Save</button>
                            </td>
                        </tr>
                    </table>
                </div>
            </div> 
        </div>
    </div>
    <div dojoType='dijit.layout.ContentPane' layoutAlign='client'>
        <table id='oila-acq-picklist-result-table'>
            <thead>
                <tr>
                    <th><a href='javascript:toggleSelect();'>Select</a></th>
                    <th>Title</th><th>Author</th><th>ISBN</th>
                    <th>ISSN</th><th>Edition</th><th>Pubdate</th>
                    <th>Publisher</th><th>Source</th>
                </tr>
            </thead>
            <tbody id='plist-tbody'>
                <tr id='plist-row'>
                    <td name='selector'><input type='checkbox' name='selectbox'/></td>
                    <td attr='title'/>
                    <td attr='author'/>
                    <td attr='isbn'/>
                    <td attr='issn'/>
                    <td attr='edition'/>
                    <td attr='pubdate'/>
                    <td attr='publisher'/>
                    <td name='source_label'/>
                </tr>
            </tbody>
        </table>    
    </div>
</div>

<div id='oils-acq-pl-loading' style='width:100%;margin-top:100px;display:none;text-align:center'>
    <img src='[% ctx.media_prefix %]/opac/images/progressbar_green.gif'/>
</div>

<script>dojo.style('oils-acq-pl-search-results', 'display', 'none');</script>
[% END %]