Mercurial > hg > digilib-old

comparison client/digitallibrary/greyskin/dllib.js @ 522:688620e8c015

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
drag zoomed image to new position
author hertzhaft
date Tue, 08 Sep 2009 19:50:27 +0200
parents a113320349c0
children
comparison
equal deleted inserted replaced
521:8b5d012e4d1b 522:688620e8c015
22 Robert Casties, 4.9.2009 22 Robert Casties, 4.9.2009
23 23
24 ! Requires baselib.js ! 24 ! Requires baselib.js !
25 */ 25 */
26 digilibVersion = "Digilib NG"; 26 digilibVersion = "Digilib NG";
27 dllibVersion = "2.041"; 27 dllibVersion = "2.042";
28 28
29 function identify() { 29 function identify() {
30 // used for identifying a digilib instance 30 // used for identifying a digilib instance
31 // Relato uses that function - lugi 31 // Relato uses that function - lugi
32 return digilibVersion; 32 return digilibVersion;
42 } 42 }
43 43
44 function bestPicSize(elem, inset) { 44 function bestPicSize(elem, inset) {
45 // returns a Size with the best image size for the given element 45 // returns a Size with the best image size for the given element
46 if (! defined(inset)) { 46 if (! defined(inset)) {
47 inset = 25; 47 inset = 0;
48 } 48 // original value was 25
49 // digilib seems to use the available space better without inset
50 }
49 var ws = getWinSize(); 51 var ws = getWinSize();
50 var es = getElementPosition(elem); 52 var es = getElementPosition(elem);
51 if (es) { 53 if (es) {
52 ws.width = ws.width - es.x - inset; 54 ws.width = ws.width - es.x - inset;
53 ws.height = ws.height - es.y - inset; 55 ws.height = ws.height - es.y - inset;
350 digilib.showBirdDiv(isBirdDivVisible); 352 digilib.showBirdDiv(isBirdDivVisible);
351 digilib.showArrows(); // show arrow overlays for zoom navigation 353 digilib.showArrows(); // show arrow overlays for zoom navigation
352 //digilib.moveCenter(true); // click to move point to center 354 //digilib.moveCenter(true); // click to move point to center
353 // new Slider("sizes", 1, 5, 2); 355 // new Slider("sizes", 1, 5, 2);
354 356
355 //Drag Image (6.9.2009, not yet working) 357 //Drag Image (8.9.2009)
356 //registerEvent("mousedown", digilib.scalerDiv, dragImage); 358 if (!digilib.isFullArea())
359 registerEvent("mousedown", digilib.scalerDiv, dragImage);
357 360
358 focus(); 361 focus();
359 } 362 }
360 } 363 }
361 364
435 Digilib.prototype.dragImage = function(evt) { 438 Digilib.prototype.dragImage = function(evt) {
436 // drag the image and load a new detail on mouse up 439 // drag the image and load a new detail on mouse up
437 // makes sense only when zoomed 440 // makes sense only when zoomed
438 if (this.isFullArea()) 441 if (this.isFullArea())
439 return; 442 return;
443 if(evt.preventDefault) evt.preventDefault(); // no Firefox drag and drop
444 var digilib = this; // our own reference to this for the local function
440 var startPos = evtPosition(evt); 445 var startPos = evtPosition(evt);
441 var picRect = getElementRect(this.scalerImg); 446 var pic = this.scalerImg;
442 var newRect; // position after drag 447 var picRect = getElementRect(pic);
448 // fit the grey div to the scaler image
449 var div = getElement("bg");
450 var dx = 0;
451 var dy = 0;
452 moveElement(div, picRect);
453 // hide the scaler image, show it as background of div instead
454 showElement(pic, false);
455 showElement(div, true);
456 div.style.backgroundImage = "url(" + pic.src + ")";
457 div.style.cursor = "move";
443 // start event capturing 458 // start event capturing
444 registerEvent("mousemove", document, moveDragEvent); 459 registerEvent("mousemove", document, moveDragEvent);
445 registerEvent("mouseup", document, moveEndEvent); 460 registerEvent("mouseup", document, moveEndEvent);
446 window.focus(); 461 window.focus();
447
448 // our own reference to this for the local function
449 var digilib = this;
450 462
451 function moveDragEvent(evt) { 463 function moveDragEvent(evt) {
452 // mousemove handler: drag 464 // mousemove handler: drag
453 var pos = evtPosition(evt); 465 var pos = evtPosition(evt);
454 var dx = pos.x - startPos.x; 466 // don't use Firefox Drag and Drop feature
455 var dy = pos.y - startPos.y; 467 if(evt.preventDefault) evt.preventDefault();
456 // move scalerImg div 468 dx = pos.x - startPos.x;
457 newRect = new Rectangle( 469 dy = pos.y - startPos.y;
458 picRect.x + dx, 470 // move the background image to the new position
459 picRect.y + dy, 471 div.style.backgroundPosition = dx + "px " + dy + "px";
460 picRect.width,
461 picRect.height);
462 // move scalerImg to new position
463 moveElement(this.scalerImg, newRect);
464 return stopEvent(evt); 472 return stopEvent(evt);
465 } 473 }
466 474
467 function moveEndEvent(evt) { 475 function moveEndEvent(evt) {
468 // mouseup handler: reload page 476 // mouseup handler: reload digilib
477 div.style.cursor = "default";
469 unregisterEvent("mousemove", document, moveDragEvent); 478 unregisterEvent("mousemove", document, moveDragEvent);
470 unregisterEvent("mouseup", document, moveEndEvent); 479 unregisterEvent("mouseup", document, moveEndEvent);
471 if (newRect == null) { // no movement happened 480 // calculate relative offset
472 return stopEvent(evt); 481 var x = -dx / pic.width;
473 } 482 var y = -dy / pic.height;
474 var newX = cropFloat(newRect.x - picRect.x); 483 stopEvent(evt);
475 var newY = cropFloat(newRect.y - picRect.y); 484 if (dx == 0 && dy == 0)
476 // if (newX < 0) newX = 0; 485 return // no movement
477 // if (newY < 0) newY = 0; 486 // reload with scaler image showing the new ausschnitt
478 digilib.params.set("wx", newX); 487 return digilib.moveBy(x, y);
479 digilib.params.set("wy", newY);
480 // zoomed is always fit
481 // digilib.params.set("ws", 1);
482 digilib.display();
483 return stopEvent(evt);
484 } 488 }
485 } 489 }
486 490
487 Digilib.prototype.zoomArea = function() { 491 Digilib.prototype.zoomArea = function() {
488 var pt1, pt2; 492 var pt1, pt2;