Koha/koha-tmpl/opac-tmpl/bootstrap/en/modules/sci/sci-main.tt
Owen Leonard de2d8ba3e4 Bug 30011: Update links to jQueryUI assets, remove datepicker references, etc.
This patch updates templates to include the new version of jQueryUI. It
removes some references to the now unused datepicker widget as well as
the jQuery timepicker addon.

Some minor JavaScript and style updates to fix issues resulting from the
upgrade.

To test, apply the patch and update the CSS in the staff interface AND
in the OPAC
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

IN THE OPAC:

 - The OPAC only uses the tabs jQueryUI widget.
 - View pages where tabs are used: Bibliographic details, user summary,
   advanced search.

IN THE STAFF INTERFACE:

 - The staff interface uses four jQueryUI widgets: accordion,
   autocomplete, sortable, and tabs
 - Test the accordion widget on two pages: Administration -> Table
   settings and Patrons -> Patrons requesting modifications.
 - Test autocomplete (requires PatronAutoComplete to be enabled) on
   various pages. For example:
   - From the "Check out" tab in the header search box.
   - From the "Search patrons" tab in the header search box, e.g. from
     the main Patrons page.
   - Place hold -> Search patrons.
   - Tools -> Patron lists -> Add patrons to list -> Patron search.
 - Test sortable:
   - Administration -> System preferences -> Language.
     - With more than one language installed you should be able to
       drag to re-order the enabled languages. Confirm that your change
       is saved successfully.
   - Administration -> MARC bibliographic framework -> MARC structure ->
     Edit subfields on a tag with multiple subfields. You should be able
     to drag to re-order the tabs at the top of the subfield constraints
     edit page. Confirm that your changes are saved successfully.
   - Cataloging -> New record. Test that you can re-order subfields
     under a tag with multiple subfields and that your changes are
     saved.
 - Tabs: View various pages with tabs: Check out, bibliographic details,
   basic MARC editor. They're everywhere.

Also confirm that the removal of the leftover datepicker doesn't affect
pages which use the calendar include: Test various pages which use
Flatpickr, e.g. check out, renew, reports, etc.

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
2022-04-08 15:49:16 +02:00

269 lines
14 KiB
Text

