Mercurial > hg > digilib
annotate client/digitallibrary/greyskin/dllib.js @ 446:8f8d7c1a12b9
experimental intermediary release
- more object-orientation in javascript
- more changes afoot
- reloading works properly
- setting a mark reloads quickly
| author | robcast |
|---|---|
| date | Mon, 23 Jan 2006 18:29:52 +0100 |
| parents | a7bd9e2e1bbe |
| children | c3a36b515a73 |
| rev | line source |
|---|---|
| 396 | 1 /* Copyright (C) 2003,2004 IT-Group MPIWG, WTWG Uni Bern and others |
| 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 | |
| 17 Authors: | |
| 18 Christian Luginbuehl, 01.05.2003 (first version) | |
| 19 DW 24.03.2004 (Changed for digiLib in Zope) | |
| 20 Robert Casties, 8.11.2005 | |
| 407 | 21 Martin Raspe <hertzhaft@biblhertz.it>, 12.12.2005 |
| 396 | 22 |
| 23 ! Requires baselib.js ! | |
| 24 | |
| 25 */ | |
| 407 | 26 digilibVersion = "Digilib NG"; |
| 446 | 27 dllibVersion = "2.040"; |
| 28 | |
| 29 /**************************************************** | |
| 30 * digilib specific classes (must be defined first) | |
| 31 ****************************************************/ | |
| 32 | |
| 33 /* | |
| 34 * Marks class | |
| 35 */ | |
| 36 function Marks() { | |
| 37 return this; | |
| 38 } | |
| 39 // Marks inherits from Array | |
| 40 Marks.prototype = new Array(); | |
| 41 Marks.prototype.parse = function(query) { | |
| 42 this.length = 0; | |
| 43 if (query.indexOf(";") >= 0) { | |
| 44 var pa = query.split(";"); // old format with ";" | |
| 45 } else { | |
| 46 var pa = query.split(","); // new format | |
| 47 } | |
| 48 for (var i = 0; i < pa.length ; i++) { | |
| 49 var pos = pa[i].split("/"); | |
| 50 if (pos.length > 1) this.push(new Position(pos[0], pos[1])); | |
| 51 } | |
| 52 } | |
| 53 Marks.prototype.getAll = function() { | |
| 54 var ma = new Array(); | |
| 55 for (var i = 0; i < this.length; i++) { | |
| 56 ma.push(cropFloat(this[i].x) + "/" + cropFloat(this[i].y)); | |
| 57 } | |
| 58 return ma.join(","); | |
| 59 } | |
| 60 Marks.prototype.addEvent = function(evt) { | |
| 61 // add a mark from a screen event | |
| 62 var pos = dlTrafo.invtransform(evtPosition(evt)); | |
| 63 this.push(pos); | |
| 64 } | |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
65 |
| 446 | 66 /* |
| 67 * DLParameters -- digilibs own parameter class | |
| 68 */ | |
| 69 function DLParameters() { | |
| 70 // flags for parameter sets | |
| 71 this.PARAM_FILE = 1; | |
| 72 this.PARAM_MODE = 2; | |
| 73 this.PARAM_DIM = 4; | |
| 74 this.PARAM_IMAGE = 8; | |
| 75 this.PARAM_DPI = 16; | |
| 76 this.PARAM_SIZE = 32; | |
| 77 this.PARAM_MARK = 64; | |
| 78 this.PARAM_PAGES = 128; | |
| 79 this.PARAM_ALL = 255; | |
| 80 return this; | |
| 81 } | |
| 82 DLParameters.prototype = new Parameters(); | |
| 83 // move the inherited getAll because we need it later | |
| 84 DLParameters.prototype._getAll = Parameters.prototype.getAll; | |
| 85 DLParameters.prototype.getAll = function(paDetail, moDetail) { | |
| 86 // get Flags and Marks first | |
| 87 var mo = dlFlags.getAll(moDetail); | |
| 88 this.set("mo", mo); | |
| 89 var mk = dlMarks.getAll(); | |
| 90 this.set("mk", mk); | |
| 91 var ret = this._getAll(paDetail); | |
| 92 return ret; | |
| 93 } | |
| 94 | |
| 95 /* | |
| 96 * DLModes -- digilibs own flags class | |
| 97 */ | |
| 98 function DLFlags() { | |
| 99 // flags for mode sets | |
| 100 this.MODE_QUAL = 1; | |
| 101 this.MODE_SIZE = 2; | |
| 102 this.MODE_MIR = 4; | |
| 103 this.MODE_OTHER = 128; | |
| 104 this.MODE_ALL = 255; | |
| 105 return this; | |
| 106 } | |
| 107 // inherits from Flags | |
| 108 DLFlags.prototype = new Flags(); | |
| 109 | |
| 110 /******************************** | |
| 111 * global variables | |
| 112 ********************************/ | |
| 113 | |
| 114 var isDigilibInitialized = false; // gets set to true in dl_param_init | |
| 115 | |
| 116 var dlParams; | |
| 117 var dlTrafo; | |
| 118 var dlMaxArea = new Rectangle(0.0, 0.0, 1.0, 1.0); // should be CONST | |
| 119 var dlArea; | |
| 120 var dlFlags; | |
| 121 var dlMarks; | |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
122 |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
123 // global elements |
| 446 | 124 var scalerDiv = null; |
| 125 var scalerImg = null; | |
| 412 | 126 |
| 441 | 127 // default inset (for scalerImg relativ to scalerDiv |
| 128 INSET = 40; // because of scrollbars of main window and scaler [Firefox bug?] | |
| 129 | |
| 446 | 130 /* old parameter function compatibility stuff */ |
| 131 function newParameter(a,b,c) {return dlParams.define(a,b,c)}; | |
| 132 function resetParameter(a) {return dlParams.reset(a)}; | |
| 133 function deleteParameter(a) {return dlParams.remove(a)}; | |
| 134 function getParameter(a) {return dlParams.get(a)}; | |
| 135 function setParameter(a,b,c) {return dlParams.set(a,b,c)}; | |
| 136 function hasParameter(a) {return dlParams.isSet(a)}; | |
| 137 function getAllParameters(a) {return dlParams.getAll(a)}; | |
| 138 getQueryString = getAllParameters; | |
| 139 function parseParameters(a) {return dlParams.parse(a)}; | |
| 140 function getAllMarks() {return dlMarks.getAll()}; | |
| 141 getMarksQueryString = getAllMarks; | |
| 142 function addMark(evt) {return dlMarks.addEvent(evt)}; | |
| 143 function deleteMark() {return dlMarks.pop()}; | |
| 144 function deleteAllMarks() {return dlMarks = new Marks()}; | |
| 145 function hasFlag(mode) {return dlFlags.get(mode)}; | |
| 146 function addFlag(mode) {return dlFlags.set(mode)}; | |
| 147 function removeFlag(mode) {return dlFlags.reset(mode)}; | |
| 148 function toggleFlag(mode) {return dlFlags.toggle(mode)}; | |
| 149 function getAllFlags() {return dlFlags.getAll()}; | |
| 150 | |
| 151 | |
| 412 | 152 |
| 153 // mouse drag area that counts as one click | |
| 154 MIN_AREA_SIZE = 3 * 3 + 1; | |
| 155 | |
| 156 // standard zoom factor | |
| 157 ZOOMFACTOR = Math.sqrt(2); | |
| 158 | |
| 159 // bird's eye view dimensions | |
| 160 BIRD_MAXX = 100; | |
| 161 BIRD_MAXY = 100; | |
| 162 | |
| 163 // with of arrow bars | |
| 164 ARROW_WIDTH = 32; | |
| 396 | 165 |
| 430 | 166 // with of calibration bar |
| 167 CALIBRATION_WIDTH = 64; | |
| 168 | |
| 396 | 169 function identify() { |
| 170 // used for identifying a digilib instance | |
| 171 // Relato uses that function - lugi | |
| 407 | 172 return digilibVersion; |
| 396 | 173 } |
| 446 | 174 |
| 396 | 175 /* |
| 176 * more parameter handling | |
| 177 */ | |
| 178 | |
| 179 function parseArea() { | |
| 180 // returns area Rectangle from current parameters | |
| 407 | 181 return new Rectangle( |
| 446 | 182 dlParams.get("wx"), |
| 183 dlParams.get("wy"), | |
| 184 dlParams.get("ww"), | |
| 185 dlParams.get("wh")); | |
| 186 } | |
| 396 | 187 |
| 188 function setParamFromArea(rect) { | |
| 412 | 189 // sets digilib wx etc. from rect |
| 446 | 190 dlParams.set("wx", cropFloat(rect.x)); |
| 191 dlParams.set("wy", cropFloat(rect.y)); | |
| 192 dlParams.set("ww", cropFloat(rect.width)); | |
| 193 dlParams.set("wh", cropFloat(rect.height)); | |
| 412 | 194 return true; |
| 446 | 195 } |
| 196 | |
| 197 function initParameters() { | |
| 198 // initialisation before onload | |
| 199 if (!baseLibVersion) alert("ERROR: baselib.js not loaded!"); | |
| 200 if (isDigilibInitialized) return false; // dl_param_init was already run | |
| 201 dlParams = new DLParameters(); | |
| 202 dlFlags = new DLFlags(); | |
| 203 dlMarks = new Marks(); | |
| 204 /* request parameters */ | |
| 205 with (dlParams) { | |
| 206 // file | |
| 207 define('fn', '', PARAM_FILE); | |
| 208 define('pn', '1', PARAM_FILE); | |
| 209 // mode | |
| 210 define('mo', '', PARAM_MODE); | |
| 211 // relative dimensions of zoomed image | |
| 212 define('wx', '0.0', PARAM_DIM); | |
| 213 define('wy', '0.0', PARAM_DIM); | |
| 214 define('ww', '1.0', PARAM_DIM); | |
| 215 define('wh', '1.0', PARAM_DIM); | |
| 216 // image manipulation | |
| 217 define('brgt', '0.0', PARAM_IMAGE); | |
| 218 define('cont', '0.0', PARAM_IMAGE); | |
| 219 define('rot', '0.0', PARAM_IMAGE); | |
| 220 define('rgba', '', PARAM_IMAGE); | |
| 221 define('rgbm', '', PARAM_IMAGE); | |
| 222 // resolution | |
| 223 define('ddpi', '', PARAM_DPI); | |
| 224 define('ddpix', '', PARAM_DPI); | |
| 225 define('ddpiy', '', PARAM_DPI); | |
| 226 // marks | |
| 227 define('mk', '', PARAM_MARK); | |
| 228 // pages total | |
| 229 define('pt', '0', PARAM_PAGES); | |
| 230 // size | |
| 231 define('ws', '1.0', PARAM_SIZE); | |
| 412 | 232 } |
| 446 | 233 /* mode flags */ |
| 234 with (dlFlags) { | |
| 235 define('q0', MODE_QUAL); | |
| 236 define('q1', MODE_QUAL); | |
| 237 define('q2', MODE_QUAL); | |
| 238 define('fit', MODE_SIZE); | |
| 239 define('clip', MODE_SIZE); | |
| 240 define('osize', MODE_SIZE); | |
| 241 define('vmir', MODE_MIR); | |
| 242 define('hmir', MODE_MIR); | |
| 243 } | |
| 244 // parse parameters | |
| 245 parseAllParameters(); | |
| 246 isDigilibInitialized = true; | |
| 247 } | |
| 412 | 248 |
| 249 /* ********************************************** | |
| 250 * parse parameters routines | |
| 251 * ******************************************** */ | |
| 396 | 252 |
| 253 function parseTrafo(elem) { | |
| 254 // returns Transform from current dlArea and picsize | |
| 255 var picsize = getElementRect(elem); | |
| 256 var trafo = new Transform(); | |
| 257 // subtract area offset and size | |
| 258 trafo.concat(getTranslation(new Position(-dlArea.x, -dlArea.y))); | |
| 259 trafo.concat(getScale(new Size(1/dlArea.width, 1/dlArea.height))); | |
| 260 // scale to screen size | |
| 261 trafo.concat(getScale(picsize)); | |
| 262 trafo.concat(getTranslation(picsize)); | |
| 412 | 263 // FIX ME: Robert, kannst Du mal nachsehen, ob das folgende tut, was es soll? |
| 446 | 264 // oder gibt es dafuer neuen Code? -- ROC: Bisher funktioniert es nicht! |
| 396 | 265 // rotate |
| 446 | 266 //var rot = getRotation(- dlParams.get("rot"), new Position(0.5*picsize.width, 0.5*picsize.height)); |
| 267 //trafo.concat(rot); | |
| 396 | 268 // mirror |
| 446 | 269 //if (hasFlag("hmir")) trafo.m00 = - trafo.m00; // ?? |
| 270 //if (hasFlag("vmir")) trafo.m11 = - trafo.m11; // ?? | |
| 396 | 271 return trafo; |
| 272 } | |
| 273 | |
| 412 | 274 /* ********************************************** |
| 275 * marks routines | |
| 276 * ******************************************** */ | |
| 277 | |
| 407 | 278 function createMarkDiv(index) { |
| 412 | 279 var div = document.createElement("div"); |
| 280 div.className = "mark"; | |
| 281 div.id = "mark" + index; | |
| 282 div.innerHTML = index + 1; | |
| 283 document.body.appendChild(div); | |
| 284 return div; | |
| 396 | 285 } |
| 286 | |
| 446 | 287 |
| 396 | 288 |
| 289 | |
| 290 function bestPicSize(elem, inset) { | |
| 291 // returns a Size with the best image size for the given element | |
| 292 if (! defined(inset)) { | |
| 293 inset = 25; | |
| 294 } | |
| 295 var ws = getWinSize(); | |
| 296 var es = getElementPosition(elem); | |
| 297 if (es) { | |
| 298 ws.width = ws.width - es.x - inset; | |
| 299 ws.height = ws.height - es.y - inset; | |
| 300 } | |
| 301 return ws; | |
| 302 } | |
| 303 | |
| 304 function setDLParam(e, s, relative) { | |
| 412 | 305 // sets parameter based on HTML event |
| 306 var nam; | |
| 396 | 307 var val; |
| 308 if (s.type && (s.type == "select-one")) { | |
| 309 nam = s.name; | |
| 310 val = s.options[s.selectedIndex].value; | |
| 311 } else if (s.name && s.value) { | |
| 312 nam = s.name; | |
| 313 val = s.value; | |
| 314 } | |
| 315 if (nam && val) { | |
| 446 | 316 dlParams.set(nam, val, relative); |
| 396 | 317 display(); |
| 318 } else { | |
| 319 alert("ERROR: unable to process event!"); | |
| 320 } | |
| 321 return true; | |
| 322 } | |
| 323 | |
| 324 | |
| 325 /* ********************************************** | |
| 326 * digilib specific routines | |
| 327 * ******************************************** */ | |
| 328 | |
| 329 | |
| 407 | 330 function parseAllParameters() { |
| 412 | 331 // put the query parameters (sans "?") in the parameters array |
| 446 | 332 dlParams.parse(location.search.slice(1)); |
| 412 | 333 // treat special parameters |
| 446 | 334 dlMarks.parse(dlParams.get("mk")); |
| 412 | 335 dlArea = parseArea(); |
| 446 | 336 dlFlags.parse(dlParams.get("mo")); |
| 337 } | |
| 407 | 338 |
| 396 | 339 function dl_param_init() { |
| 412 | 340 return true; |
| 446 | 341 } |
| 396 | 342 |
| 343 function dl_init() { | |
| 412 | 344 // initalisation on load |
| 345 if (!isDigilibInitialized) dl_param_init(); | |
| 346 // wait for image to load and display marks | |
| 347 renderMarks(); | |
| 348 // done | |
| 349 focus(); | |
| 446 | 350 } |
| 396 | 351 |
| 446 | 352 function setScalerImage(detail) { |
| 353 // set the scaler image source (needs the browser size) | |
| 354 if (!scalerDiv) scalerDiv = getElement("scaler"); | |
| 355 if (!scalerImg) scalerImg = getElement("pic"); | |
| 356 var picsize = bestPicSize(scalerDiv, 50); | |
| 412 | 357 var src = "../servlet/Scaler?" |
| 446 | 358 + dlParams.getAll(dlParams.PARAM_ALL & ~(dlParams.PARAM_MARK | dlParams.PARAM_PAGES)) |
| 412 | 359 + "&dw=" + picsize.width |
| 360 + "&dh=" + picsize.height; | |
| 361 // debug(src); | |
| 446 | 362 scalerImg.onload = onImgLoad; |
| 363 scalerImg.src = src; | |
| 364 //initScaler(); // dl_init braucht die endgueltigen Masze des pic Elements | |
| 365 } | |
| 396 | 366 |
| 446 | 367 function display(detail, moDetail) { |
| 412 | 368 // redisplay the page |
| 446 | 369 var queryString = dlParams.getAll(detail, moDetail); |
| 370 location.href | |
| 371 = location.protocol + "//" | |
| 372 + location.host | |
| 373 + location.pathname | |
| 374 + "?" + queryString; | |
| 375 } | |
| 396 | 376 |
| 377 /* ********************************************** | |
| 378 * interactive digilib functions | |
| 379 * ******************************************** */ | |
| 380 function renderMarks() { | |
| 412 | 381 // make sure the image is loaded so we know its size |
| 446 | 382 if (!dlTrafo) { |
| 383 alert("ERROR: cannot render marks!"); | |
| 384 return; | |
| 385 } | |
| 412 | 386 // debugProps(dlArea, "dlArea"); |
| 407 | 387 for (var i = 0; i < dlMarks.length; i++) { |
| 446 | 388 var div = getElement("mark" + i, true) || createMarkDiv(i); |
| 389 var mark = dlMarks[i]; | |
| 390 // debugProps(mark, "mark"); | |
| 391 if (dlArea.containsPosition(mark)) { | |
| 392 var mpos = dlTrafo.transform(mark); | |
| 393 // debugProps(mark, "mpos"); | |
| 394 // suboptimal to place -5 pixels and not half size of mark-image | |
| 395 // better not hide the marked spot (MR) | |
| 396 // mpos.x = mpos.x -5; | |
| 397 // mpos.y = mpos.y -5; | |
| 398 moveElement(div, mpos); | |
| 399 showElement(div, true); | |
| 400 } else { | |
| 401 // hide the other marks | |
| 402 showElement(div, false); | |
| 403 } | |
| 396 | 404 } |
| 446 | 405 } |
| 396 | 406 |
| 407 function setMark(reload) { | |
| 408 | |
| 412 | 409 function markEvent(evt) { |
| 410 // event handler adding a new mark | |
| 430 | 411 unregisterEvent("mousedown", scalerDiv, markEvent); |
| 446 | 412 dlMarks.addEvent(evt); |
| 412 | 413 if ( defined(reload) && !reload ) { |
| 414 // don't redisplay | |
| 415 renderMarks(); | |
| 416 return; | |
| 446 | 417 } |
| 412 | 418 display(); |
| 430 | 419 return stopEvent(evt); |
| 446 | 420 } |
| 412 | 421 |
| 422 // add a mark where clicked | |
| 423 window.focus(); | |
| 430 | 424 moveCenter(false); |
| 412 | 425 // start event capturing |
| 430 | 426 registerEvent("mousedown", scalerDiv, markEvent); |
| 446 | 427 } |
| 396 | 428 |
| 429 function removeMark(reload) { | |
| 430 // remove the last mark | |
| 446 | 431 dlMarks.pop(); |
| 396 | 432 if (defined(reload)&&(!reload)) { |
| 433 // don't redisplay | |
| 434 renderMarks(); | |
| 435 return; | |
| 436 } | |
| 437 display(); | |
| 438 } | |
| 439 | |
| 440 function zoomArea() { | |
| 412 | 441 var pt1, pt2; |
| 442 var zoomdiv = getElement("zoom"); | |
| 443 var overlay = getElement("overlay"); | |
| 444 // use overlay div to avoid <img> mousemove problems | |
| 430 | 445 var picRect = getElementRect(scalerImg); |
| 412 | 446 // FIX ME: is there a way to query the border width from CSS info? |
| 447 // rect.x -= 2; // account for overlay borders | |
| 448 // rect.y -= 2; | |
| 430 | 449 moveElement(overlay, picRect); |
| 412 | 450 showElement(overlay, true); |
| 451 // start event capturing | |
| 452 registerEvent("mousedown", overlay, zoomStart); | |
| 430 | 453 registerEvent("mousedown", scalerImg, zoomStart); |
| 412 | 454 window.focus(); |
| 396 | 455 |
| 407 | 456 // mousedown handler: start moving |
| 412 | 457 function zoomStart(evt) { |
| 458 pt1 = evtPosition(evt); | |
| 459 unregisterEvent("mousedown", overlay, zoomStart); | |
| 430 | 460 unregisterEvent("mousedown", scalerImg, zoomStart); |
| 412 | 461 // setup and show zoom div |
| 462 moveElement(zoomdiv, Rectangle(pt1.x, pt1.y, 0, 0)); | |
| 463 showElement(zoomdiv, true); | |
| 430 | 464 // register events |
| 465 registerEvent("mousemove", document, zoomMove); | |
| 466 registerEvent("mouseup", document, zoomEnd); | |
| 412 | 467 return stopEvent(evt); |
| 446 | 468 } |
| 412 | 469 |
| 407 | 470 // mouseup handler: end moving |
| 412 | 471 function zoomEnd(evt) { |
| 472 pt2 = evtPosition(evt); | |
| 473 // assume a click if the area is too small (up to 3 x 3 pixel) | |
| 446 | 474 var clickRect = new Rectangle(pt1, pt2); |
| 475 clickRect.normalize(); | |
| 430 | 476 if (clickRect.getArea() <= MIN_AREA_SIZE) return stopEvent(evt); |
| 412 | 477 // hide zoom div |
| 478 showElement(zoomdiv, false); | |
| 479 showElement(overlay, false); | |
| 430 | 480 // unregister events |
| 481 unregisterEvent("mousemove", document, zoomMove); | |
| 482 unregisterEvent("mouseup", document, zoomMove); | |
| 446 | 483 // clip and transform |
| 430 | 484 clickRect.clipTo(picRect); |
| 446 | 485 var area = dlTrafo.invtransform(clickRect); |
| 486 setParamFromArea(area); | |
| 412 | 487 // zoomed is always fit |
| 446 | 488 dlParams.set("ws", 1); |
| 412 | 489 display(); |
| 490 return stopEvent(evt); | |
| 446 | 491 } |
| 412 | 492 |
| 407 | 493 // mouse move handler |
| 412 | 494 function zoomMove(evt) { |
| 495 pt2 = evtPosition(evt); | |
| 446 | 496 var rect = new Rectangle(pt1, pt2); |
| 497 rect.normalize(); | |
| 430 | 498 rect.clipTo(picRect); |
| 412 | 499 // update zoom div |
| 430 | 500 moveElement(zoomdiv, rect); |
| 412 | 501 return stopEvent(evt); |
| 446 | 502 } |
| 396 | 503 } |
| 504 | |
| 505 function zoomBy(factor) { | |
| 506 // zooms by the given factor | |
| 507 var newarea = dlArea.copy(); | |
| 508 newarea.width /= factor; | |
| 509 newarea.height /= factor; | |
| 510 newarea.x -= 0.5 * (newarea.width - dlArea.width); | |
| 511 newarea.y -= 0.5 * (newarea.height - dlArea.height); | |
| 512 newarea = dlMaxArea.fit(newarea); | |
| 513 setParamFromArea(newarea); | |
| 514 display(); | |
| 515 } | |
| 516 | |
| 517 | |
| 518 function zoomFullpage() { | |
| 519 // zooms out to show the whole image | |
| 446 | 520 dlParams.set("wx", 0.0); |
| 521 dlParams.set("wy", 0.0); | |
| 522 dlParams.set("ww", 1.0); | |
| 523 dlParams.set("wh", 1.0); | |
| 396 | 524 display(); |
| 525 } | |
| 526 | |
| 527 | |
| 430 | 528 function moveCenter(on) { |
| 396 | 529 // move visible area so that it's centered around the clicked point |
| 430 | 530 if (isFullArea()) return; // nothing to do |
| 531 // starting event capture | |
| 532 if (on) registerEvent("mousedown", scalerImg, moveCenterEvent); | |
| 533 else unregisterEvent("mousedown", scalerImg, moveCenterEvent); | |
| 396 | 534 window.focus(); |
| 430 | 535 } |
| 396 | 536 |
| 430 | 537 function moveCenterEvent(evt) { |
| 538 // move to handler | |
| 539 var pt = dlTrafo.invtransform(evtPosition(evt)); | |
| 540 var newarea = new Rectangle( | |
| 541 pt.x - 0.5 * dlArea.width, | |
| 542 pt.y - 0.5 * dlArea.height, | |
| 543 dlArea.width, | |
| 544 dlArea.height | |
| 545 ); | |
| 546 newarea.stayInside(dlMaxArea); | |
| 547 // newarea = dlMaxArea.fit(newarea); | |
| 548 // debugProps(newarea, "newarea"); | |
| 549 // debugProps(dlArea, "dlArea"); | |
| 550 if (newarea.equals(dlArea)) return; // keep event handler | |
| 551 unregisterEvent("mousedown", scalerImg, moveCenterEvent); | |
| 552 // set parameters | |
| 553 setParamFromArea(newarea); | |
| 554 parseArea(); | |
| 555 display(); | |
| 396 | 556 } |
| 557 | |
| 412 | 558 function isFullArea(area) { |
| 559 if (!area) area = dlArea; | |
| 439 | 560 // pixel by pixel is not always full area |
| 561 return (area.width == 1.0) && (area.height == 1.0) && ! hasFlag("clip"); | |
| 430 | 562 } |
| 412 | 563 |
| 564 function canMove(movx, movy) { | |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
565 if (isFullArea()) return false; |
| 430 | 566 var x2 = dlArea.x + dlArea.width; |
| 567 var y2 = dlArea.y + dlArea.height; | |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
568 // debugProps(dlArea); |
| 412 | 569 return ((movx < 0) && (dlArea.x > 0)) |
| 430 | 570 || ((movx > 0) && (x2 < 1.0)) |
| 571 || ((movy < 0) && (dlArea.y > 0)) | |
| 572 || ((movy > 0) && (y2 < 1.0)) | |
| 573 } | |
| 412 | 574 |
| 396 | 575 function moveBy(movx, movy) { |
| 576 // move visible area by movx and movy (in units of ww, wh) | |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
577 if (!canMove(movx, movy)) return; // nothing to do |
| 396 | 578 var newarea = dlArea.copy(); |
| 579 newarea.x += parseFloat(movx)*dlArea.width; | |
| 580 newarea.y += parseFloat(movy)*dlArea.height; | |
| 581 newarea = dlMaxArea.fit(newarea); | |
| 582 // set parameters | |
| 583 setParamFromArea(newarea); | |
| 584 parseArea(); | |
| 585 display(); | |
| 586 } | |
| 587 | |
| 407 | 588 function getRef(baseURL) { |
| 396 | 589 // returns a reference to the current digilib set |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
590 if (!baseUrl) baseUrl |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
591 = location.protocol |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
592 + "//" |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
593 + location.host |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
594 + location.pathname; |
| 396 | 595 var hyperlinkRef = baseUrl; |
| 446 | 596 var params = dlParams.getAll(dlParams.PARAM_ALL & ~(dlParams.PARAM_DPI | dlParams.PARAM_PAGES)); // all without ddpi, pt |
| 407 | 597 if (params.length > 0) hyperlinkRef += "?" + params; |
| 598 return hyperlinkRef; | |
| 446 | 599 } |
| 396 | 600 |
| 601 function getRefWin(type, msg) { | |
| 602 // shows an alert with a reference to the current digilib set | |
| 407 | 603 if (! msg) msg = "URL reference to the current view"; |
| 604 prompt(msg, getRef()); | |
| 446 | 605 } |
| 396 | 606 |
| 607 function getQuality() { | |
| 407 | 608 // returns the current q setting |
| 396 | 609 for (var i = 0; i < 3; i++) { |
| 446 | 610 if (dlFlags.get("q"+i)) return i; |
| 611 } | |
| 407 | 612 return 1 |
| 446 | 613 } |
| 396 | 614 |
| 615 function setQuality(qual) { | |
| 616 // set the image quality | |
| 446 | 617 for (var i = 0; i < 3; i++) dlFlags.reset("q" + i); |
| 618 if ((qual < 0)||(qual > 2)) return alert("Quality setting not supported"); | |
| 619 dlFlags.set("q" + qual); | |
| 396 | 620 display(); |
| 407 | 621 } |
| 396 | 622 |
| 623 function setQualityWin(msg) { | |
| 412 | 624 // dialog for setting quality |
| 625 if (! msg) msg = "Quality (0..2)"; | |
| 626 var q = getQuality(); | |
| 627 var newq = window.prompt(msg, q); | |
| 628 if (newq) setQuality(newq); | |
| 446 | 629 } |
| 396 | 630 |
| 631 function mirror(dir) { | |
| 632 // mirror the image horizontally or vertically | |
| 446 | 633 if (dir == "h") { |
| 634 dlFlags.toggle("hmir"); | |
| 635 } else { | |
| 636 dlFlags.toggle("vmir"); | |
| 637 } | |
| 396 | 638 display(); |
| 639 } | |
| 640 | |
| 641 function gotoPage(gopage, keep) { | |
| 412 | 642 // goto given page nr (+/-: relative) |
| 446 | 643 var oldpn = parseInt(dlParams.get("pn")); |
| 644 dlParams.set("pn", gopage, true); | |
| 645 var pn = parseInt(dlParams.get("pn")); | |
| 412 | 646 if (pn < 1) { |
| 647 alert("No such page! (Page number too low)"); | |
| 446 | 648 dlParams.set("pn", oldpn); |
| 412 | 649 return; |
| 650 } | |
| 446 | 651 if (dlParams.isSet("pt")) { |
| 652 pt = parseInt(dlParams.get("pt")) | |
| 412 | 653 if (pn > pt) { |
| 654 alert("No such page! (Page number too high)"); | |
| 446 | 655 dlParams.set("pn", oldpn); |
| 412 | 656 return; |
| 657 } | |
| 658 } | |
| 659 if (keep) { | |
| 446 | 660 display(dlParams.PARAM_ALL & ~dlParams.PARAM_MARK); // all, no mark |
| 412 | 661 } else { |
| 446 | 662 display(dlParams.PARAM_FILE | dlParams.PARAM_MODE | dlParams.PARAM_PAGES, dlParams.MODE_QUAL | dlParams.MODE_OTHER); // fn, pn, ws, mo + pt |
| 412 | 663 } |
| 396 | 664 } |
| 665 | |
| 666 function gotoPageWin() { | |
| 412 | 667 // dialog to ask for new page nr |
| 446 | 668 var pn = dlParams.get("pn"); |
| 412 | 669 var gopage = window.prompt("Go to page", pn); |
| 670 if (gopage) gotoPage(gopage); | |
| 671 } | |
| 396 | 672 |
| 673 function setParamWin(param, text, relative) { | |
| 412 | 674 // dialog to ask for new parameter value |
| 446 | 675 var val = dlParams.get(param); |
| 412 | 676 var newval = window.prompt(text, val); |
| 677 if (newval) { | |
| 446 | 678 dlParams.set(param, newval, relative); |
| 412 | 679 display(); |
| 680 } | |
| 396 | 681 } |
| 682 | |
| 683 function showOptions(show) { | |
| 412 | 684 // show or hide option div |
| 685 var elem = getElement("dloptions"); | |
| 686 showElement(elem, show); | |
| 687 // FIX ME: get rid of the dotted line around the buttons when focused | |
| 688 } | |
| 407 | 689 |
| 690 function showAboutDiv(show) { | |
| 412 | 691 // show or hide "about" div |
| 692 var elem = getElement("about"); | |
| 693 if (elem == null) { | |
| 439 | 694 if (show) alert("About Digilib - dialog missing in HTML code!" |
| 412 | 695 + "\nDigilib Version: " + digilibVersion |
| 430 | 696 + "\JSP Version: " + jspVersion |
| 412 | 697 + "\ndlLib Version: " + dllibVersion |
| 698 + "\nbaseLib Version: " + baseLibVersion); | |
| 699 return; | |
| 700 } | |
| 439 | 701 if (show) { |
| 702 getElement("digilib-version").innerHTML = "Digilib Version: " + digilibVersion; | |
| 703 getElement("jsp-version").innerHTML = "JSP Version: " + jspVersion; | |
| 704 getElement("baselib-version").innerHTML = "baseLib Version: " + baseLibVersion; | |
| 705 getElement("dllib-version").innerHTML = "dlLib Version: " + dllibVersion; | |
| 706 var aboutRect = getElementRect(elem); | |
| 707 aboutRect.setCenter(getWinRect().getCenter()); | |
| 708 moveElement(elem, aboutRect); | |
| 709 } | |
| 412 | 710 showElement(elem, show); |
| 711 } | |
| 712 | |
| 713 function loadBirdImage() { | |
| 714 var img = getElement("bird-image"); | |
| 715 var src = "../servlet/Scaler?" | |
| 446 | 716 + dlParams.getAll(dlParams.PARAM_FILE) |
| 412 | 717 + "&dw=" + BIRD_MAXX |
| 718 + "&dh=" + BIRD_MAXY; | |
| 719 img.src = src; | |
| 720 } | |
| 721 | |
| 722 function showBirdDiv(show) { | |
| 723 // show or hide "bird's eye" div | |
| 724 var startPos; // anchor for dragging | |
| 725 var newRect; // position after drag | |
| 726 var birdImg = getElement("bird-image"); | |
| 430 | 727 var birdArea = getElement("bird-area"); |
| 728 var overlay = getElement("overlay"); | |
| 412 | 729 showElement(birdImg, show); |
| 430 | 730 // dont show selector if area has full size |
| 412 | 731 if (!show || isFullArea()) { |
| 732 // hide area | |
| 733 showElement(birdArea, false); | |
| 430 | 734 showElement(overlay, false); |
| 412 | 735 return; |
| 736 }; | |
| 737 var birdImgRect = getElementRect(birdImg); | |
| 738 var area = parseArea(); | |
| 739 // scale area down to img size | |
| 740 var birdAreaRect = new Rectangle( | |
| 741 // what about borders ?? | |
| 742 birdImgRect.x + birdImgRect.width * area.x, | |
| 743 birdImgRect.y + birdImgRect.height * area.y, | |
| 744 birdImgRect.width * area.width, | |
| 745 birdImgRect.height * area.height | |
| 746 ); | |
| 747 moveElement(birdArea, birdAreaRect); | |
| 430 | 748 showElement(birdArea, true); |
| 749 moveElement(overlay, birdImgRect); | |
| 750 showElement(overlay, true); | |
| 751 registerEvent("mousedown", overlay, birdAreaStartDrag); | |
| 752 registerEvent("mousedown", birdImg, birdAreaStartDrag); | |
| 412 | 753 |
| 754 function birdAreaStartDrag(evt) { | |
| 755 // mousedown handler: start drag | |
| 756 startPos = evtPosition(evt); | |
| 430 | 757 unregisterEvent("mousedown", overlay, birdAreaStartDrag); |
| 758 unregisterEvent("mousedown", birdImg, birdAreaStartDrag); | |
| 759 registerEvent("mousemove", document, birdAreaMove); | |
| 760 registerEvent("mouseup", document, birdAreaEndDrag); | |
| 412 | 761 // debugProps(getElementRect(bird)) |
| 762 return stopEvent(evt); | |
| 763 } | |
| 764 | |
| 765 function birdAreaMove(evt) { | |
| 766 // mousemove handler: drag | |
| 767 var pos = evtPosition(evt); | |
| 768 var dx = pos.x - startPos.x; | |
| 769 var dy = pos.y - startPos.y; | |
| 770 // move birdArea div, keeping size | |
| 771 newRect = new Rectangle( | |
| 772 birdAreaRect.x + dx, | |
| 773 birdAreaRect.y + dy, | |
| 774 birdAreaRect.width, | |
| 775 birdAreaRect.height); | |
| 776 // stay within image | |
| 777 newRect.stayInside(birdImgRect); | |
| 778 moveElement(birdArea, newRect); | |
| 779 showElement(birdArea, true); | |
| 780 return stopEvent(evt); | |
| 781 } | |
| 782 | |
| 783 function birdAreaEndDrag(evt) { | |
| 784 // mouseup handler: reload page | |
| 430 | 785 unregisterEvent("mousemove", document, birdAreaMove); |
| 786 unregisterEvent("mouseup", document, birdAreaEndDrag); | |
| 787 showElement(overlay, false); | |
| 788 if (newRect == null) { // no movement happened | |
| 789 startPos = birdAreaRect.getCenter(); | |
| 790 birdAreaMove(evt); // set center to click position | |
| 791 } | |
| 446 | 792 dlParams.set("wx", cropFloat((newRect.x - birdImgRect.x) / birdImgRect.width)); |
| 793 dlParams.set("wy", cropFloat((newRect.y - birdImgRect.y) / birdImgRect.height)); | |
| 412 | 794 // zoomed is always fit |
| 446 | 795 dlParams.set("ws", 1); |
| 412 | 796 display(); |
| 797 return stopEvent(evt); | |
| 798 } | |
| 799 } | |
| 800 | |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
801 function showArrow(name, rect, show) { |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
802 var arrow = getElement(name); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
803 moveElement(arrow, rect); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
804 showElement(arrow, show); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
805 } |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
806 |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
807 function showArrows() { |
| 439 | 808 // show the 4 arrow bars on top of scaler img according to current dlArea |
| 430 | 809 if (defined(scalerImg.complete) && !scalerImg.complete && !browserType.isN4 ) { |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
810 setTimeout("showArrows()", 100); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
811 return; |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
812 } |
| 430 | 813 var r = getElementRect(scalerImg); |
|
425
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
814 showArrow('up', |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
815 new Rectangle(r.x, r.y, r.width, ARROW_WIDTH), |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
816 canMove(0, -1) |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
817 ); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
818 showArrow('down', |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
819 new Rectangle(r.x, r.y + r.height - ARROW_WIDTH, r.width, ARROW_WIDTH), |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
820 canMove(0, 1) |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
821 ); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
822 showArrow('left', |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
823 new Rectangle(r.x, r.y, ARROW_WIDTH, r.height), |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
824 canMove(-1, 0) |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
825 ); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
826 showArrow('right', |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
827 new Rectangle(r.x + r.width - ARROW_WIDTH, r.y, ARROW_WIDTH, r.height), |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
828 canMove(1, 0) |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
829 ); |
|
ab2557f079fc
added showArrows() function (navigation arrows overlay)
hertzhaft
parents:
412
diff
changeset
|
830 } |
| 412 | 831 |
| 430 | 832 function calibrate(direction) { |
| 833 // calibrate screen | |
| 834 var startPos; // anchor for dragging | |
| 835 var newRect; // position after drag | |
| 836 var calDiv = getElement("calibration"); | |
| 435 | 837 var pixel = calDiv.getElementsByTagName("p")[0]; |
| 430 | 838 var overlay = getElement("overlay"); |
| 839 moveElement(overlay, getWinRect()); | |
| 840 showElement(overlay, true); | |
| 841 var xDir = direction == "x"; | |
| 842 moveCenter(false); | |
| 843 registerEvent("mousedown", document, calibrationStartDrag); | |
| 844 | |
| 845 function calibrationStartDrag(evt) { | |
| 846 // mousedown handler: start drag | |
| 847 startPos = evtPosition(evt); | |
| 848 unregisterEvent("mousedown", document, calibrationStartDrag); | |
| 849 registerEvent("mousemove", document, calibrationMove); | |
| 850 registerEvent("mouseup", document, calibrationEndDrag); | |
| 851 newRect = new Rectangle( | |
| 852 startPos.x, | |
| 853 startPos.y, | |
| 854 xDir ? 1 : CALIBRATION_WIDTH, | |
| 855 xDir ? CALIBRATION_WIDTH : 1 | |
| 856 ); | |
| 857 moveElement(calDiv, newRect); | |
| 858 showElement(calDiv, true); | |
| 859 // debugProps(getElementRect(bird)) | |
| 860 return stopEvent(evt); | |
| 861 } | |
| 862 | |
| 863 function calibrationMove(evt) { | |
| 864 // mousemove handler: drag | |
| 865 var pos = evtPosition(evt); | |
| 866 var dx = (xDir) ? pos.x - startPos.x : CALIBRATION_WIDTH; | |
| 867 var dy = (xDir) ? CALIBRATION_WIDTH : pos.y - startPos.y; | |
| 868 // move birdArea div, keeping size | |
| 869 newRect = new Rectangle(startPos.x, startPos.y, dx, dy); | |
| 435 | 870 pixel.innerHTML = (xDir ? dx : dy) + " px"; |
| 430 | 871 moveElement(calDiv, newRect); |
| 872 showElement(calDiv, true); | |
| 873 return stopEvent(evt); | |
| 874 } | |
| 875 | |
| 876 function calibrationEndDrag(evt) { | |
| 877 // mouseup handler: calibrate | |
| 878 unregisterEvent("mousemove", document, calibrationMove); | |
| 879 unregisterEvent("mouseup", document, calibrationEndDrag); | |
| 435 | 880 if (xDir) { |
| 881 var val = newRect.width * 0.254; // ratio dm/inch | |
| 882 cookie.add("ddpi", val); | |
| 883 cookie.add("ddpix", val); | |
| 884 } else { | |
| 885 var val = newRect.height * 0.254; | |
| 886 cookie.add("ddpiy", val); | |
| 887 } | |
| 430 | 888 showElement(calDiv, false); |
| 889 showElement(overlay, false); | |
| 890 moveCenter(true); | |
| 891 return stopEvent(evt); | |
| 892 } | |
| 893 } | |
| 894 | |
| 439 | 895 function originalSize(on) { |
| 896 // set osize flag, needs calibrated screen | |
| 897 if (on) { | |
| 898 var dpi = cookie.get("ddpi"); | |
| 899 if (dpi == null) { | |
| 900 alert("Screen has not yet been calibrated - using default value of 72 dpi"); | |
| 901 dpi = 72; | |
| 902 } | |
| 446 | 903 dlParams.set("ddpi", dpi); |
| 439 | 904 addFlag("osize"); |
| 905 display(); | |
| 435 | 906 } |
| 439 | 907 else removeFlag("osize"); |
| 435 | 908 } |
| 909 | |
| 439 | 910 function pixelByPixel(on) { |
| 911 // sets clip flag | |
| 912 if (on) { | |
| 913 addFlag("clip"); | |
| 914 display(); | |
| 915 } | |
| 916 else removeFlag("clip"); | |
| 435 | 917 } |
| 436 | 918 |
| 441 | 919 function pageWidth() { |
| 920 var divSize = getElementSize(scalerDiv); | |
| 921 divSize.width -= INSET; // allow for scrollbars [Firefox bug?] | |
| 922 var imgSize = getElementSize(scalerImg); | |
| 923 if (imgSize.width < divSize.width) { | |
| 446 | 924 dlParams.set("ws", cropFloat(divSize.width / imgSize.width)); |
| 925 display(dlParams.PARAM_ALL & ~dlParams.PARAM_DIM); // no zoom | |
| 441 | 926 }; |
| 927 // TODO: how to calculate correct width if zoom is on? (plus size?) | |
| 928 | |
| 929 } | |
| 930 | |
| 436 | 931 function resize(factor) { |
| 446 | 932 dlParams.set("ws", factor); |
| 439 | 933 showSizeMenu(false); |
| 436 | 934 display(); |
| 935 } | |
| 936 | |
| 439 | 937 function showSizeMenu(show) { |
| 436 | 938 var menu = getElement("sizes"); |
| 439 | 939 if (show) { |
| 940 // align menu with button | |
| 941 var buttonPos = getElementPosition(getElement("size")); | |
| 942 moveElement(menu, new Position(buttonPos.x - 50, buttonPos.y)); | |
| 943 } | |
| 944 showElement(menu, show); | |
| 436 | 945 } |
| 430 | 946 // :tabSize=4:indentSize=4:noTabs=true: |
| 947 |