//IIDj BERLIN-A-Z 2006, 04 ----------------------------------------------------
// google map implementation

// requires following body events
//onload="getGoogleMap();"
//onunload="GUnload();"
// requires following DIVs
// 'GMapCaption'

var map,mapDiv,xmlFile,iconList,iconLabelList;

//----------------------------------------------------------------------
// initizlizing
function getGoogleMap() {
	var initCenter,initZoom,iconSize,cat

	mapDiv = document.getElementById('SPREAD');
	if (GBrowserIsCompatible()) {
		document.getElementById('MAINTEXT').style.top = '575px';
		mapDiv.style.height = '380px';
		xmlFile = '_JA.xml';
		initCenter = {x:13.4119,y:52.5238};
		initZoom = 12;
		iconSize = 32;
		iconList = new Array();
		iconList[2] = 'http://a-z.gestaltung.com/MAP/IMG/ICN/2.png';
		iconList[4] = 'http://a-z.gestaltung.com/MAP/IMG/ICN/4.png';
		iconList[6] = 'http://a-z.gestaltung.com/MAP/IMG/ICN/6.png';
		iconList[8] = 'http://a-z.gestaltung.com/MAP/IMG/ICN/8.png';
		iconLabelList = new Array();
		iconLabelList[2] = '見る';
		iconLabelList[4] = '食べる';
		iconLabelList[6] = '買う';
		iconLabelList[8] = '体験する';
		cat = (Math.floor(Math.random()*4) +1)*2;
		//cat = 2;
		map = initMap(initCenter,initZoom,iconSize);
		load(cat);
	}
	else {
		writeLayer(mapDiv,'<img src="IMG/DOC/BERLIN-A-Z_GoogleEarth.jpg" alt="" width="380" height="294" border="0" align="top" /><br /><span class="CAPTION"><a href="DOC/Berlin-A-Z_JA.kml.zip">全ての掲載スポット<' + '/a>を<a href="http://earth.google.com/downloads.html" target="EXT">Google Earth<' + '/a>©で見ることができます。<' + '/span>');
	}
}


function initMap(initCenter,initZoom,iconSize) {
var map = new GMap2(mapDiv);
map.removeMapType(G_HYBRID_MAP);

map.addControl(new GSmallZoomControl());
map.addControl(new GMapTypeControl());
map.initLatLng = new GLatLng(initCenter.y,initCenter.x);
map.setCenter(map.initLatLng,initZoom);
map.centerX = map.fromLatLngToDivPixel(map.initLatLng).x;
map.centerY = map.fromLatLngToDivPixel(map.initLatLng).y;
map.deltaX = 0;
map.deltaY = 0;

var icon = new GIcon();
icon.iconSize = new GSize(iconSize,iconSize);
icon.iconAnchor = new GPoint(iconSize/2,iconSize/2);
icon.infoWindowAnchor = new GPoint(iconSize/2-4,iconSize/2+4);

map.icons = new Array();
for (var iconIndex in iconList) {
map.icons[iconIndex] = new GIcon(icon);
map.icons[iconIndex].image = iconList[iconIndex];
}
map.hoverIcon = new GIcon(icon);
map.infoWindow = document.getElementById('GMapCaption');
map.infoWindowOn = false;
map.hideInfoWindow = hideInfoWindow;
map.infoWindow.onclick = function() {
map.hideInfoWindow();
};
GEvent.addListener(map,'dragstart',function() {
this.hideInfoWindow();
});
GEvent.addListener(map,'zoomend',function() {
this.hideInfoWindow();
});
GEvent.addListener(map,'moveend',function() {
this.deltaX = this.centerX - this.fromLatLngToDivPixel(this.getCenter()).x;
this.deltaY = this.centerY - this.fromLatLngToDivPixel(this.getCenter()).y;
});

GMarker.prototype.isOn = false;
GMarker.prototype.formatInfoWindowHtml = formatInfoWindowHtml;
GMarker.prototype.showInfoWindow = showInfoWindow;
GMarker.prototype.showToolTip = showToolTip;

GEvent.addDomListener(GMarker.prototype,'mouseover',function() {
this.showToolTip();
});
GEvent.addDomListener(GMarker.prototype,'click',function() {
this.showInfoWindow();
});

return map;
}


