var tempX;
var tempY;
var oldX;
var oldY;
var z = 2;
var Users = new Array();
var IE = document.addEventListener?false:true
var currentTarget;
var currentFunction;
var tiles = document.getElementById('tiles');
var divs = document.getElementsByTagName('DIV');
var container = document.getElementById('container');
if (!IE) document.captureEvents(Event.MOUSEMOVE);
function getNextHighestDepth() {
	z = z+1;
}
function player (name, color) {
		this.name = name;
		this.color = color;
	}
function addEvent(elm, evType, fn, useCapture) {
		if(elm.addEventListener) {
			elm.addEventListener(evType, fn, useCapture);
			return true;
		} else if( elm.attachEvent) {
			var r = elm.attachEvent('on' + evType, fn);
		} else {
			elm['on' +evType] = fn;	
		}
	}
function render(e) {
    oldX = tempX;
    oldY = tempY;
  if (IE) {
    tempX = event.clientX;
    tempY = event.clientY;
  } else {  
    tempX = e.pageX;
    tempY = e.pageY;
  } 
  if(currentFunction == 'expand') { expand(currentTarget) } else if (currentFunction == 'drag') { drag(currentTarget);}
 } 
function expand(t) {
		getNextHighestDepth();

	if(t) {
		while(t.className != 'tile') {
			t = t.parentNode;
		}		
		t.style.width =  parseInt(tempX - (t.offsetLeft)-45)+'px';
		t.style.height = parseInt(tempY - (t.offsetTop)-25)+'px';
		t.style.zIndex = z;
	}
}
function overlayOpen(e) {
		var t = (e.target) ? e.target : e.srcElement;
		getNextHighestDepth();

	if(t) {
		while(t.className != 'tile') {
			t = t.parentNode;
		}		
		t.style.width =  '400px';
		t.style.height = '500px';
		t.style.top = '0px;'
		t.style.zIndex = z;
	}
}
function drag(t) {
		getNextHighestDepth();	
		if(t.className == 'handler') { expand(t); return false; };
		while(t.className != 'tile') { t = t.parentNode;}	
		t.style.left =  parseInt(t.offsetLeft+(tempX-oldX))+'px';
		t.style.top =  parseInt(t.offsetTop+(tempY-oldY))+'px';
		t.style.zIndex = z;
}
///attach expands
function setTargetMouseOver(e) {
	currentFunction = 'expand';
	currentTarget = (e.target) ? e.target : e.srcElement;
}
function setTargetMouseDown(e) {
	currentTarget = (e.target) ? e.target : e.srcElement;
	currentFunction = 'drag';
	addEvent(currentTarget,'mouseup',setTargetMouseUp,false);
}
function setTargetMouseUp(e) {
	currentTarget = (e.target) ? e.target : e.srcElement;
	if(document.addEventListener) {
	    currentTarget.removeEventListener('mouseover',setTargetMouseOver,true);
	    }
	currentTarget = '';
	currentFunction = '';
}
function setTargetMouseOut(e) {
	currentTarget = '';
	currentFunction = '';
}


////EMPHASIZING TARGET BLOCKS FOR IE, EMPH FOR MOZ/NET IN CSS
function emphasize(e) {
	getNextHighestDepth();
	var tempT = (e.target) ? e.target : e.srcElement;
	tempT = 'tile'+tempT.id.slice(-1);
	var t = document.getElementById(tempT);
	t.style.borderWidth = '2px';
	t.style.zIndex = z;
	t.style.left =  parseInt(t.offsetLeft-1)+'px';
	t.style.top =   parseInt(t.offsetTop-1)+'px';
}
function deemphasize(e)  {
	getNextHighestDepth();	
	var tempT = (e.target) ? e.target : e.srcElement;
	tempT = 'tile'+tempT.id.slice(-1);
	var t = document.getElementById(tempT);
	t.style.borderWidth = '1px';
	t.style.z = z;
	t.style.left =  parseInt(t.offsetLeft+1)+'px';
	t.style.top =   parseInt(t.offsetTop+1)+'px';;
}
var timeout;
function resetx(target) {
	////TIMEOUT
		var t = document.getElementById(target);
		t.style.backgroundColor = "#000000";
		document.getElementById('media').innerHTML = '';
		t.style.top = '10px';
		t.style.left = '10px';
		t.style.width = '40px';
		t.style.height = '40px';
		clearTimeout(timeout);
	}
