//
// Internal functions not in API
//

PWidget.prototype.buildWidget = function() {
	if (this.id == P_WIDGET_LAYER_ID) {
		this.map.widgetLayer = this;
		if (this.title && this.title.innerHTML == "")
			this.setLabel("Display " + this.map.getCurrentMapType().getName() + " Layers");
		
		if (!this.layersDiv) {
			this.layersDiv = document.createElement("div");
			this.body.appendChild(this.layersDiv);
		}
		else {
                	this.layersDiv.innerHTML = "";
		}

		var layers = this.map.getCurrentMapType().getMapLayers();
		for (var i=1; i<layers.length; i++) {
			if (layers[i].title != "donotshowinwidget") {
				var checkDiv = document.createElement("div");
				checkDiv.style.styleFloat = "left";
				checkDiv.style.cssFloat = "left";
			
				var check = document.createElement("input");
				check.type = "checkbox";
				check.value = i;
				checkDiv.appendChild(check);
				this.layersDiv.appendChild(checkDiv);
				
				if (layers[i].isOn())
					check.checked = "true";
				check.onclick = function() { if (layers[this.value].isOn()) layers[this.value].off(); else layers[this.value].on(); };
			
				var textDiv = document.createElement("div");
				textDiv.style.styleFloat = "left";
				textDiv.style.cssFloat = "left";
				textDiv.style.paddingTop = "3px";
				textDiv.style.paddingLeft = "2px";
				textDiv.innerHTML = layers[i].title;
				this.layersDiv.appendChild(textDiv);
			
				var br = document.createElement("br");
				br.clear = "both";
				this.layersDiv.appendChild(br);
			}
		}
	}
	else if (this.id == P_WIDGET_OVERLAY_ID) {
		this.map.widgetOverlay = this;
		if (!this.expandDiv)
			this.expandDiv = [];
		if (this.title && this.title.innerHTML == "")
			this.setLabel("Display Overlays");
		
		if (!this.overlaysDiv) {
			this.overlaysDiv = document.createElement("div");
			this.overlaysDiv.style.padding = "1px";
			this.body.appendChild(this.overlaysDiv);
		}
		else {
                	this.overlaysDiv.innerHTML = "";
		}

		var overlays = this.map.getOverlaySets();
		for (var i=0; i<overlays.length; i++) {
			var overlayi = overlays[i];
			var checkDiv = document.createElement("div");
			checkDiv.style.styleFloat = "left";
			checkDiv.style.cssFloat = "left";
			
			var check = document.createElement("input");
			check.type = "checkbox";
			check.value = i;
			checkDiv.appendChild(check);
			this.overlaysDiv.appendChild(checkDiv);
			
			if (overlayi.isOn())
				check.checked = "true";
			check.onclick = function() { if (overlays[this.value].isOn()) overlays[this.value].off(); else overlays[this.value].on(); };
	
			// add icon for the set
			var imgWidth = 10;
			var iconDiv = null;
			if ((overlayi.markers && overlayi.markers[0]) || overlayi.icon) {
				var overlay = null;
				if (overlayi.markers && overlayi.markers[0])
					overlay = overlayi.markers[0];
				if (overlay instanceof PMarker || overlayi.icon) {
					iconDiv = document.createElement("img");
					var icon;
					if (overlayi.icon)
						icon = new PIcon(overlayi.icon);
					else
						icon = new PIcon(overlay.icon);
					iconDiv.src = icon.image;
					var height = icon.iconSize.height;
					var width = icon.iconSize.width;
					if (width > imgWidth) {
						height = (imgWidth / width) * height;
						width = imgWidth;
					}
					iconDiv.style.height = height + "px";
					iconDiv.style.width = width + "px";
					fixPNG(iconDiv);
				}
				else if (overlay instanceof PPolyline || overlay instanceof PPolygon) {
					iconDiv = document.createElement("div");
					iconDiv.style.styleFloat = "left";
					iconDiv.style.cssFloat = "left";
					iconDiv.style.height = overlay.weight + "px";
					iconDiv.style.width = imgWidth + "px";
					iconDiv.style.marginTop = (15 - overlay.weight) + "px";
					iconDiv.style.marginRight = "3px";
					iconDiv.style.backgroundColor = overlay.color;
					iconDiv.style.fontSize = "1px";
					_BrowserIdent_setOpacity(iconDiv, overlay.opacity);
				}
			}

			var textDiv = document.createElement("div");
			var textNode = document.createTextNode(" " + overlayi.name + " [" + overlayi.getOverlayCount() + "] ");
			textDiv.style.styleFloat = "left";
			textDiv.style.cssFloat = "left";
			textDiv.style.paddingTop = "3px";
			textDiv.style.paddingLeft = "2px";
			
			if (iconDiv)
				textDiv.appendChild(iconDiv);
			textDiv.appendChild(textNode);
			//textDiv.innerHTML = "&nbsp;" + overlayi.name + " [" + overlayi.getOverlayCount() + "]&nbsp;&nbsp;";
	
			this.overlaysDiv.appendChild(textDiv);
			
			// Check if there are display filters
			if (overlayi.displayfiltergroups) {
				var menuTimer = [];
				var menuTimerNameDiv = [];
				var menuTimerValueDiv = [];
				var menuWait = 300;
				
				function findPos(obj) {
					var curleft = curtop = 0;
					if (obj.offsetParent) {
						curleft = obj.offsetLeft
						curtop = obj.offsetTop
						while (obj = obj.offsetParent) {
							curleft += obj.offsetLeft
							curtop += obj.offsetTop
						}
					}
					return [curleft,curtop];
				};

				function removeNode(div, id) {
					for (var i=0; i<div.childNodes.length; i++) {
						if (div.childNodes[i].id == id)
							div.removeChild(div.childNodes[i]);
					}

				};

				// menu elements
				var filterArrow = document.createElement("img");
				var nameDiv = document.createElement("div");
				
				// arrow to open menu
				filterArrow.style.width = "13px";
				filterArrow.style.height = "13px";
				filterArrow.style.cursor = "pointer";
				filterArrow.style.paddingRight = "3px";
				filterArrow.align = "top";
				filterArrow.textDiv = textDiv;
				filterArrow.nameDiv = nameDiv;
				filterArrow.mouseoverimg = this.map.kamap.server + "images/button_arrow_down_widget.gif";
				filterArrow.mouseoutimg = this.map.kamap.server + "images/button_arrow_widget.gif";
				filterArrow.src = filterArrow.mouseoutimg;
				filterArrow.timerIndex = i;
				filterArrow.valueDivId = "filterValueDiv";
				filterArrow.onmouseover = function() { 
					this.src = this.mouseoverimg;
					clearTimeout(menuTimer[this.timerIndex]);
					clearTimeout(menuTimerNameDiv[this.timerIndex]);
					clearTimeout(menuTimerValueDiv[this.timerIndex]);
					this.textDiv.appendChild(this.nameDiv);
					removeNode(this.textDiv, this.valueDivId);
				};
				filterArrow.onmouseout = function() {
					var self = this;
					menuTimer[self.timerIndex] = setTimeout(function() {
						self.src = self.mouseoutimg; 
						self.textDiv.removeChild(self.nameDiv);
					}, menuWait);
				};
				while (textDiv.hasChildNodes())
					textDiv.removeChild(textDiv.firstChild);
				textDiv.appendChild(filterArrow);
				if (iconDiv)
					textDiv.appendChild(iconDiv);
				textDiv.appendChild(textNode);
	
				// attribute name menu
				nameDiv.style.zIndex = 10;
				nameDiv.style.position = "absolute";
				nameDiv.style.borderTop = this.box.style.borderTop;
				nameDiv.style.borderRight = this.background.style.borderRight;
				nameDiv.style.borderBottom = this.background.style.borderBottom;
				nameDiv.style.width = "150px";
				nameDiv.style.backgroundColor = this.background.style.backgroundColor;
				nameDiv.filterArrow = filterArrow;
				nameDiv.onmouseover = function() { 
					clearTimeout(menuTimer[this.filterArrow.timerIndex]);
					clearTimeout(menuTimerNameDiv[this.filterArrow.timerIndex]); 
					clearTimeout(menuTimerValueDiv[this.filterArrow.timerIndex]); 
				};
				nameDiv.onmouseout = function() {
					var filterArrow = this.filterArrow;
					menuTimerNameDiv[filterArrow.timerIndex] = setTimeout(function() {
						filterArrow.src = filterArrow.mouseoutimg;
						filterArrow.textDiv.removeChild(filterArrow.nameDiv);
						removeNode(filterArrow.textDiv, filterArrow.valueDivId);
					}, menuWait);
				};
				var nameDivPos = findPos(filterArrow);
				var widgetPos = findPos(this.background);
				nameDiv.style.left = nameDivPos[0] - widgetPos[0] + parseInt(filterArrow.style.width) + 2 + "px";
				nameDiv.style.top = nameDivPos[1] - widgetPos[1] + "px";
				
				for (var j in overlayi.displayfiltergroups) {
					var filters = overlayi.displayfiltergroups[j];
					if (filters.length > 0) {
						var newDivOuter = document.createElement("div");
						newDivOuter.style.padding = "1px";
						newDivOuter.style.borderLeft = this.box.style.borderLeft;
						newDivOuter.style.borderRight = this.box.style.borderRight;
						newDivOuter.style.borderBottom = this.box.style.borderBottom;

						var valueDiv = document.createElement("div");
						valueDiv.id = filterArrow.valueDivId;
						valueDiv.style.zIndex = nameDiv.style.zIndex;
						valueDiv.style.position = nameDiv.style.position;
						valueDiv.style.borderTop = nameDiv.style.borderTop;
						valueDiv.style.borderRight = nameDiv.style.borderRight;
						valueDiv.style.borderBottom = nameDiv.style.borderBottom;
						valueDiv.style.width = nameDiv.style.width;
						valueDiv.style.backgroundColor = nameDiv.style.backgroundColor;
						valueDiv.style.left = parseInt(nameDiv.style.left) + parseInt(nameDiv.style.width) - 1 + "px";
						valueDiv.style.top = nameDiv.style.top;
						valueDiv.filterArrow = filterArrow;
						valueDiv.onmouseover = function() { 
							clearTimeout(menuTimerValueDiv[this.filterArrow.timerIndex]); 
							clearTimeout(menuTimerNameDiv[this.filterArrow.timerIndex]);
						};
						valueDiv.onmouseout = function() { 
							var self = this;
							var filterArrow = this.filterArrow;
							menuTimerValueDiv[filterArrow.timerIndex] = setTimeout(function() {
								filterArrow.src = filterArrow.mouseoutimg;
								filterArrow.textDiv.removeChild(filterArrow.nameDiv);
								filterArrow.textDiv.removeChild(self);
							}, menuWait);
						};

						// attribute names
						var newDiv = document.createElement("div");
						newDiv.innerHTML = j;
						newDiv.style.width = "136px";
						newDiv.style.padding = "0px 5px 0px 5px";
						newDiv.style.cursor = "pointer";
						newDiv.style.fontSize = "10px";
						newDiv.valueDiv = valueDiv;
						newDiv.textDiv = textDiv;
						newDiv.filterArrow = filterArrow;
						newDiv.mouseovercolor = this.heading.style.backgroundColor;
						newDiv.mouseoutcolor = this.background.style.backgroundColor;
						newDiv.onmouseover = function() { 
							this.style.backgroundColor = this.mouseovercolor; 
							removeNode(this.textDiv, this.filterArrow.valueDivId);
							this.textDiv.appendChild(this.valueDiv);
						};
						newDiv.onmouseout = function() { this.style.backgroundColor = this.mouseoutcolor; };
						newDivOuter.appendChild(newDiv);
						nameDiv.appendChild(newDivOuter);
						
						for (var k=0; k<filters.length; k++) {
							var existfilters = overlayi.filtergroups[j];
							var found = false;
							
							// attribute filter values
							var newChild = document.createElement("div");
							var newChildOuter = document.createElement("div");
							newChildOuter.style.padding = newDivOuter.style.padding;
							newChildOuter.style.borderLeft = newDivOuter.style.borderLeft;
							newChildOuter.style.borderRight = newDivOuter.style.borderRight;
							newChildOuter.style.borderBottom = newDivOuter.style.borderBottom;
							newChild.style.width = newDiv.style.width;
							newChild.style.padding = newDiv.style.padding;
							newChild.style.fontSize = "10px";
							newChild.innerHTML = filters[k].displayValues();
							if (existfilters) {
								for (var l=0; l<existfilters.length; l++) {
									if (filters[k] == existfilters[l]) {
										found = true;
										break;
									}
								}
							}
							if (found)
								newChild.style.backgroundColor = this.heading.style.backgroundColor;
							else {
								newChild.mouseovercolor = this.heading.style.backgroundColor;
								newChild.mouseoutcolor = this.background.style.backgroundColor;
								newChild.overlay = overlayi;
								newChild.filter = filters[k];
								newChild.style.cursor = "pointer";
								newChild.filterArrow = filterArrow;
								newChild.timerIndex = k;
								newChild.onmouseover = function() { this.style.backgroundColor = this.mouseovercolor; };
								newChild.onmouseout = function() { this.style.backgroundColor = this.mouseoutcolor; };
								newChild.onclick = function() { this.overlay.addFilter(this.filter); };
							}
							newChildOuter.appendChild(newChild);
							valueDiv.appendChild(newChildOuter);
						}
					}
				}
			}
			
			// Check if there are any active filters
			if (overlayi.getFilters().length > 0) {
				var activeDiv = document.createElement("div");
				activeDiv.style.paddingLeft = "15px";
				
				//if (!this.expandDiv[i]) {
					// expand button
					var expandImg = document.createElement("img");
					expandImg.style.width = "9px";
					expandImg.style.height = "9px";
					expandImg.hspace = 3;

					this.expandDiv[i] = document.createElement("div");
					this.expandDiv[i].expand = true;
					this.expandDiv[i].plusImg = this.map.kamap.server + "images/expand.png";
					this.expandDiv[i].minusImg = this.map.kamap.server + "images/collapse.png";
					expandImg.src = this.expandDiv[i].minusImg;
					this.expandDiv[i].appendChild(expandImg);
					this.expandDiv[i].innerHTML += "<b><u>Active Filters</u></b><br>";
					this.expandDiv[i].style.cursor = "pointer";
					this.expandDiv[i].onclick = function () { 
						if (this.expand) {
							this.childNodes[0].src = this.plusImg;
							this.expand = false;
							this.parentNode.removeChild(this.activeDiv);
						} 
						else { 
							this.childNodes[0].src = this.minusImg;
							this.expand = true;
							this.parentNode.appendChild(this.activeDiv);
						}
					};
				//}
				this.expandDiv[i].activeDiv = activeDiv;
				textDiv.appendChild(this.expandDiv[i]);
				if (this.expandDiv[i].expand)
					textDiv.appendChild(activeDiv);
				for (var j in overlayi.filtergroups) {
					var filters = overlayi.filtergroups[j];
					if (filters.length > 0) {
						var newDiv = document.createElement("div");
						var newChild = document.createElement("div");
						newDiv.innerHTML = j + ": <span style='font-size: 9px; color: #aaa'>(click to remove)</span>";
						newChild.style.paddingLeft = "15px";
						newChild.style.fontSize = "10px";
						newDiv.appendChild(newChild);
						activeDiv.appendChild(newDiv);
						for (var k=0; k<filters.length; k++) {
							var newA = document.createElement("a");
							newA.href = "javascript:void(0)";
							newA.title = "Remove";
							newA.style.paddingRight = "2px";
							newA.filter = filters[k];
							newA.overlay = overlayi;
							newA.innerHTML = newA.filter.displayValues();
							newA.onclick = function() { this.overlay.removeFilter(this.filter); };
							newChild.appendChild(newA);
							newChild.appendChild(document.createElement("br"));
						}
					}
				}
			}
			var br = document.createElement("br");
			br.clear = "both";
			this.overlaysDiv.appendChild(br);
		}
	}
	else if (this.id == P_WIDGET_INDICATOR_ID) {
		this.map.widgetIndicator = this; 
		this.map.kamap.widgetIndicator = this; 
		if (this.title && this.title.innerHTML == "")
			this.setLabel("Choose an Indicator");
		
		if(!this.indSelect) {
			this.indSelect = document.createElement('select');
			this.indSelect.style.width = "100%";
			this.indSelect.style.fontSize = "10px";
			this.body.appendChild(this.indSelect);
		}
		else {
			this.indSelect.innerHTML = "";
		}

		var widgetMap = this.map;
		var widget = this;
		var indList = this.map.getIndicatorList();

		this.indSelect.onchange = function() { if (this.value == -1) widgetMap.removeIndicator(); else widgetMap.setIndicator(indList[this.value]);changeMapTitle();};

		var indOption = document.createElement('option');
		indOption.text = "None";
		indOption.value = -1;
		try {
			this.indSelect.add(indOption,null);
		}
		catch(ex) {
			this.indSelect.add(indOption);
		}
		
		if (this.map.getLegend() != null && this.map.getIndicatorList()) {
			var inds = this.map.getIndicatorList();
			var selectedIndex = 0;
			for (var i=0; i<inds.length; i++) {
				var indOption = document.createElement('option');
				indOption.text = inds[i].displayName;
				indOption.value = i;
				if (this.map.getIndicator() != null && this.map.getIndicator().id == inds[i].id)
					selectedIndex = i+1;
				try {
					this.indSelect.add(indOption,null);
				}
				catch(ex) {
					this.indSelect.add(indOption);
				}
			}
			this.indSelect.selectedIndex = selectedIndex;
		}

		var legend = "";
		if (this.map.getLegend() != null && this.map.getIndicator() != null) {
			var leg = this.map.getLegend();
			var breaks = leg.getFormattedBreaks();
			var colors = leg.getColors();
//			legend = "<div style='padding-bottom: 5px'></div><table width=98% cellpadding=0 cellspacing=0 border=0 style='border-left: #ccc 1px solid; border-top: #ccc 1px solid; border-right: #ccc 1px solid'>";
//			for (var i=0; i<leg.getNumberOfBreaks(); i++) {
//				legend += "<tr><td style='border-right: #ccc 1px solid; border-bottom: #ccc 1px solid; width: 30px; background-color: #" + colors[i] + "'>&nbsp;</td><td style='border-bottom: #ccc 1px solid'>&nbsp;&nbsp;" + breaks[i] + " - " + breaks[i+1] + "</td></tr>";
//			}
//			legend += "</table><div style='padding-bottom: 3px'></div>";

			legend = "<div style='padding-bottom: 5px'></div><div id='indicatorTable'><table width=98% cellpadding=0 cellspacing=0 border=0 style='border-left: #ccc 1px solid; border-top: #ccc 1px solid; border-right: #ccc 1px solid'>";
			for (var i=0; i<leg.getNumberOfBreaks(); i++) {
				legend += "<tr><td style='border-right: #ccc 1px solid; border-bottom: #ccc 1px solid; width: 30px; background-color: #" + colors[i] + "'>&nbsp;</td><td style='border-bottom: #ccc 1px solid'>&nbsp;&nbsp;" + breaks[i] + " - " + breaks[i+1] + "</td></tr>";
			}
			legend += "</table></div><div style='padding-bottom: 3px'></div>";

			
			/*legend += "Shaded by " + leg.getBoundaryType().name;
			if (leg.getIndicator().year != '')
				legend += " (" + leg.getIndicator().year + ")";
			legend += "<br>";
			if (leg.getIndicator().source != '')
				legend += "<i>Source: " + leg.getIndicator().source + "</i>";
			*/
		}

		if (!this.indLegend) {
			this.indLegend = document.createElement('div');
			this.body.appendChild(this.indLegend);
		}
		this.indLegend.innerHTML = legend;
	}
}