//*************************************************************
// These are the functions which will allow the construction
// of a small magnifier window which can be dragged over an image
// to allow viewing of an alternate -possibly different sized
// version of the image underneath.
//
// Rupert Brooks www.cyberus.ca/~rbrooks
// Version 1.0 May 27, 2003
//
// This relies on the Dynapi cross browser library, available from
// dynapi.sourceforge.net  It was developed using version 2.5.6 of
// dynapi.
//
// This code is tested and seems to work under recent IE, Mozilla,
// and Netscape browsers.  It does not work under Opera because 
// dynapi does not.
// Some errors have been reported under a particular Mozilla 1.2.x 
// release.  Unfortunately, i can't reproduce them, so...
//
// You may use this code for whatever you like.  I'd appreciate an
// acknowledgement, and any bug fixes you may have, but its not
// a requirement.
//
// to use - first preload the images you want in the background
// use lines like this in your header.
//       magimage1=new Image();
//       magimage1.src="hubelmag.jpg";
// then name the image that you want to build the magnifier over
// something unique.
// then call buildMagnifier as follows
//
// buildMagnifier(imagename,magimage,magsizex,magsizey) {
// where imagename is the string name of the image
//       magimage is the preloaded image for in the magnifier
//                window
//       magsizex and magsizey are the size of the magnifier in 
//                pixels
//
function getXYcoord ( nvn ) {
   var elm = document.images[nvn];
   if ( document.layers ) return elm;
           // NS4 images contain x and y values
   var rd = { x:0 ,y:0 };
   do { rd.x += parseInt( elm.offsetLeft );
        rd.y += parseInt( elm.offsetTop );
        elm = elm.offsetParent;
   } while ( elm );
   return rd
}; //end getXYcoord ( string ) -> object{x,y}


function adjustMagImage(layer) {
	x=layer.getX()
        y=layer.getY()
        layer.children[0].setX((layer.targl-x)*layer.xsf)
        layer.children[0].setY((layer.targt-y)*layer.ysf)                
}

function buildMagnifier(imagename,magimage,magsizex,magsizey) {
        // color of the border of the magnifier
        magbc='#ff0000'
        // what are the height and width of the mag image
        magimgh=magimage.height
        magimgw=magimage.width

        // we call the main mag image the target
        targvar=getXYcoord(imagename);
        targh=document.images[imagename].height
        targw=document.images[imagename].width
        targt=targvar.y
        targb=targt+targh
        targl=targvar.x
        targr=targl+targw

        // x and y scale factors
        xsf=(magimgw-magsizex)/(targw-magsizex)
        ysf=(magimgh-magsizey)/(targh-magsizey)

	myLayer=new DynLayer(null,targl,targt,magsizex,magsizey,'#c0c0c0')
	magImage=new DynLayer(null,0,0,magimgw,magimgh)
        magImage.setBgImage(magimage.src)
        //myLayer.setBgImage('MRI.png')
        myLayer.addChild(magImage)
        DynAPI.document.addChild(myLayer)
        // put some thin borders around the magnifying area
        BorderL=new DynLayer(null,0,0,magsizex,1,magbc)
	BorderT=new DynLayer(null,0,magsizey-1,magsizex,1,magbc)
	BorderR=new DynLayer(null,0,0,1,magsizey,magbc)
        BorderB=new DynLayer(null,magsizex-1,0,1,magsizey,magbc)
        myLayer.addChild(BorderL)
        myLayer.addChild(BorderT)
        myLayer.addChild(BorderR)
        myLayer.addChild(BorderB)
        myLayer.xsf=xsf;
        myLayer.ysf=ysf;
        myLayer.targl=targl;
        myLayer.targt=targt;


        myListener=new EventListener(myLayer)
	myListener.ondragmove=function(e){
                adjustMagImage(e.getTarget())
	}
	myListener.ondragend=function(e){
                adjustMagImage(e.getTarget())
	}
	myLayer.addEventListener(myListener)

	DragEvent.setDragBoundary(myLayer,targt,targr,targb,targl)
	DragEvent.enableDragEvents(myLayer)

}