Mercurial > hg > digilib-old

changeset 452:6edd60cfa47f

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
ongoing experimental intermediary release - more cleanup on object stuff - new mark image - menu is now fixed and tries to work in IE
author robcast
date Tue, 24 Jan 2006 21:17:44 +0100
parents a6c83fa262b2
children 211155a109ed
files client/digitallibrary/greyskin/baselib.js client/digitallibrary/greyskin/diginew.css client/digitallibrary/greyskin/dllib.js
diffstat 3 files changed, 159 insertions(+), 132 deletions(-) [+]
line wrap: on
line diff
--- a/client/digitallibrary/greyskin/baselib.js	Mon Jan 23 22:36:29 2006 +0100
+++ b/client/digitallibrary/greyskin/baselib.js	Tue Jan 24 21:17:44 2006 +0100
@@ -355,6 +355,7 @@
 
 function Parameters() {
 	this.params = new Object();
+	this.PARAM_ALL = 65535;
 	return this;
 }
 Parameters.prototype.define = function(name, defaultValue, detail) {
@@ -420,7 +421,7 @@
 }
 Parameters.prototype.getAll = function(detail) {
     // returns a string of all parameters in query format
-    if (!detail) detail = 255;
+    if (!detail) detail = this.PARAM_ALL;
     var pa = new Array();
     for (p in this.params) {
         if (((this.params[p].detail & detail) > 0)
--- a/client/digitallibrary/greyskin/diginew.css	Mon Jan 23 22:36:29 2006 +0100
+++ b/client/digitallibrary/greyskin/diginew.css	Tue Jan 24 21:17:44 2006 +0100
@@ -87,20 +87,21 @@
 	font-family: Verdana, Arial, Helvetica, sans-serif;
 	font-weight: bold;
 	font-size:11px;
-	height: 16px;
+	height: 15px;
 	width: 16px;
+	padding-top: 1px;
 	text-align: center;
 	z-index: 10;
 	/* filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='mark-bg-16.png') */
 	}
 		
 div#scaler {
-	position: absolute;
+/*	position: absolute;
 	left: 8px;
 	top: 8px;
 	bottom: 30px;
 	right: 44px;
-	overflow: auto;
+*/	/* overflow: auto; */
 	}
 
 div#overlay {
@@ -114,17 +115,21 @@
 	}
 
 div#buttons {
-	position: absolute;
+	position: fixed;
 	right: 5px;
 	top: 5px;
-	background-color: #E0E0E0;
-	}
+	padding: 3px;
+/*	background-color: #E0E0E0; */
+    background-color: lightgrey;	 
+  }
 
 div#dloptions {
-	position: absolute;
+	position: fixed;
 	right: 5px;
 	top: 5px;
-	background-color: #E0E0E0;
+	padding: 3px;
+/*	background-color: #E0E0E0; */
+    background-color: lightgrey;
 	visibility: hidden;
 	}
 
--- a/client/digitallibrary/greyskin/dllib.js	Mon Jan 23 22:36:29 2006 +0100
+++ b/client/digitallibrary/greyskin/dllib.js	Tue Jan 24 21:17:44 2006 +0100
@@ -26,27 +26,6 @@
 digilibVersion = "Digilib NG";
 dllibVersion = "2.040";
 
