diff client/digitallibrary/navigation_n6.js @ 107:85126da2ae21 vendor start

XUL: Digilib Buttons in chrome
author engler
date Tue, 13 May 2003 21:02:22 +0200
parents 254fca7a21ce
children
line wrap: on
line diff
--- a/client/digitallibrary/navigation_n6.js	Tue May 13 20:59:47 2003 +0200
+++ b/client/digitallibrary/navigation_n6.js	Tue May 13 21:02:22 2003 +0200
@@ -1,34 +1,83 @@
-/* navigation_ie -- JS library for digilib (Mozilla version)
-
-  Digital Image Library servlet components
-
-  Copyright (C) 2001, 2002 Christian Luginbuehl (luginbuehl@student.unibe.ch)
+/*
+Copyright (C) 2003 WTWG, Uni Bern
+ 
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License
+as published by the Free Software Foundation; either version 2
+of the License, or (at your option) any later version.
+ 
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+ 
+You should have received a copy of the GNU General Public License
+along with this program; if not, write to the Free Software
+Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA
+ 
+Author: Christian Luginbuehl, 01.05.2003 , Version Alcatraz 0.3
+*/
+// this global variable has to be initialised before the frist use of the functions below
+// to fill in the attributes you can use the function init provided below
+// - array with all attributes
+var att = new Object();
 
-  This program is free software; you can redistribute  it and/or modify it
-  under  the terms of  the GNU General  Public License as published by the
-  Free Software Foundation;  either version 2 of the  License, or (at your
-  option) any later version.
-   
-  Please read license.txt for the full details. A copy of the GPL
-  may be found at http://www.gnu.org/copyleft/lgpl.html
+// fill in the values of the "att"-array
+function init(fn, pn, ws, mo, mk, wx, wy, ww, wh) {
+
+	// debug window to check the parameters passed
+	//alert ("DEBUG message (parameters in init):\n\npu = " + pu + "\npn = " + pn + "\nws = " + ws + "\nmo = " + mo + "\nmk = " + mk + "\nwx = " + wx + "\nwy = " + wy + "\nww = " + ww + "\nwh = " + wh);
 
-  You should have received a copy of the GNU General Public License
-  along with this program; if not, write to the Free Software
-  Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
-
-*/
+	// attaching the values to the att-array
+	att.fn = fn;
+	att.pn = parseInt(pn);
+	att.ws = parseFloat(ws);
+	att.mo = mo;
+	att.mk = mk;
+	att.wx = parseFloat(wx);
+	att.wy = parseFloat(wy);
+	att.ww = parseFloat(ww);
+	att.wh = parseFloat(wh);
+	
+	// compatablility issue
+// dangerous at the time - lugi
+//	if (att.mo.indexOf("f") > -1) {
+//		att.mo = "fit";
+//	}
 
-// these two global variables have to be initialised before the frist use of the functions below
-// to fill in the attributes you can use the function initPicture provided below
-// - array with all attributes
-var att = new Array();
+	// converts the old mark format (0-1000) to new format(0.0 - 1.0)
+	// could even be useless now
+	if (att.mk != "0/0" && att.mk != "") {
+		var tmp = att.mk.split(";");
+		
+		att.mk = "";
+		
+		for (i = 0; i < tmp.length; i++) {
+			tmp[i] = tmp[i].split("/");
 
-// - variable to store the path to the frame, in which the pictures should be created
-var whichFrame = parent.mainFrame;
+			if (tmp[i][0] > 1 && tmp[i][1] > 1) {
+				tmp[i][0] /= 1000;
+				tmp[i][1] /= 1000;
+			}
+			
+			att.mk += tmp[i][0] + "/" + tmp[i][1] + ";";
+		}
+		att.mk = att.mk.slice(0, -1);
+	}
 
-// give a name to the window containing digilib - this way one can test if there is already a
-// digilib-window open and replace the contents of it (ex. digicat)
-window.name = "digilib";
+	// initialisation stuff
+	// ====================
+	
+	setMarks();
+
+	this.document.addEventListener('keypress', parseKeypress, true);
+	focus();
+	
+	// give a name to the window containing digilib - this way one can test if there is already a
+	// digilib-window open and replace the contents of it (ex. digicat)
+	top.window.name = "digilib";
+}
+
 
 // function that launches the ScaleServlet
 // the different detailGrades:
