Update boolean search tab with more advanced search changes
authorKathy Lussier <klussier@masslnc.org>
Fri, 2 Dec 2016 13:53:00 +0000 (08:53 -0500)
committerKathy Lussier <klussier@masslnc.org>
Fri, 2 Dec 2016 14:50:41 +0000 (09:50 -0500)
Update the Boolean search tab with more changes the have been implemented in
advanced search since the original code was done, including more responsive
design, accessbility improvements, exclude electronic resources limiter, and
hidden field for show more/fewer details button and the ability to set default
sort via global flag.

Signed-off-by: Kathy Lussier <klussier@masslnc.org>
Open-ILS/src/templates/opac/parts/advanced/boolean.tt2

index 5644573..c96f5c1 100644 (file)
@@ -4,15 +4,14 @@
     query = CGI.param('boolean_query'); 
 %]
 <form action="[% ctx.opac_root %]/results" method="GET">
-    <table id='adv_global_search' class='data_grid data_grid_center' width='100%'>
-        <tr style='border-bottom: none;'>
-            <!-- Contains the user-addable(?) rows to define search class, containment and text -->
-            <td valign='top' class='adv_global_input_container'>
-                <table width='100%' id='adv_global_input_table'>
+    <div id='adv_global_search' class='data_grid data_grid_center'>
+        <div id='adv_search_rows'>
+            <div valign='top' class='adv_global_input_container'>
+                <table id='adv_global_input_table' role="presentation">
                     <thead>
                         <tr>
                             <td>
-                                <div style="width:100%;" class="header_middle">
+                                <div class="header_middle" id="adv_search_input">
                                     [% l("Free-Form Boolean Search") %]
                                 </div>
                             </td>
                     <tbody id='adv_global_tbody'>
                         <tr>
                             <td>
-                                <input class="hidden" name="boolean" class="hidden" value=true/>
+                                <input class="hidden" name="boolean" class="hidden" value="true" />
                                 <input type="text" name="boolean_query" size="50" value="[% query | html %]" autofocus />
                             </td>
                         </tr>
                     </tbody>
                 </table>
