Basic web-based selfcheck interface. This interface implements a subset of
[Evergreen.git] / Open-ILS / web / opac / extras / selfcheck / selfcheck.xml
1 <?xml version="1.0" encoding="UTF-8"?>
2 <!-- ***********************************************************************
3 * Copyright (C) 2008  Equinox Software, Inc.
4 * Bill Erickson <erickson@esilibrary.com>
5
6 * This program is free software; you can redistribute it and/or
7 * modify it under the terms of the GNU General Public License
8 * as published by the Free Software Foundation; either version 2
9 * of the License, or (at your option) any later version.
10
11 * This program is distributed in the hope that it will be useful,
12 * but WITHOUT ANY WARRANTY; without even the implied warranty of
13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14 * GNU General Public License for more details.
15
16 * You should have received a copy of the GNU General Public License
17 * along with this program; if not, write to the Free Software
18 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  
19 * 02110-1301, USA
20 ************************************************************************ -->
21
22 <!DOCTYPE html PUBLIC 
23         "-//W3C//DTD XHTML 1.0 Transitional//EN" 
24         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" [
25         <!--#include virtual="/opac/locale/${locale}/opac.dtd" -->
26 ]>
27
28 <!--#include virtual="../../skin/default/xml/setenv.xml"-->
29
30 <html xmlns='http://www.w3.org/1999/xhtml'>
31
32     <head>
33         <script>var config = {css:{}}</script>
34                 <!--#include virtual="../../skin/default/xml/common/js_common.xml"-->
35         <script language='javascript' type='text/javascript' 
36             src='<!--#echo var="OILS_OPAC_JS_HOST"-->/common/js/DP_DateExtensions.js'></script>
37         <script language='javascript' type='text/javascript' 
38             src='<!--#echo var="OILS_OPAC_JS_HOST"-->/extras/selfcheck/selfcheck.js'></script>
39         <link type='text/css' rel='stylesheet' title='Regular'
40             href="<!--#echo var='OILS_OPAC_CSS_HOST'-->/extras/selfcheck/selfcheck.css"/>
41         <link type='text/css' rel='stylesheet' media='print'
42             href="<!--#echo var='OILS_OPAC_CSS_HOST'-->/extras/selfcheck/selfcheck_print.css"/>
43         <link type='text/css' rel='alternate stylesheet' title='Printable'
44             href="<!--#echo var='OILS_OPAC_CSS_HOST'-->/extras/selfcheck/selfcheck_print.css"/>
45     </head>
46
47     <body onload='selfckInit();'>
48
49         <div class='noprint'>
50
51             <!--***********************************************************************
52                 Form for patron "login"
53                 *********************************************************************** -->
54             <div id='selfck-patron-login-container' class='hide_me form_div'>
55                 <span>&selfck.patron_barcode_label;</span>
56                 <span><input type='text' id='selfck-patron-login-input'> </input></span>
57                 <span><button onclick='selfckPatronLogin();'>&selfck.submit;</button></span>
58                 <span id='selfck-patron-not-found' class='hide_me'>&selfck.event.patron_not_found;</span>
59             </div>
60
61             <!--***********************************************************************
62                 Checkout form
63                 *********************************************************************** -->
64             <div id='selfck-patron-checkout-container' class='hide_me'>
65
66                 <!--***********************************************************************
67                     Header
68                     *********************************************************************** -->
69                 <div id='selfck-logout-div' class='container'>
70                     <div id='selfck-patron-info-div'> 
71                         <!-- not really i18n friendly, but better than nothing -->
72                         &selfck.welcome; <span id='selfck-patron-name-span'></span>!
73                     </div>
74                     <div id='selfck-logout-link-div'>
75                         <span class='selfck-link-span'>
76                             <a href='javascript:void(0);' id='selfck-print-co-button' 
77                                 onclick='selfckPrint();'>&selfck.print_checkouts;</a>
78                         </span>
79                         <span class='selfck-link-span'>
80                             <a href='javascript:void(0);' id='selfck-logout-button' 
81                                 onclick='selfckLogoutPatron();'>&selfck.logout;</a>
82                         </span>
83                         <span class='selfck-link-span'>
84                             <a href='javascript:void(0);' id='selfck-logout-print-button' 
85                                 onclick='selfckPrint(); selfckLogoutPatron();'>&selfck.print_logout;</a>
86                         </span>
87                     </div>
88                 </div>
89
90                 <!--***********************************************************************
91                     Display messages here
92                     *********************************************************************** -->
93                 <div id='selfck-message-div' class='form_div'>
94                     <span class='' id='selfck-event-time'></span>
95                     <span class='biglabel' id='selfck-event-span'> </span>
96                     <span class='hide_me'>
97                         <span id='selfck-event-SUCCESS'>&selfck.event.co_success;</span>
98                         <span id='selfck-event-UNKNOWN'>&selfck.event.unknown;</span>
99                         <span id='selfck-event-ACTOR_USER_NOT_FOUND'>&selfck.event.patron_not_found;</span>
100                         <span id='selfck-event-COPY_CIRC_NOT_ALLOWED'>&selfck.event.item_nocirc;</span>
101                         <span id='selfck-event-ITEM_NOT_CATALOGED'>&selfck.event.item_noncat;</span>
102                         <span id='selfck-event-dupe-barcode'>&selfck.event.dupe_barcode;</span>
103                     </span>
104                 </div>
105
106                 <!--***********************************************************************
107                     This is where patrons scan in the item barcodes
108                     *********************************************************************** -->
109                 <div id='selfck-item-barcode-form-div' class='form_div'>
110                     <div>
111                         <img src='../../../images/small_logo.jpg'/>
112                         <div class='biglabel'>&selfck.item_barcode_label;</div>
113                         <div id='selfck-item-barcode-form'>
114                             <span><input type='text' id='selfck-item-barcode-input'> </input></span>
115                             <span><button onclick='selfckCheckout();'>&selfck.submit;</button></span>
116                         </div>
117                     </div>
118                 </div>
119
120                 <!--***********************************************************************
121                     This is where patrons scan in the item barcodes
122                     *********************************************************************** -->
123                 <table id='selfck-items-out-table' class='hide_me'>
124                     <thead>
125                         <tr>
126                             <td id='selfck-pic-cell'></td>
127                             <td>&selfck.barcode;</td>
128                             <td>&selfck.title;</td>
129                             <td>&selfck.author;</td>
130                             <td>&selfck.due_date;</td>
131                             <td>&selfck.remaining;</td>
132                             <td>&selfck.cotype;</td>
133                         </tr>
134                     </thead>
135                     <tbody id='selfck-items-out-tbody'>
136                         <tr id='selfck-items-out-row'>
137                             <td><img class='jacket' name='selfck.jacket'></img></td>
138                             <td name='selfck.barcode'></td>
139                             <td name='selfck.title'></td>
140                             <td name='selfck.author'></td>
141                             <td name='selfck.due_date'></td>
142                             <td name='selfck.remaining'></td>
143                             <td>
144                                 <span name='selfck.cotype_co'>&selfck.cotype_co;</span>
145                                 <span name='selfck.cotype_rn' class='hide_me'>&selfck.cotype_rn;</span>
146                             </td>
147                         </tr>
148                     </tbody>
149                 </table>
150             </div>
151         </div>
152
153         <!--***********************************************************************
154             Generate the printable version of the checked out list here
155             *********************************************************************** -->
156         <div class='print' id='selfck-print-div'>
157             <div>
158                 <div id='selfck-print-date'/>
159                 You checked out the following items:
160                 <ol id='selfck-print-items-list'>
161                     <li name='selfck-print-items-template'>
162                         <div name='title'/>
163                         Barcode: <span name='barcode'/>
164                         Due Date: <span name='due_date'/>
165                     </li>
166                 </ol>
167             </div>
168         </div>
169     </body>
170 </html>
171