changeset 755:4c0cc97a6399 jquery

ugly workaround for IE7 image load handler bug
author hertzhaft
date Sun, 06 Feb 2011 18:25:41 +0100
parents ce5a0e6b5ee9
children ccf67eaf97ee
files client/digitallibrary/jquery/jquery-test-full.html client/digitallibrary/jquery/jquery.digilib.js
diffstat 2 files changed, 28 insertions(+), 11 deletions(-) [+]
line wrap: on
line diff
--- a/client/digitallibrary/jquery/jquery-test-full.html	Sun Feb 06 00:12:47 2011 +0100
+++ b/client/digitallibrary/jquery/jquery-test-full.html	Sun Feb 06 18:25:41 2011 +0100
@@ -9,6 +9,18 @@
                  background: silver;
             }
 
+            #debug {
+                background-color: beige;
+                position: absolute;
+                opacity: 50%;
+                top: 4px;
+                left: 300px;
+                width: 500px;
+                padding: 0px 5px;
+                font-family: Arial;
+                font-size: 9px;
+                }
+
         </style>
 
         <script type="text/javascript" src="jquery-1.4.4.js"></script>
@@ -35,6 +47,7 @@
         <div id="digilib-1" class="digilib">
             <img src="http://digilib.biblhertz.it/digilib04/servlet/Scaler?dw=200&amp;dh=200&amp;fn=/digisprint/jquery/FransHals-WillemVanHeythuysen" />
         </div>
+        <div id="debug">DEBUG</div>
     </body>
 </html>
 
--- a/client/digitallibrary/jquery/jquery.digilib.js	Sun Feb 06 00:12:47 2011 +0100
+++ b/client/digitallibrary/jquery/jquery.digilib.js	Sun Feb 06 18:25:41 2011 +0100
@@ -356,7 +356,7 @@
                 // about window creation - TODO: could be deferred? restrict to only one item?
                 setupAboutDiv(data);
                 // drag zoom area around in scaler div 
-                setupZoomDrag(data);
+                // setupZoomDrag(data); // is done in scalerImgLoadedHandler()
             });
         },
 
@@ -1143,10 +1143,13 @@
     // returns function for load event of bird's eye view img
     var birdImgLoadedHandler = function (data) {
         return function () {
-            var $img = $(this);
-            console.debug("birdimg loaded! this=", this, " data=", data);
-            // create Transform from current area and picsize
-            data.birdTrafo = getImgTrafo($img, FULL_AREA);
+            var $birdImg = $(this);
+            var birdRect = geom.rectangle($birdImg);
+            console.debug("birdImg loaded!", $birdImg, "rect=", birdRect, "data=", data);
+            if (birdRect.width === 0) {
+                // malheureusement IE7 calls load handler when there is no size info yet 
+                setTimeout(function () { $birdImg.triggerHandler('load') }, 200);
+                }
             // display red indicator around zoomarea
             renderBirdArea(data);
             // enable click and drag
@@ -1185,9 +1188,10 @@
         } else {
             $birdZoom.show();
         }
-        // position may have changed
+        // create Transform from current area and picsize
         data.birdTrafo = getImgTrafo(data.$birdImg, FULL_AREA);
         var zoomRect = data.birdTrafo.transform(zoomArea);
+        console.debug("renderBirdArea:", zoomRect, "zoomArea:", zoomArea, "$birdTrafo:", data.birdTrafo);
         // acount for border width
         zoomRect.addPosition({x : -2, y : -2});
         if (data.settings.interactionMode === 'fullscreen') {
@@ -1198,10 +1202,11 @@
             // correct offsetParent because animate doesn't use offset
             var ppos = $birdZoom.offsetParent().offset();
             var dest = {
-                    left : (zoomRect.x - ppos.left) + 'px',
-                    top : (zoomRect.y - ppos.top) + 'px',
-                    width : zoomRect.width,
-                    height : zoomRect.height};
+                left : (zoomRect.x - ppos.left) + 'px',
+                top : (zoomRect.y - ppos.top) + 'px',
+                width : zoomRect.width,
+                height : zoomRect.height
+                };
             $birdZoom.animate(dest);
         }
     };
@@ -1340,7 +1345,6 @@
             var imgArea = data.imgTrafo.transform(area);
             var offset = imgArea.getPosition().neg();
             offset.add(scalerPos);
-            console.log('offset', offset);
             if (fullRect) {
                 var bgPos = fullRect.getPosition().add(offset);
             } else {