From 1f348a34d67358848dd24ff26e0cb72706b76cf3 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Wed, 31 May 2017 13:58:27 +0000
Subject: [PATCH] Bug 18708 [Revised] Show itemBarcodeFallbackSearch results in
 a modal window

This patch modifies the circulation template so that
itemBarcodeFallbackSearch results show in a modal window.

To test, enable the itemBarcodeFallbackSearch system preference and open
a patron's account in circulation.

- Submit a string which will return search results. When the page
  reloads a modal should display showing a table of title search
  results.
  - Test the "Check out" button and confirm that the correct item is
    submitted.
  - Test closing the modal and re-displaying it using the new "Show
    matching titles" button.
  - Confirm that the "Add record using fast cataloging" button still
    works correctly.
- Submit a string which will return no results. No modal window should
  display, and only the "Add record" button should appear.
- Confirm that normal checkout works correctly.
- Test with itemBarcodeFallbackSearch disabled, and with a user who
  lacks Fast Cataloging permission.

Revision removes a heading which was made redundant by the modal markup.
---
 koha-tmpl/intranet-tmpl/prog/css/staff-global.css  | 18 ++++-
 .../prog/en/modules/circ/circulation.tt            | 89 +++++++++++++++-------
 .../intranet-tmpl/prog/js/pages/circulation.js     |  4 +
 3 files changed, 82 insertions(+), 29 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css
index fb09d51..784fc3e 100644
--- a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css
+++ b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css
@@ -1177,24 +1177,32 @@ div.alert strong {
     list-style-position:inside;
 }
 
