Mercurial > hg > digilib
diff client/digitallibrary/jquery/jquery.digilib.birdseye.js @ 788:040e9bc1602e jquery
birds eye view now as a plugin.
digilib now 200 lines less!
author | robcast |
---|---|
date | Fri, 18 Feb 2011 18:58:52 +0100 |
parents | 912519475259 |
children | 32d1d6601968 |
line wrap: on
line diff
--- a/client/digitallibrary/jquery/jquery.digilib.birdseye.js Fri Feb 18 15:18:55 2011 +0100 +++ b/client/digitallibrary/jquery/jquery.digilib.birdseye.js Fri Feb 18 18:58:52 2011 +0100 @@ -16,6 +16,16 @@ } }; + var defaults = { + // is birdView shown? + 'isBirdDivVisible' : false, + // dimensions of bird's eye div + 'birdDivWidth' : 200, + 'birdDivHeight' : 200, + // parameters used by bird's eye div + 'birdDivParams' : ['fn','pn','dw','dh'] + }; + var actions = { // event handler: toggles the visibility of the bird's eye window showBirdDiv : function (data, show) { @@ -24,27 +34,69 @@ // no bird div -> create setupBirdDiv(data); } - var on = showDiv(settings.isBirdDivVisible, data.$birdDiv, show); + var on = digilib.fn.showDiv(settings.isBirdDivVisible, data.$birdDiv, show); settings.isBirdDivVisible = on; - highlightButtons(data, 'bird', on); + digilib.fn.highlightButtons(data, 'bird', on); updateBirdDiv(data); - storeOptions(data); + digilib.fn.storeOptions(data); } }; - // plugin initialization called by digilib on plugin object. - var install = function() { + // plugin installation called by digilib on plugin object. + var install = function(digilib) { // import geometry classes - geom = this.fn.geometry; - FULL_AREA = digilib.fn.FULL_AREA; - // TODO: add actions - // TODO: add buttons - // TODO: add event handlers + geom = digilib.fn.geometry; + FULL_AREA = geom.rectangle(0,0,1,1); + // add defaults + $.extend(digilib.defaults, defaults); + // add actions + $.extend(digilib.actions, actions); + // 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'); + }; + + // plugin initialization + var init = function (data) { + var $data = $(data); + // install event handler + $data.bind('setup', handleSetup); + $data.bind('update', handleUpdate); + $data.bind('dragZoom', handleDragZoom); }; - + + var handleSetup = function (evt) { + console.debug("birdseye: handleSetup"); + data = this; + // bird's eye view creation + if (data.settings.isBirdDivVisible) { + setupBirdDiv(data); + data.$birdDiv.show(); + } + }; + + var handleUpdate = function (evt) { + console.debug("birdseye: handleUpdate"); + data = this; + if (data.settings.isBirdDivVisible) { + renderBirdArea(data); + setupBirdDrag(data); + } + }; + + var handleDragZoom = function (evt, zoomArea) { + //console.debug("birdseye: handleDragZoom za="+zoomArea); + data = this; + if (data.settings.isBirdDivVisible) { + setBirdZoom(data, zoomArea); + } + }; + // returns URL for bird's eye view image - var getBirdImgUrl = function (data, moreParams) { + var getBirdImgUrl = function (data) { var settings = data.settings; var birdDivOptions = { dw : settings.birdDivWidth, @@ -52,23 +104,7 @@ }; var birdSettings = $.extend({}, settings, birdDivOptions); // use only the relevant parameters - if (moreParams == null) { - var params = getParamString(birdSettings, settings.birdDivParams, defaults); - } else { - // filter scaler flags - if (birdSettings.mo != null) { - var mo = ''; - if (data.scalerFlags.hmir != null) { - mo += 'hmir,'; - } - if (data.scalerFlags.vmir != null) { - mo += 'vmir'; - } - birdSettings.mo = mo; - } - var params = getParamString(birdSettings, - settings.birdDivParams.concat(moreParams), defaults); - } + var params = digilib.fn.getParamString(birdSettings, settings.birdDivParams, digilib.defaults); var url = settings.scalerBaseUrl + '?' + params; return url; }; @@ -123,7 +159,7 @@ setTimeout(function () { $birdImg.triggerHandler('load'); }, 200); } // update display (zoom area indicator) - updateDisplay(data); + digilib.fn.updateDisplay(data); }; }; @@ -132,7 +168,7 @@ if (data.$birdImg == null || ! data.$birdImg.get(0).complete) return; var $birdZoom = data.$birdZoom; var zoomArea = data.zoomArea; - var normalSize = isFullArea(zoomArea); + var normalSize = digilib.fn.isFullArea(zoomArea); if (normalSize) { $birdZoom.hide(); return; @@ -140,11 +176,11 @@ $birdZoom.show(); } // create Transform from current area and picsize - data.birdTrafo = getImgTrafo(data.$birdImg, FULL_AREA); + data.birdTrafo = digilib.fn.getImgTrafo(data.$birdImg, FULL_AREA); var zoomRect = data.birdTrafo.transform(zoomArea); console.debug("renderBirdArea:", zoomRect, "zoomArea:", zoomArea, "$birdTrafo:", data.birdTrafo); // acount for border width - var bw = getBorderWidth($birdZoom); + var bw = digilib.fn.getBorderWidth($birdZoom); zoomRect.addPosition({x : -bw, y : -bw}); if (data.settings.interactionMode === 'fullscreen') { // no animation for fullscreen @@ -170,18 +206,18 @@ var $document = $(document); var $scaler = data.$scaler; var startPos, newRect, birdImgRect, birdZoomRect, fullRect, scalerPos; - var bw = getBorderWidth($birdZoom); + var bw = digilib.fn.getBorderWidth($birdZoom); // mousedown handler: start dragging bird zoom to a new position var birdZoomStartDrag = function(evt) { startPos = geom.position(evt); // position may have changed - data.birdTrafo = getImgTrafo($birdImg, FULL_AREA); + data.birdTrafo = digilib.fn.getImgTrafo($birdImg, FULL_AREA); birdImgRect = geom.rectangle($birdImg); birdZoomRect = geom.rectangle($birdZoom); scalerPos = geom.position($scaler); newRect = null; - fullRect = setZoomBG(data); // setup zoom background image + fullRect = digilib.fn.setZoomBG(data); // setup zoom background image $document.bind("mousemove.dlBirdMove", birdZoomMove); $document.bind("mouseup.dlBirdMove", birdZoomEndDrag); return false; @@ -229,7 +265,7 @@ newRect.addPosition({x : bw, y : bw}); var newArea = data.birdTrafo.invtransform(newRect); data.zoomArea = newArea; - redisplay(data); + digilib.fn.redisplay(data); return false; }; @@ -237,7 +273,7 @@ $document.unbind(".dlBirdMove"); $birdImg.unbind(".dlBirdMove"); $birdZoom.unbind(".dlBirdMove"); - if (! isFullArea(data.zoomArea)) { + if (! digilib.fn.isFullArea(data.zoomArea)) { // set new handler $birdImg.bind("mousedown.dlBirdMove", birdZoomStartDrag); $birdZoom.bind("mousedown.dlBirdMove", birdZoomStartDrag); @@ -248,11 +284,11 @@ var setBirdZoom = function(data, rect) { var part = data.imgTrafo.invtransform(rect); // area = FULL_AREA.fit(part); // no, we want to see where we transcend the borders - birdTrafo = getImgTrafo(data.$birdImg, FULL_AREA); + birdTrafo = digilib.fn.getImgTrafo(data.$birdImg, FULL_AREA); var birdRect = birdTrafo.transform(part); var $birdZoom = data.$birdZoom; // acount for border width - var bw = getBorderWidth($birdZoom); + var bw = digilib.fn.getBorderWidth($birdZoom); birdRect.addPosition({x : -bw, y : -bw}); birdRect.adjustDiv(data.$birdZoom); }; @@ -262,6 +298,7 @@ var digilib = { name : 'birdseye', install : install, + init : init, buttons : {}, actions : {}, fn : {},