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

comparison client/digitallibrary/jquery/jquery.digilib.js @ 636:687447a0e799 jquery

zoomin and -out works now gotopage resets (some) parameters reload takes changed parameters (to put in url) getParamString omits parameters with default values (for shorter urls)

author	robcast
date	Wed, 19 Jan 2011 20:03:44 +0100
parents	3223fabd53bc
children	71cc855e2e4b

comparison

equal deleted inserted replaced

-:0547e61e4e3d
+:687447a0e799
 onclick : "javascript:getRefWin()",
 tooltip : "get a reference URL",
 img : "reference.png"
 },
 zoomin : {
-onclick : "javascript:dl.zoomBy(1.4)",
+onclick : ["zoomBy", 1.4],
 tooltip : "zoom in",
 img : "zoom-in.png"
 },
 zoomout : {
-onclick : "javascript:zoomBy(0.7)",
+onclick : ["zoomBy", 0.7],
 tooltip : "zoom out",
 img : "zoom-out.png"
 },
 zoomarea : {
 onclick : "javascript:zoomArea()",
 'scalerBaseUrl' : 'http://digilib.mpiwg-berlin.mpg.de/digitallibrary/servlet/Scaler',
 // list of Scaler parameters
 'scalerParamNames' : ['fn','pn','dw','dh','ww','wh','wx','wy','ws','mo',
 'rot','cont','brgt','rgbm','rgba','ddpi','ddpix','ddpiy'],
 // Scaler parameter defaults
+'pn' : 1,
 'ww' : 1.0,
 'wh' : 1.0,
 'wx' : 0.0,
 'wy' : 0.0,
 'ws' : 1.0,
-'pn' : 1,
+'mo' : '',
-// mode of operation.
+'rot' : 0,
-// fullscreen: takes parameters from page URL, keeps state in page URL
+'cont' : 0,
-// embedded: takes parameters from Javascript options, keeps state inside object
+'brgt' : 0,
+'rgbm' : '0/0/0',
+'rgba' : '0/0/0',
+'ddpi' : null,
+'ddpix' : null,
+'ddpiy' : null,
+// digilib defaults
+'mk' : '',
+// mode of operation:
+// fullscreen = take parameters from page URL, keep state in page URL
+// embedded = take parameters from Javascript options, keep state inside object
 'interactionMode' : 'fullscreen',
 // actions
 'actions' : actions,
 // path to button images (must end with a slash)
 'buttonsImagePath' : '../greyskin/',
 };
 // affine geometry classes
 var geom = dlGeometry();
+var MAX_ZOOMAREA = geom.rectangle(0, 0, 1, 1);
 var methods = {
 // digilib initialization
 init : function(options) {
 // settings for this digilib instance are merged from defaults and options
 data.settings.isBirdDivVisible = showDiv(data.settings.isBirdDivVisible, data.$birdDiv, show);
 },
 // goto given page nr (+/-: relative)
 gotoPage : function (pageNr) {
-var $elem = $(this); // the clicked button
+var $elem = $(this);
 var data = $elem.data('digilib');
 var settings = data.settings;
 var oldpn = settings.pn;
 var pn = setNumValue(settings, "pn", pageNr);
 if (pn == null) return false; // nothing happened
 alert("no such page (page number too high)");
 settings.pn = oldpn;
 return false;
 }
 }
-// add pn to param list and remove mk and others(?)
+// add pn to param list and reset mk and others(?)
-data.queryParams.pn = pn;
+data.marks = [];
-delete data.queryParams.mk;
+data.zoomArea = MAX_ZOOMAREA;
 // then reload
-redisplay(data);
+redisplay(data, ['pn']);
+},
+// zoom by a given factor
+zoomBy : function (factor) {
+var $elem = $(this);
+var data = $elem.data('digilib');
+zoomBy(data, factor);
 }
 };
 // sets a key to a value (relative values with +/- if relative=true)
 var setNumValue = function(settings, key, value) {
 }
 }
 return params;
 };
