/*************************************************************************
* Copyright 2006, Trustees of Indiana University. All rights reserved. This
* file is part of the Chymistry of Isaac Newton website,
* http://www.dlib.indiana.edu/collections/newton
* External javascript libraries have been included here; see
* individual copyright information for those libraries below. 
*************************************************************************/ 
 
/*************************************************************************
 Name: makePanelTop, imgStyleDrag, imgStyleDragEnd
 Desc: These functions are keyed to events handled by the * dom-drag.js
 	   library, below.  They are called within the showImgPanel function.
*************************************************************************/
	   
var panels = [];

makePanelTop = function() {
	/* var start = this.style.zIndex;
	for (var i = 0; i < panels.length; i++) {
		if (panels[i].style.zIndex > start ) panels[i].style.zIndex--;
	}
	this.style.zIndex = panels.length - 1; */
	this.style.zIndex = 65535;
}
  
pStyleDrag = function() {
	this.style.opacity = '.70';
	this.style.filter = "alpha(opacity=70)";
}

pStyleDragEnd = function() {
	this.style.opacity = '1.0'; 
	this.style.filter = "alpha(opacity=100)";
}
	
/*************************************************************************
 Name: hidePanel
 Desc: Closes a panel. 
	  
 Params: 
 theInstance - the unique id of the panel to hide (i.e. 70r_screen, 'panel_')
*************************************************************************/

function hidePanel(theInstance) { 
	if (!document.getElementById) return null;
	document.getElementById("panel" + "_" + theInstance).style.visibility = "hidden";
}

/*************************************************************************
 Name: showPanel
 Desc: Opens a new panel. 
 Params: 
 e		   - the event triggering the swap (typically onClick)
 theInstance - the id of the panel to show (i.e. 70r_screen)
 theImgSrc   - relative path to the img (i.e. /collections/newton/img/70r.gif)
 x		   - horizontal offset (in pixels) for new panel
 y		   - vertical offset (in pixels) for new panel 
*************************************************************************/

function showPanel(e,theInstance,x,y) {
	var offx = (x)? x - 0 : 20;
	var offy= (y)? y - 0 : 20;
	var theHandle = document.getElementById("handle" + "_" + theInstance);
	var theRoot   = document.getElementById("panel" + "_" + theInstance);
	Drag.init(theHandle, theRoot);
	theRoot.onDragStart = makePanelTop;
	theRoot.onDrag = pStyleDrag;
	theRoot.onDragEnd = pStyleDragEnd;
	panels[panels.length] = theRoot;
	/* panels[panels.length-1].style.zIndex = panels.length - 1; */
	panels[panels.length-1].style.zIndex = 65535;
	positionPanel(e,theRoot,offx,offy);
	theRoot.style.visibility = "visible";
}

/*************************************************************************
 Name: showImgPanel
 Desc: Opens a new image panel. Distinct from showPanel in that the
	   content is written when the panel is made visible.
 NOTE: probably this should be generalized.
 Params: 
 e		   - the event triggering the swap (typically onClick)
 theInstance - the id of the panel to show (i.e. 70r_screen)
 theImgSrc   - relative path to the img (i.e. /collections/newton/img/70r.gif)
 x		   - horizontal offset (in pixels) for new panel
 y		   - vertical offset (in pixels) for new panel 
*************************************************************************/

function showImgPanel(e,theInstance,theImgSrc,x,y) {
	var offx = (x)? x - 0 : 20;
	var offy = (y)? y - 0 : 20;
	var theHandle = document.getElementById("handle" + "_" + theInstance);
	var theRoot   = document.getElementById("panel" + "_" + theInstance);
	var theContent   = document.getElementById("content" + "_" + theInstance);
	var theImg = "<img alt='Page image' title='Page image' onload='scaleImage(this);' src='" + theImgSrc + "'>";
	Drag.init(theRoot, theRoot);
	theRoot.onDragStart=makePanelTop;
	theRoot.onDrag=pStyleDrag;
	theRoot.onDragEnd=pStyleDragEnd;
	panels[panels.length]=theRoot;
	/* panels[panels.length-1].style.zIndex = panels.length-1; */
	panels[panels.length-1].style.zIndex = 65535;
	positionPanel(e,theRoot,offx,offy);
	theContent.innerHTML = theImg;
	theRoot.style.visibility = "visible";
}

