|
400
|
1 <%@ page language="java" %><%!
|
|
|
2 // -- JSP init -------------
|
|
|
3
|
|
|
4 // create DocumentBean instance for all JSP requests
|
|
|
5 digilib.servlet.DocumentBean docBean = new digilib.servlet.DocumentBean();
|
|
|
6
|
|
|
7 // initialize DocumentBean instance in JSP init
|
|
|
8 public void jspInit() {
|
|
|
9 try {
|
|
|
10 // set servlet init-parameter
|
|
|
11 docBean.setConfig(getServletConfig());
|
|
|
12 } catch (javax.servlet.ServletException e) {
|
|
|
13 System.out.println(e);
|
|
|
14 }
|
|
|
15 }
|
|
|
16 // -- end of JSP init -------------
|
|
|
17 %>
|
|
|
18
|
|
|
19 <%
|
|
|
20 // -- JSP request -------------
|
|
|
21
|
|
|
22 // parsing the query
|
|
|
23 // -----------------
|
|
|
24 digilib.servlet.DigilibRequest dlRequest = new digilib.servlet.DigilibRequest(request);
|
|
|
25 docBean.setRequest(dlRequest);
|
|
|
26 // check if authentication is needed and redirect if necessary
|
|
|
27 docBean.doAuthentication(response);
|
|
|
28 // add number of pages
|
|
|
29 dlRequest.setValue("pt", docBean.getNumPages());
|
|
|
30 // store objects for jsp:include
|
|
|
31 pageContext.setAttribute("docBean", docBean, pageContext.REQUEST_SCOPE);
|
|
|
32 %>
|
|
|
33
|
|
|
34 <html>
|
|
|
35
|
|
|
36 <head>
|
|
|
37 <title>Digital Document Library NG</title>
|
|
|
38
|
|
|
39 <style type="text/css">
|
|
|
40
|
|
|
41 body { background-color: #E0E0E0; color: black; font-size: 8pt }
|
|
|
42 code { font-family: monospace; color: blue; }
|
|
|
43 pre { color: #006060; }
|
|
|
44
|
|
|
45 a.icon { margin: 0px; padding: 0px; }
|
|
|
46
|
|
|
47 img.png { border: none; }
|
|
401
|
48 img.png:hover { background-image: url('corona.png'); }
|
|
400
|
49 img.mark { border: none; }
|
|
|
50
|
|
|
51 div.button { padding: 0px; }
|
|
|
52 div.dot { position: absolute; left: -20; top: 100; visibility: hidden }
|
|
|
53 div#scaler-table { padding-right: 40px; }
|
|
|
54
|
|
|
55 div#buttons { position: absolute; right: 5px; top: 5px; background-color: #E0E0E0; }
|
|
|
56 div#dloptions { position: absolute; right: 5px; top: 5px; background-color: #E0E0E0; visibility: hidden; }
|
|
401
|
57 div#zoom { position: absolute; border: 2px solid red; visibility: hidden; }
|
|
400
|
58
|
|
|
59 </style>
|
|
|
60
|
|
|
61 <script type="text/javascript" src="baselib.js"></script>
|
|
|
62
|
|
|
63 <script type="text/javascript" src="dllib.js"></script>
|
|
|
64
|
|
|
65 <script language="JavaScript">
|
|
|
66 var isOptionDivVisible = false;
|
|
|
67 var dlTarget = window.name;
|
|
|
68 var baseUrl = '<%= dlRequest.getAsString("base.url") %>';
|
|
|
69 var toolbarEnabledURL = window.location.href;
|
|
|
70
|
|
|
71 function resetParams() {
|
|
|
72 newParameter('fn', '', 1);
|
|
|
73 newParameter('pn', '1', 1);
|
|
|
74 newParameter('ws', '1.0', 1);
|
|
|
75 newParameter('mo', '', 1);
|
|
|
76 newParameter('mk', '', 3);
|
|
|
77 newParameter('wx', '0.0', 2);
|
|
|
78 newParameter('wy', '0.0', 2);
|
|
|
79 newParameter('ww', '1.0', 2);
|
|
|
80 newParameter('wh', '1.0', 2);
|
|
|
81 newParameter('pt', '<%= dlRequest.getAsString("pt") %>', 1);
|
|
|
82 newParameter('brgt', '0.0', 1);
|
|
|
83 newParameter('cont', '0.0', 1);
|
|
|
84 newParameter('rot', '0.0', 1);
|
|
|
85 newParameter('rgba', '', 1);
|
|
|
86 newParameter('rgbm', '', 1);
|
|
|
87 newParameter('ddpix', '', 1);
|
|
|
88 newParameter('ddpiy', '', 1);
|
|
|
89 document.id='digilib';
|
|
|
90 }
|
|
|
91
|
|
|
92
|
|
|
93 function toggleOptionDiv() {
|
|
|
94 isOptionDivVisible = !isOptionDivVisible;
|
|
|
95 showOptions(isOptionDivVisible);
|
|
|
96 }
|
|
|
97
|
|
|
98 function highlightPNG(id, on) {
|
|
|
99 var img = document.getElementById(id);
|
|
|
100 var a = img.parentNode
|
|
|
101 var div = a.parentNode;
|
|
|
102 var src = img.src;
|
|
|
103 // FIXME: IE - transparente PNGs offenbar nicht nachladbar
|
|
|
104
|
|
|
105 // if (browserType.isIE)
|
|
|
106 // img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "');"
|
|
|
107 div.style.backgroundImage = on
|
|
|
108 ? "url('corona.png')"
|
|
|
109 : "";
|
|
|
110 }
|
|
|
111
|
|
|
112 // initialize image; called by body.onload
|
|
|
113 function onBodyLoaded() {
|
|
|
114 var scaler = getElement('scaler');
|
|
|
115 var pic = getElement('pic');
|
|
|
116 var ps = bestPicSize(scaler, 50);
|
|
|
117 var src = "../servlet/Scaler?" + getQueryString() + "&dw=" + ps.width + "&dh=" + ps.height;
|
|
|
118 pic.src = src;
|
|
|
119 dl_init(); // dl_init braucht die endgültigen Maße des pic Elements
|
|
|
120 }
|
|
|
121
|
|
|
122 base_init(); // browser recognition
|
|
|
123 resetParams(); // default values
|
|
|
124 dl_param_init(); // parse parameter values
|
|
|
125
|
|
|
126 </script>
|
|
|
127 </head>
|
|
|
128
|
|
|
129 <body onload="onBodyLoaded();">
|
|
|
130
|
|
|
131 <!-- slot for the scaled image -->
|
|
|
132 <div id="scaler-table">
|
|
|
133 <div id="scaler" style="visibility:visible">
|
|
|
134 <img id="pic"></img>
|
|
|
135 </div>
|
|
|
136 </div>
|
|
|
137
|
|
|
138 <!-- slot for the zoom -->
|
|
|
139 <div id="zoom">
|
|
|
140 </div>
|
|
|
141
|
|
|
142 <!-- marks as dynamically created divs with numbers or text? -->
|
|
|
143 <div id="dot0" class="dot"><img class="mark" src="../img/mark1.gif" ></div>
|
|
|
144 <div id="dot1" class="dot"><img class="mark" src="../img/mark2.gif" ></div>
|
|
|
145 <div id="dot2" class="dot"><img class="mark" src="../img/mark3.gif" ></div>
|
|
|
146 <div id="dot3" class="dot"><img class="mark" src="../img/mark4.gif" ></div>
|
|
|
147 <div id="dot4" class="dot"><img class="mark" src="../img/mark5.gif" ></div>
|
|
|
148 <div id="dot5" class="dot"><img class="mark" src="../img/mark6.gif" ></div>
|
|
|
149 <div id="dot6" class="dot"><img class="mark" src="../img/mark7.gif" ></div>
|
|
|
150 <div id="dot7" class="dot"><img class="mark" src="../img/mark8.gif" ></div>
|
|
|
151
|
|
|
152 <div id="buttons">
|
|
|
153 <div class="button">
|
|
|
154 <a
|
|
|
155 class="icon"
|
|
|
156 href="javascript:getRefWin()"
|
|
|
157 >
|
|
|
158
|
|
|
159 <img
|
|
|
160 class="png"
|
|
|
161 id="reference"
|
|
401
|
162
|
|
400
|
163 title="get a reference URL"
|
|
|
164 src="reference.png"
|
|
|
165 >
|
|
|
166 </a>
|
|
|
167 </div>
|
|
|
168
|
|
|
169 <div class="button">
|
|
|
170 <a
|
|
|
171 class="icon"
|
|
|
172 href="javascript:zoomBy(1.4)"
|
|
|
173 >
|
|
|
174
|
|
|
175 <img
|
|
|
176 class="png"
|
|
|
177 id="zoom-in"
|
|
401
|
178
|
|
400
|
179 title="zoom in"
|
|
|
180 src="zoom-in.png"
|
|
|
181 >
|
|
|
182 </a>
|
|
|
183 </div>
|
|
|
184
|
|
|
185 <div class="button">
|
|
|
186 <a
|
|
|
187 class="icon"
|
|
|
188 href="javascript:zoomBy(0.7)"
|
|
|
189 >
|
|
|
190
|
|
|
191 <img
|
|
|
192 class="png"
|
|
|
193 id="zoom-out"
|
|
401
|
194
|
|
400
|
195 title="zoom out"
|
|
|
196 src="zoom-out.png"
|
|
|
197 >
|
|
|
198 </a>
|
|
|
199 </div>
|
|
|
200
|
|
|
201 <div class="button">
|
|
|
202 <a
|
|
|
203 class="icon"
|
|
401
|
204 href="javascript:zoomArea()"
|
|
400
|
205 >
|
|
|
206
|
|
|
207 <img
|
|
|
208 class="png"
|
|
|
209 id="zoom-area"
|
|
401
|
210
|
|
400
|
211 title="zoom area"
|
|
|
212 src="zoom-area.png"
|
|
|
213 >
|
|
|
214 </a>
|
|
|
215 </div>
|
|
|
216
|
|
|
217 <div class="button">
|
|
|
218 <a
|
|
|
219 class="icon"
|
|
|
220 href="javascript:zoomFullpage()"
|
|
|
221 >
|
|
|
222
|
|
|
223 <img
|
|
|
224 class="png"
|
|
|
225 id="zoom-full"
|
|
401
|
226
|
|
400
|
227 title="view the whole image"
|
|
|
228 src="zoom-full.png"
|
|
|
229 >
|
|
|
230 </a>
|
|
|
231 </div>
|
|
|
232
|
|
|
233 <div class="button">
|
|
|
234 <a
|
|
|
235 class="icon"
|
|
|
236 href="javascript:gotoPage('-1')"
|
|
|
237 >
|
|
|
238
|
|
|
239 <img
|
|
|
240 class="png"
|
|
|
241 id="back"
|
|
401
|
242
|
|
400
|
243 title="goto previous image"
|
|
|
244 src="back.png"
|
|
|
245 >
|
|
|
246 </a>
|
|
|
247 </div>
|
|
|
248
|
|
|
249 <div class="button">
|
|
|
250 <a
|
|
|
251 class="icon"
|
|
|
252 href="javascript:gotoPage('+1')"
|
|
|
253 >
|
|
|
254
|
|
|
255 <img
|
|
|
256 class="png"
|
|
|
257 id="fwd"
|
|
401
|
258
|
|
400
|
259 title="goto next image"
|
|
|
260 src="fwd.png"
|
|
|
261 >
|
|
|
262 </a>
|
|
|
263 </div>
|
|
|
264
|
|
|
265 <div class="button">
|
|
|
266 <a
|
|
|
267 class="icon"
|
|
|
268 href="javascript:help()"
|
|
|
269 >
|
|
|
270
|
|
|
271 <img
|
|
|
272 class="png"
|
|
|
273 id="help"
|
|
401
|
274
|
|
400
|
275 title="help"
|
|
|
276 src="help.png"
|
|
|
277 >
|
|
|
278 </a>
|
|
|
279 </div>
|
|
|
280
|
|
|
281 <div class="button">
|
|
|
282 <a
|
|
|
283 class="icon"
|
|
|
284 href="javascript:toggleOptionDiv()"
|
|
|
285 >
|
|
|
286
|
|
|
287 <img
|
|
|
288 class="png"
|
|
|
289 id="options"
|
|
401
|
290
|
|
400
|
291 title="more options"
|
|
|
292 src="options.png"
|
|
|
293 >
|
|
|
294 </a>
|
|
|
295 </div>
|
|
|
296
|
|
|
297 </div>
|
|
|
298
|
|
|
299 <!-- options div -->
|
|
|
300
|
|
|
301 <div id="dloptions">
|
|
|
302 <div class="button">
|
|
|
303 <a
|
|
|
304 class="icon"
|
|
401
|
305 href="javascript:setMark()"
|
|
400
|
306 >
|
|
|
307
|
|
|
308 <img
|
|
|
309 class="png"
|
|
|
310 id="mark"
|
|
401
|
311
|
|
400
|
312 title="set a mark"
|
|
|
313 src="mark.png"
|
|
|
314 >
|
|
|
315 </a>
|
|
|
316 </div>
|
|
|
317
|
|
|
318 <div class="button">
|
|
|
319 <a
|
|
|
320 class="icon"
|
|
|
321 href="javascript:removeMark()"
|
|
|
322 >
|
|
|
323
|
|
|
324 <img
|
|
|
325 class="png"
|
|
|
326 id="delmark"
|
|
401
|
327
|
|
400
|
328 title="delete the last mark"
|
|
|
329 src="delmark.png"
|
|
|
330 >
|
|
|
331 </a>
|
|
|
332 </div>
|
|
|
333
|
|
|
334 <div class="button">
|
|
|
335 <a
|
|
|
336 class="icon"
|
|
|
337 href="javascript:mirror('h')"
|
|
|
338 >
|
|
|
339
|
|
|
340 <img
|
|
|
341 class="png"
|
|
|
342 id="mirror-h"
|
|
401
|
343
|
|
400
|
344 title="mirror horizontally"
|
|
|
345 src="mirror-horizontal.png"
|
|
|
346 >
|
|
|
347 </a>
|
|
|
348 </div>
|
|
|
349
|
|
|
350 <div class="button">
|
|
|
351 <a
|
|
|
352 class="icon"
|
|
|
353 href="javascript:mirror('v')"
|
|
|
354 >
|
|
|
355
|
|
|
356 <img
|
|
|
357 class="png"
|
|
|
358 id="mirror-v"
|
|
401
|
359
|
|
400
|
360 title="mirror vertically"
|
|
|
361 src="mirror-vertical.png"
|
|
|
362 >
|
|
|
363 </a>
|
|
|
364 </div>
|
|
|
365
|
|
|
366 <div class="button">
|
|
|
367 <a
|
|
|
368 class="icon"
|
|
|
369 href="javascript:setParamWin('rot', 'Rotate (0..360) clockwise')"
|
|
|
370 >
|
|
|
371
|
|
|
372 <img
|
|
|
373 class="png"
|
|
|
374 id="rotate"
|
|
401
|
375
|
|
400
|
376 title="rotate image"
|
|
|
377 src="rotate.png"
|
|
|
378 >
|
|
|
379 </a>
|
|
|
380 </div>
|
|
|
381
|
|
|
382 <div class="button">
|
|
|
383 <a
|
|
|
384 class="icon"
|
|
|
385 href="javascript:setParamWin('brgt', 'Brightness (-255..255)')"
|
|
|
386 >
|
|
|
387
|
|
|
388 <img
|
|
|
389 class="png"
|
|
|
390 id="brightness"
|
|
401
|
391
|
|
400
|
392 title="set brightness"
|
|
|
393 src="brightness.png"
|
|
|
394 >
|
|
|
395 </a>
|
|
|
396 </div>
|
|
|
397
|
|
|
398 <div class="button">
|
|
|
399 <a
|
|
|
400 class="icon"
|
|
|
401 href="javascript:setParamWin('cont', 'Contrast (0..8)')"
|
|
|
402 >
|
|
|
403
|
|
|
404 <img
|
|
|
405 class="png"
|
|
|
406 id="contrast"
|
|
401
|
407
|
|
400
|
408 title="set contrast"
|
|
|
409 src="contrast.png"
|
|
|
410 >
|
|
|
411 </a>
|
|
|
412 </div>
|
|
|
413
|
|
|
414 <div class="button">
|
|
|
415 <a
|
|
|
416 class="icon"
|
|
|
417 href="javascript:setParamWin('rgb', '...')"
|
|
|
418 >
|
|
|
419
|
|
|
420 <img
|
|
|
421 class="png"
|
|
|
422 id="rgb"
|
|
401
|
423
|
|
400
|
424 title="set rgb values"
|
|
|
425 src="rgb.png"
|
|
|
426 >
|
|
|
427 </a>
|
|
|
428 </div>
|
|
|
429
|
|
|
430 <div class="button">
|
|
|
431 <a
|
|
|
432 class="icon"
|
|
|
433 href="javascript:setParamWin('size', '...')"
|
|
|
434 >
|
|
|
435
|
|
|
436 <img
|
|
|
437 class="png"
|
|
|
438 id="size"
|
|
401
|
439
|
|
400
|
440 title="resize page"
|
|
|
441 src="size.png"
|
|
|
442 >
|
|
|
443 </a>
|
|
|
444 </div>
|
|
|
445
|
|
|
446 <div class="button">
|
|
|
447 <a
|
|
|
448 class="icon"
|
|
|
449 href="javascript:setQualityWin('Quality (0..2)')"
|
|
|
450 >
|
|
|
451
|
|
|
452 <img
|
|
|
453 class="png"
|
|
|
454 id="quality"
|
|
401
|
455
|
|
400
|
456 title="set image quality"
|
|
|
457 src="quality.png"
|
|
|
458 >
|
|
|
459 </a>
|
|
|
460 </div>
|
|
|
461
|
|
|
462 <div class="button">
|
|
|
463 <a
|
|
|
464 class="icon"
|
|
|
465 href="javascript:gotoPageWin()"
|
|
|
466 >
|
|
|
467
|
|
|
468 <img
|
|
|
469 class="png"
|
|
|
470 id="page"
|
|
401
|
471
|
|
400
|
472 title="specify image"
|
|
|
473 src="page.png"
|
|
|
474 >
|
|
|
475 </a>
|
|
|
476 </div>
|
|
|
477
|
|
|
478 <div class="button">
|
|
|
479 <a
|
|
|
480 class="icon"
|
|
|
481 href="javascript:pixelByPixel()"
|
|
|
482 >
|
|
|
483
|
|
|
484 <img
|
|
|
485 class="png"
|
|
|
486 id="pixel-by-pixel"
|
|
401
|
487
|
|
400
|
488 title="view image pixel by pixel"
|
|
|
489 src="pixel-by-pixel.png"
|
|
|
490 >
|
|
|
491 </a>
|
|
|
492 </div>
|
|
|
493
|
|
|
494 <div class="button">
|
|
|
495 <a
|
|
|
496 class="icon"
|
|
|
497 href="javascript:originalSize()"
|
|
|
498 >
|
|
|
499
|
|
|
500 <img
|
|
|
501 class="png"
|
|
|
502 id="original-size"
|
|
401
|
503
|
|
400
|
504 title="view image in original size"
|
|
|
505 src="original-size.png"
|
|
|
506 >
|
|
|
507 </a>
|
|
|
508 </div>
|
|
|
509
|
|
|
510 <div class="button">
|
|
|
511 <a
|
|
|
512 class="icon"
|
|
|
513 href="javascript:toggleOptionDiv()"
|
|
|
514 >
|
|
|
515
|
|
|
516 <img
|
|
|
517 class="png"
|
|
|
518 id="options-1"
|
|
401
|
519
|
|
400
|
520 title="hide options"
|
|
|
521 src="options.png"
|
|
|
522 >
|
|
|
523 </a>
|
|
|
524 </div>
|
|
|
525 </div>
|
|
|
526
|
|
|
527 </body>
|
|
|
528
|
|
|
529 </html>
|
