Mercurial > hg > digilib-old

changeset 879:b2ec8244b86e jquery

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
arrows: positioning works in embedded mode, too
author hertzhaft
date Thu, 17 Mar 2011 19:21:25 +0100
parents f6e2e6831aaf
children ca6b8c970ea1
files client/digitallibrary/jquery/jquery-test-embedded.html client/digitallibrary/jquery/jquery.digilib.css client/digitallibrary/jquery/jquery.digilib.js
diffstat 3 files changed, 27 insertions(+), 8 deletions(-) [+]
line wrap: on
line diff
--- a/client/digitallibrary/jquery/jquery-test-embedded.html	Thu Mar 17 17:27:07 2011 +0100
+++ b/client/digitallibrary/jquery/jquery-test-embedded.html	Thu Mar 17 19:21:25 2011 +0100
@@ -67,8 +67,7 @@
                     interactionMode : 'embedded',
                     scalerBaseUrl : 'http://digilib.biblhertz.it/digilib04/servlet/Scaler',
                     showRegionNumbers : false,
-                    autoRegionLinks : true,
-                    buttonSettings : { 'embedded' : { buttonSets : [] } } 
+                    autoRegionLinks : true
                     };
                 var $div = $('div.digilib');
                 $div.digilib(opts);
--- a/client/digitallibrary/jquery/jquery.digilib.css	Thu Mar 17 17:27:07 2011 +0100
+++ b/client/digitallibrary/jquery/jquery.digilib.css	Thu Mar 17 19:21:25 2011 +0100
@@ -136,12 +136,17 @@
     text-align: center;
     background-color: black;
     opacity: 0.08;
+    z-index: 200;
     }
 
 div.digilib div.arrows div.button:hover {
     opacity: 0.5;
 }
 
+div.digilib div.arrows div.button a {
+    position: relative;
+}
+
 /* special definitions for fullscreen */
 div.digilib.dl_fullscreen div.buttons {
 	position: fixed;
@@ -149,7 +154,7 @@
 	top: 0px;
 	padding: 2px;
 	background-color: transparent;
-	z-index: 100;
+	z-index: 200;
 }
 
 div.digilib.dl_fullscreen div.buttons div.button:hover {
--- a/client/digitallibrary/jquery/jquery.digilib.js	Thu Mar 17 17:27:07 2011 +0100
+++ b/client/digitallibrary/jquery/jquery.digilib.js	Thu Mar 17 19:21:25 2011 +0100
@@ -1125,6 +1125,7 @@
         if (!show) return;
         var mode = settings.interactionMode;
         var arrowNames = settings.buttonSettings[mode].arrowSet;
+        if (arrowNames == null) return;
         // arrow divs are marked with class "keep"
         var $arrowsDiv = $('<div class="keep arrows"/>');
         $elem.append($arrowsDiv);
@@ -1137,8 +1138,12 @@
     // size and show arrow overlays, called after scaler img is loaded
     var renderZoomArrows = function (data) {
         var settings = data.settings;
-        if (isFullArea(data.zoomArea) || !settings.showZoomArrows) return;
         var $arrowsDiv = data.$elem.find('div.arrows');
+        if (isFullArea(data.zoomArea) || !settings.showZoomArrows) {
+            $arrowsDiv.hide();
+            return;
+            }
+        $arrowsDiv.show();
         var r = geom.rectangle(data.$scaler);
         // calculate arrow bar width
         var aw = settings.zoomArrowWidth;
@@ -1151,19 +1156,19 @@
                 aw = minWidth;
             }
         }
-        $arrowsDiv.show();
+        // vertical position of left/right image
         var arrowData = [{
             name : 'up',
             rect : geom.rectangle(r.x, r.y, r.width, aw), 
             show : canMove(data, 0, -1)
         }, {
             name : 'down',
-            rect : geom.rectangle(r.x, r.y + r.height - aw, r.width),
+            rect : geom.rectangle(r.x, r.y + r.height - aw, r.width, aw),
             show : canMove(data, 0, 1)
         }, {
             name : 'left',
             rect : geom.rectangle(r.x, r.y, aw, r.height),
-            show : canMove(data, -1, 0)
+            show : canMove(data, -1, 0),
         }, {
             name : 'right',
             rect : geom.rectangle(r.x + r.width - aw, r.y, aw, r.height),
@@ -1172,12 +1177,22 @@
         // render a single zoom Arrow
         var render = function (i, item) {
             var $arrow = $arrowsDiv.find('div.button-' + item.name);
-            item.rect.adjustDiv($arrow);
             if (item.show) {
                 $arrow.show();
             } else {
                 $arrow.hide();
+                return;
             }
+            var r = item.rect; 
+            r.adjustDiv($arrow);
+            var $a = $arrow.contents('a');
+            var $img = $a.contents('img');
+            $img.width(aw).height(aw);
+            // hack for missing vertical-align
+            if (item.name.match(/left|right/)) {
+                var top = (r.height - $a.height())/2;
+                $a.css({'top' : top}); // position : 'relative'
+                }
         };
         $.each(arrowData, render);
     };