X-Git-Url: http://git.rot13.org/?p=Biblio-RFID.git;a=blobdiff_plain;f=examples%2Fselfcheck.html;h=1c0b378b8da3b69612aaee25a132117e1dc57a93;hp=fd00e6101b166b5b9a2fb1ca90b0026de4cb94d5;hb=282b54550a8a651fe528648d40aa7c582d288511;hpb=77e46708c51a697cf4dca335ec59b95d9a446361;ds=sidebyside

diff --git a/examples/selfcheck.html b/examples/selfcheck.html
index fd00e61..1c0b378 100644
--- a/examples/selfcheck.html
+++ b/examples/selfcheck.html
@@ -8,7 +8,12 @@
 
 body, input {
 	font-family: 'Roboto', sans-serif;
-	font-size: 110%;
+	font-size: 150%;
+	/* disable selection which brings havoc on touchscreens */
+	-webkit-user-select: none;
+	-moz-user-select: -moz-none;
+	-ms-user-select: none;
+	user-select: none;
 }
 
 body {
@@ -17,6 +22,13 @@ body {
 }
 
 
+h1 {
+	position: absolute;
+	top: -0.5em;
+	left: 0.5em;
+	font-size: 100%;
+}
+
 .status {
 	background: #ff8;
 }
@@ -40,13 +52,15 @@ body {
 	width: 20em;
 	top: 0;
 	right: 0;
+	font-size: 50%;
 }
 
 input[type=button] {
 	display: block;
 	float: left;
-	width: 100%;
-	height: 3em;
+	width: 50%;
+	height: 6em;
+	font-size: 100%;
 }
 
 .button {
@@ -64,13 +78,23 @@ input[type=button] {
 	top: 50%;
 	left: 50%;
 	margin-left: -8em; /* width + 2 * padding / 2 */
-	margin-top: -2.5em;
+	margin-top: -5em;
 	width: 12em;
-	height: 5em;
+	height: 8em;
 	background: #ff8;
 	padding: 2em;
 	border: 0.5em solid #f00;
 	text-align: center;
+	font-size: 100%;
+}
+
+#working {
+	display: none;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	margin-left: -250px; /* 500 / 2 */
+	margin-top: -187px;  /* 375 / 2 */
 }
 
 </style>
@@ -82,24 +106,28 @@ input[type=button] {
 RFID reader not found or driver program not started.
 </div>
 
-
 <h1>Knjižnica Filozofskog fakulteta</h1>
 
 <div id="timeout">
 Timeout in <span id="tick">99</span> seconds.
 <div class="button">
-<input type=button value="continue" onClick="start_timeout();">
+<input type=button value="continue" onClick="start_timeout();" style="width:100%">
 </div>
 </div>
 
 
+<div id="working">
+<img src="/examples/giphy.gif">
+</div>
+
+
 <div class="page" id="start">
 
 <!--
 Put borrower card on a reader to borrow books
 -->
 
-Ako želite posuditi knjigu, najprije stavite iskaznicu na za to previđeno mjesto.
+Ako želite posuditi knjigu, najprije stavite iskaznicu na za to predviđeno mjesto.
 
 <hr>
 
@@ -107,14 +135,15 @@ Ako želite posuditi knjigu, najprije stavite iskaznicu na za to previđeno mjes
 Select checkin button to return books.
 -->
 
-Ako želite vratiti knjigu, pristisnite ovaj gumb.
+Ako želite vratiti knjigu, pritisnite gumb za povrat.
 
 <div class="button">
-<input name=checkin type=button value="Povrat" onClick="change_page('checkin')">
+<input name=checkin type=button value="Povrat" onClick="change_page('checkin')" style="background: #8f8;">
 </div>
 </div>
 
 <div class="page" id="borrower_info">
+
 <!--
 Borrower:
 -->
@@ -128,12 +157,17 @@ Borrower:
 <h2>Dokumenti</h2>
 
 <ul>
+<!--
 <li>Hold items: <span class="hold_items">0</span>
-<li>Overdue items: <span class="overdue_items">0</span>
-<li>Charged items: <span class="charged_items">0</span>
+-->
+<li>Posuđeno: <span class="charged_items">0</span>
+<li>Kašnjenja: <span class="overdue_items">0</span>
+<!--
 <li>Fine items: <span class="fine_items">0</span>
+-->
 </ul>
 
+<!--
 <h2>Dugovanje</h2>
 
 Ostatak: 0,00 kn
@@ -142,6 +176,8 @@ Ostatak: 0,00 kn
 
 Greeting from Koha.
 
+-->
+
 <div class="button">
 <input type="button" value="OK" onClick="change_page(circulation_type)">
 </div>
@@ -162,11 +198,9 @@ Postavite knjige na predviđeno mjesto ispred monitora.
 <ul id="books">
 </ul>
 
-Dokumenata: <span id="books_count">0</span>
-
 <div class="button">
 <input class="checkout" type="button" value="Informacije o članu" onClick="change_page('borrower_info')">
-<input type="button" value="Završi" onClick="change_page('end')">
+<input type="button" value="Završi" onClick="change_page('end')" style="float:right; background: #f88;">
 </div>
 
 </div>