-            </td>
-        </tr>
-        <tr>
-            <td align='top'>
-                <div style="width:100%;" class="header_middle">[% l('Search Filters') %]</div>
-                <table cellpadding='10' cellspacing='0' border='0'>
-                [%
-                    in_row = 0;
-                    FOR adv_chunk IN search.adv_config;
-                        NEXT IF adv_chunk.adv_hide;
-                        IF in_row == 0;
-                            in_row = 1; %]
-                            <tr>
-                [%
-                        END; %]
-                            <td valign='top'[% IF adv_chunk.js_only %]
-                                id='adv_chunk_[% adv_chunk.adv_special %]'
-                                class='hidden'[% END %]>
-                                <strong>[% adv_chunk.adv_label %]</strong><br />
-                [%
-                        IF adv_chunk.adv_special;
-                            SWITCH adv_chunk.adv_special;
-                                CASE "lib_selector";
-                                    PROCESS "opac/parts/org_selector.tt2";
-                                        INCLUDE build_org_selector show_loc_groups=1 id="adv_org_selector" %]
-                                            <div style="position:relative;top:7px;">
-                                                <input type='checkbox' name="modifier"
-                                                    value="available"[% CGI.param('modifier').grep('available').size ? ' checked="checked"' : '' %]
-                                                    id='opac.result.limit2avail'/>
-                                                <label style="position:relative;top:-2px;"
-                                                    for='opac.result.limit2avail'>
-                                                    [% l("Limit to Available") %]</label>
-                                            </div>
-                [%
-                                CASE "pub_year"; %]
-                                            <select name='pubdate' onchange='
-                                                if(this.selectedIndex == 3)
-                                                    unHideMe($("adv_global_pub_date_2_span"));
-                                                else
-                                                    hideMe($("adv_global_pub_date_2_span"));'>
-                                                    [%  FOR opt IN [
-                                                            {"code" => "is", "label" => l("Is")},
-                                                            {"code" => "before", "label" => l("Before")},
-                                                            {"code" => "after", "label" => l("After")},
-                                                            {"code" => "between", "label" => l("Between")} ] %]
-                                                        <option value="[% opt.code %]"[% CGI.param('pubdate') == opt.code ? ' selected="selected"' : '' %]>[% opt.label | html %]</option>
-                                                    [%  END %]
-                                            </select>    
-                                            <div style='margin-top:5px;'>
-                                                <input name='date1' type='text' size='4' maxlength='4' value="[% CGI.param('date1') | html %]"/>
-                                                <span id='adv_global_pub_date_2_span' class='[% CGI.param("pubdate") == "between" ? "" : "hide_me" %]'>
-                                                   [% l("and") %] <input name='date2' type='text' size='4' maxlength='4' value="[% CGI.param('date2') | html %]" />
-                                                </span>
-                                            </div>
-                [%
-                                CASE "sort_selector";
-                                    INCLUDE "opac/parts/filtersort.tt2"
-                                        value=CGI.param('sort') class='results_header_sel';
-                                    %]
-                        
+            </div>
+        </div>
+    <div id='adv_search_submit'>
+        <input id="detail" type="hidden" name="detail_record_view"
+               value="[% show_detail_view %]"/>
+        <span>
+            <input id='search-submit-go' type="submit" value="[% l('Search') %]" title="[% l('Search') %]" class="opac-button"
+                onclick='setTimeout(function(){$("search-submit-spinner").className=""; $("search-submit-go").className="hidden"}, 2000)'/>
+            <img id='search-submit-spinner' src='/opac/images/progressbar_green.gif'
+                class='hidden' alt="[% l('Search in progress icon') %]"/>
+        </span>
+
+        <a href="[% mkurl(ctx.opac_root _ '/advanced', {$loc_name => loc_value, pane => 'boolean'}, 1) %]"
+            class="opac-button">[% l('Clear Form') %]</a>
+    </div>
+
+    <div id='adv_search_filters'>
+        <div class="header_middle">[% l('Search Filters') %]</div>
+
+[%
+    in_row = 0;
+    FOR adv_chunk IN search.adv_config;
+        NEXT IF adv_chunk.adv_hide;
+        IF in_row == 0;
+            in_row = 1; %]
+            <div class='adv_filter_block'>
+[%
+        END; %]
+            <div class='adv_filter_block_item'>
+            <div valign='top'[% IF adv_chunk.js_only %]
+                id='adv_chunk_[% adv_chunk.adv_special %]'
+                class='hidden'[% END %]>
+                <strong><label for="[% adv_chunk.id %]">
+                  [% adv_chunk.adv_label %] </label></strong><br />
+[%
+        IF adv_chunk.adv_special;
+            SWITCH adv_chunk.adv_special;
+                CASE "lib_selector";
+                    PROCESS "opac/parts/org_selector.tt2";
+                        INCLUDE build_org_selector show_loc_groups=1 id=adv_chunk.id %]
+                            <div class="adv_search_available">
+                                <input type='checkbox' name="modifier"
+                                    value="available"[% CGI.param('modifier').grep('available').size ? ' checked="checked"' : '' %]
+                                    id='opac.result.limit2avail' />
+                                <label for='opac.result.limit2avail'>
+                                    [% l("Limit to Available") %]</label>
+                            </div>
+[%
+                CASE "pub_year"; %]
+                            <select name='pubdate'
+                                id="[% adv_chunk.id %]"
+                                onchange='if(this.selectedIndex == 3)
+                                    unHideMe($("adv_global_pub_date_2_span"));
+                                else
+                                    hideMe($("adv_global_pub_date_2_span"));'>
+                                    [%  FOR opt IN [
+                                            {"code" => "is", "label" => l("Is")},
+                                            {"code" => "before", "label" => l("Before")},
+                                            {"code" => "after", "label" => l("After")},
+                                            {"code" => "between", "label" => l("Between")} ] %]
+                                        <option value="[% opt.code %]"[% CGI.param('pubdate') == opt.code ? ' selected="selected"' : '' %]>[% opt.label | html %]</option>
+                                    [%  END %]
+                            </select>
+                            [% IF !ctx.exclude_electronic_checkbox %]
+                            <br/>
+                            <div id='adv_special_block'>
+                            [% END %]
+                                <input title="[% l('Search date') %]"
+                                  name='date1' type='text' size='4' maxlength='4' value="[% CGI.param('date1') | html %]" />
+                                <span id='adv_global_pub_date_2_span' class='[% CGI.param("pubdate") == "between" ? "" : "hide_me" %]'>
+                                   [% l("and") %] <input name='date2'
+                                    title="[% l('Secondary search date') %]" type='text' size='4' maxlength='4' value="[% CGI.param('date2') | html %]" />
+                                </span>
+                            [% IF !ctx.exclude_electronic_checkbox %]
+                            </div>
+                            [% END %]
+                            [% IF ctx.exclude_electronic_checkbox %]
+                            <div class="adv_search_available">
+                                <input type='checkbox' name="fi:-search_format" value="electronic"
+                                [%- CGI.param('fi:-search_format').grep('electronic').size ?
+                                    ' checked="checked"' : '' %]
+                                id='opac.result.excludeelec' />
+                                <label for='opac.result.excludeelec'>
+                                    [% l("Exclude Electronic Resources") %]
+                                </label>
+                            </div>
+                            [% END %]
+[%
+                CASE "sort_selector";
+                    default_sort=ctx.default_sort;
+                    IF CGI.param('sort');
+                        default_sort=CGI.param('sort');
+                    END;
+                    INCLUDE "opac/parts/filtersort.tt2"
+                        id=adv_chunk.id
+                        value=default_sort class='results_header_sel';
+                    %]
+
                     [% IF NOT metarecords.disabled %]
                         <br/><!-- <br> may seem redundant, but it allows the
                             <input> (below) to drop down inline w/ its label -->
                         name="fi:locations" size="3" multiple="multiple">
                     </select>
                 [%
-            END;
-          ELSIF adv_chunk.adv_attr;
-                            INCLUDE "opac/parts/coded_value_selector.tt2"
-                                attr=adv_chunk.adv_attr multiple="multiple" size="4";
-                        ELSIF adv_chunk.adv_filter;
-                            INCLUDE "opac/parts/filter_group_selector.tt2"
-                                filter_group=adv_chunk.adv_filter multiple="multiple" size="4";
-                        END; %]
-                            </td>
-                [%
-                        IF adv_chunk.adv_break;
-                            in_row = 0; %]
-                            </tr>
-                [%
-                        END;
-                    END; %]
-                </table>
-            </td>
-        </tr>
-    </table>
-    <span>
-        <input id='search-submit-go' type="submit" value="[% l('Search') %]" alt="[% l('Search') %]" class="opac-button"
-                onclick='setTimeout(function(){$("search-submit-spinner").className=""; $("search-submit-go").className="hidden"}, 2000)'/>
-        <img id='search-submit-spinner' src='/opac/images/progressbar_green.gif' style='height:16px;width:16px;' class='hidden' alt=''/>
-    </span>
-    <a href="[% mkurl(ctx.opac_root _ '/advanced', {$loc_name => loc_value, pane => 'boolean'}, 1) %]"
-        class="pointer opac-button">[% l('Clear Form') %]</a>
+            END;
+        ELSIF adv_chunk.adv_attr;
+            INCLUDE "opac/parts/coded_value_selector.tt2"
+                id=adv_chunk.id
+                attr=adv_chunk.adv_attr multiple="multiple"
+                size=adv_chunk.adv_size || search.default_adv_select_height || "4";
+        ELSIF adv_chunk.adv_filter;
+            INCLUDE "opac/parts/filter_group_selector.tt2"
+                id=adv_chunk.id
+                filter_group=adv_chunk.adv_filter multiple="multiple"
+                size=adv_chunk.adv_size || search.default_adv_select_height || "4";
+        END; %]
+            </div>
+        </div>
+[%
+        IF adv_chunk.adv_break;
+            in_row = 0; %]
+            </div>
+[%
+        END;
+    END; %]
+
+        </div>
+    </div>
+</div>
 </form>