// High Jump Measurement Conversion Calculator
// Copyright M. Rand Crippen 2003-2008
// Version 5.1, Feb 27 2008
// tested in Netscape 4.76, IE6, Firefox 2.0, Opera 8.5
// Issues:
//  Opera has major rendering bugs!
//  reload doesn't reset forms in IE, FF
//  resize loses crossbar in NS4
//  IE cursor problems on drag
//  IE eats second click on doubleclick

var iFt,iQi,iMe,iCm,df,bn=0,pt=0	// Globals
D=document; DB=D.body; DA=D.all
//alert([ !DA, 99, !DB ])
NS4= !DA&&!DB
FF=  !DA&&!!DB
IE= !!DA&&!!DB
//ds([ NS4?'NS4':'-', FF?'FF':'-', IE?'IE':'-' ])

function status(s) { window.status= s }
function ds(s)     { window.defaultStatus= s }
function clip(c,i)	{return (i<0)?0:(i>c)?c:i}
//function bound(v,a,b) {a=a?a:1;b=b?b:0;return a<b?v<a?a:v<b?v:b:v<b?b:v<a?v:a}
//alert (bound(-1,2))

function update(q,c,s) {
	//ds(D.bar+'*')
	if(D.Bar) D.Bar.top= D.BarRel.pageY+80-Math.round(q/5)
	else if(FF) Bar.style.top=pt=80-Math.round(q/5)-3
	else	  Bar.style.pixelTop=pt=80-Math.round(q/5)
	D.iArrow.src= s
	f= (q-(q%=48))/48
	m= (c-(c%=100))/100
	if(f!=iFt) df.nFt.value= ' '+(iFt=f)
	if(q!=iQi) {
	 iQi=q
	 i= (q-(q%=4))/4
	 df.nIn.value= (i>9?i:'0'+i)+' '+" ¼½¾".charAt(q)
	}
	if(m!=iMe) df.nMe.value= ' '+(iMe=m)
	if(c!=iCm) df.nCm.value= (iCm=c)>9? c: '0'+c
}

ro="0.0+0.5*df.nRound.selectedIndex"
la=new Image();la.src="larrow.gif"
ra=new Image();ra.src="rarrow.gif"
function fromQi(q) {update(q,Math.floor(eval(ro)+q*2.54/4),ra.src)}
function fromCm(c) {update(Math.floor(eval(ro)+c*400/254),c,la.src)}


function doClick(inc,bn) {
 df.nCm.focus()
 if(bn<3) fromQi(clip(400, 48*iFt+iQi+inc))
 else	  fromCm(clip(254,100*iMe+iCm+inc))
 return false
}

function ws(a,b,c,d,e,f,g,h) {
 window.status=a+' '+b+' '+c+' '+d+' '+e+' '+f+' '+g+' '+h
}

var dragB
function draginit(e) {
 window.focus()
 //alert([ e, window.event, D.Bar, Bar.style ])
 dragB=	e? e.which: event.button
 //if(!e) e=event
 //dY=	e? D.Bar.top-e.pageY-D.BarRel.pageY: Bar.style.pixelTop-event.clientY
 //ds([ pt, Bar.style.pixelTop, (e? e.pageY: event.clientY) ])
 dY=	D.Bar	? D.Bar.top-e.pageY-D.BarRel.pageY
		: pt- (e? e.pageY: event.clientY)
 //dY=	e? D.Bar.top-e.pageY-D.BarRel.pageY: Bar.style.pixelTop-event.clientY
 if(NS4) D.captureEvents(Event.MOUSEMOVE)
 DMM0=D.onmousemove, D.onmousemove=dragmove
 if(DB)DBC0=DB.style.cursor, DB.style.cursor='n-resize'
 if(DB)BarC0=Bar.style.cursor, Bar.style.cursor='n-resize'
 return false
}

function dragmove(e) {
 if (dragB==(e? e.which: event.button)){
	Y= (e? e.pageY: event.clientY)+dY
	v= Y<0? 80: Y>80? 0: 80-Y	// 0..80
	//ds([ e, (e? e.pageY: event.clientY), dY, Y, v ])
	;(e? e.pageX*2<window.innerWidth: event.clientX*2<D.body.clientWidth)?
		fromQi(5*v): fromCm(((v*=254)-v%80)/80)
	return false
 }
}

function dragstop() {
 dragB=-1
 if(!DB) D.releaseEvents(Event.MOUSEMOVE)
 D.onmousemove= DMM0
 if(DB)DB.style.cursor= DBC0
 if(DB)Bar.style.cursor= BarC0
}

function ShowAt(o,s,p) { o.x=p?s.pageX:s.x; o.y=p?s.pageY:s.y; o.visibility="show" }


if(!DB)D.write("<style>.abshid{position:absolute;visibility:hide}#BarRel{position:relative;visibility:hide}</style>")

