// イメージ読み込み
cxPreImages(
	'../images/icon/icon_map_arrow08.gif'
);

/**
 * GMap2クラス
 * @param objId GooleMaps表示オブジェクトのID名:String
 * @param infoWindow 情報ウィンドウ内要素格納オブジェクト:Object
 */
var GDMap2 = function(objId,infoWindow){
	//定数の宣言
	//GoogleMaps関係
	this.gmapArea		= $(objId);						//GoogleMaps表示オブジェクト
	this.listArea		= "resultList";					//検索結果リスト表示オブジェクトID名
	this.zoom			= 9;							//初期ズームレベル
	this.infoOption		= {maxWidth:400};				//情報ウィンドウオプション
	this.infoDataObj	= infoWindow;					//情報ウィンドウデータオブジェクト
	this.iconPath		= "/shared/images/result/";		//アイコンファイルへのパス
	this.icon_width		= "34";							//アイコン幅
	this.icon_height	= "37";							//アイコン高さ
	this.iconSelf		= "icon_map_arrow_self.gif";	//自身のアイコン
	this.iconFile		= "icon_map_arrow08.gif";		//アイコンファイル
	this.infoHtml		= {								//情報ウィンドウ内HTMLフォーマット
		header :'<div id="dtl_map_balloon">',
		title  :'<h2>#TITLE#</h2>',
		image  :'<p class="detail_img"><img name="prev_img" src="#IMAGE#" alt="" /></p>',
		exp    :'<p style="font-size:12px;">#EXP#</p>',
		access :'<h3>交通アクセス</h3><p style="font-size:12px;">#ACCESS#</p>',
		inquiry:'<h3>問い合わせ</h3><p style="font-size:12px;">#INQUIRY#</p>',
		footer :'</div>'
	};
//<div style="height:150px;overflow:scroll;"></div>

	//変数の宣言
	//GoogleMaps関係
	this.gmap			= null;							//GMap2インスタンス
	this.marker			= new Object();					//マーカー格納
	this.resultData		= null;							//検索結果リスト格納オブジェクト

	//チェック
	if(!this.gmapArea){
		alert("System Error! [Constructor]\nGoogle Maps表示領域が存在しません。");
		return;
	}
	this.loading();
}

/**
 * 処理関数郡の宣言
 * GoogleMaps表示に使用する関数郡
 */