/*************************************************************************
 Name: positionPanel
 Desc: Uses functions from the dyn-web libraries also in this file to
	   position panels.  
 NOTE: This is not working so well in i.e., needs to be refactored.
 
 Params: 
 e		   - the event from which the position will be determined (typically onClick)
 o		   - the object to position
 offx		- horizontal offset (in pixels) for new panel
 offy		- vertical offset (in pixels) for new panel 
*************************************************************************/
	
function positionPanel(e,o,offX,offY) {
	var x = 0, y = 0; viewport.getAll();
	x = e.pageX? e.pageX: e.clientX + viewport.scrollX;
	y = e.pageY? e.pageY: e.clientY + viewport.scrollY;
	if (y < 0) y = 25;
	if (x < 0) x = 25;
	o.style.left = x + "px"; o.style.top = y + "px";
}

/*************************************************************************
 
 dw_viewport.js
 version date Nov 2003
 
 This code is from Dynamic Web Coding 
 at http://www.dyn-web.com/
 Copyright 2003 by Sharon Paine 
 See Terms of Use at http://www.dyn-web.com/bus/terms.html
 regarding conditions under which you may use this code.
 This notice must be retained in the code as is!
	
*************************************************************************/  
	
var viewport = {
	getWinWidth: function () {
		this.width = 0;
		if (window.innerWidth) this.width = window.innerWidth - 18;
		else if (document.documentElement && document.documentElement.clientWidth)
			this.width = document.documentElement.clientWidth;
		else if (document.body && document.body.clientWidth) 
			this.width = document.body.clientWidth;
	},
	
	getWinHeight: function () {
		this.height = 0;
		if (window.innerHeight) this.height = window.innerHeight - 18;
		else if (document.documentElement && document.documentElement.clientHeight) 
			this.height = document.documentElement.clientHeight;
		else if (document.body && document.body.clientHeight) 
			this.height = document.body.clientHeight;
	},
	
	getScrollX: function () {
		this.scrollX = 0;
		if (typeof window.pageXOffset == "number") this.scrollX = window.pageXOffset;
		else if (document.documentElement && document.documentElement.scrollLeft)
			this.scrollX = document.documentElement.scrollLeft;
		else if (document.body && document.body.scrollLeft) 
			this.scrollX = document.body.scrollLeft; 
		else if (window.scrollX) this.scrollX = window.scrollX;
	},
	
	getScrollY: function () {
		this.scrollY = 0;	
		if (typeof window.pageYOffset == "number") this.scrollY = window.pageYOffset;
		else if (document.documentElement && document.documentElement.scrollTop)
			this.scrollY = document.documentElement.scrollTop;
		else if (document.body && document.body.scrollTop) 
			this.scrollY = document.body.scrollTop; 
		else if (window.scrollY) this.scrollY = window.scrollY;
	},
	
	getAll: function () {
		this.getWinWidth(); this.getWinHeight();
		this.getScrollX();  this.getScrollY();
	}
}
	
/**************************************************
* dom-drag.js
* 09.25.2001
* www.youngpup.net
**************************************************
* This library was borrowed from youngpup.net,
* it has not been altered internally - tlcamero
**************************************************/

