$(function(){
	mapInit();
	var position = $("#mapCanvas").offset().top-20;
	$(".placeNameBoxWrap").click(function () {
        $('html,body').animate({ scrollTop : position }, 'fast');
        mapClick($(this).prop("rel"));
        return false;
    });
    /*$(".placeNameBoxWrap").mouseover(function () {
    	mapClick($(this).prop("rel"));
    	return false;
    });*/
	$("#locationBtn").click(function () {
		var selectLocation = $('[name=locationSelector]').val();
		window.location.href = selectLocation;
		location.reload();
	});
});

//地図の基本設定
var myOptions;
var styledMapOptions;
var map;
var markers;
function mapInit() {

	if("#machida" == location.hash) {
		machida();
	}else if("#kobuchi" == location.hash) {
		kobuchi();
	}else if("#fuchinobe" == location.hash) {
		fuchinobe();
	}else if("#yabe" == location.hash) {
		yabe();
	}else if("#naruse" == location.hash) {
		naruse();
	}else if("#nagatsuta" == location.hash) {
		nagatsuta();
	}else if("#sagamihara" == location.hash) {
		sagamihara();
	}else if("#odakyusagamihara" == location.hash) {
		odakyusagamihara();
	}else if("#tokaichiba" == location.hash) {
		tokaichiba();
	}else if("#grandberrypark" == location.hash) {
		grandberrypark();
	}else if("#shinyokohama" == location.hash) {
		shinyokohama();
	}else if("#hashimoto" == location.hash) {
		hashimoto();
	}else if("#hachioji" == location.hash) {
		hachioji();
	}else{
		machida();
	}
	//地図のスタイルを設定
	var styleOptions = [
			  {
			    "stylers": [
			      { "gamma": 2.01 },
			      { "hue": "#ff0033" },
			      { "visibility": "simplified" },
			      { "lightness": -5 },
			      { "saturation": -5 }
			    ]
			  }
			];

	var mapType = new google.maps.StyledMapType(styleOptions, styledMapOptions);
	map.mapTypes.set('okusama', mapType);
	map.setMapTypeId('okusama');
	var countNum = 0;
	for (var i = 0; i < markers.length; i++) {
		countNum++;
		icon = new google.maps.MarkerImage(
	    	'/sagamihara/images/mapIconBL_'+ countNum +'.png',
		    new google.maps.Size(25,37),
		    new google.maps.Point(0,0)
		 );
		var content = markers[i][0];
		var latlng = new google.maps.LatLng(markers[i][1],markers[i][2]);
		createMarker(latlng,content,map,icon,i);
	}
}

