var map = "";
var geocoder = "";
function startMap() {
	if (GBrowserIsCompatible()) {
	    map = document.getElementById("map");
	    if (map != null) {
	        map = new GMap2(document.getElementById("map"));
	        map.disableDragging();
	        geocoder = new GClientGeocoder();
	        return true;
	    } else {
	    	return false;
	    }
	} else {
    	return false;
    }
}

function startBuble( buble, location ) {
	if (startMap()) {
		if (geocoder) {
	        geocoder.getLatLng(
	          location,
	          function(point) {
	            if (!point) {
	              alert(location + " not found");
	            } else {
	              map.setCenter(point, 13);
	              var icon = new GIcon(G_DEFAULT_ICON,"/img/map-circle.png" );
	              icon.iconSize = new GSize(220, 220);
	              icon.shadowSize = new GSize(0, 0)
	              iconPosition = map.fromContainerPixelToLatLng(new GPoint(278, 146));
	              var marker = new GMarker(iconPosition, icon);
	              map.addOverlay(marker);
	              var emptyIcon = new GIcon(G_DEFAULT_ICON,"/img/map-empty.gif");
	              emptyIcon.iconSize = new GSize(1, 1);
	              emptyIcon.shadowSize = new GSize(0, 0)
	              var emptyMarker = new GMarker(point, emptyIcon)
	              map.addOverlay(emptyMarker);
	              emptyMarker.openInfoWindowHtml(buble);
	            }
	          }
	        );
	
	      }
	} else {
		return false;
	}
}

function showExchangeMap( city, state, npa, nxx,  cityInfo) {
      var buble =  "";
      
      for (var f = 0; f < cityInfo.length; f++) {
      	
      	buble += "<div class=\"map-item\"><div class=\"map-name\">" + cityInfo[f]["name"] + ":</div><div class=\"map-value\">" + cityInfo[f]["value"] + "</div></div>";
      }
      buble = "<div class=\"map-city\">" + npa + "-" + nxx + "-XXXX</div><div class=\"map-item\"><div class=\"map-name\">City:</div><div class=\"map-value\">" + city + "</div></div><div class=\"map-item\"><div class=\"map-name\">State: </div><div class=\"map-value\">" + state + "</div></div>" + buble;
      startBuble(buble, city + ", " + state);
}

function showPhoneMap( city, state, npa, nxx, phone,  cityInfo) {
      var buble =  "";
      
      for (var f = 0; f < cityInfo.length; f++) {
      	
      	buble += "<div class=\"map-item\"><div class=\"map-name\">" + cityInfo[f]["name"] + ":</div><div class=\"map-value\">" + cityInfo[f]["value"] + "</div></div>";
      }
      buble = "<div class=\"map-city\">" + npa + "-" + nxx + "-" + phone + "</div><div class=\"map-item\"><div class=\"map-name\">City:</div><div class=\"map-value\">" + city + "</div></div><div class=\"map-item\"><div class=\"map-name\">State: </div><div class=\"map-value\">" + state + "</div></div>" + buble;
      startBuble(buble, city + ", " + state);
}