/*-------------initial setting start------------------*/
var gmapSrc = "http://maps.google.com/"
	+"maps?&"
	+"file=api&"
	+"v=2&"
	+"key=ABQIAAAAXDIAzANtYULOcCx6UsnK8xTWJEZr8vn95PnGgjL5hwZTLWs0YhSKobXQ_iofP2KTEqpzu6hfJoszTQ";
//
document.write("<script src='"+gmapSrc+"' type='text\/javascript'\><\/script\>");
//
var swfName = "storelocator";
var swf;
//
//

var map;
var mapNode;
var bounds;
//
var overlay;
var overlayElement;
//
var mujiicon;
//
var stores;
var countryname;

var Categories = {
	classes: ["mujiNormal", "kiosk", "mujitogo", "muji"],
	img: ["logo_mujirushiryohin.gif","logo_comkiosk.gif","logo_mujitogo.gif", "logo_muji.gif"],
	alt: ["MUJI 無印良品", "comKIOSK", "MUJI to go", "MUJI"],
	w: ["94", "146", "77", "49"],
	h: ["21", "21", "92", "21"]
};

var isIE = !!(window.attachEvent && !window.opera);
/*-------------initial setting end------------------*/



/*-------------load json start------------------*/
var txt;
function load(o){
	var a = o.split(", ");
	var data = a[0];
	var method = a[1];
	var file = a[2];
	var async = a[3];
	countryname = file.split("/")[2].split(".js")[0];
	var req = window.XMLHttpRequest ? new XMLHttpRequest() : (function() {
		try { return new ActiveXObject("Msxml2.XMLHTTP"); }
		catch(e) { return new ActiveXObject("Microsoft.XMLHTTP"); }
	})();
	req.onreadystatechange = function() {
		if(req.readyState==4 && (req.status == 200 || req.status == 304)) {
			oncompl();
		}
	}
	function oncompl(){
		stores = eval( "("+req.responseText+")" );
		var retry = 1;
		setTimeout( function(){
			if(!retry--) return;
			swf = document.all ? window[swfName] : document[swfName];
			try { swf._jsonPosted(req.responseText); }
			catch(e) { setTimeout(arguments.callee,50); }
		},50);
	}
	req.open(method, file, async);
	req.send(data);
} 
/*-------------load json end------------------*/



/*-------------Markerwindow start------------------*/
function initOverlay(){
	overlay = new Function();
	overlayElement = document.createElement("div");
	overlayElement.className = "info";
	overlayElement.style.top = "31px";
	overlayElement.style.position = "relative";
	overlay.prototype = new GOverlay();
	overlay.prototype.initialize = function(){
		map.getPane(G_MAP_FLOAT_PANE).appendChild(overlayElement);
		//overlayElement.style.zIndex = 300000;
	}
	overlay.prototype.remove = function(){
		overlayElement.parentNode.removeChild(overlayElement);
	}
	overlay.prototype.copy = function(){
		return new overlay();
	}
	overlay.prototype.redraw = function(){
		setWindowPosition(overlay.point);
	}
	customInfoWindow = new overlay();
}
function openWindowLatLng(ele, point){
	overlay.point = point;
	overlayElement.style.display = "block";
	//overlayElement.style.zIndex = 4000000;
	overlayElement.style.postion = "absolute";
	overlayElement.innerHTML = ele.innerHTML;
	setWindowPosition(overlay.point);
	map.addOverlay(customInfoWindow);
	//GEvent.addDomListener(overlayElement, "click", function() {void(0);} );
	//map.panBy(new GSize(0,verlayElement.offsetHeight/2-50));
	var tar = map.fromDivPixelToLatLng({x:map.fromLatLngToDivPixel(point).x, y:map.fromLatLngToDivPixel(point).y-overlayElement.offsetHeight+140});
	map.panTo(tar);
}
function setWindowPosition(p){
	var pt = map.fromLatLngToDivPixel(overlay.point);
	overlayElement.style.top = (pt.y-overlayElement.offsetHeight-50+( isIE ? 15:0 )) + "px";
	overlayElement.style.left = (pt.x-overlayElement.offsetWidth/2) + "px";
}
function closeWindow(){
	map.removeOverlay(customInfoWindow);
}
/*-------------Markerwindow end------------------*/