-MAX_AREA = new Rectangle(0.0, 0.0, 1.0, 1.0);
-
-// default inset (for scalerImg relativ to scalerDiv 
-INSET = 40; // because of scrollbars of main window and scaler [Firefox bug?]
-
-// mouse drag area that counts as one click 
-MIN_AREA_SIZE = 3 * 3 + 1;
-
-// standard zoom factor
-ZOOMFACTOR = Math.sqrt(2);
-
-// bird's eye view dimensions
-BIRD_MAXX = 100;
-BIRD_MAXY = 100;
-
-// with of arrow bars
-ARROW_WIDTH = 32;
-
-// with of calibration bar
-CALIBRATION_WIDTH = 64;
-
 function identify() {
         // used for identifying a digilib instance
         // Relato uses that function - lugi
@@ -128,7 +107,7 @@
 	this.PARAM_SIZE = 32;
 	this.PARAM_MARK = 64;
 	this.PARAM_PAGES = 128;
-	this.PARAM_ALL = 255;
+	this.PARAM_CLIENT = 256;
 	/* request parameters */
 	with (this) {
 	// file
@@ -157,6 +136,8 @@
 	    define('pt', '0', PARAM_PAGES);
 	// size
 	    define('ws', '1.0', PARAM_SIZE);
+	    // client side options
+	    define('clop', '', PARAM_CLIENT);
 	}
 	return this;
 }
@@ -164,10 +145,12 @@
 // move the inherited getAll because we need it later
 DLParameters.prototype._getAll = Parameters.prototype.getAll;
 DLParameters.prototype.getAll = function(paDetail, moDetail, digilib) {
+	if (!digilib) digilib = dl;
 	// get Flags and Marks first
-	if (!digilib) digilib = dl;
     var mo = digilib.flags.getAll(moDetail);
     this.set("mo", mo);
+    var clop = digilib.opts.getAll();
+    this.set("clop", clop);
     var mk = digilib.marks.getAll();
     this.set("mk", mk);
     var ret = this._getAll(paDetail);
@@ -206,10 +189,30 @@
  */
 function Digilib() {
     if (!baseLibVersion) alert("ERROR: baselib.js not loaded!");
+    /* constants */
+    this.MAX_AREA = new Rectangle(0.0, 0.0, 1.0, 1.0);
+	// default inset (for scalerImg relativ to scalerDiv 
+	this.INSET = 40; // because of scrollbars of main window and scaler [Firefox bug?]
+	// mouse drag area that counts as one click 
+	this.MIN_AREA_SIZE = 3 * 3 + 1;
+	// standard zoom factor
+	this.ZOOMFACTOR = Math.sqrt(2);
+	// bird's eye view dimensions
+	this.BIRD_MAXX = 100;
+	this.BIRD_MAXY = 100;
+	// witdh of arrow bars
+	this.ARROW_WIDTH = 32;
+	// width of calibration bar
+	this.CALIBRATION_WIDTH = 64;
+    /* variables */
+    this.fitOnlyWidth = false;
+    this.fitOnlyHeight = false;
     this.trafo = null;
 	// page elements
     this.scalerDiv = null;
     this.scalerImg = null;
+    this.buttons1Div = null;
+    this.buttons2Div = null;
     /* parse parameters */
     // put the query parameters (sans "?") in the parameters array
     this.params = new DLParameters();
@@ -220,45 +223,10 @@
     this.marks.parse(this.params.get("mk"));
     this.flags = new DLFlags();
     this.flags.parse(this.params.get("mo"));
-
+	this.opts = new Flags();
+	this.opts.parse(this.params.get("clop"));
 	return this;
 }
-Digilib.prototype.parseArea = function() {
-    // returns area Rectangle from current parameters
-    return new Rectangle(
-        this.params.get("wx"),
-        this.params.get("wy"),
-        this.params.get("ww"),
-        this.params.get("wh"));
-}
-Digilib.prototype.setParamFromArea = function(rect) {
-    // sets digilib wx etc. from rect
-    this.params.set("wx", cropFloat(rect.x));
-    this.params.set("wy", cropFloat(rect.y));
-    this.params.set("ww", cropFloat(rect.width));
-    this.params.set("wh", cropFloat(rect.height));
-    return true;
-}
-Digilib.prototype.parseTrafo = function(elem) {
-    // returns Transform from current dlArea and picsize
-    var picsize = getElementRect(elem);
-    var trafo = new Transform();
-    // subtract area offset and size
-    trafo.concat(getTranslation(new Position(-this.area.x, -this.area.y)));
-    trafo.concat(getScale(new Size(1/this.area.width, 1/this.area.height)));
-    // scale to screen size
-    trafo.concat(getScale(picsize));
-    trafo.concat(getTranslation(picsize));
-    // FIX ME: Robert, kannst Du mal nachsehen, ob das folgende tut, was es soll?
-    // oder gibt es dafuer neuen Code? -- ROC: Bisher funktioniert es nicht!
-    // rotate
-    //var rot = getRotation(- dl.params.get("rot"), new Position(0.5*picsize.width, 0.5*picsize.height));
-    //trafo.concat(rot);
-    // mirror
-    //if (hasFlag("hmir")) trafo.m00 = - trafo.m00; // ??
-    //if (hasFlag("vmir")) trafo.m11 = - trafo.m11; // ??
-    return trafo;
-}
 Digilib.prototype.setDLParam = function(e, s, relative) {
     // sets parameter based on HTML event
     var nam;
@@ -278,39 +246,102 @@
     }
     return true;
 }
