Attachment 152032 Details for Bug 33891 – Bug 33891: Use template wrapper for tabs: OPAC advanced search

[patch] Bug 33891: Use template wrapper for tabs: OPAC advanced search

Bug-33891-Use-template-wrapper-for-tabs-OPAC-advan.patch (text/plain), 10.54 KB, created by David Cook on 2023-06-06 06:08:06 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: David Cook

Created: 2023-06-06 06:08:06 UTC

Size: 10.54 KB

patch

obsolete

>From d5c64de69722d2b4fef31cc8d705c34dd6873d90 Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Wed, 31 May 2023 17:51:46 +0000
>Subject: [PATCH] Bug 33891: Use template wrapper for tabs: OPAC advanced
> search
>
>This patch adds the tab WRAPPER markup to the OPAC, adapted for the
>Bootstrap version used by the OPAC (4.5.0). The advanced search page is
>updated to use the wrapper construction.
>
>Unrelated markup fix: an empty size attribute is removed from an
><input>.
>
>To test, apply the patch and view the the advanced search page in the
>OPAC. The tabs for item type, shelving location, and collection should
>all look correct and work correctly.
>
>In the staff interface, go to Administration -> System preferences ->
>OpacAdvancedSearchTypes and try various configurations, confirming each
>time that the OPAC page adjustes correctly.
>
>Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
>Signed-off-by: David Cook <dcook@prosentient.com.au>
>---
> .../bootstrap/en/includes/html_helpers.inc    | 65 +++++++++++++++++++
> .../bootstrap/en/modules/opac-advsearch.tt    | 40 ++++++------
> 2 files changed, 84 insertions(+), 21 deletions(-)
>
>diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/html_helpers.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/html_helpers.inc
>index d849154a37..5196f3beca 100644
>--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/html_helpers.inc
>+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/html_helpers.inc
>@@ -33,3 +33,68 @@
>     [%- END -%]
>     [%- this_biblio_href | url %][% biblionumber | url -%]
> [%- END %]
>+
>+[% # BOOTSTRAP TAB WRAPPER USAGE                                                                         %]
>+[% #     [ WRAPPER tabs id= "tabs_container_id" ]                                                        %]
>+[% #         [ WRAPPER tabs_nav ]                                                                        %]
>+[% #             [ WRAPPER tab_item tabname= "tab_name_1" bt_active= 1 ] <span>Tab text 1</span> [ END ] %]
>+[% #             [ WRAPPER tab_item tabname= "tab_name_2" ] <span>Tab text 2</span> [ END ]              %]
>+[% #             ...                                                                                     %]
>+[% #         [ END ]                                                                                     %]
>+[% #         [ WRAPPER tab_panels ]                                                                      %]
>+[% #             [ WRAPPER tab_panel tabname="tab_name_1" bt_active= 1 ] Panel contents 1 [ END ]        %]
>+[% #             [ WRAPPER tab_panel tabname="tab_name_2" ] Panel contents 2 [ END ]                     %]
>+[% #             ...                                                                                     %]
>+[% #         [ END ]                                                                                     %]
>+[% #     [ END ]                                                                                         %]
>+
>+[% BLOCK tabs %]
>+    [% IF ( id ) %]
>+        <div id="[% id | html %]" class="toptabs">
>+    [% ELSE %]
>+        <div class="toptabs">
>+    [% END %]
>+        [% content | $raw %]
>+    </div>
>+[% END %]
>+
>+[% BLOCK tabs_nav %]
>+    <ul class="nav nav-tabs" role="tablist">
>+        [% content | $raw %]
>+    </ul>
>+[% END %]
>+
>+[% BLOCK tab_item %]
>+    <li class="nav-item" role="presentation">
>+        [% IF ( bt_active ) %]
>+            [% SET link_class="nav-link active" %]
>+            [% SET aria_selected="true" %]
>+        [% ELSE %]
>+            [% SET link_class="nav-link" %]
>+            [% SET aria_selected="false" %]
>+        [% END %]
>+        <a href="#[% tabname | uri %]_panel" class="[% link_class | html %]" id="[% tabname | html %]-tab" data-toggle="tab" data-target="#[% tabname | html %]_panel" data-tabname="[% tabname | uri %]" aria-controls="[% tabname | uri %]_panel" role="tab" aria-selected="[% aria_selected | html %]">
>+            [% content | $raw %]
>+        </a>
>+    </li>
>+[% END %]
>+
>+[% BLOCK tab_panels %]
>+    [% IF ( id ) %]
>+        <div class="tab-content" id="[% id | html %]_content">
>+    [% ELSE %]
>+        <div class="tab-content">
>+    [% END %]
>+        [% content | $raw %]
>+    </div>
>+[% END %]
>+
>+[% BLOCK tab_panel %]
>+    [% IF ( bt_active ) %]
>+        <div role="tabpanel" class="tab-pane show active" id="[% tabname | html %]_panel" aria-labelledby="[% tabname | html %]-tab">
>+    [% ELSE %]
>+        <div role="tabpanel" class="tab-pane" id="[% tabname | html %]_panel" aria-labelledby="[% tabname | html %]-tab">
>+    [% END %]
>+        [% content| $raw %]
>+    </div>
>+[% END %]
>diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt
>index 7e09f3911f..eb1edd78bc 100644
>--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt
>+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt
>@@ -112,7 +112,7 @@
>                                             </select> 
>                                         </div> 
>                                         <div class="search-term-input">
>-                                            <input class="form-control" type="text" size="" name="q" title="Enter search terms" value="" />
>+                                            <input class="form-control" type="text" name="q" title="Enter search terms" value="" />
>                                         </div> 
>                                         [% IF ( expanded_options ) %]
>                                             <div class="search-term-input">
>@@ -144,7 +144,7 @@
>                                         See from (non-preferred form) headings are included
>                                     </div>
>                                 [% END %]
>-                            </div> 
>+                            </div> 
>                         </fieldset>
>                     </div> 
>                 </div> 
>@@ -162,23 +162,21 @@
>                 [%# Following on one line for translatability %]
>                 [% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('itemtype').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('itemtype').size > 0 and expanded_options ) ) %]
>                     <div class="col order-first order-md-first order-lg-2">
>-                        <div id="advsearches" class="toptabs">
>-                            <ul class="nav nav-tabs" role="tablist">
>+                        [% WRAPPER tabs id= "advsearches" %]
>+                            [% WRAPPER tabs_nav %]
>                                 [% FOREACH advsearchloo IN advancedsearchesloop %]
>-                                    <li class="nav-item" role="presentation" id="advsearch-tab-[% advsearchloo.advanced_search_type | html %]">
>-                                        <a href="#advsearch-[% advsearchloo.advanced_search_type | uri %]" class="nav-link" aria-controls="advsearch-[% advsearchloo.advanced_search_type | html %]" aria-selected="false" role="tab" data-toggle="tab">
>-                                            [% IF ( advsearchloo.advanced_search_type == 'itemtypes' ) %]<span>Item type</span>
>-                                            [% ELSIF ( advsearchloo.advanced_search_type == 'ccode' ) %]<span>Collection</span>
>-                                            [% ELSIF ( advsearchloo.advanced_search_type == 'loc' ) %]<span>Shelving location</span>
>-                                            [% ELSE %]<span>Something else</span>
>-                                            [% END %]
>-                                        </a>
>-                                    </li>
>+                                    [% WRAPPER tab_item tabname= "advsearch-tab-${advsearchloo.advanced_search_type}" bt_active= "0" %]
>+                                        [% IF ( advsearchloo.advanced_search_type == 'itemtypes' ) %]<span>Item type</span>
>+                                        [% ELSIF ( advsearchloo.advanced_search_type == 'ccode' ) %]<span>Collection</span>
>+                                        [% ELSIF ( advsearchloo.advanced_search_type == 'loc' ) %]<span>Shelving location</span>
>+                                        [% ELSE %]<span>Something else</span>
>+                                        [% END %]
>+                                    [% END %]
>                                 [% END %]
>-                            </ul>
>-                            <div class="tab-content">
>+                            [% END # /WRAPPER tabs_nav %]
>+                            [% WRAPPER tab_panels id= "advsearches" %]
>                                 [% FOREACH advsearchloo IN advancedsearchesloop %]
>-                                    <div role="tabpanel" class="tab-pane" id="advsearch-[% advsearchloo.advanced_search_type | html %]" class="advsearch" aria-labelledby="advsearch-tab-[% advsearchloo.advanced_search_type | html %]">
>+                                    [% WRAPPER tab_panel tabname="advsearch-tab-${advsearchloo.advanced_search_type}" %]
>                                         <fieldset>
>                                             <legend>Limit to any of the following:</legend>
>                                             <div class="row">
>@@ -204,13 +202,13 @@
>                                                     [% END %]
>                                                 [% END %]
>                                         </fieldset>
>-                                    </div> 
>+                                    [% END # /tab_panel#advsearch-advsearchloo.advanced_search_type %]
>                                 [% END # / FOREACH advancedsearchesloop %]
>-                            </div> 
>-                        </div> 
>+                            [% END # /tab_panels %]
>+                        [% END # /WRAPPER tabs#advsearches %]
>                     </div> 
>                 [% END # /IF OpacAdvSearchOptions %]
>-            </div>
>+            </div> 
> 
>             <div id="advsearch_limits" class="row">
> 
>@@ -483,7 +481,7 @@ $(document).ready(function() {
>     [% END %]
> 
>     if( $("#advsearches .tab-pane.active").length < 1 ){
>-        $("#advsearches a:first").tab("show");
>+        $("#advsearches li:first a").tab("show");
>     }
> 
>     $('.search-term-row .search-term-input select[name="op"]').first().prop("disabled",true).hide();
>-- 
>2.30.2

Actions: View | Diff | Splinter Review

Attachments on bug 33891: 151988 | 152015 | 152032