var Drag = {
	obj : null,
	init : function(o, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper) {
		o.onmousedown	= Drag.start;
		o.hmode			= bSwapHorzRef ? false : true ;
		o.vmode			= bSwapVertRef ? false : true ;
		o.root = oRoot && oRoot != null ? oRoot : o ;
		if (o.hmode  && isNaN(parseInt(o.root.style.left  ))) o.root.style.left   = "0px";
		if (o.vmode  && isNaN(parseInt(o.root.style.top   ))) o.root.style.top	= "0px";
		if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.style.right  = "0px";
		if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = "0px";
		o.minX	= typeof minX != 'undefined' ? minX : null;
		o.minY	= typeof minY != 'undefined' ? minY : null;
		o.maxX	= typeof maxX != 'undefined' ? maxX : null;
		o.maxY	= typeof maxY != 'undefined' ? maxY : null;
		o.xMapper = fXMapper ? fXMapper : null;
		o.yMapper = fYMapper ? fYMapper : null;
		o.root.onDragStart	= new Function();
		o.root.onDragEnd	= new Function();
		o.root.onDrag		= new Function();
	},
	
	start : function(e) {
		var o = Drag.obj = this;
		e = Drag.fixE(e);
		var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		o.root.onDragStart(x, y);
		o.lastMouseX	= e.clientX;
		o.lastMouseY	= e.clientY;
		if (o.hmode) {
			if (o.minX != null)	o.minMouseX	= e.clientX - x + o.minX;
			if (o.maxX != null)	o.maxMouseX	= o.minMouseX + o.maxX - o.minX;
		} else {
			if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x;
			if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x;
		}
		if (o.vmode) {
			if (o.minY != null)	o.minMouseY	= e.clientY - y + o.minY;
			if (o.maxY != null)	o.maxMouseY	= o.minMouseY + o.maxY - o.minY;
		} else {
			if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y;
			if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y;
		}
		document.onmousemove	= Drag.drag;
		document.onmouseup = Drag.end;
		return false;
	},

	drag : function(e) {
		e = Drag.fixE(e);
		var o = Drag.obj;
		var ey	= e.clientY;
		var ex	= e.clientX;
		var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		var nx, ny;
		if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX);
		if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX);
		if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY);
		if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY);
		nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1));
		ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1));
		if (o.xMapper)		nx = o.xMapper(y)
		else if (o.yMapper)	ny = o.yMapper(x)
		Drag.obj.root.style[o.hmode ? "left" : "right"] = nx + "px";
		Drag.obj.root.style[o.vmode ? "top" : "bottom"] = ny + "px";
		Drag.obj.lastMouseX	= ex;
		Drag.obj.lastMouseY	= ey;
		Drag.obj.root.onDrag(nx, ny);
		return false;
	},

	end : function() {
		document.onmousemove = null;
		document.onmouseup   = null;
		Drag.obj.root.onDragEnd(parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]), parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]));
		Drag.obj = null;
	},

	fixE : function(e) {
		if (typeof e == 'undefined') e = window.event;
		if (typeof e.layerX == 'undefined') e.layerX = e.offsetX;
		if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;
		return e;
	}
};

/*************************************************************************
 Name: showTextPanel
 Desc: A modification of showImgPanel designed for the display of textual
      notes.
 Params: 
 e		   - the event triggering the swap (typically onClick)
 theInstance - the id of the panel to show (i.e. 70r_screen)
 theText   - the text to be included within the new panel
 x		   - horizontal offset (in pixels) for new panel
 y		   - vertical offset (in pixels) for new panel 
*************************************************************************/
 
function showTextPanel(e,theInstance,theText,x,y) {
	var offx = (x)? x - 0 : 20;
	var offy = (y)? y - 0 : 20;
	var theHandle = document.getElementById("handle" + "_" + theInstance);
	var theRoot   = document.getElementById("panel" + "_" + theInstance);
	var theContent   = document.getElementById("content" + "_" + theInstance);
	Drag.init(theRoot, theRoot);
	theRoot.onDragStart=makePanelTop;
	theRoot.onDrag=pStyleDrag;
	theRoot.onDragEnd=pStyleDragEnd;
	panels[panels.length]=theRoot;
	/* panels[panels.length-1].style.zIndex = panels.length-1; */
	positionPanel(e,theRoot,offx,offy);
	theContent.innerHTML = theText;
	theRoot.style.visibility = "visible";
}

function displayNote(noteicon,title,e,theInstance,x,y) {
	var val = eval("document.getElementById(noteicon).innerHTML");
	/* document.getElementById("title_" + theInstance).innerHTML = "Note type: " + title; */
	return showTextPanel(e, theInstance, val, x, y);
}