// global variables
window.onload =  init; 
nsnav =  (document.all) ? false : true;
var inifoc = 'v0015'; // default initial focus: Nathon;
function Pan() {
var p, ps, s;
	this.setup = function() {
		p = document.createElement("div" );
		p.id='panbox';
		ps = p.style;
		ps.position = 'absolute'; ps.backgroundImage='url(../images/50percent.gif)';
		ps.height = '38px'; ps.width = '44px';
		ps.top = '0px'; ps.left = '0px';
		ps.border='1px solid blue';
    	document.getElementById('m004').insertBefore(p,null);
		s = document.getElementById('scrollmap');
		p.onmouseover = this.obj_over;
		p.onmouseout = this.obj_out;
		//if (nsnav) { p.onmousedown = this.obj_netscapeselect; }
		// else { p.onmousedown = this.obj_select; }
		p.onmousedown = this.obj_select;
		p.onmouseup = this.obj_drop;
		p.onmousemove = null;
	}
	this.obj_select = function() {
		ps.cursor='move';
		ps.borderColor = 'yellow';
		p.onmousemove = document.pan.obj_move;
		p.onmouseout = document.pan.obj_move; // recapture focus
		s.scrollTop = 10 * window.event.y - 190;
		s.scrollLeft = 10 * window.event.x - 220;
	}
	this.obj_over = function() {
		ps.cursor='hand';
		ps.borderColor = 'lightblue';
	}
	this.obj_out = function() {
		ps.cursor='default';
		ps.borderColor = 'purple';
	}
	this.obj_drop = function() {
		ps.cursor='hand';
		ps.borderColor = 'purple';
		p.onmouseout = document.pan.obj_out;
		p.onmousemove = null;
	}
	this.obj_move = function() {
		if (window.event.button == 1) {
			s.scrollTop = 10 * window.event.y - 190;
			s.scrollLeft = 10 * window.event.x - 220;
		}
		else {
			ps.cursor='default';
			ps.borderColor = 'purple';
			p.onmouseout = document.pan.obj_out;
			p.onmousemove = null;
		}
	}
}
document.pan = new Pan();

function Drag() {
var drag_dx, drag_dy, scroll_x, scroll_y, p, ps, s, sm, vb;
	this.setup = function() {
		p = document.createElement("div" );
		ps = p.style;
		ps.position = 'absolute'; ps.backgroundImage='url(../images/c.gif)';
		ps.height = document.getElementById('mapgrid').clientHeight+'px';
		ps.width = document.getElementById('mapgrid').clientWidth+'px';
		s = document.getElementById('scrollmap');
                s.insertBefore(p,null);
		ps.posTop = 0; ps.posLeft = 0;
		p.onmouseover = this.obj_over;
		p.onmouseout = this.obj_out;
		p.onmousedown = this.obj_select;
		p.onmouseup = this.obj_drop;
	}
	this.obj_select = function() {
		ps.cursor='move';
		drag_dx = window.event.x;
		drag_dy = window.event.y;
		p.onmousemove = document.drag.obj_move;
	}
	this.obj_over = function() {
		ps.cursor='crosshair';
		p.onmousemove = null;
	}
	this.obj_out = function() {
		ps.cursor='default';
		p.onmousemove = null;
	}
	this.obj_drop = function() {
		ps.cursor='crosshair';
		p.onmousemove = null;
	}
	this.obj_move = function() {
		s.scrollTop  += (drag_dy - window.event.y); drag_dy = window.event.y;
		s.scrollLeft += (drag_dx - window.event.x); drag_dx = window.event.x;
	}
}
document.drag = new Drag();

function MapScroll() {
var s, vb, mlo, pbs;
	this.setup = function() {
		s = document.getElementById('scrollmap');
		s.scrollTop = 0; s.scrollLeft = 0;
		s.onscroll = this.adjpan;
		f = document.getElementById('fco');
		fs = f.getElementsByTagName("td");
		pbs = document.getElementById('panbox').style;
	}
	this.adjpan = function() {
		pbs.posTop = s.scrollTop/10; pbs.posLeft = s.scrollLeft/10;  // accepts floating point
		if (mlo) { mlo.style.color = 'gray'; } // erase previous focus on scroll
		f.style.visibility='hidden';
		document.getElementById('pnrd').style.visibility='visible';
		document.vill.setup(); // enable quick jump mode after first scroll
	}

	this.locpos = function() {
                pnrd_style = document.getElementById('pnrd').style;
/*
		with (document.getElementById('pnrd').style) {
			mly = posTop; mlx = posLeft; }
*/
                mly = pnrd_style.posTop; mlx = pnrd_style.posLeft;
		s.onscroll = null;
                //console.log (parseInt(pnrd_style.top));
		//s.scrollLeft= mlx-s.clientWidth/2; s.scrollTop = mly-s.clientHeight/2;
                // firefox:
		s.scrollLeft= parseInt(pnrd_style.left)-s.clientWidth/2;
                s.scrollTop = parseInt(pnrd_style.top)-s.clientHeight/2;
		//pbs.posTop = s.scrollTop/10) + "px";
                //pbs.posLeft = s.scrollLeft/10;  // accepts floating point
		pbs.top =  parseInt(s.scrollTop/10) + "px";
                pbs.left = parseInt(s.scrollLeft/10) + "px";
		s.onscroll = document.mapscroll.adjpan;
		$tagsarray = s.getElementsByTagName("span");
		mlo = $tagsarray[$tagsarray.length-1]; // current location is listed last
		mlo.style.color = '#D06';
	}

	this.focuson = function(vill) {
		s.onscroll = null;
		h = (vill.substr(1,4)*1);
		mlx = document.conv.cdxy(h)[1];
		mly = document.conv.cdxy(h)[0];
		with (document.getElementById('pnrd').style) {
			posTop = mly; posLeft = mlx; visibility = 'visible'; }
		fs[0].innerHTML=document.getElementById(vill).innerHTML;
		fs[1].innerHTML=hotloc[vill.substr(1)*1][0];
		fs[2].innerHTML=hotloc[vill.substr(1)*1][1];
		f.style.visibility='visible';
		s.scrollLeft= mlx-s.clientWidth/2; s.scrollTop = mly-s.clientHeight/2;
		if (mlo) { mlo.style.color = 'gray'; } // erase previous focus
		mlo = document.getElementById(vill.replace(/v/, 'l'));
		if (mlo) {mlo.style.color = '#D06'; } // hilite current focus
		pbs.posTop = s.scrollTop/10; pbs.posLeft = s.scrollLeft/10;  // accepts floating point
		s.onscroll = document.mapscroll.adjpan;
	}
}
document.mapscroll = new MapScroll();

