# HG changeset patch
# User robcast
# Date 1325069238 -3600
# Node ID 79cbc4694b14ccbe4c746e7485558e62fcf967c3
# Parent  2b136cdbc6b2edd8c35421063340acd166c91117# Parent  6b49f78ccfd88eb0bb576a26e6e1e9e8aa6ebfb0
Merge with 6b49f78ccfd88eb0bb576a26e6e1e9e8aa6ebfb0

diff -r 6b49f78ccfd8 -r 79cbc4694b14 webapp/src/main/webapp/jquery/jquery.digilib.birdseye.js
--- a/webapp/src/main/webapp/jquery/jquery.digilib.birdseye.js	Tue Dec 27 20:05:53 2011 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.birdseye.js	Wed Dec 28 11:47:18 2011 +0100
@@ -78,7 +78,7 @@
 
     var handleSetup = function (evt) {
         console.debug("birdseye: handleSetup");
-        data = this;
+        var data = this;
         // bird's eye view creation
         if (data.settings.isBirdDivVisible) {
             setupBirdDiv(data);
@@ -88,7 +88,7 @@
 
     var handleUpdate = function (evt) {
         console.debug("birdseye: handleUpdate");
-        data = this;
+        var data = this;
         if (data.settings.isBirdDivVisible) {
             renderBirdArea(data);
             setupBirdDrag(data);
@@ -97,7 +97,7 @@
 
     var handleRedisplay = function (evt) {
         console.debug("birdseye: handleRedisplay");
-        data = this;
+        var data = this;
         if (data.settings.isBirdDivVisible) {
             updateBirdDiv(data);
         }
@@ -105,7 +105,7 @@
 
     var handleDragZoom = function (evt, zoomArea) {
         //console.debug("birdseye: handleDragZoom za="+zoomArea);
-        data = this;
+    	var data = this;
         if (data.settings.isBirdDivVisible) {
             setBirdZoom(data, zoomArea);
         }
diff -r 6b49f78ccfd8 -r 79cbc4694b14 webapp/src/main/webapp/jquery/jquery.digilib.js
--- a/webapp/src/main/webapp/jquery/jquery.digilib.js	Tue Dec 27 20:05:53 2011 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.js	Wed Dec 28 11:47:18 2011 +0100
@@ -364,6 +364,8 @@
                         break;
                     }
                 }
+                // check if browser supports AJAX-like URL-replace without reload
+                data.hasAsyncReload = (typeof history.replaceState === 'function');
                 // check digilib base URL
                 if (elemSettings.digilibBaseUrl == null) {
                     if (isFullscreen) {
@@ -404,7 +406,7 @@
                 // create buttons before scaler 
                 for (var i = 0; i < elemSettings.visibleButtonSets; ++i) {
                     showButtons(data, true, i);
-                    }
+                }
                 // create HTML structure for scaler, taking width of buttons div into account
                 setupScalerDiv(data);
                 highlightButtons(data);
@@ -506,6 +508,7 @@
             var delta = geom.position(deltaX, deltaY);
             za.addPosition(delta);
             data.zoomArea = FULL_AREA.fit(za);
+            $(data).trigger('changeZoomArea', za);
             // TODO: improve this calculation
             var deltapix = geom.position(-dx*factor*data.imgRect.width,-dy*factor*data.imgRect.height);
             moveZoomBg(data, fullBgRect, deltapix);
@@ -957,7 +960,7 @@
             // update location.href (browser URL) in fullscreen mode
             var url = getDigilibUrl(data);
             var history = window.history;
-            if (typeof history.replaceState === 'function') {
+            if (data.hasAsyncReload) {
                 console.debug("faking reload to "+url);
                 // change url without reloading (stateObj, title, url)
                 // TODO: we really need to push the state in stateObj and listen to pop-events
@@ -976,6 +979,8 @@
                 		}
                 	}
                 	highlightButtons(data); // TODO: better solution
+                	// invalidate background
+                	data.hasPreviewBg = null;
                 	// send event
                 	$(data).trigger('redisplay');
                 } catch (e) {
@@ -1001,6 +1006,8 @@
         		}
         	}
             highlightButtons(data); // TODO: better solution
+        	// invalidate background
+        	data.hasPreviewBg = null;
             // send event
             $(data).trigger('redisplay');
         }
@@ -1098,7 +1105,9 @@
         $img.addClass('pic');
         data.$scaler = $scaler;
         data.$img = $img;
-        // setup image load handler before setting the src attribute (IE bug)
+        // set up event handlers
+        $(data).on('changeZoomArea', handleChangeZoomArea);
+        // set up image load handler before setting the src attribute (IE bug)
         $img.load(scalerImgLoadedHandler(data));
         $img.error(function () {console.error("error loading scaler image");});
         $img.attr('src', scalerUrl);
@@ -1486,6 +1495,23 @@
         updateDisplay(data);
     };
 
+    // handler for changeZoomArea event
+    var handleChangeZoomArea = function (evt, newZa) {
+    	console.debug("handleChangeZoomArea:", newZa);
+    	var data = this;
+    	if (data.hasPreviewBg == null) {
+    		// no background yet
+            setZoomBg(data);
+    	} else {
+    		// move background
+            // TODO: improve this calculation
+            var deltapix = geom.position(-dx*factor*data.imgRect.width,-dy*factor*data.imgRect.height);
+            moveZoomBg(data, fullBgRect, deltapix);    		
+    	}
+    	
+    };
+    
+    
     // place marks on the image
     var renderMarks = function (data) {
         if (data.$img == null || data.imgTrafo == null) return;
@@ -1630,7 +1656,7 @@
                 var scalerPos = geom.position($scaler);
                 fullRect.addPosition(scalerPos.neg());
                 var url = getBgImgUrl(data);
-                // add background url, size and position
+                // add second background url, size and position (CSS3)
                 scalerCss['background-image'] += ', url(' + url + ')';
                 scalerCss[data.bgSizeName] = 'auto, ' + fullRect.width + 'px ' + fullRect.height + 'px';
                 scalerCss['background-position'] += ', ' + fullRect.x + 'px '+ fullRect.y + 'px';
@@ -1640,14 +1666,16 @@
             }
         }
         $scaler.css(scalerCss);