-// returns a query string from key names from a parameter hash
+// returns a query string from key names from a parameter hash (ignoring if the same value is in defaults)
-var getParamString = function (settings, keys) {
+var getParamString = function (settings, keys, defaults) {
 var paramString = '';
 var latter = false;
 for (i = 0; i < keys.length; ++i) {
 var key = keys[i];
-if (settings[key]) {
+if ((settings[key] != null) && ((defaults == null) || (settings[key] !== defaults[key]))) {
 // first param gets no '&'
 paramString += latter ? '&' : '';
 latter = true;
 // add parm=val
 paramString += key + '=' + settings[key];
 }
 }
 return paramString;
 };
 // returns URL and query string for Scaler
 var getScalerUrl = function (data) {
 var settings = data.settings;
 var keys = settings.scalerParamNames;
-var queryString = getParamString(settings, keys);
+var queryString = getParamString(settings, keys, defaults);
 var url = settings.scalerBaseUrl + '?' + queryString;
 return url;
 };
 // returns URL and query string for current digilib
-var getDigilibUrl = function (data) {
+var getDigilibUrl = function (data, changedParams) {
-var settings = data.settings;
+packParams(data);
+var settings = data.settings;
+var queryParams = data.queryParams;
+// add changedParams
+if (changedParams != null) {
+for (var i=0; i < changedParams.length; ++i) {
+var k = changedParams[i];
+if (queryParams[k] == null) {
+// add param (value doesn't matter)
+queryParams[k] = k;
+}
+}
+}
 // make list from queryParams keys
 var keys = [];
 for (var k in data.queryParams) {
 keys.push(k);
 }
-var queryString = getParamString(settings, keys);
+var queryString = getParamString(settings, keys, defaults);
 var url = window.location.toString();
 var pos = url.indexOf('?');
 var baseUrl = url.substring(0, pos);
 var newurl = baseUrl + '?' + queryString;
 return newurl;
 // processes some parameters into objects and stuff
 var unpackParams = function (data) {
 var settings = data.settings;
 // zoom area
 var zoomArea = geom.rectangle(settings.wx, settings.wy, settings.ww, settings.wh);
-settings.zoomArea = zoomArea;
+data.zoomArea = zoomArea;
 // marks
 var marks = [];
 var mk = settings.mk || '';
 if (mk.indexOf(";") >= 0) {
 var pa = mk.split(";");    // old format with ";"
 var pos = pa[i].split("/");
 if (pos.length > 1) {
 marks.push(geom.position(pos[0], pos[1]));
 }
 }
-settings.marks = marks;
+data.marks = marks;
 };
 // put objects back into parameters
 var packParams = function (data) {
 var settings = data.settings;
 // zoom area
-if (settings.zoomArea) {
+if (data.zoomArea) {
-settings.wx = settings.zoomArea.x;
+settings.wx = data.zoomArea.x;
-settings.wy = settings.zoomArea.y;
+settings.wy = data.zoomArea.y;
-settings.ww = settings.zoomArea.width;
+settings.ww = data.zoomArea.width;
-settings.wh = settings.zoomArea.height;
+settings.wh = data.zoomArea.height;
 }
 // marks
-if (settings.marks) {
+if (data.marks) {
 var ma = [];
-for (var i = 0; i < settings.marks.length; i++) {
+for (var i = 0; i < data.marks.length; i++) {
-ma.push(cropFloat(settings.marks[i].x) + "/" + cropFloat(settings.marks[i].y));
+ma.push(cropFloat(data.marks[i].x) + "/" + cropFloat(data.marks[i].y));
 }
 settings.mk = ma.join(",");
 }
 };
 // TODO: account for borders?
 return geom.size(winW, winH);
 };
 // (re)load the img from a new scaler URL
-var redisplay = function (data) {
+var redisplay = function (data, changedParams) {
 var settings = data.settings;
 if (settings.interactionMode === 'fullscreen') {
 // update location.href (browser URL) in fullscreen mode
-var url = getDigilibUrl(data);
+var url = getDigilibUrl(data, changedParams);
 var history = window.history;
 if (typeof(history.pushState) === 'function') {
 console.debug("we could modify history, but we don't...");
 }
 window.location = url;
 var $elem = data.target;
 var $img = data.$img;
 return function () {
 console.debug("img loaded! this=", this, " data=", data);
-var area = settings.zoomArea;
+var area = data.zoomArea;
 // create Transform from current area and picsize
 var picpos = $img.offset();
 var picrect = geom.rectangle(picpos.left, picpos.top, $img.width(), $img.height());
 var trafo = geom.transform();
 // subtract area offset and size
 trafo.concat(trafo.getScale(picrect));
 trafo.concat(trafo.getTranslation(picrect));
 data.imgTrafo = trafo;
 // display marks
 renderMarks(data);
-// show birds eye view
-//showDiv(settings.isBirdDivVisible);
 //digilib.showArrows(); // show arrow overlays for zoom navigation
 // done -- hide about div ---
 // --- why? This only leads to suprise effects when displayed programmatically
 // settings.isAboutDivVisible = showDiv(null, data.$aboutDiv, 0);
 };
 };
 // place marks on the image
 var renderMarks = function (data) {
 var $elem = data.target;
-var marks = data.settings.marks;
+var marks = data.marks;
 for (var i = 0; i < marks.length; i++) {
 var mark = marks[i];
-if (data.settings.zoomArea.containsPosition(mark)) {
+if (data.zoomArea.containsPosition(mark)) {
 var mpos = data.imgTrafo.transform(mark);
 // create mark
 var html = '<div class="mark">'+(i+1)+'</div>';
 var $mark = $(html);
 $elem.append($mark);
 $mark.offset({ left : mpos.x, top : mpos.y});
 }
 }
 };
+var zoomBy = function(data, factor) {
+// zooms by the given factor
+var area = data.zoomArea;
+var newarea = area.copy();
+// scale
+newarea.width /= factor;
+newarea.height /= factor;
+// and recenter
+newarea.x -= 0.5 * (newarea.width - area.width);
+newarea.y -= 0.5 * (newarea.height - area.height);
+newarea = MAX_ZOOMAREA.fit(newarea);
+data.zoomArea = newarea;
+redisplay(data, ['wx', 'wy', 'ww', 'wh']);
+};
 // auxiliary function (from Douglas Crockford, A.10)
 var isNumber = function isNumber(value) {
 return typeof value === 'number' && isFinite(value);
 };