// V2
// 2. Remove "Save this location"
// 3. Add "Go to this location" (on YOUR Gmap. The link originally provided was linked to maps.google.com)
// 4. Error message when Local Search shows No result.
// 5. If you enter location directly, go to tere on your map, and cancel search.
// Currently, detectable formats are following five:
// "35.12345,-74.12345",
// "N35.12345,W74.12345",
// "35.12.34.56,-74.12.34.56"(As DD.MM.SS.SS)
// "N35.12.34.56,W74.12.34.56"(As DD.MM.SS.SS)
// Or, LocaPoint(TM) location pointer code
//
// I hope someone modify this control better and cooler. :-)
//
//
// Usage:
// You need to include Uds API and Maps API
//
//
//
// You also need to include or cut&paste THIS file on your javascript source
//
//
// After you initialize Gmap2, Initialize Local Search Control as following.
// map = new GMap2(d.getElementById("map"));
// map.setCenter(new GLatLng(34.669782,135.47915),18);
//
// map.IntegratedGLocalSearchControl = new IntegratedGLocalSearchControl();
// map.addControl(map.IntegratedGLocalSearchControl);
//
//
//
//
//
///////////////////////////////////////////////////////////////////////////////
//IntegratedGLocalSearchControl
///////////////////////////////////////////////////////////////////////////////
//Configuration
var offsetFromTop = 40;
//global state for AJAX API search
var gLocalSearch;
var gSelectedResults = [];
var gCurrentResults = [];
var gSearchForm;
// Create our "tiny" marker icon
var gSmallIcon = new GIcon();
gSmallIcon.image = "http://labs.google.com/ridefinder/images/mm_20_yellow.png";
gSmallIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
gSmallIcon.iconSize = new GSize(12, 20);
gSmallIcon.shadowSize = new GSize(22, 20);
gSmallIcon.iconAnchor = new GPoint(6, 20);
gSmallIcon.infoWindowAnchor = new GPoint(5, 1);
function IntegratedGLocalSearchControl() {
}
IntegratedGLocalSearchControl.prototype = new GControl(true, true);
IntegratedGLocalSearchControl.prototype.initialize = function(map) {
this.map_ = map;
//container
this.base = document.createElement("div");
//switchOn
this.switchOnDiv = document.createElement("div");
this.switchOnDiv.style.visibility="visible";
var s = this.switchOnDiv.style;
s.position = "relative";
s.top = "0px";
s.border = "1px solid #000000";
s.padding = "0px";
s.rightMargin = "7px";
s.backgroundColor = "#FFFFFF";
s.color = "#000000";
s.cursor = "pointer";
this.switchOnDiv.font = "small Tahoma";
this.switchOnDiv.appendChild(document.createTextNode("<< Local Search"));
GEvent.addDomListener(this.switchOnDiv, "click", function() {
map.IntegratedGLocalSearchControl.show();
});
this.base.appendChild(this.switchOnDiv);
//Local Search
this.locsearchDiv = document.createElement("div");
this.locsearchDiv.style.visibility="hidden";
s = this.locsearchDiv.style;
s.position = "relative";
s.top = "-25px";
s.left = "0px";
s.width = "212px";
s.height = "1px";
s.border = "4px solid #C0C0C0";
s.padding = "5px";
s.backgroundColor = "#FFFFFF";
s.color = "#000000";
var search = document.createElement("div");
search.id = "search";
search.style.border = "1px solid #C0C0C0"
search.style.padding ="2px";
var switchOffDiv = document.createElement("div");
switchOffDiv.style.font = "small Tahoma";
switchOffDiv.style.cursor = "pointer";
switchOffDiv.appendChild(document.createTextNode("Google Local Search >> close"));
GEvent.addDomListener(switchOffDiv, "click", function() {
map.IntegratedGLocalSearchControl.hide();
});
search.appendChild(switchOffDiv);
var searchformDiv = document.createElement("div");
searchformDiv.id = "searchform";
search.appendChild(searchformDiv);
this.locsearchDiv.appendChild(search);
this.resultDiv = document.createElement("div");
this.resultDiv.id = "results";
this.resultDiv.style.height = "1px";
this.resultDiv.style.overflow = "auto";
var searchwellDiv = document.createElement("div");
searchwellDiv.id = "searchwell";
this.resultDiv.appendChild(searchwellDiv);
this.locsearchDiv.appendChild(this.resultDiv);
this.base.appendChild(this.locsearchDiv);
//map.IntegratedGLocalSearchControl.resize();
this.map_.getContainer().appendChild(this.base);
//Attach to resize
if (window.addEventListener) {
window.addEventListener("resize", map.IntegratedGLocalSearchControl.resize, false);
}else if (window.attachEvent) {
window.attachEvent("on"+"resize", map.IntegratedGLocalSearchControl.resize);
}
initAJAXSearch();
return(this.base);
}
IntegratedGLocalSearchControl.prototype.getDefaultPosition = function() {
return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(0, offsetFromTop));
}
IntegratedGLocalSearchControl.prototype.resize = function() {
var size = map.getSize();
map.IntegratedGLocalSearchControl.locsearchDiv.style.height = (size.height - 60 - offsetFromTop ) + "px";
map.IntegratedGLocalSearchControl.resultDiv.style.height = (size.height - 120 - offsetFromTop) + "px";
}
IntegratedGLocalSearchControl.prototype.show = function() {
this.locsearchDiv.style.visibility="visible";
this.switchOnDiv.style.visibility="hidden";
map.IntegratedGLocalSearchControl.resize();
}
IntegratedGLocalSearchControl.prototype.hide = function() {
this.locsearchDiv.style.visibility="hidden";
this.locsearchDiv.style.height = "1px";
this.switchOnDiv.style.visibility="visible";
}
///////////////////////////////////////////////////////////////////////////////
//Geocoder with GoogleSearch API
///////////////////////////////////////////////////////////////////////////////
// Set up the map and the local searcher.
function initAJAXSearch() {
gSearchForm = new GSearchForm(false, document.getElementById("searchform"));
gSearchForm.setOnSubmitCallback(null, CaptureForm);
gSearchForm.input.size = "25";
//gSearchForm.input.setAttribute("title", "Enter Address/Keyword/LocaPoint/etc.");
//gSearchForm.input.focus();
//Auto Select
if (gSearchForm.input.addEventListener) {
gSearchForm.input.addEventListener("focus", gSearchForm.input.select, false);
}else if (gSearchForm.input.attachEvent) {
gSearchForm.input.attachEvent("on"+"focus", gSearchForm.input.select);
}
// Initialize the local searcher
gLocalSearch = new GlocalSearch();
gLocalSearch.setCenterPoint(map);
gLocalSearch.setSearchCompleteCallback(null, OnLocalSearch);
}
// Called when Local Search results are returned, we clear the old
// results and load the new ones.
function OnLocalSearch() {
if (!gLocalSearch.results) return;
var searchWell = document.getElementById("searchwell");
if (gLocalSearch.results.length==0){
searchWell.innerHTML = "No Result...";
return;
}
// Clear the map and the old search well
searchWell.innerHTML = "";
for (var i = 0; i < gCurrentResults.length; i++) {
if (!gCurrentResults[i].selected()) {
map.removeOverlay(gCurrentResults[i].marker());
}
}
gCurrentResults = [];
for (var i = 0; i < gLocalSearch.results.length; i++) {
gCurrentResults.push(new LocalResult(gLocalSearch.results[i]));
}
var attribution = gLocalSearch.getAttribution();
if (attribution) {
document.getElementById("searchwell").appendChild(attribution);
}
// move the map to the first result
var first = gLocalSearch.results[0];
map.panTo(new GLatLng(parseFloat(first.lat), parseFloat(first.lng)));
}
// Cancel the form submission, executing an AJAX Search API search.
function CaptureForm(searchForm) {
//Regular Expressions to detect location data
var re_LP =/^([A-Z]{2}\d\.){3}[A-Z]{2}\d$/.exec(searchForm.input.value);
var re_DMS =/^([-\+NnSs]?)(\d{1,2})[^0-9A-Za-z](\d{1,2})[^0-9A-Za-z](\d{1,2}\.?\d\d*),\s*([-\+EeWw]?)(\d{1,3})[^0-9A-Za-z](\d{1,2})[^0-9A-Za-z](\d{1,2}\.?\d\d*)$/.exec(searchForm.input.value);
var re_DD =/^([-\+NnSs]?)(\d{1,2}\.\d\d*){1},\s*([-\+EeWw]?)(\d{1,3}\.\d\d*){1}$/.exec(searchForm.input.value);
if(re_LP!=null){ //LocaPoint
var location = LocaPoint2LatLon(searchForm.input.value);
map.setCenter(new GLatLng(location.latitude, location.longitude));
//gLocalSearch.setCenterPoint(map);
return false;
}else if(re_DMS!=null && re_DMS.length==9){//DD*MM*SS.SSS
var dotPosSS;
dotPosSS = re_DMS[4].indexOf(".",0);
var latd = re_DMS[2] -0 + (re_DMS[3]-0)/60 + (dotPosSS==-1?((re_DMS[4].subStr(0,dotPosSS)+"."+re_DMS[4].subStr(dotPosSS+1,len(re_DMS[4])-dotPosSS)))-0:(re_DMS[4]-0))/3600;
dotPosSS = re_DMS[8].indexOf(".",0);
var lond = re_DMS[6] -0 + (re_DMS[7]-0)/60 + (dotPosSS==-1?((re_DMS[8].subStr(0,dotPosSS)+"."+re_DMS[8].subStr(dotPosSS+1,len(re_DMS[8])-dotPosSS)))-0:(re_DMS[8]-0))/3600;
if(re_DMS[1]=="" || re_DMS[1]=="+" || re_DMS[1]=="N" || re_DMS[1]=="n"){
}else if(re_DMS[1]=="-" || re_DMS[1]=="S" || re_DMS[1]=="s"){
latd*=(-1);
}
if(re_DMS[5]=="" || re_DMS[5]=="+" || re_DMS[5]=="E" || re_DMS[5]=="e"){
}else if(re_DMS[5]=="-" || re_DMS[5]=="W" || re_DMS[5]=="w"){
lond*=(-1);
}
map.setCenter(new GLatLng(latd, lond));
//gLocalSearch.setCenterPoint(map);
return false;
}else if(re_DD!=null && re_DD.length==5){//DD.DDDD
var latdd = re_DD[2];
var londd = re_DD[4];
if(re_DD[1]=="" || re_DD[1]=="+" || re_DD[1]=="N" || re_DD[1]=="n"){
}else if(re_DD[1]=="-" || re_DD[1]=="S" || re_DD[1]=="s"){
latdd*=(-1);
}
if(re_DD[3]=="" || re_DD[3]=="+" || re_DD[3]=="E" || re_DD[3]=="e"){
}else if(re_DD[3]=="-" || re_DD[3]=="W" || re_DD[3]=="w"){
londd*=(-1);
}
map.setCenter(new GLatLng(latdd, londd));
//gLocalSearch.setCenterPoint(map);
return false;
}else{//else Go search
gLocalSearch.execute(searchForm.input.value);
return false;
}
}
// A class representing a single Local Search result returned by the
// Google AJAX Search API.
function LocalResult(result) {
this.result_ = result;
this.resultNode_ = this.unselectedHtml();
document.getElementById("searchwell").appendChild(this.resultNode_);
map.addOverlay(this.marker(gSmallIcon));
}
// Returns the map marker for this result, creating it with the given
// icon if it has not already been created.
LocalResult.prototype.marker = function(opt_icon) {
if (this.marker_) return this.marker_;
var marker = new GMarker(new GLatLng(parseFloat(this.result_.lat), parseFloat(this.result_.lng)), opt_icon);
GEvent.bind(marker, "click", this, function() {
marker.openInfoWindow(this.selected() ? this.selectedHtml() :
this.unselectedHtml());
});
this.marker_ = marker;
return marker;
}
// "Saves" this result if it has not already been saved
LocalResult.prototype.select = function() {
if (!this.selected()) {
this.selected_ = true;
// Remove the old marker and add the new marker
map.removeOverlay(this.marker());
this.marker_ = null;
map.addOverlay(this.marker(G_DEFAULT_ICON));
// Add our result to the saved set
document.getElementById("selected").appendChild(this.selectedHtml());
// Remove the old search result from the search well
this.resultNode_.parentNode.removeChild(this.resultNode_);
}
}
// Returns the HTML we display for a result before it has been "saved"
LocalResult.prototype.unselectedHtml = function() {
var container = document.createElement("div");
container.className = "unselected";
container.style.paddingLeft ="18px";
container.style.paddingTop = "1px";
container.style.backgroundImage = "url('http://labs.google.com/ridefinder/images/mm_20_yellow.png')";
container.style.backgroundRepeat = "no-repeat";
container.style.backgroundPosition = "top left";
container.appendChild(this.result_.html.cloneNode(true));
//var saveDiv = document.createElement("div");
//saveDiv.className = "select";
//saveDiv.innerHTML = "Save this location";
//GEvent.bindDom(saveDiv, "click", this, function() {
// map.closeInfoWindow();
// this.select();
// gSelectedResults.push(this);
//});
//container.appendChild(saveDiv);
this.result_.locapoDiv = document.createElement("div");
this.result_.locapoDiv.className = "select";
this.result_.locapoDiv.style.marginBottom = "1em";
this.result_.locapoDiv.style.cursor = "pointer";
this.result_.locapoDiv.style.textDecoration = "underline";
this.result_.locapoDiv.style.coor = "7777CC";
var locapoint=LatLon2LocaPoint(this.result_.lat, this.result_.lng);
var latlonstr = " (" + FormLatLonStr(this.result_.lat, this.result_.lng) + ")";
this.result_.locapoDiv.innerHTML = "Go to this location";
this.result_.locapoDiv.setAttribute("title", "LocaPoint:" + locapoint + latlonstr);
GEvent.bindDom(this.result_.locapoDiv, "click", this, function() {
map.closeInfoWindow();
map.setCenter(new GLatLng(this.result_.lat, this.result_.lng));
});
container.appendChild(this.result_.locapoDiv);
return container;
}
// Returns the HTML we display for a result after it has been "saved"
LocalResult.prototype.selectedHtml = function() {
return this.result_.html.cloneNode(true);
}
// Returns true if this result is currently "saved"
LocalResult.prototype.selected = function() {
return this.selected_;
}
///////////////////////////////////////////////////////////////////////////////
// Following are LocaPoint functions.
// If you remove following, make sure not to use them in this file.
///////////////////////////////////////////////////////////////////////////////
//LocaPoint2LatLon
///////////////////////////////////////////////////////////////////////////////
function LocaPoint2LatLon(locapoint){
var location = new Object();
location.latitude =(
((locapoint.charCodeAt(0)-65)*1757600
+(locapoint.charCodeAt(1)-65)*67600
+(locapoint.charCodeAt(2)-48)*6760
+(locapoint.charCodeAt(8)-65)*260
+(locapoint.charCodeAt(9)-65)*10
+(locapoint.charCodeAt(10)-48))
*180/45697600-90).toFixed(6);
location.longitude = (
((locapoint.charCodeAt(4)-65)*1757600
+(locapoint.charCodeAt(5)-65)*67600
+(locapoint.charCodeAt(6)-48)*6760
+(locapoint.charCodeAt(12)-65)*260
+(locapoint.charCodeAt(13)-65)*10
+(locapoint.charCodeAt(14)-48) )
*360/45697600-180).toFixed(6);
return(location);
}
///////////////////////////////////////////////////////////////////////////////
//LatLon2LocaPoint
///////////////////////////////////////////////////////////////////////////////
function LatLon2LocaPoint(lat, lon){
var latstep=Math.floor(((lat-(-90))*45697600/180));
var lngstep=Math.floor(((lon-(-180))*45697600/360));
var locapoint=String.fromCharCode(
Math.floor(latstep/1757600%26)+65,
Math.floor(latstep/67600%26)+65,
Math.floor(latstep/6760%10)+48,
46,
Math.floor(lngstep/1757600%26)+65,
Math.floor(lngstep/67600%26)+65,
Math.floor(lngstep/6760%10)+48,
46,
Math.floor(latstep/260%26)+65,
Math.floor(latstep/10%26)+65,
Math.floor(latstep%10)+48,
46,
Math.floor(lngstep/260%26)+65,
Math.floor(lngstep/10%26)+65,
Math.floor(lngstep%10)+48
);
return(locapoint);
}
///////////////////////////////////////////////////////////////////////////////
//FormLatLonStr
///////////////////////////////////////////////////////////////////////////////
function FormLatLonStr(lat, lon){
var latstr =lat>=0?"N":"S";
var lonstr =lon>=0?"E":"W";
lat = Math.abs(lat);
lon = Math.abs(lon);
lat = "000" + lat.toFixed(6);
lon = "000" + lon.toFixed(6);
latstr += lat.substr(lat.length - 9);
lonstr += lon.substr(lon.length - 10);
return(latstr + "," + lonstr);
}
//]]>