window.addEvent('domready',makeGmap);

function makeGmap(){

	//GMap2オブジェクトを生成
	var map = new GMap2($("shop_map"));

	//小さいマップコントローラを設置
	map.addControl(new GSmallMapControl());

	//地図の中心座標を設定
	map.setCenter(new GLatLng(35.705262263265716, 139.70008850097656), 11);

	//カスタムアイコンを作成
	var baseIcon = new GIcon();
	baseIcon.image = "http://localhost/hamazon/wp-content/themes/hamazon/css/img/icon.png";
	baseIcon.shadow = "http://localhost/hamazon/wp-content/themes/hamazon/css/img/icon-shadow.png";
	baseIcon.iconSize = new GSize(56,28);
	baseIcon.shadowSize = new GSize(56,28);
	baseIcon.iconAnchor = new GPoint(0,28);
	baseIcon.infoWindowAnchor = new GPoint(9,2);

	//「各店の最寄り駅から道を描画」→繰り返し
	//各店のポリラインを描画
	var mosakuPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "yoyxEmrusYCRwA_A{Nlb@KtAYpDfB}@",
		levels: "BBBBBBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(mosakuPolyline);

	//マーカー表示地点を設定
	var mosakuPoint = new GLatLng(35.68911704082882,139.70743775367737);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var mosakuMOption = {icon:baseIcon,title:"模索舎"};
	//マーカー・オブジェクトを生成
    var mosakuMarker = new GMarker(mosakuPoint,mosakuMOption);
    //イベント添附用の式を生成
    var openmosakuWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">模索舎</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：JR新宿</li>";
		myHtml += "<li>営業時間：11:00～21:00</li>";
		myHtml += "<li>定休日　：なし</li>";
		myHtml += "</ul>";
    	mosakuMarker.openInfoWindowHtml(myHtml);
        map.panTo(mosakuPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(mosakuMarker,"click",function(){
		openmosakuWindow();
	});

   $('mosaku_link').addEvent('click',function(){
		openmosakuWindow();
   });
	map.addOverlay(mosakuMarker);
	//各店のポリラインを描画
	var basaraPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "_e|xEgk|rYMCTcFRwA",
		levels: "BBBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(basaraPolyline);

	//マーカー表示地点を設定
	var basaraPoint = new GLatLng(35.702713922762534,139.57829475402832);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var basaraMOption = {icon:baseIcon,title:"BASARA BOOKS"};
	//マーカー・オブジェクトを生成
    var basaraMarker = new GMarker(basaraPoint,basaraMOption);
    //イベント添附用の式を生成
    var openbasaraWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">BASARA BOOKS</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：JR吉祥寺</li>";
		myHtml += "<li>営業時間：13:00～23:30</li>";
		myHtml += "<li>定休日　：月曜日</li>";
		myHtml += "</ul>";
    	basaraMarker.openInfoWindowHtml(myHtml);
        map.panTo(basaraPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(basaraMarker,"click",function(){
		openbasaraWindow();
	});

   $('basara_link').addEvent('click',function(){
		openbasaraWindow();
   });
	map.addOverlay(basaraMarker);
	//各店のポリラインを描画
	var tacoPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "gm}xEemmsY|F?`Ja@",
		levels: "BBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(tacoPolyline);

	//マーカー表示地点を設定
	var tacoPoint = new GLatLng(35.7091956956163,139.66562747955322);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var tacoMOption = {icon:baseIcon,title:"タコシェ"};
	//マーカー・オブジェクトを生成
    var tacoMarker = new GMarker(tacoPoint,tacoMOption);
    //イベント添附用の式を生成
    var opentacoWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">タコシェ</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：JR中野</li>";
		myHtml += "<li>営業時間：12:00～20:00</li>";
		myHtml += "<li>定休日　：なし</li>";
		myHtml += "</ul>";
    	tacoMarker.openInfoWindowHtml(myHtml);
        map.panTo(tacoPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(tacoMarker,"click",function(){
		opentacoWindow();
	});

   $('taco_link').addEvent('click',function(){
		opentacoWindow();
   });
	map.addOverlay(tacoMarker);
	//各店のポリラインを描画
	var shinnaiPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "wa|xEku`sYDO[KmAxAaEsA",
		levels: "BBBBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(shinnaiPolyline);

	//マーカー表示地点を設定
	var shinnaiPoint = new GLatLng(35.702198109858045,139.60037469863892);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var shinnaiMOption = {icon:baseIcon,title:"信愛書店"};
	//マーカー・オブジェクトを生成
    var shinnaiMarker = new GMarker(shinnaiPoint,shinnaiMOption);
    //イベント添附用の式を生成
    var openshinnaiWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">信愛書店</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：JR西荻窪</li>";
		myHtml += "<li>営業時間：10:30～24:00</li>";
		myHtml += "<li>定休日　：不明</li>";
		myHtml += "</ul>";
    	shinnaiMarker.openInfoWindowHtml(myHtml);
        map.panTo(shinnaiPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(shinnaiMarker,"click",function(){
		openshinnaiWindow();
	});

   $('shinnai_link').addEvent('click',function(){
		openshinnaiWindow();
   });
	map.addOverlay(shinnaiMarker);
	//各店のポリラインを描画
	var annnonnnPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "yz|xE_{_sYPFbH_KvAeETuB?oB",
		levels: "BBBBBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(annnonnnPolyline);

	//マーカー表示地点を設定
	var annnonnnPoint = new GLatLng(35.70617267627721,139.59615290164948);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var annnonnnMOption = {icon:baseIcon,title:"西荻アンノンレコード"};
	//マーカー・オブジェクトを生成
    var annnonnnMarker = new GMarker(annnonnnPoint,annnonnnMOption);
    //イベント添附用の式を生成
    var openannnonnnWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">西荻アンノンレコード</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：JR西荻窪</li>";
		myHtml += "<li>営業時間：14:00～22：00</li>";
		myHtml += "<li>定休日　：不定休</li>";
		myHtml += "</ul>";
    	annnonnnMarker.openInfoWindowHtml(myHtml);
        map.panTo(annnonnnPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(annnonnnMarker,"click",function(){
		openannnonnnWindow();
	});

   $('annnonnn_link').addEvent('click',function(){
		openannnonnnWindow();
   });
	map.addOverlay(annnonnnMarker);
	//各店のポリラインを描画
	var otowaPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "gq|xEca`sYPDbC}DAeA",
		levels: "BBBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(otowaPolyline);

	//マーカー表示地点を設定
	var otowaPoint = new GLatLng(35.70468330346233,139.59714531898499);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var otowaMOption = {icon:baseIcon,title:"音羽館"};
	//マーカー・オブジェクトを生成
    var otowaMarker = new GMarker(otowaPoint,otowaMOption);
    //イベント添附用の式を生成
    var openotowaWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">音羽館</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：JR西荻窪</li>";
		myHtml += "<li>営業時間：不明～不明</li>";
		myHtml += "<li>定休日　：不明</li>";
		myHtml += "</ul>";
    	otowaMarker.openInfoWindowHtml(myHtml);
        map.panTo(otowaPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(otowaMarker,"click",function(){
		openotowaWindow();
	});

   $('otowa_link').addEvent('click',function(){
		openotowaWindow();
   });
	map.addOverlay(otowaMarker);
	//各店のポリラインを描画
	var fictionessPolyline = new GPolyline.fromEncoded({
		color: "#004B91",
		weight: 10,
		points: "{~sxEc}msYXR_@jBaCQ",
		levels: "BBBB",
		zoomFactor: 32,
		numLevels: 4
	});

	//ポリラインをオーバーレイ
	map.addOverlay(fictionessPolyline);

	//マーカー表示地点を設定
	var fictionessPoint = new GLatLng(35.66078570069057,139.66820776462555);
	//カスタムアイコンをベースにマーカーオプションクラスを生成
	var fictionessMOption = {icon:baseIcon,title:"フィクショネス"};
	//マーカー・オブジェクトを生成
    var fictionessMarker = new GMarker(fictionessPoint,fictionessMOption);
    //イベント添附用の式を生成
    var openfictionessWindow = function(){
    //マーカー内のHTMLを定義
		var myHtml = "<h4 class=\"info\">フィクショネス</h4>";
		myHtml += "<ul class=\"info\">";
		myHtml += "<li>最寄り駅：小田急線下北沢</li>";
		myHtml += "<li>営業時間：13:00～20:00</li>";
		myHtml += "<li>定休日　：水曜日</li>";
		myHtml += "</ul>";
    	fictionessMarker.openInfoWindowHtml(myHtml);
        map.panTo(fictionessPoint);
        map.setZoom(17);
	}
	//マーカーにクリックイベントを定義
	GEvent.addListener(fictionessMarker,"click",function(){
		openfictionessWindow();
	});

   $('fictioness_link').addEvent('click',function(){
		openfictionessWindow();
   });
	map.addOverlay(fictionessMarker);

	//ここからアコーディオン
	var toggler = $$('h4.toggler');
    var accordion = new Accordion($('shop_list'),toggler,$$('ol.element'),{
    	opacity:false,
    	onActive: function(toggler,element){
        	toggler.setStyle('color','#F29915');
		},
        onBackground: function(toggler,element){
        	toggler.setStyle('color','#FFFFFF');
        }
	});

}