Mercurial > hg > digilib

comparison client/digitallibrary/greyskin/dllib.js @ 430:fc5b8cade32f

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
bug fixes; added saving status in cookie; added basic screen calibration functionality;
author hertzhaft
date Mon, 09 Jan 2006 17:53:03 +0100
parents ab2557f079fc
children a6af40003a38
comparison
equal deleted inserted replaced
429:61bb8c55ed37 430:fc5b8cade32f
22 22
23 ! Requires baselib.js ! 23 ! Requires baselib.js !
24 24
25 */ 25 */
26 digilibVersion = "Digilib NG"; 26 digilibVersion = "Digilib NG";
27 dllibVersion = "2.0"; 27 dllibVersion = "2.027";
28 isDigilibInitialized = false; // gets set to true in dl_param_init 28 isDigilibInitialized = false; // gets set to true in dl_param_init
29 reloadPage = true; // reload the page when parameters are changed, otherwise update only "src" attribute of scaler img 29 reloadPage = true; // reload the page when parameters are changed, otherwise update only "src" attribute of scaler img
30 30
31 // global variables 31 // global variables
32 dlTrafo = new Transform(); 32 dlTrafo = new Transform();
34 dlArea = null; 34 dlArea = null;
35 dlMarks = null; 35 dlMarks = null;
36 dlFlags = null; 36 dlFlags = null;
37 37
38 // global elements 38 // global elements
39 elemScaler = null; 39 scalerDiv = null;
40 picElem = null; 40 scalerImg = null;
41
42 41
43 // flags for parameter sets 42 // flags for parameter sets
44 PARAM_FILE = 1; 43 PARAM_FILE = 1;
45 PARAM_MODE = 2; 44 PARAM_MODE = 2;
46 PARAM_SIZE = 4; 45 PARAM_DIM = 4;
47 PARAM_IMAGE = 8; 46 PARAM_IMAGE = 8;
48 PARAM_DPI = 16; 47 PARAM_DPI = 16;
49 PARAM_MARK = 32; 48 PARAM_MARK = 32;
50 PARAM_PAGES = 64; 49 PARAM_PAGES = 64;
51 PARAM_ALL = PARAM_FILE | PARAM_MODE | PARAM_SIZE | PARAM_IMAGE | PARAM_DPI | PARAM_MARK | PARAM_PAGES; 50 PARAM_SIZE = 128;
51 PARAM_ALL = PARAM_FILE | PARAM_MODE | PARAM_DIM | PARAM_IMAGE | PARAM_DPI | PARAM_MARK | PARAM_PAGES | PARAM_SIZE;
52 52
53 // mouse drag area that counts as one click 53 // mouse drag area that counts as one click
54 MIN_AREA_SIZE = 3 * 3 + 1; 54 MIN_AREA_SIZE = 3 * 3 + 1;
55 55
56 // standard zoom factor 56 // standard zoom factor
60 BIRD_MAXX = 100; 60 BIRD_MAXX = 100;
61 BIRD_MAXY = 100; 61 BIRD_MAXY = 100;
62 62
63 // with of arrow bars 63 // with of arrow bars
64 ARROW_WIDTH = 32; 64 ARROW_WIDTH = 32;
65
66 // with of calibration bar
67 CALIBRATION_WIDTH = 64;
65 68
66 function identify() { 69 function identify() {
67 // used for identifying a digilib instance 70 // used for identifying a digilib instance
68 // Relato uses that function - lugi 71 // Relato uses that function - lugi
69 return digilibVersion; 72 return digilibVersion;
75 function initParameters() { 78 function initParameters() {
76 // file 79 // file
77 newParameter('fn', '', PARAM_FILE); 80 newParameter('fn', '', PARAM_FILE);
78 newParameter('pn', '1', PARAM_FILE); 81 newParameter('pn', '1', PARAM_FILE);
79 // mode 82 // mode
80 newParameter('ws', '1.0', PARAM_MODE);
81 newParameter('mo', '', PARAM_MODE); 83 newParameter('mo', '', PARAM_MODE);
82 // relative dimensions of zoomed image 84 // relative dimensions of zoomed image
83 newParameter('wx', '0.0', PARAM_SIZE); 85 newParameter('wx', '0.0', PARAM_DIM);
84 newParameter('wy', '0.0', PARAM_SIZE); 86 newParameter('wy', '0.0', PARAM_DIM);
85 newParameter('ww', '1.0', PARAM_SIZE); 87 newParameter('ww', '1.0', PARAM_DIM);
86 newParameter('wh', '1.0', PARAM_SIZE); 88 newParameter('wh', '1.0', PARAM_DIM);
87 // image manipulation 89 // image manipulation
88 newParameter('brgt', '0.0', PARAM_IMAGE); 90 newParameter('brgt', '0.0', PARAM_IMAGE);
89 newParameter('cont', '0.0', PARAM_IMAGE); 91 newParameter('cont', '0.0', PARAM_IMAGE);
90 newParameter('rot', '0.0', PARAM_IMAGE); 92 newParameter('rot', '0.0', PARAM_IMAGE);
91 newParameter('rgba', '', PARAM_IMAGE); 93 newParameter('rgba', '', PARAM_IMAGE);
96 newParameter('ddpiy', '', PARAM_DPI); 98 newParameter('ddpiy', '', PARAM_DPI);
97 // marks 99 // marks
98 newParameter('mk', '', PARAM_MARK); 100 newParameter('mk', '', PARAM_MARK);
99 // pages total 101 // pages total
100 newParameter('pt', '0', PARAM_PAGES); 102 newParameter('pt', '0', PARAM_PAGES);
101 } 103 // size
104 newParameter('ws', '1.0', PARAM_SIZE);
105 }
102 106
103 function parseArea() { 107 function parseArea() {
104 // returns area Rectangle from current parameters 108 // returns area Rectangle from current parameters
105 return new Rectangle( 109 return new Rectangle(
106 getParameter("wx"), 110 getParameter("wx"),
324 } 328 }
325 329
326 function dl_init() { 330 function dl_init() {
327 // initalisation on load 331 // initalisation on load
328 if (!isDigilibInitialized) dl_param_init(); 332 if (!isDigilibInitialized) dl_param_init();
329 elemScaler = getElement("scaler"); 333 scalerDiv = getElement("scaler");
330 picElem = getElement("pic", true); 334 scalerImg = getElement("pic", true);
331 // in N4 pic is in the scaler layer 335 // in N4 pic is in the scaler layer
332 if (picElem == null && elemScaler) { 336 if (scalerImg == null && scalerDiv) {
333 picElem = elemScaler.document.images[0]; 337 scalerImg = scalerDiv.document.images[0];
334 } 338 }
335 // give a name to the window containing digilib 339 // give a name to the window containing digilib
336 window.name = defined(dlTarget) && dlTarget 340 window.name = defined(dlTarget) && dlTarget
337 ? dlTarget 341 ? dlTarget
338 : "digilib"; 342 : "digilib";
381 /* ********************************************** 385 /* **********************************************
382 * interactive digilib functions 386 * interactive digilib functions
383 * ******************************************** */ 387 * ******************************************** */
384 function renderMarks() { 388 function renderMarks() {
385 // make sure the image is loaded so we know its size 389 // make sure the image is loaded so we know its size
386 if (defined(picElem.complete) && !picElem.complete && !browserType.isN4 ) { 390 if (defined(scalerImg.complete) && !scalerImg.complete && !browserType.isN4 ) {
387 setTimeout("renderMarks()", 100); 391 setTimeout("renderMarks()", 100);
388 return; 392 return;
389 } 393 }
390 // put the visible marks on the image 394 // put the visible marks on the image
391 dlTrafo = parseTrafo(picElem); 395 dlTrafo = parseTrafo(scalerImg);
392 // debugProps(dlArea, "dlArea"); 396 // debugProps(dlArea, "dlArea");
393 for (var i = 0; i < dlMarks.length; i++) { 397 for (var i = 0; i < dlMarks.length; i++) {
394 var div = document.getElementById("mark" + i) || createMarkDiv(i); 398 var div = document.getElementById("mark" + i) || createMarkDiv(i);
395 var mark = dlMarks[i]; 399 var mark = dlMarks[i];
396 // debugProps(mark, "mark"); 400 // debugProps(mark, "mark");
412 416
413 function setMark(reload) { 417 function setMark(reload) {
414 418
415 function markEvent(evt) { 419 function markEvent(evt) {
416 // event handler adding a new mark 420 // event handler adding a new mark
417 unregisterEvent("mousedown", elemScaler, markEvent); 421 unregisterEvent("mousedown", scalerDiv, markEvent);
418 addMark(evt); 422 addMark(evt);
419 if ( defined(reload) && !reload ) { 423 if ( defined(reload) && !reload ) {
420 // don't redisplay 424 // don't redisplay
421 renderMarks(); 425 renderMarks();
422 return; 426 return;
423 } 427 }
424 display(); 428 display();
429 return stopEvent(evt);
425 } 430 }
426 431
427 // add a mark where clicked 432 // add a mark where clicked
428 window.focus(); 433 window.focus();
434 moveCenter(false);
429 // start event capturing 435 // start event capturing
430 registerEvent("mousedown", elemScaler, markEvent); 436 registerEvent("mousedown", scalerDiv, markEvent);
431 } 437 }
432 438
433 function removeMark(reload) { 439 function removeMark(reload) {
434 // remove the last mark 440 // remove the last mark
435 deleteMark(); 441 deleteMark();
444 function zoomArea() { 450 function zoomArea() {
445 var pt1, pt2; 451 var pt1, pt2;
446 var zoomdiv = getElement("zoom"); 452 var zoomdiv = getElement("zoom");
447 var overlay = getElement("overlay"); 453 var overlay = getElement("overlay");
448 // use overlay div to avoid <img> mousemove problems 454 // use overlay div to avoid <img> mousemove problems
449 var rect = getElementRect(picElem); 455 var picRect = getElementRect(scalerImg);
450 // FIX ME: is there a way to query the border width from CSS info? 456 // FIX ME: is there a way to query the border width from CSS info?
451 // rect.x -= 2; // account for overlay borders 457 // rect.x -= 2; // account for overlay borders
452 // rect.y -= 2; 458 // rect.y -= 2;
453 moveElement(overlay, rect); 459 moveElement(overlay, picRect);
454 showElement(overlay, true); 460 showElement(overlay, true);
455 // start event capturing 461 // start event capturing
456 registerEvent("mousedown", overlay, zoomStart); 462 registerEvent("mousedown", overlay, zoomStart);
457 registerEvent("mousedown", elemScaler, zoomStart); 463 registerEvent("mousedown", scalerImg, zoomStart);
458 window.focus(); 464 window.focus();
459 465
460 // mousedown handler: start moving 466 // mousedown handler: start moving
461 function zoomStart(evt) { 467 function zoomStart(evt) {
462 pt1 = evtPosition(evt); 468 pt1 = evtPosition(evt);
463 unregisterEvent("mousedown", overlay, zoomStart); 469 unregisterEvent("mousedown", overlay, zoomStart);
464 unregisterEvent("mousedown", elemScaler, zoomStart); 470 unregisterEvent("mousedown", scalerImg, zoomStart);
465 // unregisterEvent("mousedown", zoomdiv, zoomStart);
466 // setup and show zoom div 471 // setup and show zoom div
467 moveElement(zoomdiv, Rectangle(pt1.x, pt1.y, 0, 0)); 472 moveElement(zoomdiv, Rectangle(pt1.x, pt1.y, 0, 0));
468 showElement(zoomdiv, true); 473 showElement(zoomdiv, true);
469 // register move events 474 // register events
470 registerEvent("mousemove", overlay, zoomMove); 475 registerEvent("mousemove", document, zoomMove);
471 registerEvent("mousemove", zoomdiv, zoomMove); 476 registerEvent("mouseup", document, zoomEnd);
472 registerEvent("mousemove", elemScaler, zoomMove);
473 // register up events for drag end
474 registerEvent("mouseup", overlay, zoomEnd);
475 registerEvent("mouseup", zoomdiv, zoomEnd);
476 registerEvent("mouseup", elemScaler, zoomEnd);
477 return stopEvent(evt); 477 return stopEvent(evt);
478 } 478 }
479 479
480 // mouseup handler: end moving 480 // mouseup handler: end moving
481 function zoomEnd(evt) { 481 function zoomEnd(evt) {
482 pt2 = evtPosition(evt); 482 pt2 = evtPosition(evt);
483 // assume a click if the area is too small (up to 3 x 3 pixel) 483 // assume a click if the area is too small (up to 3 x 3 pixel)
484 var clickArea = getRect(pt1, pt2).getArea(); 484 var clickRect = getRect(pt1, pt2);
485 if (clickArea <= MIN_AREA_SIZE) return stopEvent(evt); 485 if (clickRect.getArea() <= MIN_AREA_SIZE) return stopEvent(evt);
486 // hide zoom div 486 // hide zoom div
487 showElement(zoomdiv, false); 487 showElement(zoomdiv, false);
488 showElement(overlay, false); 488 showElement(overlay, false);
489 // unregister move events 489 // unregister events
490 unregisterEvent("mousemove", overlay, zoomMove); 490 unregisterEvent("mousemove", document, zoomMove);
491 unregisterEvent("mousemove", zoomdiv, zoomMove); 491 unregisterEvent("mouseup", document, zoomMove);
492 unregisterEvent("mousemove", elemScaler, zoomMove);
493 // unregister drag events
494 unregisterEvent("mouseup", overlay, zoomEnd);
495 unregisterEvent("mouseup", zoomdiv, zoomEnd);
496 unregisterEvent("mouseup", elemScaler, zoomMove);
497 // calc offsets 492 // calc offsets
493 clickRect.clipTo(picRect);
498 var area = getRect( 494 var area = getRect(
499 // FIX ME: liefert negative x/y Werte, wenn hmir/vmir=1 495 // FIX ME: liefert negative x/y Werte, wenn hmir/vmir=1
500 dlTrafo.invtransform(pt1), 496 dlTrafo.invtransform(clickRect.getPt1()),
501 dlTrafo.invtransform(pt2) 497 dlTrafo.invtransform(clickRect.getPt2())
502 ); 498 );
503 setParameter("wx", cropFloat(area.x)); 499 setParameter("wx", cropFloat(area.x));
504 setParameter("wy", cropFloat(area.y)); 500 setParameter("wy", cropFloat(area.y));
505 setParameter("ww", cropFloat(area.width)); 501 setParameter("ww", cropFloat(area.width));
506 setParameter("wh", cropFloat(area.height)); 502 setParameter("wh", cropFloat(area.height));
512 } 508 }
513 509
514 // mouse move handler 510 // mouse move handler
515 function zoomMove(evt) { 511 function zoomMove(evt) {
516 pt2 = evtPosition(evt); 512 pt2 = evtPosition(evt);
513 var rect = getRect(pt1, pt2);
514 rect.clipTo(picRect);
517 // update zoom div 515 // update zoom div
518 moveElement(zoomdiv, getRect(pt1, pt2)); 516 moveElement(zoomdiv, rect);
519 return stopEvent(evt); 517 return stopEvent(evt);
520 } 518 }
521 519
522 // get a rectangle from two points 520 // get a rectangle from two points
523 function getRect(p1, p2) { 521 function getRect(p1, p2) {
551 setParameter("wh", 1.0); 549 setParameter("wh", 1.0);
552 display(); 550 display();
553 } 551 }
554 552
555 553
556 function moveCenter() { 554 function moveCenter(on) {
557 // move visible area so that it's centered around the clicked point 555 // move visible area so that it's centered around the clicked point
558 if ( (dlArea.width == 1.0) && (dlArea.height == 1.0) ) { 556 if (isFullArea()) return; // nothing to do
559 // nothing to do 557 // starting event capture
560 return; 558 if (on) registerEvent("mousedown", scalerImg, moveCenterEvent);
561 } 559 else unregisterEvent("mousedown", scalerImg, moveCenterEvent);
562 window.focus(); 560 window.focus();
563 561 }
564 function moveCenterEvent(evt) { 562
565 // move to handler 563 function moveCenterEvent(evt) {
566 var pt = dlTrafo.invtransform(evtPosition(evt)); 564 // move to handler
567 var newarea = new Rectangle( 565 var pt = dlTrafo.invtransform(evtPosition(evt));
568 pt.x - 0.5 * dlArea.width, 566 var newarea = new Rectangle(
569 pt.y - 0.5 * dlArea.height, 567 pt.x - 0.5 * dlArea.width,
570 dlArea.width, 568 pt.y - 0.5 * dlArea.height,
571 dlArea.height 569 dlArea.width,
572 ); 570 dlArea.height
573 newarea.stayInside(dlMaxArea); 571 );
574 // newarea = dlMaxArea.fit(newarea); 572 newarea.stayInside(dlMaxArea);
575 // debugProps(newarea, "newarea"); 573 // newarea = dlMaxArea.fit(newarea);
576 // debugProps(dlArea, "dlArea"); 574 // debugProps(newarea, "newarea");
577 if (newarea.equals(dlArea)) return; // keep event handler 575 // debugProps(dlArea, "dlArea");
578 unregisterEvent("mousedown", elemScaler, moveCenterEvent); 576 if (newarea.equals(dlArea)) return; // keep event handler
579 // set parameters 577 unregisterEvent("mousedown", scalerImg, moveCenterEvent);
580 setParamFromArea(newarea); 578 // set parameters
581 parseArea(); 579 setParamFromArea(newarea);
582 display(); 580 parseArea();
583 } 581 display();
584
585 // starting event capture
586 registerEvent("mousedown", elemScaler, moveCenterEvent);
587 } 582 }
588 583
589 function isFullArea(area) { 584 function isFullArea(area) {
590 if (!area) area = dlArea; 585 if (!area) area = dlArea;
591 return ((area.width == 1.0) && (area.height == 1.0)); 586 return ((area.width == 1.0) && (area.height == 1.0));
592 } 587 }
593 588
594 function canMove(movx, movy) { 589 function canMove(movx, movy) {
595 if (isFullArea()) return false; 590 if (isFullArea()) return false;
591 var x2 = dlArea.x + dlArea.width;
592 var y2 = dlArea.y + dlArea.height;
596 // debugProps(dlArea); 593 // debugProps(dlArea);
597 return ((movx < 0) && (dlArea.x > 0)) 594 return ((movx < 0) && (dlArea.x > 0))
598 || ((movy < 0) && (dlArea.y > 0)) 595 || ((movx > 0) && (x2 < 1.0))
599 || ((movx > 0) && (dlArea.x + dlArea.width < 1.0)) 596 || ((movy < 0) && (dlArea.y > 0))
600 || ((movy > 0) && (dlArea.y + dlArea.height < 1.0)) 597 || ((movy > 0) && (y2 < 1.0))
601 } 598 }
602 599
603 function moveBy(movx, movy) { 600 function moveBy(movx, movy) {
604 // move visible area by movx and movy (in units of ww, wh) 601 // move visible area by movx and movy (in units of ww, wh)
605 if (!canMove(movx, movy)) return; // nothing to do 602 if (!canMove(movx, movy)) return; // nothing to do
606 var newarea = dlArea.copy(); 603 var newarea = dlArea.copy();
723 var elem = getElement("about"); 720 var elem = getElement("about");
724 if (elem == null) { 721 if (elem == null) {
725 if (!show) return; 722 if (!show) return;
726 alert("About Digilib - dialog missing in HTML code!" 723 alert("About Digilib - dialog missing in HTML code!"
727 + "\nDigilib Version: " + digilibVersion 724 + "\nDigilib Version: " + digilibVersion
725 + "\JSP Version: " + jspVersion
728 + "\ndlLib Version: " + dllibVersion 726 + "\ndlLib Version: " + dllibVersion
729 + "\nbaseLib Version: " + baseLibVersion); 727 + "\nbaseLib Version: " + baseLibVersion);
730 return; 728 return;
731 } 729 }
732 document.getElementById("digilib-version").innerHTML = "Digilib Version: " + digilibVersion; 730 document.getElementById("digilib-version").innerHTML = "Digilib Version: " + digilibVersion;
731 document.getElementById("jsp-version").innerHTML = "JSP Version: " + jspVersion;
733 document.getElementById("baselib-version").innerHTML = "baseLib Version: " + baseLibVersion; 732 document.getElementById("baselib-version").innerHTML = "baseLib Version: " + baseLibVersion;
734 document.getElementById("dllib-version").innerHTML = "dlLib Version: " + dllibVersion; 733 document.getElementById("dllib-version").innerHTML = "dlLib Version: " + dllibVersion;
735 showElement(elem, show); 734 showElement(elem, show);
736 } 735 }
737 736
738 function loadBirdImage() { 737 function loadBirdImage() {
739 var img = getElement("bird-image"); 738 var img = getElement("bird-image");
740 var src = "../servlet/Scaler?" 739 var src = "../servlet/Scaler?"
741 + getQueryString(PARAM_FILE | PARAM_MODE) 740 + getQueryString(PARAM_FILE)
742 + "&dw=" + BIRD_MAXX 741 + "&dw=" + BIRD_MAXX
743 + "&dh=" + BIRD_MAXY; 742 + "&dh=" + BIRD_MAXY;
744 img.src = src; 743 img.src = src;
745 } 744 }
746 745
747 function showBirdDiv(show) { 746 function showBirdDiv(show) {
748 // show or hide "bird's eye" div 747 // show or hide "bird's eye" div
749 var startPos; // anchor for dragging 748 var startPos; // anchor for dragging
750 var newRect; // position after drag 749 var newRect; // position after drag
751 var birdImg = getElement("bird-image"); 750 var birdImg = getElement("bird-image");
751 var birdArea = getElement("bird-area");
752 var overlay = getElement("overlay");
752 showElement(birdImg, show); 753 showElement(birdImg, show);
753 var birdArea = getElement("bird-area"); 754 // dont show selector if area has full size
754 // dont show selector if area is full size
755 if (!show || isFullArea()) { 755 if (!show || isFullArea()) {
756 // hide area 756 // hide area
757 showElement(birdArea, false); 757 showElement(birdArea, false);
758 showElement(overlay, false);
758 return; 759 return;
759 }; 760 };
760 var birdImgRect = getElementRect(birdImg); 761 var birdImgRect = getElementRect(birdImg);
761 var area = parseArea(); 762 var area = parseArea();
762 // scale area down to img size 763 // scale area down to img size
766 birdImgRect.y + birdImgRect.height * area.y, 767 birdImgRect.y + birdImgRect.height * area.y,
767 birdImgRect.width * area.width, 768 birdImgRect.width * area.width,
768 birdImgRect.height * area.height 769 birdImgRect.height * area.height
769 ); 770 );
770 moveElement(birdArea, birdAreaRect); 771 moveElement(birdArea, birdAreaRect);
771 showElement(birdArea, show); 772 showElement(birdArea, true);
772 registerEvent("mousedown", birdArea, birdAreaStartDrag); 773 moveElement(overlay, birdImgRect);
774 showElement(overlay, true);
775 registerEvent("mousedown", overlay, birdAreaStartDrag);
776 registerEvent("mousedown", birdImg, birdAreaStartDrag);
773 777
774 function birdAreaStartDrag(evt) { 778 function birdAreaStartDrag(evt) {
775 // mousedown handler: start drag 779 // mousedown handler: start drag
776 startPos = evtPosition(evt); 780 startPos = evtPosition(evt);
777 registerEvent("mousemove", birdArea, birdAreaMove); 781 unregisterEvent("mousedown", overlay, birdAreaStartDrag);
778 registerEvent("mousemove", birdImg, birdAreaMove); 782 unregisterEvent("mousedown", birdImg, birdAreaStartDrag);
779 registerEvent("mouseup", birdArea, birdAreaEndDrag); 783 registerEvent("mousemove", document, birdAreaMove);
780 registerEvent("mouseup", birdImg, birdAreaEndDrag); 784 registerEvent("mouseup", document, birdAreaEndDrag);
781
782 // debugProps(getElementRect(bird)) 785 // debugProps(getElementRect(bird))
783 return stopEvent(evt); 786 return stopEvent(evt);
784 } 787 }
785 788
786 function birdAreaMove(evt) { 789 function birdAreaMove(evt) {
801 return stopEvent(evt); 804 return stopEvent(evt);
802 } 805 }
803 806
804 function birdAreaEndDrag(evt) { 807 function birdAreaEndDrag(evt) {
805 // mouseup handler: reload page 808 // mouseup handler: reload page
806 unregisterEvent("mousemove", birdArea, birdAreaMove); 809 unregisterEvent("mousemove", document, birdAreaMove);
807 unregisterEvent("mouseup", birdArea, birdAreaEndDrag); 810 unregisterEvent("mouseup", document, birdAreaEndDrag);
808 unregisterEvent("mousemove", birdImg, birdAreaMove); 811 showElement(overlay, false);
809 unregisterEvent("mouseup", birdImg, birdAreaEndDrag); 812 if (newRect == null) { // no movement happened
813 startPos = birdAreaRect.getCenter();
814 birdAreaMove(evt); // set center to click position
815 }
810 setParameter("wx", cropFloat((newRect.x - birdImgRect.x) / birdImgRect.width)); 816 setParameter("wx", cropFloat((newRect.x - birdImgRect.x) / birdImgRect.width));
811 setParameter("wy", cropFloat((newRect.y - birdImgRect.y) / birdImgRect.height)); 817 setParameter("wy", cropFloat((newRect.y - birdImgRect.y) / birdImgRect.height));
812 // width and height parameters remain the same
813 // setParameter("ww", cropFloat(newRect.width / birdImgRect.width));
814 // setParameter("ww", cropFloat(newRect.height / birdImgRect.height));
815 // parseArea(); // why?
816 // zoomed is always fit 818 // zoomed is always fit
817 setParameter("ws", 1); 819 setParameter("ws", 1);
818 display(); 820 display();
819 return stopEvent(evt); 821 return stopEvent(evt);
820 } 822 }
825 moveElement(arrow, rect); 827 moveElement(arrow, rect);
826 showElement(arrow, show); 828 showElement(arrow, show);
827 } 829 }
828 830
829 function showArrows() { 831 function showArrows() {
830 if (defined(picElem.complete) && !picElem.complete && !browserType.isN4 ) { 832 if (defined(scalerImg.complete) && !scalerImg.complete && !browserType.isN4 ) {
831 setTimeout("showArrows()", 100); 833 setTimeout("showArrows()", 100);
832 return; 834 return;
833 } 835 }
834 var r = getElementRect(picElem); 836 var r = getElementRect(scalerImg);
835 showArrow('up', 837 showArrow('up',
836 new Rectangle(r.x, r.y, r.width, ARROW_WIDTH), 838 new Rectangle(r.x, r.y, r.width, ARROW_WIDTH),
837 canMove(0, -1) 839 canMove(0, -1)
838 ); 840 );
839 showArrow('down', 841 showArrow('down',
848 new Rectangle(r.x + r.width - ARROW_WIDTH, r.y, ARROW_WIDTH, r.height), 850 new Rectangle(r.x + r.width - ARROW_WIDTH, r.y, ARROW_WIDTH, r.height),
849 canMove(1, 0) 851 canMove(1, 0)
850 ); 852 );
851 } 853 }
852 854
855 function calibrate(direction) {
856 // calibrate screen
857 var startPos; // anchor for dragging
858 var newRect; // position after drag
859 var calDiv = getElement("calibration");
860 var overlay = getElement("overlay");
861 moveElement(overlay, getWinRect());
862 showElement(overlay, true);
863 var xDir = direction == "x";
864 moveCenter(false);
865 registerEvent("mousedown", document, calibrationStartDrag);
866
867 function calibrationStartDrag(evt) {
868 // mousedown handler: start drag
869 startPos = evtPosition(evt);
870 unregisterEvent("mousedown", document, calibrationStartDrag);
871 registerEvent("mousemove", document, calibrationMove);
872 registerEvent("mouseup", document, calibrationEndDrag);
873 registerEvent("mousemove", calDiv, calibrationMove);
874 registerEvent("mouseup", calDiv, calibrationEndDrag);
875 newRect = new Rectangle(
876 startPos.x,
877 startPos.y,
878 xDir ? 1 : CALIBRATION_WIDTH,
879 xDir ? CALIBRATION_WIDTH : 1
880 );
881 // stay within image
882 moveElement(calDiv, newRect);
883 showElement(calDiv, true);
884 // debugProps(getElementRect(bird))
885 return stopEvent(evt);
886 }
887
888 function calibrationMove(evt) {
889 // mousemove handler: drag
890 var pos = evtPosition(evt);
891 var dx = (xDir) ? pos.x - startPos.x : CALIBRATION_WIDTH;
892 var dy = (xDir) ? CALIBRATION_WIDTH : pos.y - startPos.y;
893 // move birdArea div, keeping size
894 newRect = new Rectangle(startPos.x, startPos.y, dx, dy);
895 // stay within image
896 moveElement(calDiv, newRect);
897 showElement(calDiv, true);
898 return stopEvent(evt);
899 }
900
901 function calibrationEndDrag(evt) {
902 // mouseup handler: calibrate
903 unregisterEvent("mousemove", document, calibrationMove);
904 unregisterEvent("mouseup", document, calibrationEndDrag);
905 unregisterEvent("mousemove", calDiv, calibrationMove);
906 unregisterEvent("mouseup", calDiv, calibrationEndDrag);
907 showElement(calDiv, false);
908 showElement(overlay, false);
909 moveCenter(true);
910
911 // TODO: calculate ...
912 return stopEvent(evt);
913 }
914 }
915
916 // :tabSize=4:indentSize=4:noTabs=true:
917