Bugzilla – Attachment 75706 Details for
Bug 13680
Items list on edit items page separates add items form from header and sidebar
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 13680 - Items list on edit items page separates add items form from header and sidebar
Bug-13680---Items-list-on-edit-items-page-separate.patch (text/plain), 24.73 KB, created by
Owen Leonard
on 2018-05-31 15:11:05 UTC
(
hide
)
Description:
Bug 13680 - Items list on edit items page separates add items form from header and sidebar
Filename:
MIME Type:
Creator:
Owen Leonard
Created:
2018-05-31 15:11:05 UTC
Size:
24.73 KB
patch
obsolete
>From a885447d01127dbe40b2fdea54c6b22d026e600a Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Thu, 31 May 2018 15:07:17 +0000 >Subject: [PATCH] Bug 13680 - Items list on edit items page separates add items > form from header and sidebar > >This is a proof of concept patch showing how I would improve this >interface with a modal window for the item add form. The "views" menu is >converted to a button menu. That goes against interface guidelines, but >I don't see how else to handle it without taking up valuable screen real >estate. > >This patch isn't complete--it doesn't handle edit operations. I just >wanted to show the layout changes and how the "Add" button triggers the >modal. > >Feeback welcome. >--- > koha-tmpl/intranet-tmpl/prog/css/staff-global.css | 6 + > .../prog/en/includes/item-add-form.inc | 149 ++++++++++++++++++++ > .../prog/en/modules/cataloguing/additem.tt | 155 ++++----------------- > 3 files changed, 179 insertions(+), 131 deletions(-) > create mode 100644 koha-tmpl/intranet-tmpl/prog/en/includes/item-add-form.inc > >diff --git a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css >index c68bff6..e02b722 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css >+++ b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css >@@ -2721,6 +2721,12 @@ button.closebtn{padding:0;cursor:pointer;background:transparent;border:0;-webkit > width: 80%; > } > >+.modal fieldset.rows { >+ border: 0; >+ background-color: transparent; >+ margin: 0; >+} >+ > .btn-group label, > .btn-group select { > font-size: 13px; >diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/item-add-form.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/item-add-form.inc >new file mode 100644 >index 0000000..9b022c0 >--- /dev/null >+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/item-add-form.inc >@@ -0,0 +1,149 @@ >+<div id="cataloguing_additem_newitem"> >+ >+ <!-- Modal --> >+ <div class="modal" id="addItemModal" tabindex="-1" role="dialog" aria-labelledby="addItemModalLabel"> >+ <div class="modal-dialog modal-wide" role="document"> >+ <div class="modal-content"> >+ <div class="modal-header"> >+ <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> >+ [% IF ( opisadd ) %] >+ <h2 id="additema">Add item [% IF (circborrowernumber) %]<em>(fast cataloging)</em>[% END %]</h2> >+ [% ELSE %] >+ <h2 id="edititem">Edit Item #[% itemnumber %][% IF ( barcode ) %] / Barcode [% barcode %][% END %]</h2> >+ [% END %] >+ </div> >+ <div class="modal-body"> >+ >+ <form id="f" method="post" action="/cgi-bin/koha/cataloguing/additem.pl" name="f"> >+ <input type="hidden" name="op" value="[% op %]" /> >+ [% IF (popup) %] >+ <input type="hidden" name="popup" value="1" /> >+ [% END %] >+ <input type="hidden" name="biblionumber" value="[% biblionumber %]" /> >+ <fieldset class="rows"> >+ <ol> >+ [% FOREACH ite IN item %] >+ <li> >+ <div class="subfield_line" style="[% ite.visibility %]" id="subfield[% ite.tag %][% ite.subfield %][% ite.random %]"> >+ [% IF ( ite.mandatory ) %] >+ <label class="required">[% ite.subfield %] - [% ite.marc_lib %]</label> >+ [% ELSE %] >+ <label>[% ite.subfield %] - [% ite.marc_lib %]</label> >+ [% END %] >+ >+ [% SET mv = ite.marc_value %] >+ [% IF ( mv.type == 'hidden' ) %] >+ <input type="hidden" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]"> >+ [% ELSIF ( mv.type == 'select' ) %] >+ [% IF ( mv.readonly ) %] >+ <select name="field_value" id="[%- mv.id -%]" size="1" class="input_marceditor" readonly="readonly" disabled="disabled"> >+ [% ELSE %] >+ <select name="field_value" id="[%- mv.id -%]" size="1" class="input_marceditor"> >+ [% END %] >+ [% FOREACH aval IN mv.values %] >+ [% IF aval == mv.default %] >+ <option value="[%- aval -%]" selected="selected">[%- mv.labels.$aval -%]</option> >+ [% ELSE %] >+ <option value="[%- aval -%]">[%- mv.labels.$aval -%]</option> >+ [% END %] >+ [% END %] >+ </select> >+ [% ELSIF ( mv.type == 'text_auth' ) %] >+ [% IF mv.readonly %] >+ <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" readonly="readonly" /> >+ [% ELSE %] >+ <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" /> >+ [% SET dopop = "Dopop('/cgi-bin/koha/authorities/auth_finder.pl?authtypecode=\"${mv.authtypecode}\"&index=${mv.id}','${mv.id}')" %] >+ <a href="#" class="buttonDot" onclick="[%- dopop -%]; return false;" title="Tag editor">...</a> >+ [% END %] >+ [% ELSIF ( mv.type == 'text_plugin' ) %] >+ [% IF mv.readonly %] >+ <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" readonly="readonly" /> >+ [% ELSE %] >+ <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" /> >+ [% IF ( mv.nopopup ) %] >+ <a href="#" id="buttonDot_[%- mv.id -%]" class="[%- mv.class -%]" title="No popup">...</a> >+ [% ELSE %] >+ <a href="#" id="buttonDot_[%- mv.id -%]" class="[%- mv.class -%]" title="Tag editor">...</a> >+ [% END %] >+ [%- mv.javascript -%] >+ [% END %] >+ [% ELSIF ( mv.type == 'text' ) %] >+ [% IF mv.readonly %] >+ <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" readonly="readonly" /> >+ [% ELSE %] >+ <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" /> >+ [% END %] >+ [% ELSIF ( mv.type == 'textarea' ) %] >+ [% IF mv.readonly %] >+ <textarea id="[%- mv.id -%]" name="field_value" class="input_marceditor" rows="5" cols="64" readonly="readonly" >[% mv.value %]</textarea> >+ [% ELSE %] >+ <textarea id="[%- mv.id -%]" name="field_value" class="input_marceditor" rows="5" cols="64" >[% mv.value %]</textarea> >+ [% END %] >+ [% END # /IF mv.type %] >+ >+ <input type="hidden" name="tag" value="[% ite.tag %]" /> >+ <input type="hidden" name="subfield" value="[% ite.subfield %]" /> >+ <input type="hidden" name="mandatory" value="[% ite.mandatory %]" /> >+ [% IF ( ite.repeatable ) %] >+ <a href="#" class="buttonPlus" onclick="CloneItemSubfield(this.parentNode); return false;"> >+ <img src="[% interface %]/[% theme %]/img/clone-subfield.png" alt="Clone" title="Clone this subfield" /> >+ </a> >+ [% END %] >+ [% IF ( ite.mandatory ) %] <span class="required">Required</span>[% END %] >+ </div> [%# /.subfield_line %] >+ </li> >+ [% END # /foreach ite %] >+ </ol> >+ </fieldset> >+ <input type="hidden" name="indicator" value=" " /> >+ <input type="hidden" name="indicator" value=" " /> >+ <input type="hidden" name="itemnumber" value="[% itemnumber %]" /> >+ >+ [%# Fields for fast cataloging %] >+ <input type="hidden" name="circborrowernumber" value="[% circborrowernumber %]" /> >+ <input type="hidden" name="stickyduedate" value="[% stickyduedate %]" /> >+ <input type="hidden" name="barcode" value="[% barcode %]" /> >+ <input type="hidden" name="duedatespec" value="[% duedatespec %]" /> >+ [%# End fields for fast cataloging %] >+ >+ </form> >+ >+ </div> [%# /.modal-body %] >+ <div class="modal-footer"> >+ [% IF ( opisadd ) %] >+ <input type="submit" name="phony_submit" value="phony_submit" id="phony_submit" style="display:none;" onclick="return false;" /> >+ [%# Note : We use here a false submit button because we have several submit buttons and we don't want the user to believe they validated the adding of multiple items when pressing the enter key, while in fact it is the first submit button that is validated, in our case the "add (single) item" button. It is a bit tricky, but necessary in the sake of UI correctness. %] >+ <span id="addsingle"> >+ <button type="submit" class="btn btn-default btn-sm" name="add_submit" onclick="return Check(this.form)"> >+ Add item >+ </button> >+ <button type="submit" class="btn btn-default btn-sm" name="add_duplicate_submit" onclick="return Check(this.form)"> >+ Add & duplicate >+ </button> >+ </span> >+ <span id="addmultiple"> >+ <button type="button" class="btn btn-default btn-sm" name="add_multiple_copies" id="add_multiple_copies"> >+ Add multiple copies of this item >+ </button> >+ </span> >+ <fieldset id="add_multiple_copies_span"> >+ <label for="number_of_copies">Number of copies of this item to add: </label> >+ <input type="text" id="number_of_copies" name="number_of_copies" value="" size="2" /> >+ <input type="submit" id="add_multiple_copies_submit" name="add_multiple_copies_submit" value="Add" onclick="javascript:return Check(this.form) && CheckMultipleAdd(this.form.number_of_copies.value);" /> >+ <a href="#" id="cancel_add_multiple" class="cancel">Cancel</a> >+ <div class="hint"><p>The barcode you enter will be incremented for each additional item.</p></div> >+ </fieldset> >+ [% ELSE %] >+ <input type="hidden" name="tag" value="[% itemtagfield %]" /> >+ <input type="hidden" name="subfield" value="[% itemtagsubfield %]" /> >+ <input type="hidden" name="field_value" value="[% itemnumber %]" /> >+ <input type="submit" value="Save changes" onclick="return Check(this.form)"> >+ <input type="button" id="addnewitem" value="Add a new item"> >+ <a href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% biblionumber %]">Cancel</a> >+ [% END %] >+ </div> >+ </div> >+ </div> >+ </div> >+</div> [%# /#cataloguing_additem_newitem %] >\ No newline at end of file >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/additem.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/additem.tt >index 6b86b21..a741ff5 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/additem.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/additem.tt >@@ -17,6 +17,10 @@ > browser.show(); > > $(document).ready(function(){ >+ var view_menu = $("#menu"); >+ view_menu.hide(); >+ var menu_html = view_menu.find("ul").html(); >+ $("#item_edit_view_menu").append( menu_html ); > > // Remove the onclick event defined in browser.js, > // otherwise the deletion confirmation will not work correctly >@@ -133,10 +137,12 @@ function confirm_deletion() { > [% Asset.css("css/addbiblio.css") %] > > [% INCLUDE 'select2.inc' %] >-<script type="text/javascript"> >- $(document).ready(function() { >- $('.subfield_line select').select2(); >- }); >+<script> >+ $(document).ready(function() { >+ $("#addItemModal").on("shown.bs.modal", function(e){ >+ $('.subfield_line select').select2(); >+ }); >+ }); > </script> > > [% IF ( bidi ) %] >@@ -159,6 +165,19 @@ function confirm_deletion() { > <div id="bd"> > <div id="yui-main"> > >+ <div id="toolbar"> >+ <div class="btn-group"> >+ <button type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#addItemModal"><i class="fa fa-plus"></i> Add items</button> >+ </div> >+ <div class="btn-group"> >+ <button class="btn btn-default btn-sm dropdown-toggle" id="item_edit_view" data-toggle="dropdown"> >+ <i class="fa fa-eye"></i> View <span class="caret"></span> >+ </button> >+ <ul class="dropdown-menu" id="item_edit_view_menu"> >+ </ul> >+ </div> >+ </div> >+ > <h1>Items for [% title |html %] [% IF ( author ) %] by [% author | html %][% END %] (Record #[% biblionumber %])</h1> > > [% IF ( barcode_not_unique ) %]<div class="dialog alert"><strong>Error saving item</strong>: Barcode must be unique.</div>[% END %] >@@ -245,135 +264,9 @@ function confirm_deletion() { > [% INCLUDE 'biblio-view-menu.inc' %] > </div> > <div class="yui-u"> >-<div id="cataloguing_additem_newitem"> >- <form id="f" method="post" action="/cgi-bin/koha/cataloguing/additem.pl" name="f"> >- <input type="hidden" name="op" value="[% op %]" /> >- [% IF (popup) %] >- <input type="hidden" name="popup" value="1" /> >- [% END %] >- <input type="hidden" name="biblionumber" value="[% biblionumber %]" /> >- [% IF ( opisadd ) %] >- <h2 id="additema">Add item [% IF (circborrowernumber) %]<em>(fast cataloging)</em>[% END %]</h2> >- [% ELSE %] >- <h2 id="edititem">Edit Item #[% itemnumber %][% IF ( barcode ) %] / Barcode [% barcode %][% END %]</h2> >- [% END %] >- <fieldset class="rows"> >- <ol> >- [% FOREACH ite IN item %] >- <li><div class="subfield_line" style="[% ite.visibility %]" id="subfield[% ite.tag %][% ite.subfield %][% ite.random %]"> >- [% IF ( ite.mandatory ) %] >- <label class="required">[% ite.subfield %] - [% ite.marc_lib %]</label> >- [% ELSE %] >- <label>[% ite.subfield %] - [% ite.marc_lib %]</label> >- [% END %] > >- [% SET mv = ite.marc_value %] >- [% IF ( mv.type == 'hidden' ) %] >- <input type="hidden" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]"> >- [% ELSIF ( mv.type == 'select' ) %] >- [% IF ( mv.readonly ) %] >- <select name="field_value" id="[%- mv.id -%]" size="1" class="input_marceditor" readonly="readonly" disabled="disabled"> >- [% ELSE %] >- <select name="field_value" id="[%- mv.id -%]" size="1" class="input_marceditor"> >- [% END %] >- [% FOREACH aval IN mv.values %] >- [% IF aval == mv.default %] >- <option value="[%- aval -%]" selected="selected">[%- mv.labels.$aval -%]</option> >- [% ELSE %] >- <option value="[%- aval -%]">[%- mv.labels.$aval -%]</option> >- [% END %] >- [% END %] >- </select> >- [% ELSIF ( mv.type == 'text_auth' ) %] >- [% IF mv.readonly %] >- <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" readonly="readonly" /> >- [% ELSE %] >- <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" /> >- [% SET dopop = "Dopop('/cgi-bin/koha/authorities/auth_finder.pl?authtypecode=\"${mv.authtypecode}\"&index=${mv.id}','${mv.id}')" %] >- <a href="#" class="buttonDot" onclick="[%- dopop -%]; return false;" title="Tag editor">...</a> >- [% END %] >- [% ELSIF ( mv.type == 'text_plugin' ) %] >- [% IF mv.readonly %] >- <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" readonly="readonly" /> >- [% ELSE %] >- <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" /> >- [% IF ( mv.nopopup ) %] >- <a href="#" id="buttonDot_[%- mv.id -%]" class="[%- mv.class -%]" title="No popup">...</a> >- [% ELSE %] >- <a href="#" id="buttonDot_[%- mv.id -%]" class="[%- mv.class -%]" title="Tag editor">...</a> >- [% END %] >- [%- mv.javascript -%] >- [% END %] >- [% ELSIF ( mv.type == 'text' ) %] >- [% IF mv.readonly %] >- <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" readonly="readonly" /> >- [% ELSE %] >- <input type="text" id="[%- mv.id -%]" name="field_value" class="input_marceditor" size="50" maxlength="[%- mv.maxlength -%]" value="[%- mv.value -%]" /> >- [% END %] >- [% ELSIF ( mv.type == 'textarea' ) %] >- [% IF mv.readonly %] >- <textarea id="[%- mv.id -%]" name="field_value" class="input_marceditor" rows="5" cols="64" readonly="readonly" >[% mv.value %]</textarea> >- [% ELSE %] >- <textarea id="[%- mv.id -%]" name="field_value" class="input_marceditor" rows="5" cols="64" >[% mv.value %]</textarea> >- [% END %] >- [% END %] >+ [% INCLUDE 'item-add-form.inc' %] > >- <input type="hidden" name="tag" value="[% ite.tag %]" /> >- <input type="hidden" name="subfield" value="[% ite.subfield %]" /> >- <input type="hidden" name="mandatory" value="[% ite.mandatory %]" /> >- [% IF ( ite.repeatable ) %] >- <a href="#" class="buttonPlus" onclick="CloneItemSubfield(this.parentNode); return false;"> >- <img src="[% interface %]/[% theme %]/img/clone-subfield.png" alt="Clone" title="Clone this subfield" /> >- </a> >- [% END %] >- [% IF ( ite.mandatory ) %] <span class="required">Required</span>[% END %] >- </div></li> >- [% END %] >- </ol> >- </fieldset> >- <input type="hidden" name="indicator" value=" " /> >- <input type="hidden" name="indicator" value=" " /> >- <input type="hidden" name="itemnumber" value="[% itemnumber %]" /> >- >-<fieldset class="action"> [% IF ( opisadd ) %] >- <input type="submit" name="phony_submit" value="phony_submit" id="phony_submit" style="display:none;" onclick="return false;" /> >- <!-- Note : We use here a false submit button because we have several submit buttons and we don't want the user to believe they validated the adding of multiple items >- when pressing the enter key, while in fact it is the first submit button that is validated, in our case the "add (single) item" button. >- It is a bit tricky, but necessary in the sake of UI correctness. >- --> >- <span id="addsingle"> >- <input type="submit" name="add_submit" value="Add item" onclick="return Check(this.form)" /> >- <input type="submit" name="add_duplicate_submit" value="Add & duplicate" onclick="return Check(this.form)" /> >- </span> >- <span id="addmultiple"> >- <input type="button" name="add_multiple_copies" id="add_multiple_copies" value="Add multiple copies of this item" /> >- </span> >- <fieldset id="add_multiple_copies_span"> >- <label for="number_of_copies">Number of copies of this item to add: </label> >- <input type="text" id="number_of_copies" name="number_of_copies" value="" size="2" /> >- <input type="submit" id="add_multiple_copies_submit" name="add_multiple_copies_submit" value="Add" onclick="javascript:return Check(this.form) && CheckMultipleAdd(this.form.number_of_copies.value);" /> <a href="#" id="cancel_add_multiple" class="cancel">Cancel</a> >- <div class="hint"><p>The barcode you enter will be incremented for each additional item.</p></div> >- </fieldset> >- >- [% ELSE %] >- <input type="hidden" name="tag" value="[% itemtagfield %]" /> >- <input type="hidden" name="subfield" value="[% itemtagsubfield %]" /> >- <input type="hidden" name="field_value" value="[% itemnumber %]" /> >- <input type="submit" value="Save changes" onclick="return Check(this.form)"> >- <input type="button" id="addnewitem" value="Add a new item"> >- <a href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% biblionumber %]">Cancel</a> >- [% END %]</fieldset> >- >- [%# Fields for fast cataloging %] >- <input type="hidden" name="circborrowernumber" value="[% circborrowernumber %]" /> >- <input type="hidden" name="stickyduedate" value="[% stickyduedate %]" /> >- <input type="hidden" name="barcode" value="[% barcode %]" /> >- <input type="hidden" name="duedatespec" value="[% duedatespec %]" /> >- [%# End fields for fast cataloging %] >- >- >- </form> >-</div> > </div><!-- /yui-u --> > </div><!-- /yui-gf --> > >-- >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 13680
:
35720
|
35721
|
36128
|
36425
| 75706 |
75964
|
75965
|
82942