digilib-old: client/digitallibrary/jquery/jquery.digilib.js comparison

comparison client/digitallibrary/jquery/jquery.digilib.js @ 879:b2ec8244b86e jquery

arrows: positioning works in embedded mode, too

author	hertzhaft
date	Thu, 17 Mar 2011 19:21:25 +0100
parents	f6e2e6831aaf
children	80a695f683c7 cb23fe100d7e

comparison

equal deleted inserted replaced

-:f6e2e6831aaf
+:b2ec8244b86e
 var show = settings.showZoomArrows;
 console.log('zoom arrows:', show);
 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);
 // create all arrow buttons
 $.each(arrowNames, function(i, arrowName){
 };
 // 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;
 var minWidth = settings.zoomArrowMinWidth;
 // arrow bar width should not exceed 10% of scaler width/height
 aw = maxWidth;
 if (aw < minWidth) {
 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),
 show : canMove(data, 1, 0)
 }];
 // 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);
 };
 // creates HTML structure for the about view in elem