@@ -38,110 +87,94 @@
 
 function loadPicture(detailGrade, keepArea) {
 
-//	alert("wx: " + att[5] + "\tww: " + att[7] + "\nwy: " + att[6] + "\twh: " + att[8]);
-
-	// sorry about that, but Mozilla needs to have a document body to calc the frames width and height
-	whichFrame.document.open();
-	whichFrame.document.write('<html><head></head><body bgcolor="#666666" topmargin="10" leftmargin="10" marginwidth="10" magrinheight="10">');
-
-//	alert(whichFrame.innerWidth);
-
-	var newPicture  = "http://" + location.host + "/docuserver/digitallibrary/servlet/Scaler/"
-	newPicture += att[0] + "?" + "pn=" + att[1] + "&ws=" + att[2];
-	newPicture += "&dw=" + (whichFrame.innerWidth-30) + "&dh=" + (whichFrame.innerHeight-30);
-	newPicture += "&mo=" + att[3];
+	var newQuery = "fn=" + att.fn + "&pn=" + att.pn + "&ws=" + att.ws + "&mo=" + att.mo;
 
 	if (detailGrade == 0) {
-		att[4] = "0/0";
+		att.mk = "0/0";
 	}
 
 	if ((detailGrade == 1) || (detailGrade == 0 && !keepArea)) {
-		att[5] = 0;
-		att[6] = 0;
-		att[7] = 1;
-		att[8] = 1;
+		att.wx = 0;
+		att.wy = 0;
+		att.ww = 1;
+		att.wh = 1;
 	}
-	newPicture += "&wx=" + att[5] + "&wy=" + att[6] + "&ww=" + att[7] + "&wh=" + att[8];
-	
-	whichFrame.document.write('<div ID="lay1" style="position:absolute; left:10;  top:10;  visibility:visible"><img name="pic" src="' + newPicture + '"></div>');
-	whichFrame.document.write('<div ID="dot0" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark1.gif"></div>');
-	whichFrame.document.write('<div ID="dot1" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark2.gif"></div>');
-	whichFrame.document.write('<div ID="dot2" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark3.gif"></div>');
-	whichFrame.document.write('<div ID="dot3" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark4.gif"></div>');
-	whichFrame.document.write('<div ID="dot4" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark5.gif"></div>');
-	whichFrame.document.write('<div ID="dot5" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark6.gif"></div>');
-	whichFrame.document.write('<div ID="dot6" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark7.gif"></div>');
-	whichFrame.document.write('<div ID="dot7" style="position:absolute; left:-20; top:100; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/mark8.gif"></div>');
-	whichFrame.document.write('<div ID="eck1" style="position:absolute; left:-20; top:120; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/olinks.gif"></div>');
-	whichFrame.document.write('<div ID="eck2" style="position:absolute; left:-20; top:140; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/orechts.gif"></div>');
-	whichFrame.document.write('<div ID="eck3" style="position:absolute; left:-20; top:160; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/ulinks.gif"></div>');
-	whichFrame.document.write('<div ID="eck4" style="position:absolute; left:-20; top:180; visibility:hidden"><img src="http://' + location.host + '/docuserver/digitallibrary/urechts.gif"></div>');
+
+	newQuery += "&mk=" + att.mk + "&wx=" + att.wx + "&wy=" + att.wy + "&ww=" + att.ww + "&wh=" + att.wh;
+	newQuery += "&dw=" + (innerWidth-30) + "&dh=" + (innerHeight-30);
+	newQuery += "&lv=1"
 
-	whichFrame.document.write('</body></html>');
-
-	whichFrame.document.close();
+	// debug window - checking the parameters passed to the next image
+	alert ("DEBUG MESSAGE (query-string in loadPicture):\n\n" + newQuery);
 
-	initScripts();
-	
-	pageInfo();
-
-	setmark();
+	location.href = location.protocol + "//" + location.host + location.pathname + "?" + newQuery;
 }
 
 