+        data.hasPreviewBg = true;
+        data.fullBgRect = fullRect;
         return fullRect;
     };
     
     // move zoom background 
-    var moveZoomBg = function(data, fullRect, delta) {
+    var moveZoomBg = function(data, delta) {
         // background position
         var bgPos = delta.x + "px " + delta.y + "px";
-        if (fullRect) {
+        if (data.fullBgRect != null) {
         	// add full-size background position
             var bp = fullRect.getPosition().add(delta);
             bgPos += ', ' + bp.x + "px " + bp.y + "px";
@@ -1658,7 +1686,7 @@
     
     // setup handlers for dragging the zoomed image
     var setupZoomDrag = function(data) {
-        var startPos, delta, fullRect;
+        var startPos, delta;
         var $document = $(document);
         var $data = $(data);
         var $elem = data.$elem;
@@ -1674,7 +1702,7 @@
             startPos = geom.position(evt);
             delta = null;
             // set low res background immediately on mousedown
-            fullRect = setZoomBg(data);
+            setZoomBg(data);
             $document.on("mousemove.dlZoomDrag", dragMove);
             $document.on("mouseup.dlZoomDrag", dragEnd);
             return false;
@@ -1685,7 +1713,7 @@
             var pos = geom.position(evt);
             delta = startPos.delta(pos);
             // position background
-            moveZoomBg(data, fullRect, delta);
+            moveZoomBg(data, delta);
             // send message event with current zoom position
             var za = geom.rectangle($img);
             za.addPosition(delta.neg());
@@ -1702,6 +1730,7 @@
                 // no movement
                 $img.css('visibility', 'visible');
                 $scaler.css({'opacity' : '1', 'background-image' : 'none'});
+                data.hasPreviewBg = null;
                 // unhide marks
                 data.$elem.find('div.mark').show();
                 $(data).trigger('redisplay');
diff -r 6b49f78ccfd8 -r 79cbc4694b14 webapp/src/main/webapp/jquery/jquery.digilib.regions.js
--- a/webapp/src/main/webapp/jquery/jquery.digilib.regions.js	Tue Dec 27 20:05:53 2011 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.regions.js	Wed Dec 28 11:47:18 2011 +0100
@@ -436,7 +436,7 @@
 
     // event handler, reads region parameter and creates region divs
     var handleSetup = function (evt) {
-        data = this;
+        var data = this;
         console.debug("regions: handleSetup", data.settings.rg);
         // regions with content are given in HTML divs
         if (data.settings.hasRegionContent) {
@@ -450,7 +450,7 @@
 
     // event handler, sets buttons and shows regions when scaler img is reloaded
     var handleUpdate = function (evt) {
-        data = this;
+        var data = this;
         console.debug("regions: handleUpdate");
         var settings = data.settings;
         fn.highlightButtons(data, 'regions' , settings.isRegionVisible);
@@ -460,7 +460,7 @@
 
     // event handler, redisplays regions (e.g. in a new position)
     var handleRedisplay = function (evt) {
-        data = this;
+        var data = this;
         console.debug("regions: handleRedisplay");
         // renderRegions(data);
     };
@@ -468,7 +468,7 @@
     // event handler
     var handleDragZoom = function (evt, zoomArea) {
         // console.debug("regions: handleDragZoom, zoomArea:", zoomArea);
-        // data = this;
+        // var data = this;
     };
 
     // plugin installation called by digilib on plugin object.