implement timeout dialog
[Biblio-RFID.git] / examples / selfcheck.html
1 <html>
2 <head>
3 <meta charset="utf-8"></meta>
4 <title>RFID SIP2 Selfcheck</title>
5 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
6 <link href='http://fonts.googleapis.com/css?family=Roboto&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
7 <style type="text/css">
8
9 body, input {
10         font-family: 'Roboto', sans-serif;
11         background: #eee;
12         font-size: 150%;
13 }
14
15 body {
16         margin: 2em;
17 }
18
19
20 .status {
21         background: #ff8;
22 }
23
24 .da {
25         background: #fcc;
26 }
27
28 .d7 {
29         background: #cfc;
30 }
31
32 .page {
33         border: 2em solid #fff;
34         border-radius: 1em;
35         background: #fff;
36 }
37
38 #tags {
39         position: fixed;
40         width: 20em;
41         top: 0;
42         right: 0;
43 }
44
45 input[type=button] {
46         margin-top: 1em;
47         display: block;
48         width: 100%;
49         height: 5em;
50 }
51
52 #timeout {
53         display: none;
54         position: absolute;
55         top: 50%;
56         left: 50%;
57         margin-left: -10em;
58         margin-top: -5em;
59         width: 20em;
60         height: 10em;
61         background: #ff8;
62         padding: 2em;
63         border: 0.5em solid #f00;
64 }
65
66 </style>
67 <script type="text/javascript" src="/examples/selfcheck.js"></script>
68 </head>
69 <body>
70
71 <div id="tags">
72 RFID reader not found or driver program not started.
73 </div>
74
75
76 <h1>Knjižnica Filozofskog fakulteta</h1>
77
78 <div id="timeout">
79 Timeout in <span id="tick">99</span> seconds.
80 <input type=button value="continue" onClick="start_timeout();">
81 </div>
82
83
84 <div class="page" id="start">
85
86 <!--
87 Put borrower card on a reader to borrow books
88 -->
89
90 Ako želite posuditi knjigu, najprije stavite iskaznicu na za to previđeno mjesto.
91
92 <hr>
93
94 <!--
95 Select checkin button to return books.
96 -->
97
98 Ako želite vratiti knjigu, pristisnite ovaj gumb.
99
100 <input name=checkin type=button value="Povrat" onClick="change_page('checkin')">
101 </div>
102
103 <div class="page" id="borrower_info">
104 <!--
105 Borrower:
106 -->
107 <h2>Informacije o članu</h2>
108 <div class="borrower_name"></div>
109 <!--
110 <div class="borrower_email"></div>
111 -->
112 <div class="borrower_number"></div>
113
114 <h2>Dokumenti</h2>
115
116 <ul>
117 <li>Hold items: <span class="hold_items">0</span>
118 <li>Overdue items: <span class="overdue_items">0</span>
119 <li>Charged items: <span class="charged_items">0</span>
120 <li>Fine items: <span class="fine_items">0</span>
121 </ul>
122
123 <h2>Dugovanje</h2>
124
125 Ostatak: 0,00 kn
126
127 <h2>Poruke</h2>
128
129 Greeting from Koha.
130
131 <input type="button" value="OK" onClick="change_page(circulation_type)">
132
133
134 </div>
135
136 <div class="page" id="circulation">
137 <!--
138 Put books to borrow on reader pad.
139 -->
140 Postavite knjige na predviđeno mjesto ispred monitora.
141
142 <hr>
143
144 <div class="checkout">Posuđeno:</div>
145 <div class="checkin">Vraćeno:</div>
146
147 <ul id="books">
148 </ul>
149
150 Dokumenata: <span id="books_count">0</span>
151
152 <div style="display: block">
153 <input type="button" value="Završi" onClick="change_page('end')">
154 <input class="checkout" type="button" value="Informacije o članu" onClick="change_page('borrower_info')">
155 </div>
156
157 </div>
158
159 <div class="page" id="end">
160
161 Hvala što ste koristili selfcheck sustav.
162
163 </div>
164
165 <div class="page" id="error">
166
167 Greška. Odnesite knjige na pult.
168
169 </div>
170
171 </body>
172 </html>