/*-------------setMarker start------------------*/
var _overlays = new Array();
//
//
var dummy;
//
function setMarker(store,number,isEnd,startnum,length){
	if(!store.latlng){
		if(store.address) alert(store.name+" ("+store.address+") is Not Found");
		else alert(store.name+" has wrong latlng");
	}else{
		bounds.extend(stores.list[number].latlng);
		//
		var mk =new GIcon(mujiicon);
		mk.image = (store.category!=3 ? "img/markers/" : "img/markers/blk/") +(number%length+1)+".png" ;
		var op = {icon:mk};
		//
		var marker= new GMarker(store.latlng,op);
		map.addOverlay(marker);
		//
		var _overlay = createOverlay(store);
		_overlays["n"+number] = new Array(_overlay, store.latlng);
		GEvent.addListener(marker, "click", function() { openWindowLatLng(_overlay,store.latlng);} );
		//
		if( isEnd ) {
			map.setCenter(bounds.getCenter(),map.getBoundsZoomLevel(bounds));
			GEvent.addListener(map,"moveend",function(){ swf._BGResume(); });
			GEvent.addListener(map,"movestart",function(){ swf._BGPause(); });
			GEvent.addListener(map,"drag",function(){
				if(dummy==undefined || !dummy.parentNode){
					dummy = document.createElement("div");
					mapNode.parentNode.appendChild(dummy);
					dummy.id = "dmm";
					dummy.style.position = "absolute";
					dummy.style.left = "0";
					dummy.style.top = "0";
					dummy.style.zIndex = String(parseInt(mapNode.style.zIndex)-1);
					dummy.style.height = "100%";
					dummy.style.width = "100%";
				}
			});
			GEvent.addListener(map,"dragend",function(){
				try { 
					var dummmy = document.getElementById("dmm");
					dummmy.parentNode.removeChild(dummmy);
				} catch(e) {
					//alert(e);
				} 
			});
			if(startnum==number)	map.setZoom(store.zoom);
		}
	}
}
var openTextArea;

function createOverlay(store){
	var _overlay = document.createElement("div");
	var _panel = document.createElement("div");
	var _inner = document.createElement("div");
	var _title = document.createElement("h3");
	var _title_img = document.createElement("img");
	var _closebtn = document.createElement("a");
	var _storename = document.createElement("h4");
	var _storename_inner = document.createElement("a");
	var _address = document.createElement("p");
	var _address_inner = document.createElement("a");
	var _tel = document.createElement("p");
	var _tel_inner = document.createElement("a");
	//var _open = document.createElement("p");
	//var _open_inner = document.createElement("a");
	var _end = document.createElement("div");
	_overlay.className = "overlay";
	_panel.className = Categories.classes[store.category];
	_panel.className += " flag";
	_inner.className = "inner";
	_storename.id = "overlay_storename";
	_address.id = "overlay_address";
	_tel.id = "overlay_tel";
	//_open.id = "overlay_open";
	_end.className = "end"+Categories.classes[store.category];
	_end.className += " end";
	_closebtn.className = "closebtn";
	
	_overlay.appendChild(_panel);
	_overlay.appendChild(_end);
	_panel.appendChild(_inner);
	_inner.appendChild(_title);
	_inner.appendChild(_closebtn);
	_inner.appendChild(_storename);
	_storename.appendChild(_storename_inner);
	_inner.appendChild(_address);
	_address.appendChild(_address_inner);
	_inner.appendChild(_tel);
	_tel.appendChild(_tel_inner);
	//_inner.appendChild(_open);
	//_open.appendChild(_open_inner);
	_title.appendChild(_title_img);
	
	_title_img.src = "img/overlay/"+Categories.img[store.category];
	_title_img.alt = Categories.alt[store.category];
	_title_img.width = Categories.w[store.category];
	_title_img.height = Categories.h[store.category];
	_closebtn.innerHTML = "close";
	_closebtn.href = "javascript:closeWindow()";
	_storename_inner.innerHTML = store.name;
	_address_inner.innerHTML = store.address;
	_tel_inner.innerHTML = "phone. "+store.tel;
	_storename_inner.href = _address_inner.href = _tel_inner.href = "javascript:openTextArea()"
	
	openTextArea = function(){
		var bg = document.createElement("div");
		var txtarea = document.createElement("textarea");
		var gm = document.getElementById("gmapArea");
		document.getElementById("content").parentNode.appendChild(bg);
		bg.appendChild(txtarea);
		bg.style.position = "absolute";
		bg.style.top = "0";
		bg.style.left = "0";
		bg.style.width = "100%";
		bg.style.height ="100%";
		bg.style.backgroundImage = "url(img/clear.gif)";
		bg.style.zIndex = parseInt(gm.style.zIndex)+1;
		var txtTar1 = document.getElementById("overlay_storename");
		var txtTar2 = document.getElementById("overlay_address");
		var txtTar3 = document.getElementById("overlay_tel");
		//var txtTar4 = document.getElementById("overlay_open");
		function permPos(tar,direction){
			return gm["offset"+direction] + overlayElement.parentNode.parentNode["offset"+direction] + overlayElement["offset"+direction] + tar["offset"+direction];
		}
		txtarea.onblur = function(){
			bg.parentNode.removeChild(bg);
		}
		txtarea.style.position = "absolute";
		txtarea.style.left = (permPos(txtTar1,"Left")-3)+"px";
		txtarea.style.top = (permPos(txtTar1,"Top")+7-1)+"px";
		txtarea.style.width = (txtTar1.offsetWidth+4)+"px";
		txtarea.style.height = (permPos(txtTar3,"Top") + txtTar3.offsetHeight - permPos(txtTar1,"Top") - 10)+"px";
		txtarea.style.fontFamily = "Helvetica,Arial,sans-serif";
		txtarea.style.fontSize = "12px";
		txtarea.style.lineHeight = "16px";
		txtarea.value = txtTar1.firstChild.innerHTML +"\n\n"+ txtTar2.firstChild.innerHTML +"\n\n"+ txtTar3.firstChild.innerHTML;//+ var txtTar4.firstChild.innerHTML;
		if(!isIE) {
			var all = document.getElementsByTagName("*");
			for(var i=0;i<all.length;i++) all[i].blur();
		}
		txtarea.focus();
	}
	//_open.innerHTML = "opening hours:<br />" +store.open;
	return _overlay;
}
/*-------------setMarker end------------------*/