-function Backpage(keepArea) {
+// constructor holding different values of a point
+function Point(event) {
 
-    att[1] = parseInt(att[1]) - 1;
+	this.pageX = parseInt(event.pageX);
+	this.pageY = parseInt(event.pageY);
+	
+	this.x = this.pageX-parseInt(document.getElementById("lay1").style.left);
+	this.y = this.pageY-parseInt(document.getElementById("lay1").style.top);
+	
+	this.relX = cropFloat(att.wx+(att.ww*this.x/document.pic.offsetWidth));
+	this.relY = cropFloat(att.wy+(att.wh*this.y/document.pic.offsetHeight));
 
-    if (att[1] > 0) {
+	return this;
+}
+
+
+function backPage(keepArea) {
+
+    att.pn = parseInt(att.pn) - 1;
+
+    if (att.pn > 0) {
         loadPicture(0, keepArea);
     } else {
-	    att[1] = parseInt(att[1]) + 1;
+	    att.pn = parseInt(att.pn) + 1;
         alert("You are already on the first page!");
     }
 }
 
 
-function Nextpage(keepArea) {
-
-    att[1] = parseInt(att[1]) + 1;
+function nextPage(keepArea) {
 
-    if (att[1] <= parent.numPages) {
-        loadPicture(0, keepArea);
-    } else {
-	    att[1] = parseInt(att[1]) - 1;
-        alert("You are already on the last page!");
-    }
+    att.pn = parseInt(att.pn) + 1;
+
+	loadPicture(0, keepArea);
 }
 
 
-function Page(keepArea) {
+function page(keepArea) {
 
 	do {
-    	page = prompt("Goto Page (1 - " + parent.numPages + "):", 1);
-	} while ((page != null) && ((page < 1) || (page > parent.numPages)));
+    	page = prompt("Goto Page:", 1);
+	} while ((page != null) && (page < 1));
 
-   	if (page != null && page != att[1]) {
-		att[1] = page;
+   	if (page != null && page != att.pn) {
+		att.pn = page;
 		loadPicture(0, keepArea);
 	}
 }
 
 
-function Digicat() {
-	var url = "http://" + location.host + "/docuserver/digitallibrary/digicat.html?" + att[0] + "+" + att[1];
+function digicat() {
+	var url = baseUrl + "/digicat.jsp?" + att.fn + "+" + att.pn;
 	win = window.open(url, "digicat");
 	win.focus();
 }
 
 
-function Ref(refselect) {
+function ref(refselect) {
 
-	var hyperlinkRef = "http://" + location.host + "/docuserver/digitallibrary/digilib.jsp?";
-	hyperlinkRef += att[0] + "+" + att[1] + "+" + att[2] + "+" + att[3] + "+" + att[4];
+	var hyperlinkRef = baseUrl + "/digilib.jsp?";
+	hyperlinkRef += att.fn + "+" + att.pn + "+" + att.ws + "+" + att.mo + "+" + att.mk;
 	
-	if ((att[5] != 0) || (att[6] != 0) || (att[7] != 1) || (att[8] != 1)) {
-		hyperlinkRef += "+" + att[5] + "+" + att[6] + "+" + att[7] + "+" + att[8];
+	if ((att.wx != 0) || (att.wy != 0) || (att.ww != 1) || (att.wh != 1)) {
+		hyperlinkRef += "+" + att.wx + "+" + att.wy + "+" + att.ww + "+" + att.wh;
 	}
 
 	if (refselect == 1) {
@@ -152,194 +185,187 @@
 }
 
 
-function Mark() {
+function mark() {
 
-	if (att[4].split(";").length > 7) {
+	if (att.mk.split(";").length > 7) {
 		alert("Only 8 marks are possible at the moment!");
 		return;
 	}
 
-	function MarkEvent(event) {
-
-		if ((att[4] != "") && (att[4] != "0/0")) {
-			att[4] += ";";
+	function markEvent(event) {
+    var point = new Point(event);
+    
+		if ((att.mk != "") && (att.mk != "0/0")) {
+			att.mk += ";";
 		} else {
-			att[4] = "";
+			att.mk = "";
 		}
+		att.mk += point.relX + "/" + point.relY;
 
-		var markX = cropFloat(att[5]+att[7]*(event.pageX-parseInt(whichFrame.document.getElementById("lay1").style.left))/whichFrame.document.pic.offsetWidth);
-		var markY = cropFloat(att[6]+att[8]*(event.pageY-parseInt(whichFrame.document.getElementById("lay1").style.top))/whichFrame.document.pic.offsetHeight);
-
-		att[4] += markX + "/" + markY;
-
-		whichFrame.document.getElementById("lay1").removeEventListener("mousedown", MarkEvent, true);		
-		setmark();
+		document.getElementById("lay1").removeEventListener("mousedown", markEvent, true);		
+		setMarks();
 	}
 
-	whichFrame.document.getElementById("lay1").addEventListener("mousedown", MarkEvent, true);		
+	document.getElementById("lay1").addEventListener("mousedown", markEvent, true);		
 }
 
 
-function Zoomrect() {
+function zoomArea() {
 	var state = 0;
-	var x1, y1, x2, y2;
+	var pt1, pt2;
 
-	function Click(event) {
+	function click(event) {
 
 		if (state == 0) {
 			state = 1;
 			
-			x1 = event.pageX;
-			y1 = event.pageY;			
-			x2 = x1;
-			y2 = y1;
+			pt1 = new Point(event);
+			pt2 = pt1;
 			
-			whichFrame.document.getElementById("eck1").style.left = x1;
-			whichFrame.document.getElementById("eck1").style.top = y1;
-			whichFrame.document.getElementById("eck2").style.left = x2-12;
-			whichFrame.document.getElementById("eck2").style.top = y1;
-			whichFrame.document.getElementById("eck3").style.left = x1;
-			whichFrame.document.getElementById("eck3").style.top = y2-12;
-			whichFrame.document.getElementById("eck4").style.left = x2-12;
-			whichFrame.document.getElementById("eck4").style.top = y2-12;
+			document.getElementById("eck1").style.left = pt1.pageX;
+			document.getElementById("eck1").style.top = pt1.pageY;
+			document.getElementById("eck2").style.left = pt2.pageX-12;
+			document.getElementById("eck2").style.top = pt1.pageY;
+			document.getElementById("eck3").style.left = pt1.pageX;
+			document.getElementById("eck3").style.top = pt2.pageY-12;
+			document.getElementById("eck4").style.left = pt2.pageX-12;
+			document.getElementById("eck4").style.top = pt2.pageY-12;
 
-			whichFrame.document.getElementById("eck1").style.visibility="visible";
-			whichFrame.document.getElementById("eck2").style.visibility="visible";
-			whichFrame.document.getElementById("eck3").style.visibility="visible";
-			whichFrame.document.getElementById("eck4").style.visibility="visible";
+			document.getElementById("eck1").style.visibility="visible";
+			document.getElementById("eck2").style.visibility="visible";
+			document.getElementById("eck3").style.visibility="visible";
+			document.getElementById("eck4").style.visibility="visible";
 			
-			whichFrame.document.getElementById("lay1").addEventListener("mousemove", Move, true);		
-			whichFrame.document.getElementById("eck4").addEventListener("mousemove", Move, true);		
+			document.getElementById("lay1").addEventListener("mousemove", move, true);		
+			document.getElementById("eck4").addEventListener("mousemove", move, true);		
 
 		} else {
 
-			x1 -= parseInt(whichFrame.document.getElementById("lay1").style.left);
-			y1 -= parseInt(whichFrame.document.getElementById("lay1").style.top);			
-
-			x2 = event.pageX-parseInt(whichFrame.document.getElementById("lay1").style.left);
-			y2 = event.pageY-parseInt(whichFrame.document.getElementById("lay1").style.top);			
-
-			whichFrame.document.getElementById("lay1").removeEventListener("mousedown", Click, true);		
-			whichFrame.document.getElementById("eck4").removeEventListener("mousedown", Click, true);		
+			pt2 = new Point(event);
 			
-			whichFrame.document.getElementById("lay1").removeEventListener("mousemove", Move, true);		
-			whichFrame.document.getElementById("eck4").removeEventListener("mousemove", Move, true);		
+			document.getElementById("lay1").removeEventListener("mousedown", click, true);		
+			document.getElementById("eck4").removeEventListener("mousedown", click, true);		
+			
+			document.getElementById("lay1").removeEventListener("mousemove", move, true);		
+			document.getElementById("eck4").removeEventListener("mousemove", move, true);		
 
-			whichFrame.document.getElementById("eck1").style.visibility="hidden";
-			whichFrame.document.getElementById("eck2").style.visibility="hidden";
-			whichFrame.document.getElementById("eck3").style.visibility="hidden";
-			whichFrame.document.getElementById("eck4").style.visibility="hidden";
+			document.getElementById("eck1").style.visibility="hidden";
+			document.getElementById("eck2").style.visibility="hidden";
+			document.getElementById("eck3").style.visibility="hidden";
+			document.getElementById("eck4").style.visibility="hidden";
 
-			att[5] = cropFloat(att[5]+att[7]*((x1 < x2) ? x1 : x2)/whichFrame.document.pic.offsetWidth);
-			att[6] = cropFloat(att[6]+att[8]*((y1 < y2) ? y1 : y2)/whichFrame.document.pic.offsetHeight);
+			att.wx = parseFloat(Math.min(pt1.relX, pt2.relX));
+			att.wy = parseFloat(Math.min(pt1.relY, pt2.relY));
 
-			att[7] = cropFloat(att[7]*Math.abs(x1-x2)/whichFrame.document.pic.offsetWidth);
-			att[8] = cropFloat(att[8]*Math.abs(y1-y2)/whichFrame.document.pic.offsetHeight);
+			att.ww = parseFloat(Math.abs(pt1.relX-pt2.relX));
+			att.wh = parseFloat(Math.abs(pt1.relY-pt2.relY));
 
-			if (att[7] != 0 && att[8] != 0) {
+			if (att.ww != 0 && att.wh != 0) {
 				loadPicture(2);
 			}
 		}
 	}
 
-	function Move(event) {
+	function move(event) {
 
-		x2 = event.pageX;
-		y2 = event.pageY;
+		pt2 = new Point(event);
 
-		whichFrame.document.getElementById("eck1").style.left = ((x1 < x2) ? x1 : x2);
-		whichFrame.document.getElementById("eck1").style.top = ((y1 < y2) ? y1 : y2);
-		whichFrame.document.getElementById("eck2").style.left = ((x1 < x2) ? x2 : x1)-12;
-		whichFrame.document.getElementById("eck2").style.top = ((y1 < y2) ? y1 : y2);
-		whichFrame.document.getElementById("eck3").style.left = ((x1 < x2) ? x1 : x2);
-		whichFrame.document.getElementById("eck3").style.top = ((y1 < y2) ? y2 : y1)-12;
-		whichFrame.document.getElementById("eck4").style.left = ((x1 < x2) ? x2 : x1)-12;
-		whichFrame.document.getElementById("eck4").style.top = ((y1 < y2) ? y2 : y1)-12;
+		document.getElementById("eck1").style.left = ((pt1.pageX < pt2.pageX) ? pt1.pageX : pt2.pageX);
+		document.getElementById("eck1").style.top = ((pt1.pageY < pt2.pageY) ? pt1.pageY : pt2.pageY);
+		document.getElementById("eck2").style.left = ((pt1.pageX < pt2.pageX) ? pt2.pageX : pt1.pageX)-12;
+		document.getElementById("eck2").style.top = ((pt1.pageY < pt2.pageY) ? pt1.pageY : pt2.pageY);
+		document.getElementById("eck3").style.left = ((pt1.pageX < pt2.pageX) ? pt1.pageX : pt2.pageX);
+		document.getElementById("eck3").style.top = ((pt1.pageY < pt2.pageY) ? pt2.pageY : pt1.pageY)-12;
+		document.getElementById("eck4").style.left = ((pt1.pageX < pt2.pageX) ? pt2.pageX : pt1.pageX)-12;
+		document.getElementById("eck4").style.top = ((pt1.pageY < pt2.pageY) ? pt2.pageY : pt1.pageY)-12;
 	}
 
-	whichFrame.document.getElementById("lay1").addEventListener("mousedown", Click, true);		
-	whichFrame.document.getElementById("eck4").addEventListener("mousedown", Click, true);		
+	document.getElementById("lay1").addEventListener("mousedown", click, true);		
+	document.getElementById("eck4").addEventListener("mousedown", click, true);		
 }
 
 
-function Zoomin() {
+function zoomPoint() {
 
-	function ZoominEvent(event) {
+	function zoomPointEvent(event) {
+	    var point = new Point(event);
 
-		att[5] = cropFloat(att[5]+att[7]*(event.pageX-parseInt(whichFrame.document.getElementById("lay1").style.left))/whichFrame.document.pic.offsetWidth-0.5*att[7]*0.7);
-		att[6] = cropFloat(att[6]+att[8]*(event.pageY-parseInt(whichFrame.document.getElementById("lay1").style.top))/whichFrame.document.pic.offsetHeight-0.5*att[8]*0.7);
+		att.wx = cropFloat(point.relX-0.5*att.ww*0.7);
+		att.wy = cropFloat(point.relY-0.5*att.wh*0.7);
 
-		att[7] = cropFloat(att[7]*0.7);
-		att[8] = cropFloat(att[8]*0.7);
+		att.ww = cropFloat(att.ww*0.7);
+		att.wh = cropFloat(att.wh*0.7);
 
-		if (att[5] < 0) {
-			att[5] = 0;
+		if (att.wx < 0) {
+			att.wx = 0;
 		}
-		if (att[6] < 0) {
-			att[6] = 0;
+		if (att.wy < 0) {
+			att.wy = 0;
 		}
-		if (att[5]+att[7] > 1) {
-			att[5] = 1-att[7];
+		if (att.wx+att.ww > 1) {
+			att.wx = 1-att.ww;
 		}
-		if (att[6]+att[8] > 1) {
-			att[6] = 1-att[8];
+		if (att.wy+att.wh > 1) {
+			att.wy = 1-att.wh;
 		}
 
-		whichFrame.document.getElementById("lay1").removeEventListener("mousedown", ZoominEvent, true);
+		document.getElementById("lay1").removeEventListener("mousedown", zoomPointEvent, true);
 		
 		loadPicture(2);
 	}
 
-	whichFrame.document.getElementById("lay1").addEventListener("mousedown", ZoominEvent, true);
+	document.getElementById("lay1").addEventListener("mousedown", zoomPointEvent, true);
 }
 
 
-function Zoomout() {
+function zoomOut() {
 
 	loadPicture(1);
 }
 
 
-function Moveto() {
+function moveTo() {
+
+	function moveToEvent(event) {
 
-	function MovetoEvent(event) {
+	    var point = new Point(event);
 
-		att[5] = cropFloat(att[5]+att[7]*(event.pageX-parseInt(whichFrame.document.getElementById("lay1").style.left))/whichFrame.document.pic.offsetWidth-0.5*att[7]);
-		att[6] = cropFloat(att[6]+att[8]*(event.pageY-parseInt(whichFrame.document.getElementById("lay1").style.top))/whichFrame.document.pic.offsetHeight-0.5*att[8]);
+		att.wx = cropFloat(point.relX-0.5*att.ww);
+		att.wy = cropFloat(point.relY-0.5*att.wh);
 
-		if (att[5] < 0) {
-			att[5] = 0;
+		if (att.wx < 0) {
+			att.wx = 0;
 		}
-		if (att[6] < 0) {
-			att[6] = 0;
+		if (att.wy < 0) {
+			att.wy = 0;
 		}
-		if (att[5]+att[7] > 1) {
-			att[5] = 1-att[7];
+		if (att.wx+att.ww > 1) {
+			att.wx = 1-att.ww;
 		}
-		if (att[6]+att[8] > 1) {
-			att[6] = 1-att[8];
+		if (att.wy+att.wh > 1) {
+			att.wy = 1-att.wh;
 		}
 
-		whichFrame.document.getElementById("lay1").removeEventListener("mousedown", MovetoEvent, true);		
+		document.getElementById("lay1").removeEventListener("mousedown", moveToEvent, true);		
 		
 		loadPicture(2);
 	}
 
-	whichFrame.document.getElementById("lay1").addEventListener("mousedown", MovetoEvent, true);
+	document.getElementById("lay1").addEventListener("mousedown", moveToEvent, true);
 }
 
 
-function Scaledef(scaledef) {
+function scale(scaledef) {
 
-	att[2] = scaledef;
+	att.ws = scaledef;
 	loadPicture(2);
 }
 
 
-function setmark() {
+function setMarks() {
 
-	if (att[4] != "" && att[4] != "0/0") {
-		var mark = att[4].split(";");
+	if (att.mk != "" && att.mk != "0/0") {
+		var mark = att.mk.split(";");
 
 		var countMarks = mark.length;
 		
@@ -347,31 +373,31 @@
 		// we do not report this error because this is already done in func. "Mark"
 		if (countMarks > 8) countMarks = 8;
 
-		var picWidth = whichFrame.document.pic.offsetWidth;
-		var picHeight = whichFrame.document.pic.offsetHeight;
+		var picWidth = document.pic.offsetWidth;
+		var picHeight = document.pic.offsetHeight;
 
 		// catch the cases where the picture had not been loaded already and
 		// make a timeout so that the coordinates are calculated with the real dimensions
-		if (whichFrame.document.pic.complete) {
-			var xoffset = parseInt(whichFrame.document.getElementById("lay1").style.left);
-			var yoffset = parseInt(whichFrame.document.getElementById("lay1").style.top);
+		if (document.pic.complete) {
+			var xoffset = parseInt(document.getElementById("lay1").style.left);
+			var yoffset = parseInt(document.getElementById("lay1").style.top);
 
 			for (var i = 0; i < countMarks; i++) {
 				mark[i] = mark[i].split("/");
 
-				if ((mark[i][0] > att[5]) && (mark[i][1] > att[6]) && (mark[i][0] < (att[5]+att[7])) && (mark[i][1] < (att[6]+att[8]))) {
+				if ((mark[i][0] >= att.wx) && (mark[i][1] >= att.wy) && (mark[i][0] <= (att.wx+att.ww)) && (mark[i][1] <= (att.wy+att.wh))) {
 
-					mark[i][0] = parseInt(xoffset+picWidth*(mark[i][0]-att[5])/att[7]);
-					mark[i][1] = parseInt(yoffset+picHeight*(mark[i][1]-att[6])/att[8]);
+					mark[i][0] = parseInt(xoffset+picWidth*(mark[i][0]-att.wx)/att.ww);
+					mark[i][1] = parseInt(yoffset+picHeight*(mark[i][1]-att.wy)/att.wh);
 
 
-					whichFrame.document.getElementById("dot" + i).style.left = mark[i][0]-5;
-					whichFrame.document.getElementById("dot" + i).style.top = mark[i][1]-5;
-					whichFrame.document.getElementById("dot" + i).style.visibility = "visible";
+					document.getElementById("dot" + i).style.left = mark[i][0]-5;
+					document.getElementById("dot" + i).style.top = mark[i][1]-5;
+					document.getElementById("dot" + i).style.visibility = "visible";
 				}
 			}
 		} else {
-			setTimeout("setmark()", 100);
+			setTimeout("setMarks()", 100);
 		}
 	}
 }
@@ -380,10 +406,10 @@
 // ascii-values of n = 110, b = 98
 function parseKeypress (event) {
 	if (event.charCode == 110) {
-		Nextpage();
+		nextPage();
 	}
 	if (event.charCode == 98) {
-		Backpage();
+		backPage();
 	}
 }
 
@@ -392,88 +418,3 @@
 function cropFloat(tmp) {
 	return parseInt(10000*tmp)/10000;
 }
-
-
-// initialize browser specific things (keypress caputring)
-function initScripts() {
-//	for (var f = 0; f < window.frames.length; f++) {
-//		window.frames[f].document.addEventListener('keypress', parseKeypress, true);
-//	}
-	whichFrame.document.addEventListener('keypress', parseKeypress, true);
-	whichFrame.focus();
-}
-
-
-// fill in the values of the "att"-array
-function initPicture(picURL) {
-	att = picURL.split("+");
-
-	if (att[0].lastIndexOf("/") == att[0].length-1) {
-		att[0] = att[0].substring(0, att[0].length-1);
-	}
-	
-	if (att.length < 2 || att[1] == "") {
-		att[1] = 1;
-	}
-	if (att.length < 3 || att[2] == "") {
-		att[2] = "1.0";
-	}
-
-	if (att.length < 4) {
-		att[3] = "";
-	}
-
-	if (att[3].indexOf("f") > -1) {
-		att[3] = "fit";
-	}
-
-	if (att.length < 5 || att[4] == "") {
-		att[4] = "0/0";
-	}
-
-	// converts the old mark format (0-1000) to new format(0.0 - 1.0)
-	if (att[4] != "0/0") {
-		var tmp = att[4].split(";");
-		
-		att[4] = "";
-		
-		for (i = 0; i < tmp.length; i++) {
-			tmp[i] = tmp[i].split("/");
-
-			if (tmp[i][0] > 1 && tmp[i][1] > 1) {
-				tmp[i][0] /= 1000;
-				tmp[i][1] /= 1000;
-			}
-			
-			att[4] += tmp[i][0] + "/" + tmp[i][1] + ";";
-		}
-		att[4] = att[4].slice(0, -1);
-	}
-	
-	if (att.length < 7) {
-		att[5] = 0;
-		att[6] = 0;
-		att[7] = 1;
-		att[8] = 1;
-	} else {
-		att[5] = parseFloat(att[5]);
-		att[6] = parseFloat(att[6]);
-		att[7] = parseFloat(att[7]);
-		att[8] = parseFloat(att[8]);
-	}
-}
-
-
-function pageInfo() {
-	
-	// bug in netscape 4.xx (confunding px and pt)
-	var fontsize = document.layers ? "11pt" : "11px";
-
-	if (window.pageFrame) {
-		pageFrame.document.open();
-		pageFrame.document.write('<html><head></head><body bgcolor="#CCCCCC" topmargin="5" marginheight="5">');
-		pageFrame.document.write('<p style="font-family: Verdana, Arial, Helvetica, sans-serif; text-align: center; color: #CC3333; font-size: ' + fontsize + '">');
-		pageFrame.document.write(att[1] + '<b> of </b>' + numPages + '</p></body></html>');
-		pageFrame.document.close();
-	}
-}