Bugzilla – Attachment 133331 Details for
Bug 30545
Replace the use of jQueryUI Accordion on the notices page
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 30545: Replace the use of jQueryUI Accordion on the notices page
Bug-30545-Replace-the-use-of-jQueryUI-Accordion-on.patch (text/plain), 25.67 KB, created by
Owen Leonard
on 2022-04-14 16:29:12 UTC
(
hide
)
Description:
Bug 30545: Replace the use of jQueryUI Accordion on the notices page
Filename:
MIME Type:
Creator:
Owen Leonard
Created:
2022-04-14 16:29:12 UTC
Size:
25.67 KB
patch
obsolete
>From 7d0673844cff8315f0e9c1fa8b80501b78e48947 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Fri, 8 Apr 2022 12:20:00 +0000 >Subject: [PATCH] Bug 30545: Replace the use of jQueryUI Accordion on the > notices page > >This patch updates the notices edit interface in order to replace >jQueryUI accordion and tabs widgets with Bootstrap collapse and tabs. > >To test, apply the patch and rebuild the staff interface CSS >(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). > >- Set the TranslateNotices system preference to "Don't allow." >- Go to Tools -> Notices and edit any notice. >- On the "Modify notice" page you should see three collapsed sections: > Email, Print, and SMS. >- Clicking the section headings should expand and collapse the panels. >- With one of the panels open, click Save -> Save and continue editing. > - When the page reloads the same panel should be expanded. > >- Enable the TranslateNotices system preference. >- Return to the edit interface for one of your notices. >- You should now see at least two tabs: Default and English. >- The sections under each tab should continue to work correctly. >- Test the "Save and continue" functionality again. When redirected you > should return to both the correct tab and the correct panel, e.g. the > "Print" section under the "English (en)" tab. >--- > .../prog/en/modules/tools/letter.tt | 219 +++++++++++------- > koha-tmpl/intranet-tmpl/prog/js/letter.js | 37 +-- > tools/letter.pl | 4 +- > 3 files changed, 158 insertions(+), 102 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/letter.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/letter.tt >index f2337e39e9..7997752a30 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/letter.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/letter.tt >@@ -22,7 +22,30 @@ > Notices › Tools › Koha > </title> > [% INCLUDE 'doc-head-close.inc' %] >-<style>#preview_template .modal-dialog { width : 80%; } .spinner { display: none; } @media (max-width: 767px) { #preview_template { margin: 0; width : auto; } }</style> >+[% FILTER collapse %] >+ <style> >+ #preview_template .modal-dialog { >+ width : 80%; >+ } >+ .spinner { >+ display: none; >+ } >+ @media (max-width: 767px) { >+ #preview_template { >+ margin: 0; width : auto; >+ } >+ } >+ .panel-body fieldset.rows { >+ border: 0; >+ background: transparent none; >+ margin: 0 0 .5em 0; >+ } >+ #tabs, >+ .panel-group { >+ margin-top: 3px; >+ } >+ </style> >+[% END %] > </head> > > <body id="tools_letter" class="tools"> >@@ -416,112 +439,134 @@ > [% IF Koha.Preference('TranslateNotices') %] > <div style="clear:both"></div> > <div id="tabs"> >- <ul> >- <li><a href="#lang_default">Default</a></li> >+ <!-- Nav tabs --> >+ <ul class="nav nav-tabs" role="tablist"> >+ <li role="presentation"> >+ <a href="#lang_default" aria-controls="lang_default" role="tab" data-toggle="tab">Default</a> >+ </li> > [% FOR language IN languages %] > [% FOR sublanguage IN language.sublanguages_loop %] > [% IF language.plural %] >- <li><a href="#lang_[% sublanguage.rfc4646_subtag | uri %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</a></li> >+ <li role="presentation"> >+ <a href="#lang_[% sublanguage.rfc4646_subtag | uri %]" aria-controls="lang_[% sublanguage.rfc4646_subtag | uri %]" role="tab" data-toggle="tab">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</a> >+ </li> > [% ELSE %] >- <li><a href="#lang_[% sublanguage.rfc4646_subtag | uri %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</a></li> >+ <li role="presentation"> >+ <a href="#lang_[% sublanguage.rfc4646_subtag | uri %]" aria-controls="lang_[% sublanguage.rfc4646_subtag | uri %]" role="tab" data-toggle="tab">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</a> >+ </li> > [% END %] > [% END %] > [% END %] > </ul> >+ <div class="tab-content"> >+ [% ELSE %] >+ <div style="clear:both"></div> > [% END # /IF TranslateNotices %] > > [% FOREACH lang IN letters.keys %] >- <div id="lang_[% lang | html %]"> >- <div class="transport-types" style="clear:both"> >- [% FOR mtt IN letters.$lang.templates.keys.sort %] >- [% SET letter = letters.$lang.templates.$mtt %] >- [% NEXT IF letter.message_transport_type == "itiva" && !Koha.Preference('TalkingTechItivaPhoneNotification') %] >- [% NEXT IF letter.message_transport_type == "phone" && !Koha.Preference('PhoneNotification') %] >- <h3> >- [% SWITCH letter.message_transport_type %] >- [% CASE 'email' %] >- Email >- [% CASE 'print' %] >- Print >- [% CASE 'sms' %] >- SMS >- [% CASE 'feed' %] >- Feed >- [% CASE 'itiva' %] >- Phone ( Itiva ) >- [% CASE 'phone' %] >- Phone >- [% CASE %] >- [% letter.message_transport_type | html %] >- [% END %] >- </h3> >- [% IF letter.message_transport_type == "sms" and not Koha.Preference("SMSSendDriver") %] >- <fieldset class="rows mtt" id="[% letter.message_transport_type | html %]_[% lang | html %]" disabled="disabled"> >- <div class="dialog message">You should enable the SMSSendDriver preference to use the SMS templates.</div> >- [% ELSE %] >- <fieldset class="rows mtt" id="[% letter.message_transport_type | html %]_[% lang | html %]"> >- [% END %] >- <ol> >- [% IF ( letter.updated_on ) %] >- <li> >- <label for="updated_on_[% letter.message_transport_type | html %]_[% lang | html %]">Last updated:</label> >- [% letter.updated_on | $KohaDates with_hours = 1 %] >- </li> >- [% END %] >- <li> >- <input type="hidden" name="message_transport_type" value="[% letter.message_transport_type | html %]" /> >- <input type="hidden" name="lang" value="[% lang | html %]" /> >- <label for="is_html_[% letter.message_transport_type | html %]_[% lang | html %]">HTML message:</label> >- [% IF letter.is_html %] >- <input type="checkbox" name="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" id="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" value="1" checked="checked" /> >- [% ELSE %] >- <input type="checkbox" name="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" id="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" value="1" /> >+ <div role="tabpanel" class="tab-pane" id="lang_[% lang | html %]"> >+ <div class="panel-group" id="group_[% lang | html %]" role="tablist" aria-multiselectable="true"> >+ [% FOR mtt IN letters.$lang.templates.keys.sort %] >+ [% SET letter = letters.$lang.templates.$mtt %] >+ [% NEXT IF letter.message_transport_type == "itiva" && !Koha.Preference('TalkingTechItivaPhoneNotification') %] >+ [% NEXT IF letter.message_transport_type == "phone" && !Koha.Preference('PhoneNotification') %] >+ <div class="panel panel-default"> >+ <div class="panel-heading" role="tab" id="[% letter.message_transport_type | html %]_[% lang | html %]Heading"> >+ <h3 class="panel-title"> >+ <a role="button" class="collapsed" data-toggle="collapse" data-parent="#group_[% lang | html %]" href="#[% letter.message_transport_type | html %]_[% lang | html %]" aria-expanded="false" aria-controls="[% letter.message_transport_type | html %]_[% lang | html %]"> >+ [% SWITCH letter.message_transport_type %] >+ [% CASE 'email' %] >+ Email >+ [% CASE 'print' %] >+ Print >+ [% CASE 'sms' %] >+ SMS >+ [% CASE 'feed' %] >+ Feed >+ [% CASE 'itiva' %] >+ Phone ( Itiva ) >+ [% CASE 'phone' %] >+ Phone >+ [% CASE %] >+ [% letter.message_transport_type | html %] > [% END %] >- </li> >- <li> >- <label for="title_[% letter.message_transport_type | html %]_[% lang | html %]">Message subject:</label><input type="text" id="title_[% letter.message_transport_type | html %]_[% lang | html %]" name="title" size="60" value="[% letter.title | html %]" /> >- </li> >- <li> >- <label for="SQLfieldname_[% letter.message_transport_type | html %]_[% lang | html %]">Message body:</label> >- [% IF letter.message_transport_type == 'sms' %] >- <span class="sms_counter" id="sms_counter_[% lang | html %]">[% IF letter.content && letter.content.length > 0 %][% letter.content.length | html %][% ELSE %]0[% END %]/160 characters</span> >- [% END %] >- <table> >- <tr> >- <td> >- <select name="SQLfieldname" id="SQLfieldname_[% letter.message_transport_type | html %]_[% lang | html %]" multiple="multiple" size="9"> >- [% FOREACH SQLfieldname IN SQLfieldnames %] >- <option value="[% SQLfieldname.value | html %]">[% SQLfieldname.text | html %]</option> >- [% END %] >- </select> >- </td> >- <td class="actions"> >- <button type="button" data-containerid="[% letter.message_transport_type | html %]_[% lang | html %]" class="btn btn-default btn-sm insert">Insert <i class="fa fa-long-arrow-right"></i></button> >- </td> >- <td> >- <textarea name="content" data-lang="[% lang | html %]" class="content_[% letter.message_transport_type | html %]" id="content_[% letter.message_transport_type | html %]_[% lang | html %]" cols="80" rows="15">[% letter.content | html %]</textarea> >- </td> >- </tr> >- </table> >- </li> >- [% IF preview_is_available %] >- <li> >- <a href="/cgi-bin/koha/svc/letters/preview" class="preview_template btn btn-default btn-xs" title="Preview this notice template" data-mtt="[% letter.message_transport_type | html %]" data-lang="[% lang | html %]"><i class="fa fa-eye"></i> Preview</a> >- </li> >+ </a> >+ </h3> >+ </div> <!-- /.panel-heading --> >+ <div id="[% letter.message_transport_type | html %]_[% lang | html %]" class="panel-collapse collapse" role="tabpanel" aria-labelledby="[% letter.message_transport_type | html %]_[% lang | html %]Heading"> >+ <div class="panel-body"> >+ [% IF letter.message_transport_type == "sms" and not Koha.Preference("SMSSendDriver") %] >+ <fieldset class="rows mtt" disabled="disabled"> >+ <div class="dialog message">You should enable the SMSSendDriver preference to use the SMS templates.</div> >+ [% ELSE %] >+ <fieldset class="rows mtt"> > [% END %] >- </ol> >- </fieldset> <!-- /.rows.mtt --> >- [% END # /FOR mtt %] >- </div> >- </div> <!-- / #transport-types --> >+ <ol> >+ [% IF ( letter.updated_on ) %] >+ <li> >+ <span class="label">Last updated:</span> >+ [% letter.updated_on | $KohaDates with_hours = 1 %] >+ </li> >+ [% END %] >+ <li> >+ <input type="hidden" name="message_transport_type" value="[% letter.message_transport_type | html %]" /> >+ <input type="hidden" name="lang" value="[% lang | html %]" /> >+ <label for="is_html_[% letter.message_transport_type | html %]_[% lang | html %]">HTML message:</label> >+ [% IF letter.is_html %] >+ <input type="checkbox" name="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" id="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" value="1" checked="checked" /> >+ [% ELSE %] >+ <input type="checkbox" name="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" id="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" value="1" /> >+ [% END %] >+ </li> >+ <li> >+ <label for="title_[% letter.message_transport_type | html %]_[% lang | html %]">Message subject:</label><input type="text" id="title_[% letter.message_transport_type | html %]_[% lang | html %]" name="title" size="60" value="[% letter.title | html %]" /> >+ </li> >+ <li> >+ <label for="SQLfieldname_[% letter.message_transport_type | html %]_[% lang | html %]">Message body:</label> >+ [% IF letter.message_transport_type == 'sms' %] >+ <span class="sms_counter" id="sms_counter_[% lang | html %]">[% IF letter.content && letter.content.length > 0 %][% letter.content.length | html %][% ELSE %]0[% END %]/160 characters</span> >+ [% END %] >+ <table> >+ <tr> >+ <td> >+ <select name="SQLfieldname" id="SQLfieldname_[% letter.message_transport_type | html %]_[% lang | html %]" multiple="multiple" size="9"> >+ [% FOREACH SQLfieldname IN SQLfieldnames %] >+ <option value="[% SQLfieldname.value | html %]">[% SQLfieldname.text | html %]</option> >+ [% END %] >+ </select> >+ </td> >+ <td class="actions"> >+ <button type="button" data-containerid="[% letter.message_transport_type | html %]_[% lang | html %]" class="btn btn-default btn-sm insert">Insert <i class="fa fa-long-arrow-right"></i></button> >+ </td> >+ <td> >+ <textarea name="content" data-lang="[% lang | html %]" class="content_[% letter.message_transport_type | html %]" id="content_[% letter.message_transport_type | html %]_[% lang | html %]" cols="80" rows="15">[% letter.content | html %]</textarea> >+ </td> >+ </tr> >+ </table> >+ </li> >+ [% IF preview_is_available %] >+ <li> >+ <a href="/cgi-bin/koha/svc/letters/preview" class="preview_template btn btn-default btn-xs" title="Preview this notice template" data-mtt="[% letter.message_transport_type | html %]" data-lang="[% lang | html %]"><i class="fa fa-eye"></i> Preview</a> >+ </li> >+ [% END %] >+ </ol> >+ </fieldset> <!-- /.rows.mtt --> >+ </div> <!-- /.panel-body --> >+ </div> <!-- /.panel-collapse --> >+ </div> <!-- /.panel.panel-default --> >+ [% END # /FOR mtt %] >+ </div> <!-- /.panel-group#lang_[% lang | html %] --> >+ </div> <!-- /.tab-panel --> > [% END # /FOREACH lang %] > > [% IF Koha.Preference('TranslateNotices') %] >- </div> >+ </div> <!-- /.tab-content --> >+ </div> <!-- /#tabs --> > [% END %] > > <input type="hidden" id="redirect" name="redirect" value="" /> > <input type="hidden" id="section" name="section" value="[% section | html %]" /> >+ <input type="hidden" id="langtab" name="langtab" value="[% langtab | html %]" /> > <input type="hidden" name="searchfield" value="[% searchfield | html %]" /> > </form> <!-- /#add_notice --> > [% END # /IF add_form %] >diff --git a/koha-tmpl/intranet-tmpl/prog/js/letter.js b/koha-tmpl/intranet-tmpl/prog/js/letter.js >index 84e63c9d96..3eeee72a57 100644 >--- a/koha-tmpl/intranet-tmpl/prog/js/letter.js >+++ b/koha-tmpl/intranet-tmpl/prog/js/letter.js >@@ -128,20 +128,31 @@ $(document).ready(function() { > } > }); > >- $( ".transport-types" ).accordion({ >- collapsible: true, >- active: parseInt( $("#section").val(), 10), >- animate: 200, >- activate: function() { >- var active = $( ".transport-types" ).accordion( "option", "active" ); >- if( active === false ){ >- $("#section").val(""); >- } else { >- $("#section").val( active ); >- } >- } >+ let section = $("#section").val(); >+ if( section != "" ){ >+ $("a[href='#" + section + "']").click(); >+ } >+ >+ $(".panel-group").on("shown.bs.collapse", function (e) { >+ $("#section").val( e.target.id ); >+ }).on("hidden.bs.collapse", function (e) { >+ $("#section").val(""); > }); > >+ if( $("#tabs").length > 0 ){ >+ let langtab = $("#langtab").val(); >+ $("#tabs a[data-toggle='tab']").on("shown.bs.tab", function (e) { >+ var link = e.target.hash.replace("#",""); >+ $("#langtab").val( link ); >+ }); >+ >+ if( langtab != "" ){ >+ $("#tabs a[href='#" + langtab + "']").tab("show"); >+ } else { >+ $("#tabs a:first").tab("show"); >+ } >+ } >+ > $(".insert").on("click",function(){ > var containerid = $(this).data("containerid"); > insertValueQuery( containerid ); >@@ -153,8 +164,6 @@ $(document).ready(function() { > $("#submit_form").click(); > }); > >- $("#tabs").tabs(); >- > $("body").on("click", ".preview_template", function(e){ > e.preventDefault(); > var mtt = $(this).data("mtt"); >diff --git a/tools/letter.pl b/tools/letter.pl >index 1b6f39ae89..4276e46280 100755 >--- a/tools/letter.pl >+++ b/tools/letter.pl >@@ -70,6 +70,7 @@ my $content = $input->param('content'); > my $op = $input->param('op') || ''; > my $redirect = $input->param('redirect'); > my $section = $input->param('section'); >+my $langtab = $input->param('langtab'); > > my $dbh = C4::Context->dbh; > >@@ -93,13 +94,14 @@ $template->param( > searchfield => $searchfield, > branchcode => $branchcode, > section => $section, >+ langtab => $langtab, > action => $script_name > ); > > if ( $op eq 'add_validate' or $op eq 'copy_validate' ) { > add_validate(); > if( $redirect eq "just_save" ){ >- print $input->redirect("/cgi-bin/koha/tools/letter.pl?op=add_form&branchcode=$branchcode&module=$module&code=$code&redirect=done§ion=$section"); >+ print $input->redirect("/cgi-bin/koha/tools/letter.pl?op=add_form&branchcode=$branchcode&module=$module&code=$code&redirect=done§ion=$section&langtab=$langtab"); > exit; > } else { > $op = q{}; # we return to the default screen for the next operation >-- >2.20.1
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 30545
:
133331
|
133408
|
133473
|
133487