/*-------------attachImageMap start------------------*/
function attachImageMap(num){
	if(mapNode.firstChild) mapNode.removeChild(mapNode.firstChild);
	var img = document.createElement("img");
	img.src = stores.list[num].img;
	mapNode.appendChild(img);
}
/*-------------attachImageMap end------------------*/

var mapFlg = false;

function onMapVisible(rect) {
	if(!mapFlg) {
		mapNode = document.createElement("div");
		mapNode.id = "gmapArea";
		document.getElementById('content').appendChild(mapNode);
		mapNode.style.position ='absolute';
		mapNode.style.zIndex = '3';
		mapFlg = true;
	}
	for(var i=0; i<rect.length; i++){
		if(rect[i] == "undefined") mapFlg = false;
	}
	mapNode.style.left = rect[0]+'px';
	mapNode.style.top = rect[1]+'px';
	mapNode.style.width = rect[2]+'px';
	mapNode.style.height = rect[3]+'px';
}
function removeMap(num){
	if(mapNode) mapNode.parentNode.removeChild(mapNode);
	mapNode = document.createElement("div");
	mapFlg = false;
	mapInitalized = false;
}

var mapInitalized = false;

function setMap(str){ 
	/*if(countryname=="korea") {
		if(str.indexOf("-")<0) {
			attachImageMap(parseInt(str));
		}
	}else{*/
		if(mapFlg){
			if(!mapInitalized) initMap();
			if(str.indexOf("-")>0){
				bounds = new GLatLngBounds();
				closeWindow();
				initOverlay();
				map.clearOverlays();
				_overlays = {};
				var start = parseInt(str.split("-")[0]);
				var end = parseInt(str.split("-")[1]);
				var length = parseInt(str.split("-")[2]);
				for(var i=start; i<end; i++){
					if(i==end-1) setMarker(stores.list[i], i, true, start, length);
					else setMarker(stores.list[i], i, false, start, length);
				}
			} else {
				openWindowLatLng(_overlays["n"+str][0],_overlays["n"+str][1]);
			}
		}
	//}
	
}

function initMap(){
	if(typeof(GBrowserIsCompatible)=="undefined"){
		alert("Unsupported browser.");
	}else if(!GBrowserIsCompatible()){
		alert("Google Maps has not loaded.");
	}else{
		initOverlay();
		window.onunload = GUnload;
		//
		map = new GMap2(mapNode);
		//
		mujiicon = new GIcon();
		mujiicon.iconSize = new GSize(22, 49);
		mujiicon.iconAnchor = new GPoint(11,45);
		mujiicon.infoWindowAnchor = new GPoint(11,0);
		//
		map.clearOverlays();
		map.setCenter(new GLatLng(0,0));
		map.addControl(new GSmallMapControl());
		//
		//
		mapInitalized = true;
	}
}