﻿function MireoSearch(div, geoAddressDrawer){
	this.geoAddressDrawer = geoAddressDrawer;
	var mainTable = document.createElement("table");
	mainTable.id = "_headerSearchTable";
	mainTable.cellSpacing = "0";
	mainTable.cellPadding = "0";
	mainTable.style.cssText = "width:100%;";

	var tblHead = document.createElement('THEAD');
	mainTable.appendChild(tblHead);
	var captRow = tblHead.insertRow(-1);
	captRow.style.cssText = "width:100%";
	var caption = captRow.insertCell(-1);
	caption.vAlign = "top";
	caption.style.cssText = "border:1px solid rgb(192, 192, 192); font-family:Arial, Helvetica, Verdana; font-size:14px; padding:0.2em; background-color:rgb(0,128,174);color:white; height:1.4em;width:100%";
	caption.innerHTML = "Map search";
	
	var inputCell = tblHead.insertRow(-1).insertCell(0);
	inputCell.vAlign = "top";
	inputCell.style.height = "3em";
	
	var inputTable = document.createElement("table");
	inputTable.style.width = "100%";
	inputTable.cellSpacing="0";
	inputTable.cellPadding="0";
	
	var innerInputRow = inputTable.insertRow(-1);
	var searchFieldCell = innerInputRow.insertCell(-1);
	searchFieldCell.style.cssText = "padding-top:0.2em; width:80%";
	searchFieldCell.innerHTML = "<INPUT type='text' id='searchFld' autocomplete='off' style='width:95%'/><br><span style='font-size:9pt'>(e.g. <font color='gray'>ilica 13, zagreb</font> or <font color='gray'>dicmo</font>)</span>"

	var searchButtonCell = innerInputRow.insertCell(-1);
	searchButtonCell.style.cssText = "text-align:right; padding-top:0.2em; padding-right:0.2em";
	searchButtonCell.vAlign = "top";
	searchButtonCell.innerHTML = "<input type='button' value='Search' id='searchBtn'/>";
	inputCell.appendChild(inputTable);
	div.appendChild(mainTable);
	// end of heading

	var sdiv = document.createElement('div');
	sdiv.id = '_searchDisplayDiv';
	sdiv.style.cssText = 'background-color:rgb(248,248,248);border:1px solid rgb(192,192,192);position:absolute;overflow:auto';
	sdiv.style.top = mainTable.offsetHeight + 'px';
	
	var w = (browser.type == 2 ? (div.offsetWidth - 2) : div.offsetWidth);
	sdiv.style.width = (w > 0 ? w : 0) + 'px';
	var h = (div.offsetHeight - mainTable.offsetHeight - (browser.type == 2 ? 10 : 8));
	sdiv.style.height = (h > 0 ? h : 0) + 'px';	
	div.appendChild(sdiv);

	var searchResults = document.createElement("table");
	searchResults.style.cssText = "background-color:rgb(252,252,252);width:100%;";
	searchResults.cellPadding="0";
	searchResults.cellSpacing="0";

	sdiv.appendChild(searchResults);

	
	this.searchResults = searchResults;
	this.searchField = document.getElementById('searchFld');

	this.mainDiv = div;
	attachToEvent(document.getElementById('searchBtn'), "click", eventHandler(this, "onSearch"));
	
	if(browser.type == 2){
		attachToEvent(window, "mouseout", eventHandler(this, "onWindowMouseOut"))
	}
		
	attachToEvent(window, "resize", eventHandler(this, "onWindowResize"))
	
	this.mouseDownHandler = eventHandler(this, "onMouseDown");
	this.mouseMoveHandler = eventHandler(this, "onMouseMove");
	this.mouseUpHandler = eventHandler(this, "onMouseUp");
	attachToEvent(window.document,"keydown",eventHandler(this, "onKeyDown"));
}

MireoSearch.prototype.onWindowResize = function(e){
	var mtb = document.getElementById('_headerSearchTable');
	var sdiv = document.getElementById('_searchDisplayDiv');
	sdiv.style.height = (this.mainDiv.offsetHeight - mtb.offsetHeight - (browser.type == 2 ? 10 : 8)) + 'px';	
}

MireoSearch.prototype.onSearch = function(){
	var str = this.searchField.value;
	var that = this;
	MapSearchWeb.Search(str, onSearchCallback);

	function onSearchCallback(addrs){
		WebException.validate(addrs);
		var searchResults = that.searchResults;
		while(searchResults.rows.length > 0){
			detachFromEvent(searchResults.rows[0].cells[1], "mousedown", that.mouseDownHandler);
			searchResults.deleteRow(0);
		}
		for(var i = 0; i < addrs.length; ++i){
			var row = searchResults.insertRow(i);
			that.geoAddressToTableRow(addrs[i], row);
			attachToEvent(row.cells[1], "mousedown", that.mouseDownHandler);
		}
	}
}

