From 9ecdebb966f07757c9c5d8461882358e7521abde Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Thu, 6 Oct 2022 13:38:54 +0000 Subject: [PATCH] Bug 31677: Convert basic MARC editor tabs to Bootstrap This patch modifies the basic MARC editor template to replace jQueryUI tabs with Bootstrap tabs. The changes should have no visible effect, with all previous functionality still intact. To test, apply the patch and go to Cataloging -> New record. - When the page first displays, the "0" tab should be active. - Test that each of the numbered tabs works correctly to activate the correct tab content. - Confirm that the numbered tag anchors still work correctly. - Append a specific tab anchor to the URL, e.g. "#tab4XX" and refresh the page (you may need to shift-refresh). When the page reloads the correct tab should be active by default. - Try appending a query string to the URL, e.g. "?tab=tab4XX" This should reload the page and make the correct tab active. - Confirm that sortable subfields can still be re-ordered by dragging and dropping them via the "stacked lines" icons. Signed-off-by: Barbara Johnson Signed-off-by: Katrin Fischer Signed-off-by: Tomas Cohen Arazi (cherry picked from commit 6017a91c8d59426f443245c8671eea8eabd4de44) Signed-off-by: Lucas Gass --- .../intranet-tmpl/prog/css/addbiblio.css | 15 - .../prog/en/modules/cataloguing/addbiblio.tt | 399 +++++++++--------- 2 files changed, 205 insertions(+), 209 deletions(-) diff --git a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css index 4411026906..9bc49c9b6c 100644 --- a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css +++ b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css @@ -6,22 +6,16 @@ div#toolbar { border: 0; } -#addbibliotabs .ui-tabs-nav { - display: none; -} - .tab-content { border: 0; padding: 0; } -.ui-tabs-panel h3, .tab-pane h3 { font-size: 140%; margin: .3em 0; } -.ui-tabs-panel ul, .tab-pane ul { margin-bottom: 0; padding-left: 0; @@ -276,11 +270,6 @@ tbody tr.active td { width: 15em; } -.ui-tabs .ui-tabs-panel { - border: 0; - padding: 0; -} - .toolbar-tabs-container { margin: 3em -5px -5px -5px; } @@ -461,7 +450,3 @@ tbody tr.active td { padding: 0; } -#authoritiestabs .ui-tabs-nav.ui-widget-header { - border-bottom: 1px solid #b9d8d9; - border-radius: 0; -} diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt index cb6a16f905..10ec159911 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt @@ -32,21 +32,31 @@ $("#toolbar").hide(); [% END %] - var $tabs = $('#addbibliotabs').tabs().bind('show.ui-tabs', function(e, ui) { - $("#"+ui.panel.id+" input:eq(0)").focus(); + $("a[data-toggle='tab']").on("shown.bs.tab", function (e) { + $( e.target.hash + " .input_marceditor:visible:eq(0)").focus(); }); - $( "ul.sortable_field", $tabs ).sortable({ + + /* On page load, check for location.hash in the page URL */ + /* If present the location hash will be used to activate the correct tab */ + var hash = location.hash; + var hashPieces = hash.split('?'); + if( hashPieces[0] !== "" ){ + selectTab( hashPieces[0] ); + window.scrollTo( 0, 0 ); + } + + $( "ul.sortable_field", "#addbibliotabs" ).sortable({ axis: "y", containment: $("#addbibliotabs") }); - $( "ul.sortable_subfield", $tabs ).sortable({ + $( "ul.sortable_subfield", "#addbibliotabs" ).sortable({ axis: "y", containment: "parent" }); [% IF tab %] - link = $("a[href='#[% tab | html %]']"); - selectTab( link ); + hash = "#[% tab | html %]"; + selectTab( hash ); [% END %] Sticky = $("#toolbar"); @@ -151,7 +161,7 @@ $(".toolbar-tabs a").on("click",function(e){ e.preventDefault(); - selectTab( $(this ) ); + selectTab( this.hash ); }); $(".tag_anchor").on("click", function(e){ @@ -179,10 +189,10 @@ }); function selectTab( tablink ){ + let a = $("a[href='" + tablink + "']"); $(".toolbar-tabs li").removeClass("selected"); - tablink.parent().addClass("selected"); - var tabid = tablink.data("tabid"); - $('#addbibliotabs').selectTabByID("#tab" + tabid + "XX"); + a.tab("show").parent().addClass("selected"); + var tabid = a.data("tabid"); $(".tag_anchors").removeClass("tab_selected").hide(); $(".tag_anchors_" + tabid ).addClass("tab_selected").show(); } @@ -950,14 +960,14 @@ function PopupMARCFieldDoc(field) { [% END # /UNLESS circborrowernumber %]
[% IF ( BIG_LOOP && BIG_LOOP.size > 1 ) %] -
    + @@ -995,205 +1005,206 @@ function PopupMARCFieldDoc(field) {
    - - - [% FOREACH BIG_LOO IN BIG_LOOP %] -
    +
    - [% IF ( BIG_LOOP.size > 1 ) %] -

    Section [% BIG_LOO.number | html %]

    + [% FOREACH BIG_LOO IN BIG_LOOP %] + [% IF loop.first %] +
    + [% ELSE %] +
    [% END %] - [% previous = "" %] - [% FOREACH innerloo IN BIG_LOO.innerloop %] - [% IF ( innerloo.tag ) %] - [% IF innerloo.tag != previous %] - [% IF previous != "" %] -
- [% END %] - [% previous = innerloo.tag %] - [% IF ( innerloo.repeatable ) %] -
    - [% ELSE %] -
      - [% END %] + + [% IF ( BIG_LOOP.size > 1 ) %] +

      Section [% BIG_LOO.number | html %]

      [% END %] - [% IF ( innerloo.repeatable ) %] -
    • - [% ELSE %] -
    • + [% previous = "" %] + [% FOREACH innerloo IN BIG_LOO.innerloop %] + [% IF ( innerloo.tag ) %] + [% IF innerloo.tag != previous %] + [% IF previous != "" %] +
    + [% END %] + [% previous = innerloo.tag %] + [% IF ( innerloo.repeatable ) %] +
      + [% ELSE %] +
        + [% END %] [% END %] -
        - [% IF advancedMARCEditor %] - [% innerloo.tag | html %] - [% ELSE %] - [% innerloo.tag | html %] -  ? - [% END %] - - [% IF ( innerloo.fixedfield ) %] - - - [% ELSE %] - - - [% END # /IF innerloo.fixedfield %] - - - [% UNLESS advancedMARCEditor %] - [% innerloo.tag_lib | html %] - [% END %] - - - [% IF ( innerloo.repeatable ) %] - - Repeat this Tag - + [% IF ( innerloo.repeatable ) %] +
      • + [% ELSE %] +
      • + [% END %] +
        + [% IF advancedMARCEditor %] + [% innerloo.tag | html %] + [% ELSE %] + [% innerloo.tag | html %] +  ? [% END %] - - Delete this Tag - - -
        - -
          - [% FOREACH subfield_loo IN innerloo.subfield_loop %] - -
        • -
          + + [% IF ( innerloo.fixedfield ) %] + -
          + tabindex="1" + class="indicator flat" + style="display:none;" + name="tag_[% innerloo.tag | html %]_indicator2_[% innerloo.index | html %][% innerloo.random | html %]" + size="1" + maxlength="1" + value="[% innerloo.indicator2 | html %]" /> + [% ELSE %] + + + [% END # /IF innerloo.fixedfield %] - + [% UNLESS advancedMARCEditor %] - [% IF ( subfield_loo.mandatory ) %] -
          - [% ELSIF ( subfield_loo.important ) %] -
          - [% ELSE %] -
          - [% END %] - [% IF ( subfield_loo.fixedfield ) %] -
          + [% innerloo.tag_lib | html %] [% END %] - [% SET mv = subfield_loo.marc_value %] -
          - [% IF ( mv.type == 'text' ) %] - [% IF ( mv.readonly == 1 ) %] - + + [% IF ( innerloo.repeatable ) %] + + Repeat this Tag + + [% END %] + + Delete this Tag + + +
          + +
            + [% FOREACH subfield_loo IN innerloo.subfield_loop %] + +
          • +
            + +
            + [% UNLESS advancedMARCEditor %] + [% IF ( subfield_loo.mandatory ) %] +
            + [% ELSIF ( subfield_loo.important ) %] +
            [% ELSE %] - +
            [% END %] - - [% ELSIF ( mv.type == 'text_complex' ) %] - - [% mv.javascript | $raw %] - [% ELSIF ( mv.type == 'hidden' ) %] - - [% ELSIF ( mv.type == 'textarea' ) %] - - [% ELSIF ( mv.type == 'select' ) %] - [% IF mv.category AND CAN_user_parameters_manage_auth_values %] - + [% IF ( subfield_loo.fixedfield ) %] +
            [% END %] - [% FOREACH aval IN mv.values %] - [% IF aval == mv.default %] - + + [% SET mv = subfield_loo.marc_value %] +
            + [% IF ( mv.type == 'text' ) %] + [% IF ( mv.readonly == 1 ) %] + [% ELSE %] - + [% END %] + + [% ELSIF ( mv.type == 'text_complex' ) %] + + [% mv.javascript | $raw %] + [% ELSIF ( mv.type == 'hidden' ) %] + + [% ELSIF ( mv.type == 'textarea' ) %] + + [% ELSIF ( mv.type == 'select' ) %] + [% IF mv.category AND CAN_user_parameters_manage_auth_values %] + [% END %] - - [% END # /IF (mv.type...) %] -
            - [% IF ( subfield_loo.mandatory ) %] -
            - Required -
            - [% ELSIF ( subfield_loo.important ) %] -
            - Important -
            - [% END %] -
            - [% IF ( mv.type == 'text' ) %] - [% IF ( mv.authtype ) %] - Tag editor - [% END %] - [% ELSIF ( mv.type == 'text_complex' ) %] - [% IF mv.noclick %] - - [% ELSE %] - [% IF mv.plugin == "upload.pl" %] - Upload + [% FOREACH aval IN mv.values %] + [% IF aval == mv.default %] + [% ELSE %] - Tag editor + [% END %] [% END %] - - [% END %] - [% IF ( subfield_loo.repeatable ) %] - - Clone - - - Delete - + + [% END # /IF (mv.type...) %] +
            + [% IF ( subfield_loo.mandatory ) %] +
            + Required +
            + [% ELSIF ( subfield_loo.important ) %] +
            + Important +
            [% END %] -
            -
            • - - [% END # /FOREACH subfield_loop %] -
          -
          • - [% END %] - [% END # /FOREACH BIG_LOO.innerloop %] -
        -
        • - [% END # /FOREACH BIG_LOOP %] +
        + [% IF ( mv.type == 'text' ) %] + [% IF ( mv.authtype ) %] + Tag editor + [% END %] + [% ELSIF ( mv.type == 'text_complex' ) %] + [% IF mv.noclick %] + + [% ELSE %] + [% IF mv.plugin == "upload.pl" %] + Upload + [% ELSE %] + Tag editor + [% END %] + [% END %] + + [% END %] + [% IF ( subfield_loo.repeatable ) %] + + Clone + + + Delete + + [% END %] +
        + + + [% END # /FOREACH subfield_loop %] +
      + + [% END %] + [% END # /FOREACH BIG_LOO.innerloop %] +
    +
+ [% END # /FOREACH BIG_LOOP %] + [%# Fields for fast cataloging %] -- 2.39.5