function openTile(target,w,h,r) {
	clearTimeout(timeout);
	getNextHighestDepth();	
	var t = document.getElementById(target);
	var oX = t.offsetLeft;
	var oY = t.offsetTop;
	var oH = t.height;
	var oW = t.width;
	t.style.left = '10px';
	t.style.top =  '10px';
	t.style.width = w +'px';
	t.style.height = h +'px';
	t.style.zIndex = z;
//	if(GT.live == true) { timeout = setTimeout("resetx('"+target+"')", 5000);}
}
///ADD EVENTS

var temp = document.getElementsByTagName('div');
for(var i = 0; i < temp.length; i++) {
	if(temp[i].className == 'handler') {
	var targetDiv = temp[i];
		addEvent(targetDiv,'mousedown',setTargetMouseOver,false);
		addEvent(targetDiv,'mouseup',setTargetMouseOut,false);
	}
}
var temp = document.getElementsByTagName('div');
for(var i = 0; i < temp.length; i++) {
	if(temp[i].className == 'tile') {
	var targetDiv = temp[i];
	addEvent(targetDiv,'mousedown',setTargetMouseDown,false);
	}
}
var temp = document.getElementsByTagName('div');
for(var i = 0; i < temp.length; i++) {
	if(temp[i].className == 'overlay') {
	var targetDiv = temp[i];
		addEvent(targetDiv,'mousedown',overlayOpen,false);
	}
}
addEvent(document, 'mousemove', render, true);

////ZOOMING AND PANNING
function zIN() {
	var map = GT.map;
	var currentZoom = map.getZoomLevel();
	currentZoom == 0 ? currentZoom = 0 : currentZoom -= 1;
	map.centerAndZoom(new GPoint(4.900435, 52.37261), currentZoom);
}
function zOUT() {
	var map = GT.map;			
	var currentZoom = map.getZoomLevel();
	currentZoom == 7 ? currentZoom = 7 : currentZoom += 1;
	map.centerAndZoom(new GPoint(4.900435, 52.37261), currentZoom);
}

function fillArchive() {
  if (GT.live == true) {
    p_leave(); // Pushlet sessie afsluiten , switch van live naar archive
  }
  GT.live = false;
  	for(var i = 1; i < 7; i++) {
		resetx('tile'+i);	
	}
	openTile('tile7', 230, 500,false);
	document.getElementById('archiveContainer').innerHTML = "een momentje a.u.b...";
	SRV.get('q-all-tracks',fArchive);
}
function fArchive(records) {
	GT.setNacht();
	GT.clearMap();
	var id;
	var name;
	var lon;
	var lat;
	var color;
	var target = document.getElementById('archiveContainer');
	var htmlString ='<p>';
	for(var i = 0; i < records.length; i++) {
		id = records[i].getField('id');
		name = records[i].getField('name');
		lon = records[i].getField('lon');
		lat = records[i].getField('lat');
		color = records[i].getField('loginname');
		htmlString += '<a href="javascript:	GT.archiveTrack(\''+name+'\',\''+lon+'\',\''+lat+'\',\''+id+'\',\''+color+'\')"><div class="archiveItem">'+ name+'</div></a>'; 
	}
	htmlString += '</p>'
	target.innerHTML = htmlString;
//	SRV.get('q-tracks-by-user&user=red',GT.onQueryArchiveTrack);
}
function liveMode() {
	for(var i = 1; i < 7; i++) {
		resetx('tile'+i);	
	}
	openTile('tile7', 40, 50,false);
	GT.clearMap();
	SRV.get('q-active-tracks',GT.onQueryLiveTracks);
	GT.setNacht();
}
function colofon() {
	openTile('tile5', 230, 500,false);
}
addEvent(document.getElementById('zoomIn'),'mousedown',zIN,true);
addEvent(document.getElementById('zoomOut'),'mousedown',zOUT,true);
addEvent(document.getElementById('nacht'),'mousedown',GT.setNacht,true);
addEvent(document.getElementById('dag'),'mousedown',GT.setDag,true);
addEvent(document.getElementById('blanco'),'mousedown',GT.setBlanco,true);
addEvent(document.getElementById('archive'),'mousedown',fillArchive,true);
addEvent(document.getElementById('live'),'mousedown',liveMode,true);
addEvent(document.getElementById('colofon'),'mousedown',colofon,true);