D.write(
"<MAP NAME=mapA>"+
" <AREA HREF=about:+	COORDS=2,03,12,12 onClick=return(doClick(+48,1))>"+
" <AREA HREF=about:-	COORDS=2,15,12,24 onClick=return(doClick(-48,1))>"+
"</MAP><MAP NAME=mapB>"+
" <AREA HREF=about:+	COORDS=2,03,12,12 onClick=return(doClick(+1,2))>"+
" <AREA HREF=about:-	COORDS=2,15,12,24 onClick=return(doClick(-1,2))>"+
"</MAP><MAP NAME=mapC>"+
" <AREA HREF=about:+	COORDS=2,03,12,12 onClick=return(doClick(+100,3))>"+
" <AREA HREF=about:-	COORDS=2,15,12,24 onClick=return(doClick(-100,3))>"+
"</MAP><MAP NAME=mapD>"+
" <AREA HREF=about:+	COORDS=2,03,12,12 onClick=return(doClick(+1,4))>"+
" <AREA HREF=about:-	COORDS=2,15,12,24 onClick=return(doClick(-1,4))>"+
"</MAP>"+

(!DB ?
"<div id=Bar class=abshid><a href=about:+/-><img border=0 src=barHJCC2.gif></a></div>"+
"<div id=dFt class=abshid><img src=button+-.gif USEMAP=#mapA border=0></div>"+
"<div id=dIn class=abshid><img src=button+-.gif USEMAP=#mapB border=0></div>"+
"<div id=dMe class=abshid><img src=button+-.gif USEMAP=#mapC border=0></div>"+
"<div id=dCm class=abshid><img src=button+-.gif USEMAP=#mapD border=0></div>"+
"<table width=354 border=0 cellpadding=0 cellspacing=0 background=bgHJCC.gif><tr><td>"+
 "<table width=354 border=0 cellpadding=0 cellspacing=0 background=''>"+
  "<tr><td height=8><div id=BarRel><img border=0 src=barHJCC2.gif></div></td>"
:
"<table width=354 background=bgHJCC.gif border=0 cellpadding=0 cellspacing=0>"+
  "<tr><td height=8><div id=IDBar style=position:relative;cursor:pointer;cursor:hand;width:1;height:1"+
	  "><table background=barHJCC2.gif width=354 height=8><tr><td></table></div>"
)+

  "<tr><th height=78><center>"+
	"<table "+(DB?"style='position:relative'":"")+" border=2 cellspacing=0 bgcolor=yellow><tr><td>"+
	 "<table border=0 cellpadding=0 cellspacing=1>"+
	  "<tr valign=middle>"+
	   "<td><FORM NAME=fCalc>&nbsp;</td>"+
	   "<td><img src=button+-.gif NAME=bFt USEMAP=#mapA border=0></td>"+
	   "<td><INPUT NAME=nFt	TYPE=TEXT SIZE="+(DB?1:2)+" value=.4 onFocus=blur()></td>"+
	   "<td>ft&nbsp;</td>"+
	   "<td><img src=button+-.gif NAME=bIn USEMAP=#mapB border=0></td>"+
	   "<td><INPUT NAME=nIn	TYPE=TEXT SIZE="+(DB?3:4)+" value=02 onFocus=blur()></td>"+
	   "<td>in&nbsp;</td>"+
	   "<td><img src=rarrow.gif NAME=iArrow></td>"+
	   "<td>&nbsp;</td>"+
	   "<td><img src=button+-.gif NAME=bMe USEMAP=#mapC border=0></td>"+
	   "<td><INPUT NAME=nMe	TYPE=TEXT SIZE="+(DB?1:2)+" value=.1 onFocus=blur()></td>"+
	   "<td>m&nbsp;</td>"+
	   "<td><img src=button+-.gif NAME=bCm USEMAP=#mapD border=0></td>"+
	   "<td><INPUT NAME=nCm	TYPE=TEXT SIZE="+(DB?1:2)+" value=27 onFocus=blur()></td>"+
	   "<td>cm&nbsp;"+
	  "<tr><th colspan=15><small>"+
	   "<select name=nRound onChange=(D.iArrow.src==ra.src)?fromQi(48*iFt+iQi):fromCm(100*iMe+iCm)>"+
		"<option selected>Official Conversion (round down)"+
		"<option	>Closest Conversion (round off)"+
	   "</select>"+
	  "</table>"+
	 "</table>"+

 "<tr><td height=8>"+
(DB?
	 "</FORM>"+
"</table>"
:
 "</table>"+
"</table></FORM>"
)
)


df=D.fCalc
if(!DB){ShowAt(D.Bar,D.BarRel,1)
	ShowAt(D.dFt,df.bFt)
	ShowAt(D.dIn,df.bIn)
	ShowAt(D.dMe,df.bMe)
	ShowAt(D.dCm,df.bCm)
	D.Bar.captureEvents(Event.MOUSEDOWN)
	D.captureEvents(Event.MOUSEUP)
	D.Bar.onmousedown=draginit
} else	(Bar=D.getElementById('IDBar')).onmousedown=draginit
D.onmouseup=	dragstop
fromCm(234)
