Mercurial > hg > digilib-old
annotate client/digitallibrary/dllib.js @ 329:1b7a6c0b2da8
fixed problems with Netscape4 (silly error by me partly :-)
author | robcast |
---|---|
date | Tue, 02 Nov 2004 20:36:59 +0100 |
parents | 610c7ee770cb |
children | d14782908c37 |
rev | line source |
---|---|
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
1 /* Copyright (C) 2003,2004 IT-Group MPIWG, WTWG Uni Bern and others |
237 | 2 |
3 This program is free software; you can redistribute it and/or | |
4 modify it under the terms of the GNU General Public License | |
5 as published by the Free Software Foundation; either version 2 | |
6 of the License, or (at your option) any later version. | |
7 | |
8 This program is distributed in the hope that it will be useful, | |
9 but WITHOUT ANY WARRANTY; without even the implied warranty of | |
10 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | |
11 GNU General Public License for more details. | |
12 | |
13 You should have received a copy of the GNU General Public License | |
14 along with this program; if not, write to the Free Software | |
15 Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA | |
16 | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
17 Authors: |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
18 Christian Luginbuehl, 01.05.2003 (first version) |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
19 DW 24.03.2004 (Changed for digiLib in Zope) |
317 | 20 Robert Casties, 27.10.2004 |
237 | 21 |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
22 ! Requires baselib.js ! |
237 | 23 |
24 */ | |
25 | |
317 | 26 var dlScriptVersion = "1.0b4"; |
27 | |
28 | |
29 function identify() { | |
30 // used for identifying a digilib instance | |
31 // Relato uses that function - lugi | |
32 return "Digilib 0.6"; | |
33 } | |
34 | |
237 | 35 |
36 /* | |
37 * more parameter handling | |
38 */ | |
39 | |
40 var dlArea = new Rectangle(0.0, 0.0, 1.0, 1.0); | |
41 var dlMaxArea = new Rectangle(0.0, 0.0, 1.0, 1.0); | |
42 | |
43 function parseArea() { | |
44 // returns area Rectangle from current parameters | |
45 return new Rectangle(getParameter("wx"), getParameter("wy"), getParameter("ww"), getParameter("wh")); | |
46 } | |
47 | |
48 function setParamFromArea(rect) { | |
49 // sets digilib wx etc. from rect | |
50 setParameter("wx", cropFloat(rect.x)); | |
51 setParameter("wy", cropFloat(rect.y)); | |
52 setParameter("ww", cropFloat(rect.width)); | |
53 setParameter("wh", cropFloat(rect.height)); | |
54 return true; | |
55 } | |
56 | |
57 var dlTrafo = new Transform(); | |
58 | |
59 function parseTrafo(elem) { | |
60 // returns Transform from current dlArea and picsize | |
61 var picsize = getElementRect(elem); | |
62 var trafo = new Transform(); | |
63 // subtract area offset and size | |
64 trafo.concat(getTranslation(new Position(-dlArea.x, -dlArea.y))); | |
65 trafo.concat(getScale(new Size(1/dlArea.width, 1/dlArea.height))); | |
66 // scale to screen size | |
67 trafo.concat(getScale(picsize)); | |
68 trafo.concat(getTranslation(picsize)); | |
69 // rotate | |
70 //trafo.concat(getRotation(- getParameter("rot"), new Position(0.5*picsize.width, 0.5*picsize.height))); | |
71 // mirror | |
72 //if (hasFlag("hmir")) { | |
73 //trafo.m00 = - trafo.m00; | |
74 //} | |
75 //if (hasFlag("vmir")) { | |
76 //trafo.m11 = - trafo.m11; | |
77 //} | |
78 return trafo; | |
79 } | |
80 | |
81 | |
82 var dlMarks = new Array(); | |
83 | |
84 function parseMarks() { | |
85 // returns marks array from current parameters | |
86 var marks = new Array(); | |
87 var ma; | |
88 var mk = getParameter("mk"); | |
89 if (mk.indexOf(";") >= 0) { | |
90 // old format with ";" | |
91 ma = mk.split(";"); | |
92 } else { | |
93 ma = mk.split(","); | |
94 } | |
95 for (var i = 0; i < ma.length ; i++) { | |
96 var pos = ma[i].split("/"); | |
97 if (pos.length > 1) { | |
98 marks.push(new Position(pos[0], pos[1])); | |
99 } | |
100 } | |
101 return marks; | |
102 } | |
103 | |
104 function getAllMarks() { | |
105 // returns a string with all marks in query format | |
106 var marks = new Array(); | |
107 for (var i = 0; i < dlMarks.length; i++) { | |
108 marks.push(cropFloat(dlMarks[i].x) + "/" + cropFloat(dlMarks[i].y)); | |
109 } | |
110 return marks.join(","); | |
111 } | |
112 | |
113 function addMark(pos) { | |
114 // add a mark | |
115 dlMarks.push(pos); | |
116 setParameter("mk", getAllMarks()); | |
117 return true; | |
118 } | |
119 | |
120 function deleteMark() { | |
121 // delete the last mark | |
122 dlMarks.pop(); | |
123 setParameter("mk", getAllMarks()); | |
124 return true; | |
125 } | |
126 | |
127 var dlFlags = new Object(); | |
128 | |
129 function hasFlag(mode) { | |
130 // returns if mode flag is set | |
131 return (dlFlags[mode]); | |
132 } | |
133 | |
134 function addFlag(mode) { | |
135 // add a mode flag | |
136 dlFlags[mode] = mode; | |
239 | 137 setParameter("mo", getAllFlags()); |
237 | 138 return true; |
139 } | |
140 | |
141 function removeFlag(mode) { | |
142 // remove a mode flag | |
143 if (dlFlags[mode]) { | |
144 delete dlFlags[mode]; | |
145 } | |
239 | 146 setParameter("mo", getAllFlags()); |
237 | 147 return true; |
148 } | |
149 | |
150 function toggleFlag(mode) { | |
151 // change a mode flag | |
152 if (dlFlags[mode]) { | |
153 delete dlFlags[mode]; | |
154 } else { | |
155 dlFlags[mode] = mode; | |
156 } | |
239 | 157 setParameter("mo", getAllFlags()); |
237 | 158 return true; |
159 } | |
160 | |
161 function getAllFlags() { | |
162 // returns a string with all flags in query format | |
163 var fa = new Array(); | |
164 for (var f in dlFlags) { | |
165 if ((f != "")&&(dlFlags[f] != null)) { | |
166 fa.push(f); | |
167 } | |
168 } | |
169 return fa.join(","); | |
170 } | |
171 | |
172 function parseFlags() { | |
173 // sets dlFlags from the current parameters | |
174 var flags = new Object(); | |
175 var fa = getParameter("mo").split(","); | |
176 for (var i = 0; i < fa.length ; i++) { | |
177 var f = fa[i]; | |
178 if (f != "") { | |
179 flags[f] = f; | |
180 } | |
181 } | |
182 return flags; | |
183 } | |
184 | |
185 | |
186 function bestPicSize(elem, inset) { | |
187 // returns a Size with the best image size for the given element | |
188 if (! defined(inset)) { | |
189 inset = 25; | |
190 } | |
191 var ws = getWinSize(); | |
192 var es = getElementPosition(elem); | |
193 if (es) { | |
194 ws.width = ws.width - es.x - inset; | |
195 ws.height = ws.height - es.y - inset; | |
196 } | |
197 return ws; | |
198 } | |
199 | |
200 | |
201 /* ********************************************** | |
202 * digilib specific routines | |
203 * ******************************************** */ | |
204 | |
205 var elemScaler = null; | |
206 var picElem = null; | |
207 | |
238 | 208 |
209 function dl_param_init() { | |
210 // parameter initialisation before onload | |
211 | |
212 // put the query parameters (sans "?") in the parameters array | |
213 parseParameters(location.search.slice(1)); | |
214 // treat special parameters | |
215 dlMarks = parseMarks(); | |
216 dlArea = parseArea(); | |
217 dlFlags = parseFlags(); | |
218 } | |
219 | |
220 | |
237 | 221 function dl_init() { |
238 | 222 // initalisation on load |
237 | 223 elemScaler = getElement("scaler", true); |
224 picElem = getElement("pic", true); | |
225 if (picElem == null && elemScaler) { | |
226 // in N4 pic is in the scaler layer | |
227 picElem = elemScaler.document.images[0]; | |
228 } | |
229 if ((!elemScaler)||(!picElem)) { | |
230 alert("Sorry, zogilib doesn't work here!"); | |
231 return false; | |
232 } | |
233 // give a name to the window containing digilib | |
234 if (defined(dlTarget)&&(dlTarget)) { | |
235 window.name = dlTarget; | |
236 } else { | |
237 window.name = "digilib"; | |
238 } | |
239 // put the query parameters (sans "?") in the parameters array | |
240 parseParameters(location.search.slice(1)); | |
241 // treat special parameters | |
242 dlMarks = parseMarks(); | |
243 dlArea = parseArea(); | |
244 dlFlags = parseFlags(); | |
245 // wait for image to load and display marks | |
246 renderMarks(); | |
247 // done | |
248 focus(); | |
249 return; | |
250 } | |
251 | |
252 | |
253 function display(detail) { | |
254 // redisplay the page | |
255 if (! detail) { | |
256 detail = 9; | |
257 } | |
258 var queryString = getAllParameters(detail); | |
259 location.href = location.protocol + "//" + location.host + location.pathname + "?" + queryString; | |
260 } | |
261 | |
262 | |
263 /* ********************************************** | |
264 * interactive digilib functions | |
265 * ******************************************** */ | |
266 | |
267 | |
268 function renderMarks() { | |
269 // put the visible marks on the image | |
270 var mark_count = dlMarks.length; | |
271 // make shure the image is loaded so we know its size | |
272 if (defined(picElem.complete) && picElem.complete == false && ! browserType.isN4 ) { | |
273 setTimeout("renderMarks()", 100); | |
274 } else { | |
275 dlTrafo = parseTrafo(picElem); | |
276 for (var i = 0; i < 8; i++) { | |
277 var me = getElement("dot"+i); | |
278 if (i < mark_count) { | |
279 if (dlArea.containsPosition(dlMarks[i])) { | |
280 var mpos = dlTrafo.transform(dlMarks[i]); | |
281 // suboptimal to place -5 pixels and not half size of mark-image | |
282 mpos.x = mpos.x -5; | |
283 mpos.y = mpos.y -5; | |
284 moveElement(me, mpos); | |
285 showElement(me, true); | |
286 } | |
287 } else { | |
288 // hide the other marks | |
289 showElement(me, false); | |
290 } | |
291 } | |
292 } | |
293 } | |
294 | |
295 | |
239 | 296 function setMark(reload) { |
237 | 297 // add a mark where clicked |
298 if ( dlMarks.length > 7 ) { | |
299 alert("Only 8 marks are possible at the moment!"); | |
300 return; | |
301 } | |
317 | 302 window.focus(); |
237 | 303 |
304 function markEvent(evt) { | |
305 // event handler adding a new mark | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
306 unregisterEvent("mousedown", elemScaler, markEvent); |
237 | 307 var p = dlTrafo.invtransform(evtPosition(evt)); |
308 addMark(p); | |
239 | 309 if (defined(reload)&&(!reload)) { |
310 // don't redisplay | |
311 renderMarks(); | |
312 return; | |
313 } | |
237 | 314 display(); |
315 } | |
316 | |
317 // starting event capture | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
318 registerEvent("mousedown", elemScaler, markEvent); |
237 | 319 } |
320 | |
321 | |
239 | 322 function removeMark(reload) { |
323 // remove the last mark | |
324 deleteMark(); | |
325 if (defined(reload)&&(!reload)) { | |
326 // don't redisplay | |
327 renderMarks(); | |
328 return; | |
329 } | |
330 display(); | |
331 } | |
332 | |
333 | |
237 | 334 function zoomArea() { |
335 var click = 1; | |
336 var pt1, pt2; | |
337 var eck1pos, eck2pos, eck3pos, eck4pos; | |
338 window.focus(); | |
339 var eck1 = getElement("eck1"); | |
340 var eck2 = getElement("eck2"); | |
341 var eck3 = getElement("eck3"); | |
342 var eck4 = getElement("eck4"); | |
343 | |
344 function zoomClick(evt) { | |
345 // mouse click handler | |
346 if (click == 1) { | |
347 // first click -- start moving | |
348 click = 2; | |
349 pt1 = evtPosition(evt); | |
350 pt2 = pt1; | |
351 eck1pos = pt1; | |
352 eck2pos = new Position(pt1.x - 12, pt1.y); | |
353 eck3pos = new Position(pt1.x, pt1.y - 12); | |
354 eck4pos = new Position(pt1.y - 12, pt1.y - 12); | |
355 moveElement(eck1, eck1pos); | |
356 moveElement(eck2, eck2pos); | |
357 moveElement(eck3, eck3pos); | |
358 moveElement(eck4, eck4pos); | |
359 showElement(eck1, true); | |
360 showElement(eck2, true); | |
361 showElement(eck3, true); | |
362 showElement(eck4, true); | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
363 // show moving |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
364 registerEvent("mousemove", elemScaler, zoomMove); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
365 registerEvent("mousemove", eck4, zoomMove); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
366 // enable drag-to-zoom |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
367 registerEvent("mouseup", elemScaler, zoomClick); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
368 registerEvent("mouseup", eck4, zoomClick); |
237 | 369 } else { |
370 // second click -- end moving | |
371 pt2 = evtPosition(evt); | |
372 showElement(eck1, false); | |
373 showElement(eck2, false); | |
374 showElement(eck3, false); | |
375 showElement(eck4, false); | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
376 unregisterEvent("mousemove", elemScaler, zoomMove); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
377 unregisterEvent("mousemove", eck4, zoomMove); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
378 unregisterEvent("mousedown", elemScaler, zoomClick); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
379 unregisterEvent("mousedown", eck4, zoomClick); |
237 | 380 var p1 = dlTrafo.invtransform(pt1); |
381 var p2 = dlTrafo.invtransform(pt2); | |
382 var ww = p2.x-p1.x; | |
383 var wh = p2.y-p1.y; | |
384 if ((ww > 0)&&(wh > 0)) { | |
385 setParameter("wx", cropFloat(p1.x)); | |
386 setParameter("wy", cropFloat(p1.y)); | |
387 setParameter("ww", cropFloat(ww)); | |
388 setParameter("wh", cropFloat(wh)); | |
389 parseArea(); | |
390 // zoomed is always fit | |
391 setParameter("ws", 1); | |
392 display(); | |
393 } | |
394 } | |
395 } | |
396 | |
397 function zoomMove(evt) { | |
398 // mouse move handler | |
399 pt2 = evtPosition(evt); | |
400 // restrict marks to move right and down | |
401 eck1pos = pt1; | |
402 eck2pos = new Position(Math.max(pt1.x, pt2.x)-12, pt1.y); | |
403 eck3pos = new Position(pt1.x, Math.max(pt1.y, pt2.y)-12); | |
404 eck4pos = new Position(Math.max(pt1.x, pt2.x)-12, Math.max(pt1.y, pt2.y)-12); | |
405 moveElement(eck1, eck1pos); | |
406 moveElement(eck2, eck2pos); | |
407 moveElement(eck3, eck3pos); | |
408 moveElement(eck4, eck4pos); | |
409 } | |
410 | |
411 // starting event capture | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
412 registerEvent("mousedown", elemScaler, zoomClick); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
413 registerEvent("mousedown", eck4, zoomClick); |
237 | 414 } |
415 | |
416 var ZOOMFACTOR = Math.sqrt(2); | |
417 | |
418 function zoomBy(factor) { | |
419 // zooms by the given factor | |
239 | 420 var newarea = dlArea.copy(); |
237 | 421 newarea.width /= factor; |
422 newarea.height /= factor; | |
423 newarea.x -= 0.5 * (newarea.width - dlArea.width); | |
424 newarea.y -= 0.5 * (newarea.height - dlArea.height); | |
425 newarea = dlMaxArea.fit(newarea); | |
426 setParamFromArea(newarea); | |
427 display(); | |
428 } | |
429 | |
430 | |
431 function zoomFullpage() { | |
432 // zooms out to show the whole image | |
433 setParameter("wx", 0.0); | |
434 setParameter("wy", 0.0); | |
435 setParameter("ww", 1.0); | |
436 setParameter("wh", 1.0); | |
437 display(); | |
438 } | |
439 | |
440 | |
441 function moveCenter() { | |
442 // move visible area so that it's centered around the clicked point | |
443 if ( (dlArea.width == 1.0) && (dlArea.height == 1.0) ) { | |
444 // noting to do | |
445 return; | |
446 } | |
447 window.focus(); | |
448 | |
449 function moveCenterEvent(evt) { | |
450 // move to handler | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
451 unregisterEvent("mousedown", elemScaler, moveCenterEvent); |
237 | 452 var pt = dlTrafo.invtransform(evtPosition(evt)); |
453 var newarea = new Rectangle(pt.x-0.5*dlArea.width, pt.y-0.5*dlArea.height, dlArea.width, dlArea.height); | |
454 newarea = dlMaxArea.fit(newarea); | |
455 // set parameters | |
456 setParamFromArea(newarea); | |
457 parseArea(); | |
458 display(); | |
459 } | |
460 | |
461 // starting event capture | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
462 registerEvent("mousedown", elemScaler, moveCenterEvent); |
237 | 463 } |
464 | |
243
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
465 function moveBy(movx, movy) { |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
466 // move visible area by movx and movy (in units of dw, dh) |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
467 if ((dlArea.width == 1.0)&&(dlArea.height == 1.0)) { |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
468 // nothing to do |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
469 return; |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
470 } |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
471 var newarea = dlArea.copy(); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
472 newarea.x += parseFloat(movx)*dlArea.width; |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
473 newarea.y += parseFloat(movy)*dlArea.height; |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
474 newarea = dlMaxArea.fit(newarea); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
475 // set parameters |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
476 setParamFromArea(newarea); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
477 parseArea(); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
478 display(); |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
479 } |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
480 |
4dbff786ff50
new digimage with red triangles for moving the zoomed area
robcast
parents:
239
diff
changeset
|
481 |
237 | 482 |
483 | |
238 | 484 function getRef() { |
237 | 485 // returns a reference to the current digilib set |
486 if (! baseUrl) { | |
487 var baseUrl = location.protocol + "//" + location.host + location.pathname; | |
488 } | |
489 var hyperlinkRef = baseUrl; | |
490 var par = getAllParameters(9); | |
491 if (par.length > 0) { | |
492 hyperlinkRef += "?" + par; | |
493 } | |
494 return hyperlinkRef; | |
495 } | |
317 | 496 |
497 function getRefWin(type, msg) { | |
498 // shows an alert with a reference to the current digilib set | |
499 if (! msg) { | |
500 msg = "Link for HTML documents"; | |
501 } | |
502 prompt(msg, getRef()); | |
503 } |