//町田駅
function machida() {
	$(".locationSelector").val("#machida");
	$('.machida').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5419950,139.4454127),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '町田駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">ローソン 町田中央南口店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5416168, 139.4457306],
					['<h1 class="firstHeading">デニーズ 町田南口店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5418845, 139.4448945]
				];
}
//古淵駅
function kobuchi() {
	$(".locationSelector").val("#kobuchi");
	$('.kobuchi').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5559700,139.4193620),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '古淵駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">古淵駅ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5559734, 139.4199760]
				];
}
//淵野辺駅
function fuchinobe() {
	$(".locationSelector").val("#fuchinobe");
	$('.fuchinobe').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 17,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5686933,139.3948411),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '淵野辺駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">ローソン 淵野辺駅前店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5690970, 139.3943523],
					['<h1 class="firstHeading">ファミリーマート相模原淵野辺四丁目店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5685482, 139.3965366]
				];
}
//矢部駅
function yabe() {
	$(".locationSelector").val("#yabe");
	$('.yabe').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5731897,139.3871032),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '矢部駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">矢部駅 北口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5729861, 139.3875138],
					['<h1 class="firstHeading">矢部駅 南口出口</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5730580, 139.3865700]
				];
}
//成瀬駅
function naruse() {
	$(".locationSelector").val("#naruse");
	$('.naruse').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5355110,139.4729501),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '成瀬駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">成瀬駅 北口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5355866, 139.4732634],
					['<h1 class="firstHeading">セブンイレブン町田成瀬駅南口店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5355860, 139.4720134]
				];
}
//長津田駅
function nagatsuta() {
	$(".locationSelector").val("#nagatsuta");
	$('.nagatsuta').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5317587,139.4957180),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '長津田駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">長津田駅 北口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5321410, 139.4961351],
					['<h1 class="firstHeading">セブンイレブン横浜長津田駅前店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5314129, 139.4963804]
				];
}
//JR相模原駅
function sagamihara() {
	$(".locationSelector").val("#sagamihara");
	$('.sagamihara').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 16,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5793840,139.3693282),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: 'JR相模原駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">ローソン さがみ夢大通り店</h1>'+
					'<div class="imageBox"><img src="https://www.okusama-angel.net/sagamihara/images/meetingplace/sagamihara1.jpg" width="250" height="180" />', 
					35.5786700, 139.3692330],
					['<h1 class="firstHeading">串カツ田中 相模原店</h1>'+
					'<div class="imageBox"><img src="https://www.okusama-angel.net/sagamihara/images/meetingplace/sagamihara5.jpg" width="250" height="180" />', 
					35.5796070, 139.3704742],
					['<h1 class="firstHeading">ホテルウォーターゲート相模原</h1>'+
					'<div class="imageBox"><img src="https://www.okusama-angel.net/sagamihara/images/meetingplace/sagamihara3.jpg" width="250" height="180" />', 
					35.5782410, 139.3706210],
					['<h1 class="firstHeading">相模原プラザ</h1>'+
					'<div class="imageBox"><img src="https://www.okusama-angel.net/sagamihara/images/meetingplace/sagamihara4.jpg" width="250" height="180" />', 
					35.5797510, 139.3706715]
				];
}
//小田急相模原駅
function odakyusagamihara() {
	$(".locationSelector").val("#odakyusagamihara");
	$('.odakyusagamihara').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 19,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5155100,139.4224740),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '小田急相模原駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">北口ロータリー 郵便ポスト前</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5156899, 139.4225810]
				];
}
//十日市場駅
function tokaichiba() {
	$(".locationSelector").val("#tokaichiba");
	$('.tokaichiba').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5263470,139.5167240),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '十日市場駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">十日市場駅 北口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5263606, 139.5171010],
					['<h1 class="firstHeading">十日市場駅 南口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5260829, 139.5165580]
				];
}
//南町田グランベリーパーク駅
function grandberrypark() {
	$(".locationSelector").val("#grandberrypark");
	$('.grandberrypark').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5114836,139.4707955),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '南町田グランベリーパーク駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">南町田グランベリーモール駅 北口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5117880, 139.4710030]
				];
}
//新横浜駅
function shinyokohama() {
	$(".locationSelector").val("#shinyokohama");
	$('.shinyokohama').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 18,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5073070,139.6178600),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '新横浜駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">新横浜駅 北口 ロータリー 乗り降りスペース</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5080380, 139.6172200],
					['<h1 class="firstHeading">新横浜駅 篠原口ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5064911, 139.6172700],
					['<h1 class="firstHeading">セブンイレブン新横浜駅南口店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5064170, 139.6171200]
				];
}
//橋本駅
function hashimoto() {
	$(".locationSelector").val("#hashimoto");
	$('.hashimoto').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 17,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.5948778,139.3449312),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '橋本駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">橋本駅 南口 ロータリー</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.5940471, 139.3453296]
				];
}
//八王子駅
function hachioji() {
	$(".locationSelector").val("#hachioji");
	$('.hachioji').css('display','block');
	//地図の中心点と拡大率を設定
	myOptions = {
		zoom: 15,
		disableDefaultUI: true,
		/*streetViewControl: false,*/
		center: new google.maps.LatLng(35.6556165,139.3387998),
		mapTypeControlOptions: { mapTypeIds: ['okusama', google.maps.MapTypeId.ROADMAP] }
	};
	map = new google.maps.Map(document.getElementById("mapCanvas"),myOptions);
	styledMapOptions = { name: '八王子駅待ち合わせ場所' }
	//アイコンの場所の名前と緯度経度を追加
	markers = [
					['<h1 class="firstHeading">サーティワンアイスクリーム セレオ八王子店前(2F)</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.6546600, 139.3388800],
					['<h1 class="firstHeading">多摩信用金庫 八王子駅前支店前</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.6541600, 139.3375600],
					['<h1 class="firstHeading">ドン・キホーテ 八王子駅前店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.6578800, 139.3371000],
					['<h1 class="firstHeading">スターバックスコーヒー 八王子オクトーレ店</h1>'+
					'<div class="imageBox"><!--img src="http://www.angelline.net/images/ajobBnr.gif" /-->', 
					35.6571310, 139.3386510]
				];
}


//アイコンの設定
var currentInfoWindow = null;
var gmarkers = [];
function createMarker(latlng,content,map,icon,i){
	var iwopts = {maxWidth: 250,};
	var infoWindow = new google.maps.InfoWindow(iwopts);
	var marker = new google.maps.Marker({
		position: latlng,
		map: map,
		icon: icon,
		animation: google.maps.Animation.DROP
	});
	google.maps.event.addListener(marker, 'click', function() {
		if (currentInfoWindow) {
			currentInfoWindow.close();
		}
		/*infoWindow.close();*/
		infoWindow.setContent(content);
		infoWindow.open(map,marker);
		currentInfoWindow = infoWindow;
	});
	i++; 
	gmarkers[i] = marker;
}

//アイコンとテキストリンクのクリックイベント
function mapClick(i) {
	google.maps.event.trigger(gmarkers[i], "click");
	map.setCenter(gmarkers[i].getPosition());
}