+Digilib.prototype.parseArea = function() {
+    // returns area Rectangle from current parameters
+    return new Rectangle(
+        this.params.get("wx"),
+        this.params.get("wy"),
+        this.params.get("ww"),
+        this.params.get("wh"));
+}
+Digilib.prototype.setParamFromArea = function(rect) {
+    // sets digilib wx etc. from rect
+    this.params.set("wx", cropFloat(rect.x));
+    this.params.set("wy", cropFloat(rect.y));
+    this.params.set("ww", cropFloat(rect.width));
+    this.params.set("wh", cropFloat(rect.height));
+    return true;
+}
+
+Digilib.prototype.parseTrafo = function(elem) {
+    // returns Transform from current dlArea and picsize
+    var picsize = getElementRect(elem);
+    var trafo = new Transform();
+    // subtract area offset and size
+    trafo.concat(getTranslation(new Position(-this.area.x, -this.area.y)));
+    trafo.concat(getScale(new Size(1/this.area.width, 1/this.area.height)));
+    // scale to screen size
+    trafo.concat(getScale(picsize));
+    trafo.concat(getTranslation(picsize));
+    // FIX ME: Robert, kannst Du mal nachsehen, ob das folgende tut, was es soll?
+    // oder gibt es dafuer neuen Code? -- ROC: Bisher funktioniert es nicht!
+    // rotate
+    //var rot = getRotation(- dl.params.get("rot"), new Position(0.5*picsize.width, 0.5*picsize.height));
+    //trafo.concat(rot);
+    // mirror
+    //if (hasFlag("hmir")) trafo.m00 = - trafo.m00; // ??
+    //if (hasFlag("vmir")) trafo.m11 = - trafo.m11; // ??
+    return trafo;
+}
+
 Digilib.prototype.onLoad = function() {
 	// initialize digilib; called by body.onload
 	this.scalerDiv = getElement("scaler", true);
     this.scalerImg = getElement("pic", true);
-    if (this.scalerImg == null && this.scalerDiv) {
+    this.buttons1Div = getElement("buttons", true);
+    this.buttons2Div = getElement("options", true);
+    /* if (this.scalerImg == null && this.scalerDiv) {
         // in N4 pic is in the scaler layer
         this.scalerImg = this.scalerDiv.document.images[0];
-    }
+    } */
     if ((!this.scalerImg)||(!this.scalerDiv)) {
         alert("Sorry, digilib doesn't work here!");
         return false;
     }
+    // fix fixed menus
+    var ms1 = getElementSize(this.buttons1Div);
+    var ms2 = getElementSize(this.buttons2Div);
+    var maxh = (ms1.height > ms2.height) ? ms1.height : ms2.height;
+    var wins = getWinSize();
+    if ((wins.height <= maxh) || browserType.isIE) {
+    		// unlock fixed menus to absolute
+    		this.buttons1Div.style.position = "absolute";
+    		this.buttons2Div.style.position = "absolute";
+    	}
 	this.setScalerImage();	// setzt auch onImgLoad
-	this.loadBirdImage();	// l?dt das Bird's Eye Bild
+	this.setBirdImage();	// l?dt das Bird's Eye Bild
 }
-Digilib.prototype.setScalerImage = function(detail) {
+
+Digilib.prototype.setScalerImage = function() {
 	// set the scaler image source (needs the browser size)
-    var picsize = bestPicSize(this.scalerDiv, 50);
+    var picsize = bestPicSize(this.scalerDiv);
+    var menusize = getElementSize(this.buttons1Div);
+    // subtract menu width
+    picsize.width -= menusize.width;
+    picsize.height -= this.INSET;
+    // compose Scaler URL
     var src = "../servlet/Scaler?" 
-        + this.params.getAll(this.params.PARAM_ALL & ~(this.params.PARAM_MARK | this.params.PARAM_PAGES))
-        + "&dw=" + picsize.width
-        + "&dh=" + picsize.height;
+        + this.params.getAll(this.params.PARAM_ALL & ~(this.params.PARAM_MARK | this.params.PARAM_PAGES));
+    if (this.opts.get('fitwidth')) {
+		src += "&dw=" + picsize.width;
+    } else if (this.opts.get('fitheight')) {
+		src += "&dh=" + picsize.height;
+	} else {
+		src += "&dw=" + picsize.width + "&dh=" + picsize.height;
+	}
     // debug(src);
     this.scalerImg.onload = onImgLoad;
     this.scalerImg.src = src;
 
 	var digilib = this;
 	// this is a local callback function that can use the current scope
+	
     function onImgLoad() {
 		// make sure the image is loaded so we know its size
-	    if (defined(digilib.scalerImg.complete) && !digilib.scalerImg.complete && !digilib.browserType.isN4 ) {
-			alert("ERROR: the image seems not to be complete!?");
-		}
+		/* this test seems to have problems sometimes :-(
+	    if (defined(digilib.scalerImg.complete) && !digilib.scalerImg.complete) {
+			alert("ERROR: the image seems not to be complete in onImgLoad!?");
+		} */
 	    digilib.trafo = digilib.parseTrafo(digilib.scalerImg);
 	    // display marks
 	    digilib.renderMarks();
@@ -321,19 +352,10 @@
 	    focus();
 	}
 }
-Digilib.prototype.display = function(detail, moDetail) {
-    // redisplay the page
-    var queryString = this.params.getAll(detail, moDetail);
-	location.href
-        = location.protocol + "//"
-    	    + location.host
-    	    + location.pathname
-        + "?" + queryString;
-}
 Digilib.prototype.renderMarks = function() {
     // make sure the image is loaded so we know its size
     if (!this.trafo) {
-    		alert("ERROR: cannot render marks!");
+    		alert("ERROR: trafo missing, cannot render marks!");
     		return;
     	}
     // debugProps(dlArea, "dlArea");
@@ -342,10 +364,10 @@
 	    	var mark = this.marks[i];
 	    	// debugProps(mark, "mark");
 	    	if (this.area.containsPosition(mark)) {
-	        	var mpos = this.trafo.transform(mark); 
+	        	var mpos = this.trafo.transform(mark);
 	        	// debugProps(mark, "mpos");
+	       	// better not hide the marked spot (MR)
 	       	// suboptimal to place -5 pixels and not half size of mark-image
-	       	// better not hide the marked spot (MR)
 	       	// mpos.x = mpos.x -5;
 	       	// mpos.y = mpos.y -5;
 	       	moveElement(div, mpos);
@@ -357,11 +379,21 @@
     }
 }
 
+Digilib.prototype.display = function(detail, moDetail) {
+    // redisplay the page
+    var queryString = this.params.getAll(detail, moDetail);
+	location.href
+        = location.protocol + "//"
+    	    + location.host
+    	    + location.pathname
+        + "?" + queryString;
+}
+
 /* **********************************************
  *     interactive digilib functions
  * ******************************************** */
 
-Digilib.prototype.setMark = function(reload) {
+Digilib.prototype.setMark = function() {
     // add a mark where clicked
     window.focus();
     this.moveCenter(false);
@@ -375,25 +407,15 @@
     // event handler adding a new mark
         unregisterEvent("mousedown", digilib.scalerDiv, markEvent);
         digilib.marks.addEvent(evt);
-        if ( defined(reload) && !reload ) {
-            // don't redisplay
-            digilib.renderMarks();
-            return stopEvent(evt);
-        }
         digilib.display();
         return stopEvent(evt);
     }
     
 }
 
-Digilib.prototype.removeMark = function(reload) {
+Digilib.prototype.removeMark = function() {
     // remove the last mark
     this.marks.pop();
-    if (defined(reload)&&(!reload)) {
-        // don't redisplay
-        this.renderMarks();
-        return;
-    }
     this.display();
 }
 
@@ -416,7 +438,7 @@
 	// our own reference to this for the local function
 	var digilib = this;
 	
-// mousedown handler: start moving
+	// mousedown handler: start moving
     function zoomStart(evt) {
         pt1 = evtPosition(evt);
         unregisterEvent("mousedown", overlay, zoomStart);
@@ -430,13 +452,13 @@
         return stopEvent(evt);
     }
     
-// mouseup handler: end moving
+	// mouseup handler: end moving
     function zoomEnd(evt) {
         pt2 = evtPosition(evt);
         // assume a click if the area is too small (up to 3 x 3 pixel)
         var clickRect = new Rectangle(pt1, pt2);
         clickRect.normalize();
-        if (clickRect.getArea() <= MIN_AREA_SIZE) return stopEvent(evt); 
+        if (clickRect.getArea() <= this.MIN_AREA_SIZE) return stopEvent(evt); 
         // hide zoom div
         showElement(zoomdiv, false);
         showElement(overlay, false);
@@ -453,7 +475,7 @@
         return stopEvent(evt);
     }
     
-// mouse move handler
+	// mouse move handler
     function zoomMove(evt) {
         pt2 = evtPosition(evt);
         var rect = new Rectangle(pt1, pt2);
@@ -472,18 +494,26 @@
     newarea.height /= factor;
     newarea.x -= 0.5 * (newarea.width - this.area.width);
     newarea.y -= 0.5 * (newarea.height - this.area.height);
-    newarea = MAX_AREA.fit(newarea);
+    newarea = this.MAX_AREA.fit(newarea);
     this.setParamFromArea(newarea);
     this.display();
 }
 
 
-Digilib.prototype.zoomFullpage = function() {
+Digilib.prototype.zoomFullpage = function(fit) {
     // zooms out to show the whole image
     this.params.set("wx", 0.0);
     this.params.set("wy", 0.0);
     this.params.set("ww", 1.0);
     this.params.set("wh", 1.0);
+    if (fit == "width") {
+    		this.opts.set('fitwidth');
+    	} else if (fit == "height") {
+    		this.opts.set('fitheight');
+    	} else {
+    		this.opts.reset('fitwidth');
+    		this.opts.reset('fitheight');
+	}
     this.display();
 }
 
@@ -504,7 +534,7 @@
 	    var pt = digilib.trafo.invtransform(evtPosition(evt));
 	    var newarea = digilib.area.copy();
 		newarea.setCenter(pt);
-	    newarea.stayInside(MAX_AREA);
+	    newarea.stayInside(this.MAX_AREA);
 	    // newarea = dlMaxArea.fit(newarea);
 	    // debugProps(newarea, "newarea");
 	    // debugProps(dlArea, "dlArea");
@@ -519,7 +549,7 @@
 Digilib.prototype.isFullArea = function(area) {
     if (!area) area = this.area;
     // pixel by pixel is not always full area
-    return (area.width == 1.0) && (area.height == 1.0) && ! hasFlag("clip");
+    return (area.width == 1.0) && (area.height == 1.0) && ! this.flags.get("clip");
 }
 
 Digilib.prototype.canMove = function(movx, movy) {
@@ -539,7 +569,7 @@
     var newarea = this.area.copy();
     newarea.x += parseFloat(movx)*this.area.width;
     newarea.y += parseFloat(movy)*this.area.height;
-    newarea = MAX_AREA.fit(newarea);
+    newarea = this.MAX_AREA.fit(newarea);
     // set parameters
     this.setParamFromArea(newarea);
     this.display();
@@ -554,7 +584,8 @@
         + location.pathname;
     var hyperlinkRef = baseUrl;
     with (this.params) {
-    		var ps = getAll(PARAM_ALL & ~(PARAM_DPI | PARAM_PAGES)); // all without ddpi, pt
+    		// all without ddpi, pt
+    		var ps = getAll(PARAM_ALL & ~(PARAM_DPI | PARAM_PAGES | PARAM_CLIENT)); 
     	}
     if (ps.length > 0) hyperlinkRef += "?" + ps;
     return hyperlinkRef;
@@ -674,12 +705,12 @@
     showElement(elem, show);
     }
     
-Digilib.prototype.loadBirdImage = function() {
+Digilib.prototype.setBirdImage = function() {
     var img = getElement("bird-image");
     var src = "../servlet/Scaler?" 
         + this.params.getAll(this.params.PARAM_FILE)
-        + "&dw=" + BIRD_MAXX 
-        + "&dh=" + BIRD_MAXY;
+        + "&dw=" + this.BIRD_MAXX 
+        + "&dh=" + this.BIRD_MAXY;
     img.src = src;
 }
     
@@ -773,24 +804,21 @@
 	
 Digilib.prototype.showArrows = function() {
     // show the 4 arrow bars on top of scaler img according to current dlArea
-    if (defined(this.scalerImg.complete) && !this.scalerImg.complete && !browserType.isN4 ) {
-        alert("ERROR: scaler img not complete in showArrows!");
-        }
 	var r = getElementRect(this.scalerImg);
     this.showArrow('up',
-        new Rectangle(r.x, r.y, r.width, ARROW_WIDTH), 
+        new Rectangle(r.x, r.y, r.width, this.ARROW_WIDTH), 
         this.canMove(0, -1)
         );
     this.showArrow('down',
-        new Rectangle(r.x, r.y + r.height - ARROW_WIDTH, r.width, ARROW_WIDTH),
+        new Rectangle(r.x, r.y + r.height - this.ARROW_WIDTH, r.width, this.ARROW_WIDTH),
         this.canMove(0, 1)
         );
     this.showArrow('left',
-        new Rectangle(r.x, r.y, ARROW_WIDTH, r.height),
+        new Rectangle(r.x, r.y, this.ARROW_WIDTH, r.height),
         this.canMove(-1, 0)
         );
     this.showArrow('right',
-        new Rectangle(r.x + r.width - ARROW_WIDTH, r.y, ARROW_WIDTH, r.height),
+        new Rectangle(r.x + r.width - this.ARROW_WIDTH, r.y, this.ARROW_WIDTH, r.height),
         this.canMove(1, 0)
         );
 	}
@@ -884,14 +912,7 @@
 }
 
 Digilib.prototype.pageWidth = function() {
-    var divSize = getElementSize(this.scalerDiv);
-    divSize.width -= INSET; // allow for scrollbars [Firefox bug?]
-    var imgSize = getElementSize(this.scalerImg);
-    if (imgSize.width < divSize.width) {
-        this.params.set("ws", cropFloat(divSize.width / imgSize.width));
-        this.display(this.params.PARAM_ALL & ~this.params.PARAM_DIM); // no zoom
-        };
-    // TODO: how to calculate correct width if zoom is on? (plus size?)
+	this.zoomFullpage('width');
 }
 
 Digilib.prototype.resize = function(factor) {