MireoSearch.prototype.onMouseDown = function(e){
	if (!e.target.geoAddress) return;
	
	this.eventSrc = e.target.setCapture ? e.target : window;
	if(this.eventSrc.setCapture) this.eventSrc.setCapture();
	
	attachToEvent(this.eventSrc, "mousemove", this.mouseMoveHandler);
	attachToEvent(this.eventSrc, "mouseup", this.mouseUpHandler);
	
	this.drag = true;
	var td = e.target;
	
	var dv = document.createElement("DIV");
	
	var posx = findPosX(e.target);
	var posy = findPosY(e.target) 

	posx -= td.offsetParent.offsetParent.scrollLeft;
	posy -= td.offsetParent.offsetParent.scrollTop;

	var dvcss = "text-indent:0.3em; font-family:Arial, Helvetica, Verdana; font-size:10pt;";
	dvcss += "background-color:rgb(248, 248, 255);padding-top:2px;";
	dvcss += "position:absolute;border:1px solid rgb(0, 0, 0);display:block";
	dv.style.cssText = dvcss;
	
	var iecorr = browser.type == 1 ? 2 : 0;
	dv.style.width = (td.offsetWidth + iecorr) + "px";
	dv.style.height = (td.offsetHeight - 3 + iecorr * 2) + "px";

	dv.style.left = posx+'px'; 
	dv.style.top = posy+'px';
	dv.innerHTML = td.innerHTML;
	dv.geoAddress = td.geoAddress;
	document.body.appendChild(dv);
	
	var pt = getMouseCoordinates(e);
	dv.offsetX = posx - pt.x;
	dv.offsetY = posy - pt.y;
	
	this.floatDiv = dv;
	this.eventSrc.setCapture != null ? this.eventSrc.style.cursor = 'move' : this.floatDiv.style.cursor = 'move';	
	cancelBubbling(e);
}

MireoSearch.prototype.onMouseMove = function(e){
	if (this.drag){
		var pt = getMouseCoordinates(e);
		this.floatDiv.style.left = (pt.x+this.floatDiv.offsetX)+"px";
		this.floatDiv.style.top = (pt.y+this.floatDiv.offsetY)+"px";
	}
	if (this.floatDiv){
		var pt = getMouseCoordinates(e);
		DragDropHelper.preDrop(this.floatDiv, pt.x, pt.y);
	}
}

MireoSearch.prototype.onMouseUp = function(e){
	this.drag = false;
	if(this.floatDiv){
		document.body.removeChild(this.floatDiv);
		var pt = getMouseCoordinates(e);
		DragDropHelper.drop(this.floatDiv, pt.x, pt.y);
		this.floatDiv = null;
	}

	detachFromEvent(this.eventSrc, "mousemove", this.mouseMoveHandler);
	detachFromEvent(this.eventSrc, "mouseup", this.mouseUpHandler);

	if (this.eventSrc.style != null)
		this.eventSrc.style.cursor = 'default';	
	
	if(this.eventSrc.releaseCapture)
		this.eventSrc.releaseCapture();
	this.eventSrc = null;
}

MireoSearch.prototype.onWindowMouseOut = function(e){
	if(!e.relatedTarget && this.drag)
		this.onMouseUp(e);
}

MireoSearch.prototype.geoAddressToTableRow = function(addr, row){
	row.style.height = "1.3em";
	var cell = row.insertCell(-1);
	this.intToCell(row.rowIndex, cell, addr);
	cell = row.insertCell(-1);
	this.geoAddressToCell(addr, cell);
}

MireoSearch.prototype.geoAddressToCell = function(addr, cell){
	cell.style.fontFamily = "Arial, Helvetica, Verdana";
	cell.style.fontSize = "10pt";
	cell.style.borderBottom = "1px solid rgb(192,192,192)";
	cell.style.backgroundColor = "rgb(248, 248, 255)"; 
	cell.style.cursor = "default";
	cell.style.paddingLeft = "0.3em";
	cell.innerHTML = MireoSearch.ga2HTML(addr);
	cell.geoAddress = addr;
	cell.setAttribute("noWrap","true");
}

MireoSearch.prototype.intToCell = function(i, cell, addr){
	var cs = 'font-family:Arial, Helvetica, Verdana; font-size:12px; border-bottom:1px solid rgb(192,192,192);';
	cs += 'border-right:1px solid rgb(192,192,192); background-color:rgb(248, 248, 255); cursor:pointer;';
	cs += 'padding-left:2px; width:20px; text-decoration:underline; color:blue;text-align:center';
	cell.style.cssText = cs;
	var drw = this.geoAddressDrawer;
	cell.onclick = function(){drw.zoomToGeoAddress(addr);};
	cell.innerHTML = (i+1)+".";
}

MireoSearch.prototype.onKeyDown = function(e){
	if(e.target != null && e.target.id == 'searchFld' && e.keyCode == 13){
		this.onSearch();
		return false;
	}
	return true;
}

MireoSearch.ga2HTML = function(ga){
	if (ga._street){
		var ret = ga._street;
		if (ga._house_no)
			ret += " "+ga._house_no
		ret += ", " + ga._PLZ + " " + ga._city;
	}else{
		ret = ga._PLZ + " "+ga._city;
	}
	return ret;	
}
