Bugzilla – Attachment 85630 Details for
Bug 22408
Subscription entry form cleanup
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 22408: Subscription entry form cleanup
Bug-22408-Subscription-entry-form-cleanup.patch (text/plain), 31.19 KB, created by
Owen Leonard
on 2019-02-25 17:45:00 UTC
(
hide
)
Description:
Bug 22408: Subscription entry form cleanup
Filename:
MIME Type:
Creator:
Owen Leonard
Created:
2019-02-25 17:45:00 UTC
Size:
31.19 KB
patch
obsolete
>From 6b87730c3e08bc81ff35cf4a3ff011741cc169f0 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Mon, 25 Feb 2019 16:28:10 +0000 >Subject: [PATCH] Bug 22408: Subscription entry form cleanup > >This patch makes a number of changes to the subscription entry form: > > - Make the default layout single-column. > - Switch the layout to two-column only when testing prediction > pattern. > - Add a button to hide the prediction pattern test pane. > - Change the style of some buttons and links. Add Font Awesome icons > to some. > - Clean up some issues with capitalization and spacing. > - Make it clearer when form fields are read-only: Move "locked" form > field style from addbiblio.css to staff-global.css and improve it > with regard to mouse interactions > >To test, apply the patch and regenerate the staff client CSS. Clear your >browser cache if necessary. > > - Go to Serials -> New subscription. > - Readonly fields under "Vendor" and "Record" should show a small > padlock icon. > - Test the process of adding a subscription, paying special attention > to the advanced pattern controls: Showing, hiding, modifying, > canceling. > - Test the process of editing a subscription in the same way. >--- > koha-tmpl/intranet-tmpl/prog/css/addbiblio.css | 1 - > .../intranet-tmpl/prog/css/src/staff-global.scss | 28 +++-- > .../en/modules/serials/showpredictionpattern.tt | 4 + > .../prog/en/modules/serials/subscription-add.tt | 126 ++++++++++++--------- > .../intranet-tmpl/prog/js/subscription-add.js | 19 +++- > 5 files changed, 112 insertions(+), 66 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css >index 5670a23..825ec0d 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css >+++ b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css >@@ -125,7 +125,6 @@ a.tagnum { > .linktools a:first-child { border-bottom: 1px solid #DDD; } > .linktools a:hover { background-color: #FFC; } > .subfield_controls { margin : 0 .5em; } >-.readonly { border-width : 1px; border-style: inset; padding-left : 15px; background: #EEE url(../img/locked.png) center left no-repeat; width:29em; } > > #cataloguing_additem_itemlist { > margin-bottom : 1em; >diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >index d4acb08..6a4201b 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >@@ -337,6 +337,10 @@ th { > font-weight: bold; > text-align: center; > >+ &[scope="row"] { >+ text-align: right; >+ } >+ > &.data { > font-family: $font-monospace; > text-align: right; >@@ -1042,7 +1046,7 @@ fieldset { > > div { > &.hint { >- margin-bottom: .4em; >+ margin: .5em 0; > margin-left: 10.5em; > } > } >@@ -1097,6 +1101,7 @@ fieldset { > } > > &.radio { >+ margin: 0; > padding-left: 9em; > width: auto; > >@@ -1919,6 +1924,21 @@ dd { > } > } > >+.readonly, >+input[type='text']:read-only { >+ background: #EEE url("../img/locked.png") center left no-repeat; >+ border-style: inset; >+ border-width: 1px; >+ cursor: default; >+ padding-left: 15px; >+} >+ >+.readonly:focus, >+input[type='text']:read-only:focus { >+ border-color: unset; >+ border-radius: unset; >+} >+ > .checkedout { > color: #999999; > font-style: italic; >@@ -2439,12 +2459,6 @@ li { > font-style: italic; > } > >-#displayexample { >- background-color: #CCCCCC; >- margin-bottom: 10px; >- padding: 5px; >-} >- > #irregularity_summary { > vertical-align: top; > } >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/serials/showpredictionpattern.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/serials/showpredictionpattern.tt >index d99b946..c684348 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/serials/showpredictionpattern.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/serials/showpredictionpattern.tt >@@ -84,4 +84,8 @@ > </tbody> > </table> > >+<fieldset class="action"> >+ <button class="btn btn-default btn-sm" id="hidepredictionpattern">Done</button> >+</fieldset> >+ > [% END %] >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/serials/subscription-add.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/serials/subscription-add.tt >index b40a444..b9ed6b0 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/serials/subscription-add.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/serials/subscription-add.tt >@@ -14,6 +14,7 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > /* Prevents Bootstrap menus from being hidden inside modal */ > #mana_search_result .modal { overflow: visible; } > #mana_search_result .modal-body { overflow-y: visible; } >+fieldset.rows table { clear: none; margin: 0; } > </style> > </head> > >@@ -32,35 +33,36 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > > <div class="main container-fluid"> > <div class="row"> >- <div class="col-sm-12"> >- <h1>[% IF ( modify ) %] Modify subscription for <i>[% bibliotitle | html %]</i>[% ELSE %]Add a new subscription[% END %] (<span id="page_number">1/2</span>)</h1> >- </div> >- <form method="post" id="subscription_add_form" name="f" action="/cgi-bin/koha/serials/subscription-add.pl" class="validated"> >- [% IF ( modify ) %] >- <input type="hidden" name="op" value="modsubscription" /> >- <input type="hidden" name="subscriptionid" value="[% subscriptionid | html %]" /> >- [% ELSE %] >- <input type="hidden" name="op" value="addsubscription" /> >- [% END %] >- <input type="hidden" name="user" value="[% logged_in_user.userid | html %]" /> >- <input type="hidden" name="irreg_check" value="0" /> >- >- <div id="page_1"> >- <div class="col-md-6"> >+ <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2"> >+ <h1>[% IF ( modify ) %] Modify subscription for <i>[% bibliotitle | html %]</i>[% ELSE %]Add a new subscription[% END %] (<span id="page_number">1/2</span>)</h1> >+ </div> >+ </div> >+ <form method="post" id="subscription_add_form" name="f" action="/cgi-bin/koha/serials/subscription-add.pl" class="validated"> >+ <div class="row" id="page_1"> >+ <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2"> >+ [% IF ( modify ) %] >+ <input type="hidden" name="op" value="modsubscription" /> >+ <input type="hidden" name="subscriptionid" value="[% subscriptionid | html %]" /> >+ [% ELSE %] >+ <input type="hidden" name="op" value="addsubscription" /> >+ [% END %] >+ <input type="hidden" name="user" value="[% logged_in_user.userid | html %]" /> >+ <input type="hidden" name="irreg_check" value="0" /> > <fieldset id="subscription_add_information" class="rows"> > <legend>Subscription details</legend> > <ol> > [% IF ( subscriptionid ) %] >- <li><span class="label">Subscription #</span> [% subscriptionid | html %]</li> >+ <li><span class="label">Subscription number: </span> [% subscriptionid | html %]</li> > [% END %] > <li> > <label for="aqbooksellerid">Vendor: </label> > <input type="text" name="aqbooksellerid" id="aqbooksellerid" value="[% aqbooksellerid | html %]" size="8" /> (<input type="text" name="aqbooksellername" id="aqbooksellername" value="[% aqbooksellername | html %]" disabled="disabled" readonly="readonly" />) <a href="#" id="vendor_search"><i class="fa fa-search"></i> Search for a vendor</a> > </li> > <li> >- <label for="biblionumber" class="required" title="Subscriptions must be associated with a bibliographic record">Record:</label> >+ <label for="biblionumber" class="required">Record:</label> > <input type="text" name="biblionumber" id="biblionumber" value="[% bibnum | html %]" size="8" /> > (<input type="text" name="title" value="[% bibliotitle | html %]" disabled="disabled" readonly="readonly" />) <span class="required" title="Subscriptions must be associated with a bibliographic record">Required</span> >+ <div class="hint">Subscriptions must be associated with a bibliographic record</div> > <div class="inputnote"> <a href="#" id="record_search"><i class="fa fa-search"></i> Search for record</a> > [% IF ( CAN_user_editcatalogue ) %] > [% IF ( modify ) %] >@@ -73,11 +75,11 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </li> > <li class="radio"> > [% IF ( serialsadditems ) %] >- <p><input type="radio" id="serialsadditems-yes" name="serialsadditems" value="1" checked="checked" /><label class="widelabel" for="serialsadditems-yes">create an item record when receiving this serial</label></p> >- <p><input type="radio" id="serialsadditems-no" name="serialsadditems" value="0" /><label class="widelabel" for="serialsadditems-no">do not create an item record when receiving this serial </label></p> >+ <p><input type="radio" id="serialsadditems-yes" name="serialsadditems" value="1" checked="checked" /><label class="widelabel" for="serialsadditems-yes"> Create an item record when receiving this serial</label></p> >+ <p><input type="radio" id="serialsadditems-no" name="serialsadditems" value="0" /><label class="widelabel" for="serialsadditems-no"> Do not create an item record when receiving this serial </label></p> > [% ELSE %] >- <p><input type="radio" id="serialsadditems-yes" name="serialsadditems" value="1"/><label class="widelabel" for="serialsadditems-yes">create an item record when receiving this serial</label></p> >- <p><input type="radio" id="serialsadditems-no" name="serialsadditems" value="0" checked="checked" /><label class="widelabel" for="serialsadditems-no">do not create an item record when receiving this serial</label></p> >+ <p><input type="radio" id="serialsadditems-yes" name="serialsadditems" value="1"/><label class="widelabel" for="serialsadditems-yes"> Create an item record when receiving this serial</label></p> >+ <p><input type="radio" id="serialsadditems-no" name="serialsadditems" value="0" checked="checked" /><label class="widelabel" for="serialsadditems-no"> Do not create an item record when receiving this serial</label></p> > [% END %] > </li> > <li class="radio"> >@@ -116,7 +118,7 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </li> > <li> > <label for="branchcode">Library:</label> >- <select name="branchcode" id="branchcode" style="width: 20em;"> >+ <select name="branchcode" id="branchcode"> > [% UNLESS ( Independentbranches ) %] > <option value="">None</option> > [% END %] >@@ -125,7 +127,7 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > [% ELSE %] > [% PROCESS options_for_libraries libraries => Branches.all( selected => branchcode ) %] > [% END %] >- </select> (select a library) >+ </select> > </li> > <li> > <label for="notes">Public note:</label> >@@ -210,13 +212,12 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </ol> > </fieldset> > <fieldset class="action"> >- <input type="button" value="Next >>" id="subscription_add_next" style="float:right;" /> >+ <button type="button" id="subscription_add_next" style="float:right;">Next <i class="fa fa-long-arrow-right"></i></button> > </fieldset> >- </div> >- </div> >- >- <div id="page_2"> >- <div class="col-md-6"> >+ </div> <!-- /.col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2 --> >+ </div> <!-- /.row#page_1 --> >+ <div class="row" id="page_2"> >+ <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2"> > [% IF ( Koha.Preference('Mana') == 1) && !mana_url %] > <fieldset> > <p><center>The Mana Knowledge Base can be used to import subscription patterns submitted by other libraries and save you extra work. Ask your system administrator to configure this service and complete the configuration, or remove this message by disabling the system preference >@@ -235,8 +236,9 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > <input type="text" size="10" id="acqui_date" name="firstacquidate" value="[% firstacquidate | $KohaDates %]" class="datepicker required" required="required" /> > [% ELSE %] > [% firstacquidate | $KohaDates %] >- <input type="hidden" size="10" id="acqui_date" name="firstacquidate" value="[% firstacquidate | $KohaDates %]"/> >+ <input type="hidden" id="acqui_date" name="firstacquidate" value="[% firstacquidate | $KohaDates %]"/> > [% END %] >+ <span class="required">Required</span> > </li> > [% IF (more_than_one_serial) %] > <li> >@@ -315,6 +317,7 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </option> > [% END %] > </select> >+ <span class="required">Required</span> > </li> > <li> > <label for="locale">Locale:</label> >@@ -328,9 +331,10 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > [% END %] > [% END %] > </select> >- <span class="hint">If empty, English is used</span> >+ <div class="hint">If empty, English is used</div> > </li> > <li id="more_options"> >+ <span class="label"> </span> > <table id="moreoptionst"> > <thead> > <tr> >@@ -342,19 +346,19 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </thead> > <tbody> > <tr> >- <td> >+ <th scope="row"> > [% IF (more_than_one_serial) %] >- Last value >+ Last value: > [% ELSE %] >- Begins with >+ Begins with: > [% END %] >- </td> >+ </th> > <td id="beginsX"><input type="text" id="lastvaluetemp1" name="lastvaluetemp1" value="[% lastvalue1 | html %]" /></td> > <td id="beginsY"><input type="text" id="lastvaluetemp2" name="lastvaluetemp2" value="[% lastvalue2 | html %]" /></td> > <td id="beginsZ"><input type="text" id="lastvaluetemp3" name="lastvaluetemp3" value="[% lastvalue3 | html %]" /></td> > </tr> > <tr> >- <td>Inner counter</td> >+ <th scope="row">Inner counter:</th> > <td id="innerX"><input type="text" id="innerlooptemp1" name="innerlooptemp1" value="[% innerloop1 | html %]" /></td> > <td id="innerY"><input type="text" id="innerlooptemp2" name="innerlooptemp2" value="[% innerloop2 | html %]" /></td> > <td id="innerZ"><input type="text" id="innerlooptemp3" name="innerlooptemp3" value="[% innerloop3 | html %]" /></td> >@@ -363,24 +367,28 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </table> > </li> > <li> >+ <span class="label"> </span> > <a href="#" class="toggle_advanced_pattern show_advanced_pattern"><i class="fa fa-plus-square"></i> Show advanced pattern</a> > <a href="#" style="display:none;" class="toggle_advanced_pattern hide_advanced_pattern"><i class="fa fa-minus-square"></i> Hide advanced pattern</a> > </li> >+ </ol> >+ > <div id="advancedpredictionpattern" style="display:none"> >+ <ol> > <li> > <label for="patternname" class="required">Pattern name:</label> > <input id="patternname" name="patternname" type="text" readonly="readonly" class="required" required="required" /> >+ <span class="required">Required</span> > </li> > <li> > <label for="numberingmethod">Numbering formula:</label> > <input readonly="readonly" type="text" name="numberingmethod" id="numberingmethod" size="50" value="[% numberingmethod | html %]" /> > </li> >+ <li> >+ <span class="label">Advanced prediction pattern: </span> > <table id="advancedpredictionpatternt"> > <thead> > <tr> >- <th colspan="4">Advanced prediction pattern</th> >- </tr> >- <tr> > <th> </th> > <th>X</th> > <th>Y</th> >@@ -389,43 +397,43 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > </thead> > <tbody> > <tr> >- <td>Label</td> >+ <th scope="row">Label: </th> > <td><input type="text" readonly="readonly" id="label1" name="label1" /></td> > <td><input type="text" readonly="readonly" id="label2" name="label2" /></td> > <td><input type="text" readonly="readonly" id="label3" name="label3" /></td> > </tr> > <tr> >- <td>Begins with</td> >+ <th scope="row">Begins with: </th> > <td><input type="text" readonly="readonly" id="lastvalue1" name="lastvalue1" /></td> > <td><input type="text" readonly="readonly" id="lastvalue2" name="lastvalue2" /></td> > <td><input type="text" readonly="readonly" id="lastvalue3" name="lastvalue3" /></td> > </tr> > <tr> >- <td>Add</td> >+ <th scope="row">Add: </th> > <td><input type="text" readonly="readonly" id="add1" name="add1" /></td> > <td><input type="text" readonly="readonly" id="add2" name="add2" /></td> > <td><input type="text" readonly="readonly" id="add3" name="add3" /></td> > </tr> > <tr> >- <td>Every</td> >+ <th scope="row">Every: </th> > <td><input type="text" readonly="readonly" id="every1" name="every1" /></td> > <td><input type="text" readonly="readonly" id="every2" name="every2" /></td> > <td><input type="text" readonly="readonly" id="every3" name="every3" /></td> > </tr> > <tr> >- <td>Set back to</td> >+ <th scope="row">Set back to: </th> > <td><input type="text" readonly="readonly" id="setto1" name="setto1" /></td> > <td><input type="text" readonly="readonly" id="setto2" name="setto2" /></td> > <td><input type="text" readonly="readonly" id="setto3" name="setto3" /></td> > </tr> > <tr> >- <td>When more than</td> >+ <th scope="row">When more than: </th> > <td><input type="text" readonly="readonly" id="whenmorethan1" name="whenmorethan1" /></td> > <td><input type="text" readonly="readonly" id="whenmorethan2" name="whenmorethan2" /></td> > <td><input type="text" readonly="readonly" id="whenmorethan3" name="whenmorethan3" /></td> > </tr> > <tr> >- <td>Inner counter</td> >+ <th scope="row">Inner counter: </th> > <td><input type="text" readonly="readonly" id="innerloop1" name="innerloop1" /></td> > <td><input type="text" readonly="readonly" id="innerloop2" name="innerloop2" /></td> > <td><input type="text" readonly="readonly" id="innerloop3" name="innerloop3" /></td> >@@ -442,18 +450,25 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > <option value="seasonabrv">Name of season (abbreviated)</option> > </select> > [% END %] >- <td>Formatting</td> >+ <th scope="row">Formatting:</th> > <td>[% PROCESS numbering_select name="numbering1" %]</td> > <td>[% PROCESS numbering_select name="numbering2" %]</td> > <td>[% PROCESS numbering_select name="numbering3" %]</td> > </tr> > </tbody> > </table> >- <input id="modifyadvancedpatternbutton" type="button" value="Modify pattern" /> >- <input id="restoreadvancedpatternbutton" type="button" value="Cancel modifications" style="display:none" /> >- <input id="saveadvancedpatternbutton" type="button" value="Save as new pattern" style="display:none" /> >- </div> >- </ol> >+ </li> >+ <li> >+ <span class="label"> </span> >+ <a href="#" id="modifyadvancedpatternbutton"><i class="fa fa-pencil"></i> Modify pattern</a> >+ <button type="button" class="btn btn-default btn-xs" id="saveadvancedpatternbutton" style="display:none"><i class="fa fa-save"></i> Save as new pattern</button> >+ <a class="cancel" href="#" id="restoreadvancedpatternbutton" style="display:none">Cancel modifications</a> >+ </li> >+ </ol> >+ </div> <!-- /#advancedpredictionpattern --> >+ <fieldset class="action"> >+ <button type="button" id="testpatternbutton" class="btn btn-default btn-sm"><i class="fa fa-play"></i> Test prediction pattern</a> >+ </fieldset> > </fieldset> > > [% IF additional_fields_for_subscription %] >@@ -496,16 +511,15 @@ fieldset.rows li.radio { width: 100%; } /* override staff-global.css */ > <input type="hidden" id="unitsperissue" name="unitsperissue" value=""/> > <input type="hidden" id="issuesperunit" name="issuesperunit" value=""/> > <fieldset class="action"> >- <input type="button" id="subscription_add_previous" value="<< Previous" style="float:left;"/> >- <input id="testpatternbutton" type="button" value="Test prediction pattern" /> >+ <button type="button" id="subscription_add_previous" style="float:left"><i class="fa fa-long-arrow-left"></i> Previous</button> > <input id="save-subscription" type="submit" value="Save subscription" style="float:right;" accesskey="w"/> > </fieldset> > </div> > </div> > <div class="col-md-6"> >- <li id="displayexample"></li> >+ <fieldset id="displayexample"></fieldset> > </div> >- </div> >+ </div> <!-- /.row#page_2 --> > </form> > </div> > >diff --git a/koha-tmpl/intranet-tmpl/prog/js/subscription-add.js b/koha-tmpl/intranet-tmpl/prog/js/subscription-add.js >index d82b875..4c6bf22 100644 >--- a/koha-tmpl/intranet-tmpl/prog/js/subscription-add.js >+++ b/koha-tmpl/intranet-tmpl/prog/js/subscription-add.js >@@ -210,7 +210,7 @@ function displaymoreoptions() { > } > > function modifyAdvancedPattern() { >- $("#patternname").prop('readOnly', false).val(''); >+ $("#patternname").prop('readOnly', false).val('').focus(); > $("#numberingmethod").prop('readOnly', false); > > $("#advancedpredictionpatternt input").each(function() { >@@ -318,7 +318,7 @@ function testPredictionPattern() { > url:"/cgi-bin/koha/serials/showpredictionpattern.pl", > data: ajaxData, > success: function(data) { >- $("#displayexample").html(data).show(); >+ showPredictionPatternTest( data ); > patternneedtobetested = 0; > } > }); >@@ -519,6 +519,16 @@ function mana_comment_close(){ > $("#new_mana_comment").hide(); > } > >+function showPredictionPatternTest( data ){ >+ $("#displayexample").html(data).show(); >+ $("#page_2 > div").attr("class","col-xs-6"); >+} >+ >+function hidePredcitionPatternTest(){ >+ $("#displayexample").hide(); >+ $("#page_2 > div").attr("class","col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2"); >+} >+ > $(document).ready(function() { > if ( mana_enabled == 1 ) { > mana_search(); >@@ -679,4 +689,9 @@ $(document).ready(function() { > var subscription_id = $(this).data("subscription_id"); > mana_use( subscription_id ); > }); >+ >+ $("#displayexample").on("click", "#hidepredictionpattern", function(e){ >+ e.preventDefault(); >+ hidePredcitionPatternTest(); >+ }); > }); >-- >2.1.4
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 22408
:
85629
|
85630
|
88189
|
88953
|
88984