function Vill() {
	this.setup = function() {
		/* var bitems = document.getElementById('n001').getElementsByTagName("span");
		for (i=0;i<bitems.length;i++) {
			bitems[i].onmouseover = this.obj_over;
			bitems[i].onmouseout  = this.obj_out;

			h = (bitems[i].id.substr(1,4)*1);
			hx = document.conv.cdxy(h)[1]-4;
			hy = document.conv.cdxy(h)[0]-4;
			htIcon = "<img id=h"+bitems[i].id.substr(1,4)+" width='9' height='9'>";
			var newHtImg = document.createElement(htIcon);
			newHtImg.src='images/maps/hotel.gif';
    		newHtImg.alt=bitems[i].innerText;
		}
    		*/
	}
	this.obj_over = function() {
		e=window.event.toElement;
		e.style.cursor='progress';
		e.onmousemove = null;
		dla = window.setTimeout("document.vill.obj_sure(" + e.id + ")", 500);
	}
	this.obj_out = function() {
		clearTimeout(dla);
		e=window.event.fromElement;
		e.style.backgroundColor = '';
		e.style.cursor='default';
		e.onmousemove = null;
	}
	this.obj_sure = function(sr_el) {
		var o = eval(sr_el);
		o.style.cursor='hand';
		o.style.backgroundColor = 'yellow';
		document.mapscroll.focuson(o.id);
	}
}
document.vill = new Vill();

function Tiles() {
	this.setup = function() {
		var tiles = document.getElementById('mapgrid').getElementsByTagName("img");
		for (var i=0;i<tiles.length;i++) {
			tiles[i].src = "../images/maps/maptiles/dtiles_"+(i<9 ? "0"+(i+1) : i+1)+".gif"; }

/*
		var newHtImg = document.createElement("<img id=pnrd height='10' width='10'>");

		newHtImg.src='../images/maps/ptred.gif';
                with (newHtImg.style) {
                        position='absolute'; left = '0px'; top = '0px'; visibility = 'hidden';}
                document.getElementById('mapgrid').insertBefore(newHtImg);
*/
        }
}
document.tiles = new Tiles();

function Conv() {
// lon. map scale: 1px : .01048 lon mins
// 95.41px / lon. Min
// lat. map scale: 1px : .01009 lat mins
// 99.09px / lat min

// calculate pixel xy equivalent of lon/lat array
var min_lgtd = 53.836; //E099°53.836'
var max_lgtd = 66.225; //E100°06.225'
var min_lttd = 24.092; //N 09°24.092'
var max_lttd = 36.021; //N 09°36.021'
var lon_scale, lat_scale;

	this.setup = function() {
		lon_scale = document.getElementById('mapgrid').offsetWidth / ( max_lgtd - min_lgtd );
		lat_scale = document.getElementById('mapgrid').offsetHeight / ( max_lttd - min_lttd );
	}

	this.cdxy = function(hti) 
	{
		cvd = new Array(2);
		var ss = hotloc[hti][0].split(/^N|°|'$/);
		var f = Math.max( Math.min(ss[1], max_lttd), min_lttd);
		cvd[0] = Math.round((max_lttd - f)*lat_scale);
		ss = hotloc[hti][1].split(/^E|°|'$/);
		f = Math.max( Math.min( (ss[0]-99)*60 + 1*ss[1], max_lgtd), min_lgtd);
		cvd[1] = Math.round((f - min_lgtd)*lon_scale);
		return cvd;
	}
}
document.conv = new Conv();

function init() {   document.tiles.setup(); document.pan.setup(); document.mapscroll.setup(); document.drag.setup();
					document.conv.setup(); document.mapscroll.locpos(); document.nav.setup();
}