Koha-community/Koha
13
7
Fork 0
Code Issues Releases Wiki Activity

Bug 33524: Use template wrapper for tabs: Authority editor

Browse source 
This patch updates the authority editor template to replace tab markup
with the use of WRAPPERs. Some CSS and JS has been modified in order to
make the custom style and behavior of the tabs on this page work
correctly with standard Bootstrap tab markup.

To test, apply the patch and go to Authorities -> New authority.

- Confirm that the tabs look correct, with the same style they had
  before the template change.
- The first tab ("0") should be selected by default.
- Confirm that tab-switching works correctly: The tab color should
  change and the list of numbered tags in the menu just below should
  change to match the section.
  - Confirm that these tag number links still work correctly to jump you
    down the page to the corresponding tag.
- Without filling in any mandatory fields, click the "Save" button.
  - You should get an error message about missing mandatory fields.
    - Clicking the "Go to field" link should take you to the correct tab
      and the correct tag.
- Append a hash to the URL to pre-select a tab other than the first one,
  e.g. "/cgi-bin/koha/authorities/authorities.pl?authtypecode=PERSO_NAME#tab5XX_panel"
  The correct tab should be selected upon page load.

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This commit is contained in:
Owen Leonard 2023-05-26 13:45:56 +00:00 committed by Tomas Cohen Arazi
parent 4a3ae69173
commit c12e14842d
Signed by: tomascohen
GPG key ID: 0A272EA1B2F3C15F
2 changed files with 25 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
koha-tmpl/intranet-tmpl/prog/css/addbiblio.css
View file

@ -376,7 +376,8 @@ tbody tr.active td {
width: 100%;
}
.toolbar-tabs-container .nav-tabs li.selected a:hover {
.toolbar-tabs-container .nav-tabs li.selected a:hover,
.toolbar-tabs-container .nav-tabs li.selected a:focus {
background-color: #418940;
border: 1px solid #418940;
border-left: 0;

40
koha-tmpl/intranet-tmpl/prog/en/modules/authorities/authorities.tt
View file

@ -33,6 +33,8 @@
if( hashPieces[0] !== "" ){
selectTab( hashPieces[0] );
window.scrollTo( 0, 0 );
} else {
selectTab( "#tab0XX_panel" );
}
$( "ul.sortable_field", "#authoritytabs" ).sortable();
@ -57,7 +59,7 @@
return false;
});
$(".toolbar-tabs a").on("click",function(e){
$(".toolbar-tabs-container .nav-tabs a").on("click",function(e){
e.preventDefault();
selectTab( this.hash );
});
@ -75,7 +77,7 @@
e.preventDefault();
var tab = $(this).data("tab");
var field = $(this).data("field");
var tablink = $("a[data-tabid='" + tab + "']" );
var tablink = $("a[data-tabname='tab" + tab + "XX']" ).get(0).hash;
selectTab( tablink );
window.scrollTo( 0, getScrollto( field, "toolbar" ) );
});
@ -93,9 +95,10 @@
function selectTab( tablink ){
let a = $("a[href='" + tablink + "']");
$(".toolbar-tabs li").removeClass("selected");
$(".toolbar-tabs-container .nav-tabs li").removeClass("selected");
a.tab("show").parent().addClass("selected");
var tabid = a.data("tabid");
/* Get number from string like "tab9XX" */
var tabid = a.data("tabname").substring(3, 4);
$(".tag_anchors").removeClass("tab_selected").hide();
$(".tag_anchors_" + tabid ).addClass("tab_selected").show();
}
@ -363,17 +366,18 @@
</div>
<div class="toolbar-tabs-container">
[% IF ( BIG_LOOP && BIG_LOOP.size > 1 ) %]
<ul class="toolbar-tabs" role="tablist">
[% WRAPPER tabs_nav %]
[%- FOREACH BIG_LOO IN BIG_LOOP -%]
[% IF loop.first %]
<li role="presentation" class="active selected">
[% SET bt_active = 1 %]
[% ELSE %]
<li role="presentation">
[% SET bt_active = 0 %]
[% END %]
[% WRAPPER tab_item tabname= "tab${BIG_LOO.number}XX" bt_active= bt_active %]
<span>[% BIG_LOO.number | html %]</span>
[% END %]
<a data-tabid="[% BIG_LOO.number | html %]" href="#tab[% BIG_LOO.number | html %]XX" aria-controls="#tab[% BIG_LOO.number | html %]XX" role="tab" data-toggle="tab">[% BIG_LOO.number | html %]</a>
</li>
[%- END -%]
</ul>
[% END # /WRAPPER tabs_nav %]
[% END %]
<ul class="tag_anchors_list">
[% FOREACH BIG_LOO IN BIG_LOOP %]
@ -396,14 +400,16 @@
This authority is not used in any records.
[% END %]
</div>
<div id="authoritytabs" class="toptabs numbered">
<div class="tab-content">
[% WRAPPER tabs id= "authoritytabs" %]
[% WRAPPER tab_panels %]
[% FOREACH BIG_LOO IN BIG_LOOP %]
[% IF loop.first %]
<div id="tab[% BIG_LOO.number | html %]XX" role="tabpanel" class="tab-pane active">
[% SET bt_active = 1 %]
[% ELSE %]
<div id="tab[% BIG_LOO.number | html %]XX" role="tabpanel" class="tab-pane">
[% SET bt_active = 0 %]
[% END %]
[% WRAPPER tab_panel tabname="tab${BIG_LOO.number}XX" bt_active= bt_active %]
[% IF ( BIG_LOOP.size > 1 ) %]
<h2>Section [% BIG_LOO.number | html %]</h2>
[% END %]
@ -608,10 +614,10 @@
[% END # /IF ( innerloo.tag ) %]
[% END # /FOREACH innerloo %]
</ul> <!-- /.sortable_field -->
</div> <!-- /#tab[% BIG_LOO.number | html %]XX -->
[% END # /tab_panel#tabXXX %]
[% END #/FOREACH BIG_LOO %]
</div> <!-- /.tab-content -->
</div> <!-- /#authoritytabs -->
[% END # /WRAPPER tab_panels %]
[% END # /WRAPPER tabs %]
<div name="hidden" id="hidden" class="tab">
[% FOREACH hidden_loo IN hidden_loop %]