[% USE raw %]
[% USE Asset %]
[%# Includes %]
[% USE Koha %]
[% USE KohaDates %]
[% USE AdditionalContents %]
[%# Helper template functions %]
[% BLOCK error_message %]
[% IF messages.BadBarcode %]
<span>(Barcode not found on the database, please see library staff for assistance)</span>
[% ELSIF messages.Wrongbranch %]
<span>(The item cannot be checked in at this library, please see library staff for assistance)</span>
[% ELSIF messages.withdrawn %]
<span>(Item is withdrawn and check-in blocked by policy, please see library staff for assistance)</span>
[% ELSIF messages.NotIssued %]
<span>(The book is not currently on loan, please see library staff for assistance)</span>
[% ELSIF messages.additional_materials %]
<span>(The item cannot be checked in at a self service terminal, please see library staff for assistance)</span>
[% ELSE %]
<span>(There was a problem checking in this item, please see library staff for assistance)</span>
[% END %]
[% END %]
[% PROCESS 'html_helpers.inc' %]
[% SET OpacHeader = AdditionalContents.get( location => "opacheader", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
[% INCLUDE 'doc-head-open.inc' %]
[% SET OpacLangSelectorMode = Koha.Preference('OpacLangSelectorMode') %]
<title>Self check-in &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha [% END %]</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="Koha [% Version | html %]" /> <!-- leave this for stats -->
[% IF ( Koha.Preference('OpacFavicon') ) %]
<link rel="shortcut icon" href="[% Koha.Preference('OpacFavicon') | url %]" type="image/x-icon" />
[% ELSE %]
<link rel="shortcut icon" href="[% interface | html %]/[% theme | html %]/images/favicon.ico" type="image/x-icon" />
[% END %]
[% IF ( bidi ) %]
[% Asset.css("lib/jquery/jquery-ui-rtl-1.13.1.min.css") | $raw %]
[% Asset.css("css/sco-rtl.css") | $raw %]
[% ELSE %]
[% Asset.css("lib/jquery/jquery-ui-1.13.1.css") | $raw %]
[% Asset.css("css/sco.css") | $raw %]
[% END %]
[% IF ( Koha.Preference('OPACUserCSS') ) %]<style>[% Koha.Preference('OPACUserCSS') | $raw %]</style>[% END %]
[% IF ( Koha.Preference('SelfCheckInUserCSS') ) %]<style>[% Koha.Preference('SelfCheckInUserCSS') | $raw %]</style>[% END %]
<script>
function _(s) { return s } // dummy function for gettext
</script>
</head>
<body id="sci_main" class="sci" onload="dofocus();" onunload="mungeHistory();">
[% INCLUDE 'masthead-sci.inc' %]
<div class="main">
<div class="container-fluid">
<div class="row">
<div class="col order-first order-md-first order-lg-2">
<div id="masthead">
<h1>[% LibraryName | html %] Self check-in</h1>
</div>
[% IF ( nopermission ) %]
[%# This is what is displayed if user doesn't have permission %]
<div class="alert alert-warning">
<h2>Access denied</h2>
<p>Sorry, this self check-in station has lost authentication. Please contact the administrator to resolve this problem.</p>
</div>
[% ELSIF ( different_ip ) %]
[%# This is what is displayed if user doesn't have permission %]
<div class="alert alert-warning">
<h2>Session lost</h2>
<p>You are accessing self check-in from a different IP address! Please log in again.</p>
</div>
[% ELSIF ( checkins ) %]
[%# We have results from a check-in attempt %]
<div id="checkins" class="sci_results_list">
[% IF ( success && success.size > 0 || errors && errors.size > 0 ) %]
<table id="sci_bcheckins_table" class="table table-bordered table-striped dataTable no-footer">
<caption><h2>Results</h2></caption>
<thead>
<th>Barcode</th>
<th>Status</th>
</thead>
<tbody>
[% FOREACH success_line IN success %]
<tr>
<td>[% success_line.barcode | html %]</td>
<td>Checked in</td>
</tr>
[% END %]
[% FOREACH error IN errors %]
<tr>
<td>[% error.barcode | html %]</td>
<td>Not checked in [% PROCESS error_message messages=error.messages %]</td>
</tr>
[% END %]
</tbody>
</table>
<div>
<form method="post" action="#" id="finish_form">
<legend class="sr-only">Finish</legend>
<button id="sci_finish_button" type="submit" class="btn btn-primary"><i class="fa fa-check" aria-hidden="true"></i> Finish</button>
</form>
</div>
[% ELSE %]
<div class="alert alert-warning">
<p>Your request included no check-ins.</p>
</div>
[% END %]
</div>
[% ELSE %]
[%# Prompt for barcodes %]
<div id="new_checkins" class="sci_entry">
<form id="scan_form" name="scan_form" method="post" action="/cgi-bin/koha/sci/sci-main.pl">
<legend class="sr-only">Scan</legend>
<div class="row">
<div class="col-auto">
<label for="barcode_input">Scan the item or enter its barcode:</label>
</div>
<div class="col-4">
<input id="barcode_input" name="barcode_input" size="20" type="text" class="focus form-control" autocomplete="off" />
</div>
<div class="col-auto">
<button id="sci_append_button" type="submit" class="btn btn-primary">
Submit
</button>
</div>
</div> <!-- /.row -->
<div class="row">
<div class="col">
<div class="sci_input_append">
<table id="sci_barcodes_table" class="table table-bordered table-striped dataTable no-footer" style="display: none;">
<caption class="sr-only">Barcodes</caption>
<thead>
<th class="barcodes_column">Barcode</th>
</thead>
<tbody>
</tbody>
</table> <!-- /#sci_barcodes_table -->
</div> <!-- .sci_input_append -->
<input type="hidden" name="op" value="check_in" />
<div id="button_bar">
<button id="sci_checkin_button" type="submit" class="btn btn-primary" style="display: none;">
<i class="fa fa-check-square-o" aria-hidden="true"></i> <span>Check in</span>
</button>
<a href="/cgi-bin/koha/sci/sci-main.pl" class="btn btn-danger" role="button" style="display: none;" id="sci_refresh_button">
<i class="fa fa-times" aria-hidden="true"></i> <span>Cancel</span>
</a>
</div> <!-- /#button_bar -->
</div> <!-- /.col -->
</div> <!-- /.row -->
</form> <!-- /#scan_form -->
</div> <!-- / #new_checkins -->
[% END # /IF ( nopermission ) %]
</div> <!-- / #masthead -->
</div> <!-- / .row -->
</div> <!-- / .container-fluid -->
[% IF ( Koha.Preference('SelfCheckInMainUserBlock') ) %]
<div id="SelfCheckInMainUserBlock">[% Koha.Preference('SelfCheckInMainUserBlock' ) | $raw %]</div>
[% END %]
</div> <!-- / .main -->
[% # Help modal %]
<div id="helpModal" class="modal" tabindex="-1" role="dialog" aria-labelledby="helpModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h2 id="helpModalLabel">Self check-in help</h2>
<button type="button" class="closebtn" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div> <!-- /.modal-header -->
<div class="modal-body">
<ul>
<li>Scan each item or enter its barcode. A list with the entered barcodes will be displayed.</li>
<li>Click the 'Check in' button to confirm.</li>
<li>The operation results will be displayed for each entered barcode.</li>
<li>The 'Finish' button is presented to start over.</li>
<li>At any step, clicking the 'Cancel' button will erase the scanned barcodes and start over.</li>
</ul>
</div> <!-- /.modal-body -->
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</div> <!-- /#helpModal -->
</body>
[% INCLUDE 'opac-bottom.inc' %]
[% BLOCK jsinclude %]
<script>
function mungeHistory() {
// prevent back button from allowing form resubmission
if (history && history.pushState) {
history.replaceState(null, document.title, window.location.href);
}
}
function dofocus() {
$(".focus:last").select();
}
var barcodes = [];
$(document).ready(function() {
// Barcodes scanning table initially hidden
$("#sci_barcodes_table").hide();
// Control de 'append' button behaviour
$("#sci_append_button").on('click',function( e ){
// Make sure the form is not submitted by the button
e.preventDefault();
var barcode = $('#barcode_input').val();
//var result = validate_barcode( barcode );
$('#sci_barcodes_table tbody').append(
'<tr style="font-size: initial;"><td>' +
barcode +
'<input type="hidden" name="barcode" value="' + barcode + '" />' +
'</td></tr>' );
// Make sure the table is now displayed
$("#sci_barcodes_table").show();
$('#sci_checkin_button').show();
$('#sci_refresh_button').show();
barcodes.push(barcode);
// clean the input, reset the focus
$('#barcode_input').val('');
dofocus();
});
$(".helpModal-trigger").on("click",function(e){
e.preventDefault();
$("#helpModal").modal("show");
});
// set focus at the beginning
dofocus();
});
var idleTime = 0;
$(document).ready(function () {
//Increment the idle time counter every second
var idleInterval = setInterval(timerIncrement, 1000);
//Zero the idle timer on mouse movement.
$(this).mousemove(function (e) {
idleTime = 0;
});
$(this).keypress(function (e) {
idleTime = 0;
});
});
function timerIncrement() {
if ( $("#sci_finish_button").is(":visible") || $("#sci_refresh_button").is(":visible") ) {
idleTime = idleTime + 1;
idleTimeout = [% refresh_timeout | html %];
if (idleTime >= idleTimeout ) {
location.href = '/cgi-bin/koha/sci/sci-main.pl';
}
}
}
</script>
[% IF ( Koha.Preference('SelfCheckInUserJS') ) %]
<script>[% Koha.Preference('SelfCheckInUserJS') | $raw %]</script>
[% END %]
[% END %]