-.dialog button {
+.dialog button,
+.dialog a.approve {
     background: #fff none;
     border: 1px outset #999999;
     border-top-color: #666;
     border-left-color: #666;
+    color: #000;
     margin : .4em;
     padding : .4em;
     white-space: pre-line;
 }
 
-.dialog button:hover {
+.dialog button:hover,
+.dialog a.approve:hover {
     background-color : #ffc;
 }
 
-.dialog button:active {
+.dialog button:active,
+.dialog a.approve:active {
     border : 1px inset #999999;
 }
 
+.dialog a.approve {
+    display: inline-block;
+}
+
 .approve i.fa,
 .success i.fa {
     color: green;
@@ -2638,6 +2646,10 @@ button.closebtn{padding:0;cursor:pointer;background:transparent;border:0;-webkit
     overflow-y: auto;
 }
 
+.modal-dialog.modal-wide {
+    width: 80%;
+}
+
 .btn-group label,
 .btn-group select {
     font-size: 13px;
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt
index a0855e8..1457c52 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt
@@ -438,34 +438,24 @@ $(document).ready(function() {
 
         [% IF ( UNKNOWN_BARCODE ) %]
             <li>The barcode was not found: <span class="ex">[% barcode |html %]</span>
-	    [% IF ( fast_cataloging ) %]
-	        [% IF ( CAN_user_editcatalogue_fast_cataloging ) %]
-            <a href="/cgi-bin/koha/cataloguing/addbiblio.pl?frameworkcode=FA&amp;barcode=[% barcode |uri %]&amp;circborrowernumber=[% borrowernumber %]&amp;branch=[% branch %]&amp;duedatespec=[% duedatespec %]&amp;stickyduedate=[% stickyduedate %]">Add record using fast cataloging</a>
-		[% END %]
-	    [% END %]
 
-        [% IF ( FALLBACK ) %]
-            [% IF options %]
-                <br />The following items were found by searching:
-                [% FOREACH book IN options %]
-                    <br />
-                    <form method="post" action="/cgi-bin/koha/circ/circulation.pl" autocomplete="off">
-                    [% IF (forceallow) %]<input type="hidden" name="forceallow" value="1">[% END %]
-                        <input type="hidden" name="restoreduedatespec" />
-                        <input type="hidden" name="borrowernumber" value="[% borrowernumber %]" />
-                        <input type="hidden" name="duedatespec" value="[% duedatespec %]" />
-                        <input type="hidden" name="stickyduedate" value="[% stickyduedate %]" />
-                        <input type="hidden" name="branch" value="[% branch %]" />
-                        <input type="hidden" name="barcode" value="[% book.barcode %]" />
-                        <button type="submit" name="x"><i class="fa fa-check"></i> Check out [% book.barcode %]: [% book.title %]</button>
-                    </form>
-                [% END %]
-            [% ELSE %]
-                <br />No items were found by searching.
-            [% END %]
-        [% END %]
+                <div>
+                    [% IF ( FALLBACK ) %]
+                        [% IF options %]
+                            <button type="button" class="approve" data-toggle="modal" data-target="#itemSearchFallback"><i class="fa fa-search"></i> Show matching titles</button>
+                        [% ELSE %]
+                            <div>No items were found by searching.</div>
+                        [% END %]
+                    [% END %]
 
-     </li>
+                    [% IF ( fast_cataloging ) %]
+                        [% IF ( CAN_user_editcatalogue_fast_cataloging ) %]
+                            <a class="approve" href="/cgi-bin/koha/cataloguing/addbiblio.pl?frameworkcode=FA&amp;barcode=[% barcode |uri %]&amp;circborrowernumber=[% borrowernumber %]&amp;branch=[% branch %]&amp;duedatespec=[% duedatespec %]&amp;stickyduedate=[% stickyduedate %]"><i class="fa fa-plus"></i> Add record using fast cataloging</a>
+                        [% END %]
+                    [% END %]
+                </div>
+
+            </li>
         [% END %]
 
         [% IF ( NOT_FOR_LOAN ) %]
@@ -545,6 +535,53 @@ $(document).ready(function() {
         [% END %]
 
 </div></div>
+
+        [% IF ( FALLBACK ) %]
+            [% IF options %]
+
+                <!-- Modal -->
+                <div class="modal" id="itemSearchFallback" tabindex="-1" role="dialog" aria-labelledby="itemSearchFallbackLabel">
+                    <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">&times;</span></button>
+                                <h3 id="itemSearchFallbackLabel"><h3>Barcode not found. The following items were found by searching:</h3>
+                            </div>
+                            <div class="modal-body">
+                                <table class="table_borrowers">
+                                    [% FOREACH book IN options %]
+                                        <tr>
+                                            <td>
+                                                <a class="popup" target="_blank" href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% book.biblionumber %]">[% book.title %]</a>
+                                                [% book.barcode %]
+                                            </td>
+                                            <td>
+                                                <form method="post" action="/cgi-bin/koha/circ/circulation.pl" autocomplete="off">
+                                                    [% IF (forceallow) %]
+                                                        <input type="hidden" name="forceallow" value="1">
+                                                    [% END %]
+                                                    <input type="hidden" name="restoreduedatespec" />
+                                                    <input type="hidden" name="borrowernumber" value="[% borrowernumber %]" />
+                                                    <input type="hidden" name="duedatespec" value="[% duedatespec %]" />
+                                                    <input type="hidden" name="stickyduedate" value="[% stickyduedate %]" />
+                                                    <input type="hidden" name="branch" value="[% branch %]" />
+                                                    <input type="hidden" name="barcode" value="[% book.barcode %]" />
+                                                    <button class="btn btn-default btn-xs" type="submit" name="x"><i class="fa fa-check"></i> Check out</button>
+                                                </form>
+                                            </td>
+                                        </tr>
+                                    [% END %]
+                                </table>
+                            </div>
+                            <div class="modal-footer">
+                                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            [% END %]
+        [% END %]
+
 [% ELSE %]
   [% IF (forceallow) %]
       <div id="overridden_debarment" class="dialog alert">Restriction overridden temporarily</div>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js b/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js
index cbe274b..aeeaf8b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js
@@ -81,6 +81,10 @@ $(document).ready(function() {
         $("#barcode").focus();
     });
 
+    $("#itemSearchFallback").ready(function(){
+        $("#itemSearchFallback").modal("show");
+    });
+
 });
 
 function export_checkouts(format) {
-- 
2.1.4