//----------------------------------------------------------------------
// implementing
function load(cat) {
var xml,pmList,pmListLength,pmNode,pmPoint,pm,pmAddressNode,pmContactName;
writeMapCaption(cat);

map.clearOverlays();
map.hideInfoWindow();

if (cat) {
map.hoverIcon.image = 'http://a-z.gestaltung.com/MAP/IMG/ICN/' + cat + '_hover.png';
GDownloadUrl(cat + xmlFile,function(data,responseCode) {
xml = GXml.parse(data);
pmList = xml.documentElement.getElementsByTagName('pm');
pmListLength = pmList.length;
for (var i=0; i<pmListLength; i++) {
pmNode = pmList[i];

pmPoint=new GLatLng(pmNode.getAttribute('x'),pmNode.getAttribute('y'));
pm = new GMarker(pmPoint,{icon:map.icons[cat]});
pm.pName = pmNode.getAttribute('pName');
pm.pCatId = pmNode.getAttribute('pCatId');
pm.pCat = pmNode.getAttribute('pCat');
pmAddressNode = pmNode.getElementsByTagName('address')[0];
pm.pDistrict = pmAddressNode.getAttribute('pDistrict');
pm.pStreet = pmAddressNode.getAttribute('pStreet');
pmContactNode = pmNode.getElementsByTagName('contact')[0];
pm.pTel = pmContactNode.getAttribute('pTel');
pm.pMail = pmContactNode.getAttribute('pMail');
pm.pUrl = pmContactNode.getAttribute('pUrl');
pm.formatInfoWindowHtml();
map.addOverlay(pm);
}
});
}
}

function getXmlNodeData(xmlNode) {
if (xmlNode.childNodes.length) {
return xmlNode.firstChild.nodeValue;
}
return '';
}

function showInfoWindow() {
//showProperties(this);
map.infoWindowOn = true;
map.panTo(this.getPoint());
map.infoWindow.innerHTML = this.html;
map.infoWindow.style.top = '370px';
map.infoWindow.style.left = '257px';
map.infoWindow.style.visibility = visible;
map.removeOverlay(map.hoverMarker);
}
function hideInfoWindow() {
this.infoWindowOn = false;
this.infoWindow.style.visibility = hidden;
if (typeof this.hoverMarker != 'undefined') {
this.removeOverlay(this.hoverMarker);
}
}

function showToolTip() {
//showProperties(this);
//alert(this.html);
if (!this.isOn && !map.infoWindowOn) {
map.hideInfoWindow();
map.hoverMarker = new GMarker(this.getPoint(),{icon:map.hoverIcon});
map.hoverMarker.isOn = true;
map.hoverMarker.pNameHtml = this.pNameHtml;
map.hoverMarker.html = this.html;
map.addOverlay(map.hoverMarker);
map.infoWindow.innerHTML = this.pNameHtml;
map.infoWindow.style.top = (map.deltaY + map.fromLatLngToDivPixel(this.getPoint()).y + 180) + 'px';
map.infoWindow.style.left = (map.deltaX + map.fromLatLngToDivPixel(this.getPoint()).x + 65) + 'px';
map.infoWindow.style.visibility = visible;
}
}
//----------------------------------------------------------------------
// formatting
function formatInfoWindowHtml() {
this.pNameHtml = '<div class="pName catColor' + this.pCatId + '">' + this.pName + '</div>';
this.html ='<div class="infoWindow"><div class="pName catColor' + this.pCatId + '">' + this.pName + '</div><div class="pCategory">' + this.pCat + '<br /><br />' + '</div><div class="pAddress">' + this.pStreet + '<br />' + this.pDistrict+ '</div>';
if (this.pTel || this.pMail || this.pUrl) {
this.html +='<div class="pContact">';
if (this.pTel) {
this.html += this.pTel;
this.html += '<br />';
}
if (this.pMail) {
this.html = this.html + '<a href ="mailto:' + this.pMail+ '">' + this.pMail + '</a><br />';
}
if (this.pUrl) {
this.html = this.html + '<a href ="' + this.pUrl+ '" target="EXT">' + extractDomain(this.pUrl) + '</a>';
}
this.html = this.html + '</div>';
}
this.html += '</div>';
}

function extractDomain(completeUrl) {
var regExp = new RegExp('^[^\/]+\/\/([^\/]+).*');
return completeUrl.replace(regExp,'$1');
}

function writeMapCaption(cat) {
var caption = '';
var iconId = 2;
while (iconId < 9) {
var iconSource = iconList[iconId];

var s = '<img src="' + iconSource.replace(/.png/,'.gif') + '" width="16" height="16" align="baseline">';
caption += s;
if (cat != iconId) {
s = '<a href="javascript:load(' + iconId + ');"> ' + iconLabelList[iconId] + '<' + '/a>';
}
else {
s = ' ' + iconLabelList[iconId];
}
caption += s;
caption += '<br />';
iconId += 2;
}
caption += '<img src="IMG/MEN/BLNK_15.gif" width="16" height="16" align="baseline">';
if (cat) {
s = '<a href="javascript:load();"> 地図のみ<' + '/a>';
}
else {
s = ' 地図のみ';
}
caption += s;

writeLayer(document.getElementById('SPREADCAPTION'),caption);
}

function showProperties(obj) {
for (var p in obj) {
alert(p + ': ' + obj[p]);
}
}