GDMap2.prototype = {
	/**
	 * ロード画面を表示
	 * GoogleMaps表示エリアにロード中であることを示す文字を描画する
	 */
	loading : function(){
		if(this.gmapArea) this.gmapArea.innerHTML = '<div style="font-size:80%;padding:10px;">Now Loading...</div>';
		this.initGmap();
	},

	/**
	 * GoogleMaps初期化
	 * GoogleMapsを初期化する
	 */
	initGmap : function(){
		//ブラウザチェック
		if(!GBrowserIsCompatible()){
			alert("ご利用のブラウザではGoogleMapsを表示することができません。");
			return;
		}
		//GoogleMapsの初期セット
		this.gmap = new GMap2(this.gmapArea);
		var point = new GLatLng(this.infoDataObj.lat,this.infoDataObj.lng);
		this.gmap.setCenter(point, this.zoom);
		this.gmap.addControl(new GLargeMapControl());
		this.gmap.addControl(new GScaleControl());
		new GKeyboardHandler(this.gmap);
		this.gmap.enableContinuousZoom();		//連続した滑らかなズーム処理
		this.gmap.enableDoubleClickZoom();		//ダブルクリックによるズーム処理

		//マップ及びリスト表示の作成
		if(res != "") eval('var data=' + res);
		else var data = new Object();
		this.resultData = data;
		//リストの初期化
		$(this.listArea).innerHTML = "";
		//マーカーの作成
		var key,id,marker,result;
		var loop_cnt = 0;
		//マーカーを表示
		for(key in data){
			//マーカーの作成
			marker = this.createMarker(data[key]);
			if(marker){
				this.gmap.addOverlay(marker);
				//最初の1件だけ、ウィンドウを表示する
				if(loop_cnt == 0){
					var prev_marker = marker;
					if(data[key].image){
						oImg = document.createElement('IMG');
						oImg.src = data[key].image;
					}
					var msg = this.createInfoWindowHtml(data[key]);
					if(oImg){
						oImg.onload = function(){
							if(document.prev_img) document.prev_img.src = oImg.src;
							prev_marker.openInfoWindowHtml(msg,gmap2.infoOption);
							prev_marker = null;
						}
					}
					else marker.openInfoWindowHtml(msg,this.infoOption);
					this.gmap.setCenter(marker.getLatLng(),this.zoom);
				}
			}
			//検索結果リスト表示
			this.createResultList(data[key],loop_cnt);
			loop_cnt++;
		}
		//リストエリアに何も表示が無ければ、指定文字を表示
		if($(this.listArea).innerHTML == "") $(this.listArea).innerHTML = '<p style="font-size:12px;">該当する情報はありません</p>';
	},

	/**
	 * GoogleMapsマーカー生成
	 * GoogleMaps表示用のマーカーを生成する
	 * @param obj マーカー作成用オブジェクト
	 * @return 作成したマーカー
	 */
	createMarker : function(obj){
		//引数チェック
		var key = ((obj.id) ? obj.id : "");
		if(key == ""){
			alert("System Error! [Func:createMarker]\nデータIDの取得に失敗しました。");
			return;
		}
		//アイコンの作成
		var icon;
		if(this.iconFile) icon = this.createIcon(this.iconFile);
		//マーカーの作成
		var marker;
		if(icon) marker = new GMarker(new GLatLng(obj["lat"],obj["lng"]),{icon:icon,title:obj["title"]});
		else marker = new GMarker(new GLatLng(obj["lat"],obj["lng"],{title:obj["title"]}));
		//クリックイベントの登録
		GEvent.addListener(marker, "click",
			function(){
				if(obj.image){
					oImg = document.createElement('IMG');
					oImg.src = obj.image;
				}
				//メッセージの作成
				var msg = this.createInfoWindowHtml(obj);
				//ウィンドウ表示
				if(oImg){
					oImg.onload = function(){
						if(document.prev_img) document.prev_img.src = oImg.src;
						marker.openInfoWindowHtml(msg,gmap2.infoOption);
					}
				}
				else marker.openInfoWindowHtml(msg,this.infoOption);
			}.bind(this)
		);
		this.marker[key] = marker;
		return marker;
	},

	/**
	 * GoogleMapsアイコン生成
	 * GoogleMapsマーカー作成用のアイコンを生成する
	 * @param iconFileName アイコンファイルのファイル名
	 * @return 作成したアイコン
	 */
	createIcon : function(iconFileName){
		//引数チェック
		if(!this.iconPath || !this.icon_width || !this.icon_height || !iconFileName) return false;
		//アイコン作成
		var icon = new GIcon();
		icon.image = this.iconPath + iconFileName;
		icon.iconSize = new GSize(this.icon_width,this.icon_height);
		icon.iconAnchor = new GPoint(this.icon_width / 2,this.icon_height);	//アイコンと地図ポイントの位置関係：中央×下
		icon.infoWindowAnchor = new GPoint(this.icon_width / 2,0);
		return icon;
	},

	/**
	 * GoogleMaps情報ウィンドウ内HTML生成
	 * GoogleMaps情報ウィンドウ内のHTMLを生成する
	 * @param obj 情報ウィンドウに必要な値を持ったオブジェクト
	 * @return 作成したhtml
	 */
	createInfoWindowHtml : function(obj){
		var html = '';

		//ヘッダ宣言の表示
		if(this.infoHtml.header)  html += this.infoHtml.header;
		//オブジェクトの内容を表示
		if(obj.title)   html += this.infoHtml.title.replace("#TITLE#",obj.title);
		if(obj.image)   html += this.infoHtml.image.replace("#IMAGE#",obj.image);
		if(obj.exp)     html += this.infoHtml.exp.replace("#EXP#",obj.exp);
		if(obj.access)  html += this.infoHtml.access.replace("#ACCESS#",obj.access);
		if(obj.inquiry) html += this.infoHtml.inquiry.replace("#INQUIRY#",obj.inquiry);
		//フッタ宣言の表示
		if(this.infoHtml.footer)  html += this.infoHtml.footer;
		return html;
	},

	/**
	 * 結果リスト生成
	 * 検索結果リストを生成する
	 * @param obj 検索結果が入っているオブジェクト
	 * @param loop_cnt 何件目の結果か分かるようにするためのカウンター
	 * @return 作成したhtml
	 */
	createResultList : function(obj,loop_cnt){
		//表示エリアの存在チェック
		if(!$(this.listArea)) return;
		//リストに表示するデータを作成
		var data = document.createElement('li');
		data.id = obj.id;
		if(loop_cnt % 2 == 0) data.className = 'odd';
		data.innerHTML = '<a href="javascript:void(0)">' + obj.title + '</a>';
		$(this.listArea).appendChild(data);
		//onClickイベントの処理登録
		data.onclick = function(){
			gmap2.listClickEventListener(this.id);
		};
	},

	/**
	 * 結果リストクリックイベント
	 * 検索結果リストをクリックしたときのイベント
	 * @param key クリックされたリストのID
	 */
	listClickEventListener : function(key){
		//データのチェック
		if(!this.marker[key] || !this.resultData[key]){
			alert("System Error! [Func:listClickEventListener]\nマーカー情報の取得に失敗しました。");
			return;
		}
		//InfoWindowを表示
		if(this.resultData[key].image){
			oImg = document.createElement('IMG');
			oImg.src = this.resultData[key].image;
		}
		//メッセージの作成
		var msg = this.createInfoWindowHtml(this.resultData[key]);
		//ウィンドウ表示
		if(oImg){
			oImg.onload = function(){
				if(document.prev_img) document.prev_img.src = oImg.src;
				gmap2.marker[key].openInfoWindowHtml(msg,gmap2.infoOption);
			}
		}
		else this.marker[key].openInfoWindowHtml(msg,this.infoOption);
//		this.marker[key].openInfoWindowHtml(this.createInfoWindowHtml(this.resultData[key]),this.infoOption);
	}
}

//画像のプリロード
function cxPreImages(){
	var d = document;
	if(d.images){
		if(!d.MM_p) d.MM_p = new Array();
		var i;
		var j = d.MM_p.length;
		var a = cxPreImages.arguments;
		for(i = 0;i < a.length;i++){
			if(a[i].indexOf("#") != 0){
				d.MM_p[j] = new Image;
				d.MM_p[j++].src = a[i];
			}
		}
	}
}

