Digilib jQuery: fullscreen

'); + $elem.append($arrowsDiv); + // create all arrow buttons + // TODO: do this without buttons plugin? + $.each(arrowNames, function(i, arrowName) { + digilib.fn.createButton(data, $arrowsDiv, arrowName); + }); + }; + + /** + * size and show arrow overlays, called after scaler img is loaded. + * + */ + var renderZoomArrows = function(data) { + var settings = data.settings; + var $arrowsDiv = data.$elem.find('div.arrows'); + if (digilib.fn.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 + var maxWidth = Math.min(r.width, r.height) / 10; + if (aw > maxWidth) { + aw = maxWidth; + if (aw < minWidth) { + aw = minWidth; + } + } + // vertical position of left/right image + var arrowData = [ { + name : 'up', + rect : geom.rectangle(r.x, r.y, r.width, aw), + show : digilib.fn.canMove(data, 0, -1) + }, { + name : 'down', + rect : geom.rectangle(r.x, r.y + r.height - aw, r.width, aw), + show : digilib.fn.canMove(data, 0, 1) + }, { + name : 'left', + rect : geom.rectangle(r.x, r.y, aw, r.height), + show : digilib.fn.canMove(data, -1, 0) + }, { + name : 'right', + rect : geom.rectangle(r.x + r.width - aw, r.y, aw, r.height), + show : digilib.fn.canMove(data, 1, 0) + } ]; + // render a single zoom Arrow + var render = function(i, item) { + var $arrow = $arrowsDiv.find('div.button-' + item.name); + 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); + }; + + // plugin object with name and init + // shared objects filled by digilib on registration + var plugin = { + name : 'arrows', + install : install, + init : init, + buttons : {}, + actions : {}, + fn : {}, + plugins : {} + }; + + if ($.fn.digilib == null) { + $.error("jquery.digilib.arrows must be loaded after jquery.digilib!"); + } else { + $.fn.digilib('plugin', plugin); + } +})(jQuery); diff -r 9e6355f7df75 -r 66db81af85e1 webapp/src/main/webapp/jquery/jquery.digilib.birdseye.js --- a/webapp/src/main/webapp/jquery/jquery.digilib.birdseye.js Thu Jan 26 22:07:15 2012 +0100 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.birdseye.js Fri Jan 27 12:46:48 2012 +0100 @@ -60,8 +60,10 @@ // add buttons $.extend(digilib.buttons, buttons); // insert in button list -- not elegant - digilib.defaults.buttonSettings.fullscreen.standardSet.splice(9, 0, 'bird'); - digilib.defaults.buttonSettings.embedded.standardSet.splice(5, 0, 'bird'); + if (digilib.defaults.buttonSettings != null) { + digilib.defaults.buttonSettings.fullscreen.standardSet.splice(9, 0, 'bird'); + digilib.defaults.buttonSettings.embedded.standardSet.splice(5, 0, 'bird'); + } }; // plugin initialization diff -r 9e6355f7df75 -r 66db81af85e1 webapp/src/main/webapp/jquery/jquery.digilib.js --- a/webapp/src/main/webapp/jquery/jquery.digilib.js Thu Jan 26 22:07:15 2012 +0100 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.js Fri Jan 27 12:46:48 2012 +0100 @@ -38,7 +38,7 @@ var defaults = { // version of this script - 'version' : 'jquery.digilib.js 2.1b2', + 'version' : 'jquery.digilib.js 2.1.2b1', // logo url 'logoUrl' : 'img/digilib-logo-text1.png', // homepage url (behind logo) @@ -79,14 +79,6 @@ // fullscreen = take parameters from page URL, keep state in page URL // embedded = take parameters from Javascript options, keep state inside object 'interactionMode' : 'fullscreen', - // arrow bar overlays for moving the zoomed area - 'showZoomArrows' : true, - // zoom arrow bar minimal width (for small images) - 'zoomArrowMinWidth' : 6, - // zoom arrow bar standard width - 'zoomArrowWidth' : 32, - // by what percentage should the arrows move the zoomed area? - 'zoomArrowMoveFactor' : 0.5, // is the "about" window shown? 'isAboutDivVisible' : false, // default size of preview image for drag-scroll (same as Bird's Eye View image) @@ -243,8 +235,6 @@ setupScalerDiv(data); // about window creation - TODO: could be deferred? restrict to only one item? setupAboutDiv(data); - // arrow overlays for moving zoomed detail - setupZoomArrows(data); // send setup event $(data).trigger('setup'); }); @@ -346,24 +336,6 @@ redisplay(data); }, - /** move zoomed area - * - * @param data - * @param dx - * @param dy - */ - moveZoomArea : function (data, dx, dy) { - var za = data.zoomArea.copy(); - var factor = data.settings.zoomArrowMoveFactor; - var deltaX = dx * factor * za.width; - var deltaY = dy * factor * za.height; - var delta = geom.position(deltaX, deltaY); - za.addPosition(delta); - za = FULL_AREA.fit(za); - setZoomArea(data, za); - redisplay(data); - }, - /** set a mark by clicking (or giving a position) * * @param data @@ -822,7 +794,7 @@ } }; - /** restrieve digilib options from a cookie + /** retrieve digilib options from a cookie * */ var retrieveOptions = function (data) { @@ -932,7 +904,6 @@ updateImgTrafo(data); renderMarks(data); setupZoomDrag(data); - renderZoomArrows(data); }; /** returns maximum size for scaler img in fullscreen mode. @@ -1036,92 +1007,6 @@ $img.attr('src', scalerUrl); }; - /** create arrow overlays for moving the zoomed area. - * - */ - var setupZoomArrows = function (data) { - var $elem = data.$elem; - var settings = data.settings; - 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 = $('

'); - $elem.append($arrowsDiv); - // create all arrow buttons - // TODO: do this without buttons plugin? - $.each(arrowNames, function(i, arrowName){ - fn.createButton(data, $arrowsDiv, arrowName); - }); - }; - - /** size and show arrow overlays, called after scaler img is loaded. - * - */ - var renderZoomArrows = function (data) { - var settings = data.settings; - 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 - var maxWidth = Math.min(r.width, r.height)/10; - if (aw > maxWidth) { - aw = maxWidth; - if (aw < minWidth) { - aw = minWidth; - } - } - // 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, aw), - show : canMove(data, 0, 1) - }, { - name : 'left', - rect : geom.rectangle(r.x, r.y, aw, r.height), - 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); - 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 * */ @@ -1755,6 +1640,7 @@ redisplay : redisplay, updateDisplay : updateDisplay, showDiv : showDiv, + setZoomArea : setZoomArea, setPreviewBg : setPreviewBg, getImgTrafo : getImgTrafo, getQuality : getQuality,