var map;
var pin;
var fid;
var fcount=0;
var tid;
var tcount = 0;
var clat = 36.4038;
var clon = 138.2444;

var menuWin = null;
var infoWin = null;
var viewWin = null;
var init_width=0;
var table_width;
var table_height;
var table_head = "";
var table_cont = "";
var ctip;
var tip = [];
var ltip = [];
var menu_item = [];
var menu_sub = [];
var init_mode="trace";
var safeHouse = [];
var vehicle = [];
var frame = [];
var sounds = [];
var trafficLayer;
var streetViewPanorama;

var shopQR = [];
var preZoom = 12;
var map_no = 0;

const jsFrame = new JSFrame();
window.addEventListener("orientationchange", function() {
	location.reload();
});

function callEra(era) {
	window.location.href = "https://uedacity.xsrv.jp/map/?era="+era;
/*
	var el = document.createElement("script");
	el.src = "https://uedacity.xsrv.jp/map/data/?era="+era;
	document.body.appendChild(el);
	initMap();
*/
}
function callDept(dept) {
	window.location.href = "https://uedacity.xsrv.jp/map/?dept="+dept;
}
function initMap() {
	var options = {styles: [
		{"featureType":"administrative.land_parcel","stylers": [{"visibility": "on"}]},
		{"featureType":"administrative.neighborhood","stylers": [{"visibility": "on"}]},
		{"featureType":"administrative.poi","elementType": "labels.text","stylers": [{"visibility": "on"}]},
		{"featureType":"poi","stylers": [{"visibility": "off"}]},
		{"featureType":"poi.school","elementType": "labels","stylers": [{"visibility": "on"}]},
		{"featureType":"road","elementType": "labels","stylers": [{"visibility": "on"}]},
		{"featureType":"transit.station","stylers": [{"visibility": "on"}]},
		{"featureType":"transit.station","elementType": "labels.text","stylers": [{"visibility": "on"}]},
		{"featureType":"landscape.man_made","elementType": "labels","stylers": [{"visibility": "on"}]},
		{"featureType":"poi","elementType": "geometry","stylers": [{"color": "#008833"}]},
		{"featureType":"poi.park","elementType": "geometry","stylers": [{"color": "#D0E7a3"}]},
		{"featureType":"road","elementType": "geometry","stylers": [{"color": "#aaaaaa"}]},//道路色
		{"featureType":"water","elementType": "labels.text","stylers": [{"visibility": "on"}]},
		{"featureType":"landscape.natural","elementType": "geometry","stylers": [{"color": "#448833"}]},//新緑
		{"featureType":"landscape.natural.landcover","elementType": "geometry","stylers": [{"color": "#D0E7a3"}]},//草色
		{"featureType":"landscape.man_made","elementType": "geometry","stylers": [{"hue": "#448833"}]},
		{"featureType":"landscape.man_made","elementType": "geometry.fill","stylers": [{"hue": "#E3D8B8"}]},
		{"featureType":"landscape.man_made","elementType": "geometry.stroke","stylers": [{"color": "#E6D8B8"}]},
		{"featureType":"water","elementType": "geometry","stylers": [{"color": "#4B64A1"}]},//群青
		{"featureType":"administrative","elementType": "geometry","stylers": [{"color": "#C09A5E"}]},//枯山
		]
	};
	map = new google.maps.Map(document.getElementById('map'), {
		center: {lat: clat, lng: clon},
		zoom: preZoom,
		minZoom: 11,
		tilt:0,
		heading:0,
		streetViewControlOptions: {
        position: google.maps.ControlPosition.LEFT_TOP,
      },
//		streetViewControl: false,
		keyboardShortcuts:false,
		gestureHandling: 'greedy',
		disableDoubleClickZoom: true,
		scrollwheel: true,
		scaleControl: true,
		rotateControl: false,
		zoomControlOptions: {position: google.maps.ControlPosition.LEFT_BOTTOM,},
		mapTypeId: google.maps.MapTypeId.TERRAIN,
		zoomControl: false,
		fullscreenControl: false,
		mapTypeControl: false,
		options
	});

	loading();
	$("#ci").css("top",window.innerHeight-32);
	addListener0(map);
	frame.forEach(element => addListener1(element));
	ltip.forEach(element => addListener2(element));
	tip.forEach(element => addListener3(element));
	safeHouse.forEach(element => addListener4(element));
	shopQR.forEach(element => addListener5(element));
	var wOptions = {
		"enableHighAccuracy": true,// true : 高精度
		"timeout": 10000, // タイムアウト : ミリ秒
		"maximumAge": 0,// データをキャッシュ時間 : ミリ秒
	};
	navigator.geolocation.getCurrentPosition(initPos,initPos,wOptions);
	sounds[0] = new Audio('SoundOnButton.mp3');
	sounds[1] = new Audio('SoundClick.mp3');
	sounds[2] = new Audio('SoundOpenWindow.mp3');
	for(i=0;sounds.length>i;i++) sounds[i].volume = 0.2;
	$('.MenuButton').mouseover(function(){playSound(0)});
	$('.MenuButton').click(function(){playSound(1)});
//	$('.SoundOnButton').mouseover(function(){playSound(0)});
//	$('.SoundOnButton').click(function(){playSound(1)});
//情報ウィンドウ
	infoWin = jsFrame.create({
		name: `Info`,
		title: '📋情報',
		left: 0, top: 0, width: 0, height: window.innerHeight-20, minWidth: 0, minHeight: 0,
		appearanceName: 'material',
		style: {backgroundColor: 'rgba(255,255,255,0.9)',overflow: 'auto'},
	});
	infoWin.hideFrameComponent('maximizeButton');
//	infoWin.hideFrameComponent('minimizeButton');
	infoWin.hideFrameComponent('closeButton');
	infoWin.setPosition(window.innerWidth, 1, 'RIGHT_TOP');
	infoWin.setControl({
			minimizeButton: 'minimizeButton',
			deminimizeButton: 'deminimizeButton',
		animation: true,
		animationDuration: 200,
	});
	menuWin = jsFrame.create({
		name: `Menu`,
		title: 'Menu',
		left: 0, top: 0, width: 130, height: window.innerHeight-30, minWidth: 0, minHeight: 0,
		appearanceName: 'material',
		style: {backgroundColor: 'rgba(255,255,255,0.8)',overflow: 'auto'},
		html:menu_html,
	});
	menuWin.hideFrameComponent('maximizeButton');
	menuWin.hideFrameComponent('minimizeButton');
	menuWin.hideFrameComponent('closeButton');
//	menuWin.setPosition(0, 0, 'LEFT_TOP');
	viewWin = jsFrame.create({
		name: `View`,
		title: 'View',
		left: 140, top: 0, width: window.innerWidth-280, height: window.innerHeight-20, minWidth: 0, minHeight: 0,
		appearanceName: 'material',
		style: {backgroundColor: 'rgba(255,255,255,0.8)',overflow: 'auto'},
		html:'<div id=\"viewWin\" style=\"width:calc(100% - 10px);height:calc(100% - 10px);margin:5px;opacity:30%;\"></div>',
	});
	viewWin.hideFrameComponent('maximizeButton');
//	viewWin.hideFrameComponent('minimizeButton');
	viewWin.hideFrameComponent('closeButton');
//	viewWin.setPosition(2, 140, 'LEFT_TOP');
	viewWin.setControl({
			minimizeButton: 'minimizeButton',
			deminimizeButton: 'deminimizeButton',
			animation: true,
		animationDuration: 200,
	});
	viewWin.control.on('deminimized', (viewWin, info) => {
		map.setZoom(17);
		streetViewPanorama.setPov({heading: 0,pitch: 0,zoom: 0});
	});
	
//	elements = document.getElementsByTagName('div');
//	for(i=0;i<elements.length;i++){//>
//		if(elements.item(i).innerHTML!="")alert(elements.item(i).innerHTML);
//		if(elements.item(i).id!="" && ~elements.item(i).id.indexOf("window_") && ~elements.item(i).id.indexOf("_title"))
//			$('#'+elements.item(i).id).click(function(){infoWin.control.doMinimize();});
//	}
trafficLayer = new google.maps.TrafficLayer();
}
function adjustWindow(){
	table_width = document.getElementById('infoTable').clientWidth;
	infoWin.setPosition(document.body.clientWidth-table_width, 0, 'LEFT_TOP');
	menuWin.setPosition(0, document.body.clientHeight-180, 'LEFT_TOP');
//	changeText('mainTitle',window.innerWidth+':'+window.innerHeight+'/'+screen.height+':'+screen.pixelDepth);

}
function pubTrans(me){
	if(me.innerHTML=="🚌"){
		me.innerHTML="🚎";
		toast('🚎交通機関モードは準備中です');
	}else{
		me.innerHTML="🚌";
	}
}
function traffic(me,flag=true){
	if(me.innerHTML=="🚙" && flag){
		map.mapType=
		me.innerHTML="🚗";
		map.setMapTypeId('roadmap');
		trafficLayer.setMap(map);
		toast('🚗渋滞情報モード');
		$("#mapType").text('🏞️');
		$("#bt_rotate").prop("disabled", true);
		$("#bt_rotate").html('👆');
	}else{
		trafficLayer.setMap(null);
		me.innerHTML="🚙";
	}
}
function infoQR(type="",genre="",sort="",order=1){
	table_cont = "<table id='infoTable' style='font-size:12px;height:25px;width:100%'>";
	if(type==""){
		sortShop(sort,order);
		table_head = "<tr><td style='height:25px;border:1px solid black'> </td><th style='height:25px;border:1px solid black'>業種</th><th style='height:25px;border:1px solid black' nowrap>件数</th></tr>";
		table_cont += table_head;
		var pre = "";
		var num = 0;
		for(i=0;shopQR.length>i;i++){
			if(map_no==0 || map_no==shopQR[i].eval){
				if(shopQR[i].getVisible()==false) shopQR[i].setVisible(true);
				if(pre != "" && pre != shopQR[i].type){
					if(pre=="飲食") str_pre = "<img src='./sample/32/emoji_u1f37d.png' style='height:20px;' />"+pre;
					else if(pre=="飲酒") str_pre = "<img src='./sample/32/emoji_u1f942.png' style='height:20px;' />"+pre;
					else if(pre=="食料品") str_pre = "<img src='./sample/32/emoji_u1f969.png' style='height:20px;' />"+pre;
					else if(pre=="美容") str_pre = "<img src='./sample/32/emoji_u2728.png' style='height:20px;' />"+pre;
					else if(pre=="服飾") str_pre = "<img src='./sample/32/emoji_u1f454.png' style='height:20px;' />"+pre;
					else if(pre=="小売") str_pre = "<img src='./sample/32/emoji_u1f6d2.png' style='height:20px;' />"+pre;
					else if(pre=="宿泊") str_pre = "<img src='./sample/32/emoji_u1f6cc.png' style='height:20px;' />"+pre;
					else if(pre=="住宅") str_pre = "<img src='./sample/32/emoji_u1f3e0.png' style='height:20px;' />"+pre;
					else if(pre=="交通") str_pre = "<img src='./sample/32/emoji_u1f6e3.png' style='height:20px;' />"+pre;
					else if(pre=="健康") str_pre = "<img src='./sample/32/emoji_u1f3c3.png' style='height:20px;' />"+pre;
					else if(pre=="サービス") str_pre = "<img src='./sample/32/emoji_u1f91d.png' style='height:20px;' />"+pre;
					else str_pre = pre;
					table_cont += "<tr  onclick=infoQR('"+pre+"')><td style='height:25px;border:1px solid black;color:white;background-color:"+shopQR[i-1].group_color+";'>　</td><td style='height:25px;border:1px solid black;' nowrap>"+str_pre+"</td><td style='height:25px;border:1px solid black' align=right>"+num+"</td></tr>";
					num=0;
				}
				pre = shopQR[i].type;
				num++;
			}
		}
		if(pre=="コンビニ") str_pre = "<img src='./sample/32/emoji_u1f3ea.png' style='height:20px;' />"+pre;
		table_cont += "<tr onclick=infoQR('"+pre+"')><td style='height:25px;border:1px solid black;color:white;background-color:"+shopQR[shopQR.length-1].group_color+";'>　</td><td style='height:25px;border:1px solid black' nowrap>"+str_pre+"</td><td style='height:25px;border:1px solid black' align=right>"+num+"</td></tr>";
		table_cont += "</table>";
		infoWin.setHTML(table_cont);
		if(init_width==0) init_width = document.getElementById('infoTable').clientWidth+22;
		var table_width = init_width;
	}else{
		sortShop("group",-1);
		var pre = type;
		var subgenre = false;
		var table_group = "";
		var table_unique = "";
		if(genre=="") pre = "";
		var emoji = "";
		for(i=0;shopQR.length>i;i++){
			if(type == shopQR[i].type && (genre=="" || genre == shopQR[i].genre)){
				if(shopQR[i].getVisible()==false) shopQR[i].setVisible(true);
				if(shopQR[i].group!="" && genre != shopQR[i].genre){
					if(table_group.indexOf(shopQR[i].group)==-1){
						emoji = "<img src='./sample/32/emoji_u"+shopQR[i].code+".png' style='height:20px;' />";
						table_group += "<tr onclick=infoQR('"+type+"','"+shopQR[i].genre+"')><td style='height:25px;border:1px solid black;text-align:center;' nowrap>"+emoji+"</td><td style='height:25px;border:1px solid black' nowrap colspan=2>"+shopQR[i].group+"</td><td style='height:25px;border:1px solid black;text-align:right;' colspan=2>"+shopQR[i].group_num+"</td></tr>";
						subgenre = true;
					}
				}else{
					emoji = "<img src='./sample/32/emoji_u"+shopQR[i].code+".png' style='height:20px;' />";
					table_unique += "<tr>";
					colspan=1;
					if(shopQR[i].group=="")table_unique += "<td class=address style='height:25px;border:1px solid black;text-align:center;'>"+emoji+"</td><td class=address style='height:25px;border:1px solid black' nowrap onclick=zoomShop("+i+") >"+shopQR[i].genre+"</td>";
					else colspan=2;
					if(shopQR[i].type=="コンビニ")table_unique += "<tr><td class=name colspan="+colspan+" style='height:25px;border:1px solid black' onmouseover=forcusShop("+i+",1) onmouseout=forcusShop("+i+",0.6) onclick=zoomShop("+i+") nowrap title='"+shopQR[i].shop+"'>"+shopQR[i].shop+"</td>";
					else table_unique += "<td class=name colspan="+colspan+" style='height:25px;border:1px solid black' onmouseover=forcusShop("+i+",1) onmouseout=forcusShop("+i+",0.6) onclick=zoomShop("+i+") nowrap title='"+shopQR[i].shop+"'>"+shopQR[i].name+"</td>";
					if(shopQR[i].hp!="") table_unique += "<td class=address style='height:25px;border:1px solid black;text-align:center' nowrap><a href='"+shopQR[i].hp+"' target='_blank'>"+shopQR[i].hpico+"</a></td>";
					else if(shopQR[i].eval!="") table_unique += "<td class=address style='height:25px;border:1px solid black;text-align:center' nowrap onclick=\"map_no="+shopQR[i].eval+";\">"+shopQR[i].eval+"</td>";
					else table_unique += "<td class=address style='height:25px;border:1px solid black' nowrap></td>";
					if(shopQR[i].qr!="") table_unique += "<td class=address style='height:25px;border:1px solid black;text-align:center;' nowrap>"+shopQR[i].qr+"</td>";
					else if(shopQR[i].report!="") table_unique += "<td class=address style='height:25px;border:1px solid black;text-align:center' nowrap>"+shopQR[i].report+"</td>";
					else table_unique += "<td class=address style='height:25px;border:1px solid black' nowrap></td>";
					table_unique += "</tr>";
				}
			}
			else shopQR[i].setVisible(false);
		}
		if(subgenre){
			table_head = "<tr style='border-top:2px solid black;'><th style='height:25px;border:1px solid black;' colspan=2>その他</th><th style='height:25px;border:1px solid black' onclick=infoQR('"+type+"','"+genre+"','name')>名称</th><th style='height:25px;border:1px solid black' onclick=infoQR('"+type+"','"+genre+"','hp',-1)>HP</th><th style='height:25px;border:1px solid black' onclick=infoQR('"+type+"','"+genre+"','qr',-1) nowrap>QR</th></tr>";
			table_cont += "<tr><th style='height:25px;width:25px;border:1px solid black' onclick=infoQR('"+pre+"')>🔙</th><th style='height:25px;border:1px solid black' colspan=2>"+type+"ジャンル</th><th style='height:25px;border:1px solid black' nowrap colspan=2>件数</th></tr>";
		}else{
			table_head = "<tr><th style='height:25px;width:25px;border:1px solid black' onclick=infoQR('"+pre+"')>🔙</th><th style='height:25px;border:1px solid black' onclick=infoQR('"+type+"','"+genre+"','name')>"+emoji+genre+"</th><th style='height:25px;border:1px solid black' onclick=infoQR('"+type+"','"+genre+"','hp',-1)>HP</th><th style='height:25px;border:1px solid black' onclick=infoQR('"+type+"','"+genre+"','qr',-1) nowrap>QR</th></tr>";
		}
		if(subgenre)table_cont += table_group;
		if(table_unique!="")table_cont += table_head;
		table_cont += table_unique;
		table_cont += "</table>";
		infoWin.setHTML(table_cont);
		var table_width = document.getElementById('infoTable').clientWidth+22;
	}
	var table_height = document.getElementById('infoTable').clientHeight+31;
	if(table_height>window.innerHeight) table_height = window.innerHeight-20;
	infoWin.minWindowHeight = table_height;
	infoWin.minWindowWidth = table_width;
	infoWin.setSize(table_width,table_height);
	infoWin.setPosition(window.innerWidth-table_width, infoWin.getPosition().y, 'LEFT_TOP');
}
function info(type,dept="",area="",name=""){
//	sortFrame(type);
	table_cont = "<table id='infoTable' style='font-size:12px;height:25px;'>";
	//ここでタイトル部分を生成
	table_head = "<tr><th style='height:25px;border:1px solid black' onclick=info('"+type+"','top')>自治会名</th></tr>";
	table_cont += table_head;
	//ここで各機能ごとのメソッドを
	var pre = "";
	var list_id = "";
	if(dept=="" || dept=="top"){
		for(i=0;i<frame.length;i++){//>
			if(type=="area"){
				if(pre != "" && pre != frame[i].area){
					table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacities('"+list_id+"',1); onmouseout=changeOpacities('"+list_id+"',0.3); onclick=playSound(1);changeOpacities('"+list_id+"',0.3);info('"+type+"','"+pre+"')>"+pre+"</td></tr>";
					list_id = "";
				}
				list_id += ","+i;
				pre = frame[i].area;
			}else if(type=="fire"){
				if(pre != "" && pre != frame[i].dept){
					table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacities('"+list_id+"',1); onmouseout=changeOpacities('"+list_id+"',0.3); onclick=playSound(1);changeOpacities('"+list_id+"',0.3);info('"+type+"','"+pre+"')>"+pre+"</td></tr>";
					list_id = "";
				}
				list_id += ","+i;
				pre = frame[i].dept;
			}
		}
		table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacities('"+list_id+"',1); onmouseout=changeOpacities('"+list_id+"',0.3); onclick=playSound(1);changeOpacities('"+list_id+"',0.3);info('"+type+"','"+pre+"')>"+pre+"</td></tr>";
	}else if(area==""){
		for(i=0;i<frame.length;i++){//>
			if(frame[i].dept==dept){
				if(type=="area"){
					if(pre != "" && pre != frame[i].area){
						table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacities('"+list_id+"',1); onmouseout=changeOpacities('"+list_id+"',0.3); onclick=playSound(1);changeOpacities('"+list_id+"',0.3);info('"+type+"','"+dept+"','"+pre+"')>"+pre+"</td></tr>";
						list_id = "";
					}
					list_id += ","+i;
					pre = frame[i].area;
				}else if(type="fire"){
					if(pre != "" && pre != frame[i].fire){
						table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacities('"+list_id+"',1); onmouseout=changeOpacities('"+list_id+"',0.3); onclick=playSound(1);changeOpacities('"+list_id+"',0.3);info('"+type+"','"+dept+"','"+pre+"')>"+pre+"</td></tr>";
						list_id = "";
					}
					list_id += ","+i;
					pre = frame[i].fire;
				}
			}
		}
		table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacities('"+list_id+"',1); onmouseout=changeOpacities('"+list_id+"',0.3); onclick=playSound(1);changeOpacities('"+list_id+"',0.3);info('"+type+"','"+dept+"','"+pre+"')>"+pre+"</td></tr>";
	}else{
		for(i=0;i<frame.length;i++){//>
			if(frame[i].area==area && frame[i].dept==dept){
				table_cont += "<tr><td style='height:25px;border:1px solid black' onmouseover=playSound(0);changeOpacity("+i+",1); onmouseout=changeOpacity("+i+",0.3); onclick=playSound(1);changeOpacity("+i+",0.3);>"+frame[i].title+"</td></tr>";
			}
		}
		
	}
	table_cont += "</table>";
	infoWin.setHTML(table_cont);
	var table_width = document.getElementById('infoTable').clientWidth;
	var table_height = document.getElementById('infoTable').clientHeight+30;
	if(table_height>window.innerHeight) table_height = window.innerHeight-20;
	infoWin.minWindowHeight = table_height;
	infoWin.minWindowWidth = table_width;
	infoWin.setSize(table_width,table_height);
//	alert("x:"+infoWin.getPosition().x+" table:"+table_width+" window:"+window.innerWidth);
	if(infoWin.getPosition().x>window.innerWidth) infoWin.setPosition(window.innerWidth-table_width, infoWin.getPosition().y, 'LEFT_TOP');
	else infoWin.setPosition(infoWin.getPosition().x, infoWin.getPosition().y, 'RIGHT_TOP');
}
function showMessage(msg){
	jsFrame.showToast({
		width: 500,
		height: 100,
		duration: 1000,
		align: 'top',
		style: {
				borderRadius: '12px',
				backgroundColor: 'rgba(0,0,0,0.8)',
		},
		html: msg
	});
}
function sortFrame(mode){
	frame.sort(function(first, second){
		if (second.deptid > first.deptid) return -1;
		else if (first.deptid > second.deptid)return 1;
		else{
			if(mode=="area"){
				if (second.areaid > first.areaid) return -1;
				else if (first.areaid > second.areaid) return 1;
				else return 0;
			}else if(mode=="fire"){
				if (second.fire > first.fire) return -1;
				else if (first.fire > second.fire) return 1;
				else return 0;
			}
		}
	});
}
function sortShop(mode,order){
	shopQR.sort(function(first, second){
		if (second.type > first.type) return order;
		else if (first.type > second.type)return -1*order;
		if(mode=="name"){
			if (second.name > first.name) return -1*order;
			else if (first.name > second.name) return order;
			else return 0;
		}else if(mode=="adrs"){
			if (second.adrs > first.adrs) return -1*order;
			else if (first.adrs > second.adrs) return order;
			else return 0;
		}else if(mode=="hp"){
			if (second.hpico > first.hpico) return -1*order;
			else if (first.hpico > second.hpico) return order;
			else return 0;
		}else if(mode=="qr"){
			if (second.qr > first.qr) return -1*order;
			else if (first.qr > second.qr) return order;
			else return 0;
		}else if(mode=="genre"){
			if (second.genre > first.genre) return -1*order;
			else if (first.genre > second.genre) return order;
			else return 0;
		}else if(mode=="group"){
			if (parseInt(second.group_num) > parseInt(first.group_num)) return -1*order;
			else if (parseInt(first.group_num) > parseInt(second.group_num)) return order;
			else return 0;
		}
	});
}

function initPos(argPos){
	if(argPos.coords.latitude>36.23 && 36.54>argPos.coords.latitude && argPos.coords.longitude>138.08 && 138.412>argPos.coords.longitude){
		clat = argPos.coords.latitude;
		clon = argPos.coords.longitude;
	}
}
function changeText(item,str){$("#"+item).html(str);}
function navigation(latLng){window.open('https://www.google.com/maps/dir/'+pin.position.lat()+','+pin.position.lng()+'/'+latLng+'/data=!3m2!1e3!4b1!4m2!4m1!3e2');}
function playSound(sid){
//	sounds[sid].currentTime = 0;sounds[sid].play();
}
function paintFrame(){if(fcount>=frame.length)clearInterval(fid);changeOpacity(fcount++,0);}
//function changeOpacity(cur_id,Opacity){if(cur_id!="")frame[cur_id].setOptions({fillOpacity:Opacity});}
function changeOpacity(cur_id,Opacity){}
function changeOpacities(ids,Opacity){idarray = ids.split(',');idarray.forEach(id => changeOpacity(id,Opacity));}

//この辺からボタンスイッチ管理
function street(){
	viewWin.show();
	map.setCenter(pin.position);
	map.setZoom(17);
	map.setStreetView(streetViewPanorama);
}
function rotate(me,add=90){
	var angle = (map.heading+add)%360;
	if(angle==0) me.innerHTML="👆";
	else if(angle==90) me.innerHTML="👈";
	else if(angle==180) me.innerHTML="👇";
	else me.innerHTML="👉";
	map.setHeading(angle);
}
function tilt(){
	if(map.tilt==0){
		map.setTilt(45);
		map.setZoom(17);
		map.setMapTypeId('satellite');
		$("#mapType").text("🛩️");
		$("#bt_rotate").prop("disabled", false);
		rotate(document.getElementById('bt_rotate'),0);
		traffic(document.getElementById('bt_traffic'),false);
	}
	else{
		map.setTilt(0);
		$("#bt_rotate").prop("disabled", true);
		$("#bt_rotate").text("👆");
	}
}
function zoomMap(div){
	map.setZoom(map.zoom+div);
	var z = map.zoom-11;
	toast("ズーム:"+z+"/10");

}
function toast(msg){
	jsFrame.showToast({
		duration: 300,//表示時間(millis)
		align: 'bottom',
		style: {
				borderRadius: '12px',
				backgroundColor: 'rgba(0,0,0,0.8)',
		},
		html: msg
	});
}
function mapType(me){
	
	if(me.innerText=='🏞️') me.innerText = "🛩️";
	else if(me.innerText=='🛩️')me.innerText = '🚌️';
	else me.innerText = '🏞️';
	if(me.innerText=='🏞️'){map.setMapTypeId('terrain');toast("🏞️地形モード");map.setOptions({styles: [{"featureType":"poi","stylers": [{"visibility": "off"}]},{"featureType":"poi","stylers": [{"visibility": "off"}]}]});}
	else if(me.innerText=='🛩️'){map.setMapTypeId('satellite');toast("🛩️衛星モード");}
	else{map.setMapTypeId('roadmap');toast("🚌交通モード");map.setOptions({styles: [{"featureType":"poi","stylers": [{"visibility": "on"}]},{"featureType":"poi","stylers": [{"visibility": "on"}]}]});}
	traffic(document.getElementById('bt_traffic'),false);
	document.getElementById('bt_rotate').disabled=true;
	document.getElementById('bt_rotate').innerHTML="👆";
}
function forcusShop(id,opacity){
	if(opacity==1){
		shopQR[id].setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+shopQR[id].char+'&code='+shopQR[id].code+'&name='+shopQR[id].safename+'&color=ffffff&edge='+shopQR[id].unique_color));
		shopQR[id].setOpacity(1);
		shopQR[id].setZIndex(10);
	}else{
		if(document.getElementById('shopName').innerText == "🏠"){
			shopQR[id].setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+shopQR[id].char+'&code='+shopQR[id].code+'&color=ffffff&edge='+shopQR[id].unique_color));
		}else{
			shopQR[id].setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+shopQR[id].char+'&code='+shopQR[id].code+'&name='+shopQR[id].safename+'&color=ffffff&edge='+shopQR[id].unique_color));
		}
		shopQR[id].setOpacity(1);
		shopQR[id].setZIndex(3);
	}
}
function forcusIt(me,opacity){
	if(opacity==1){
		me.setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+me.char+'&code='+me.code+'&name='+me.safename+'&color=ffffff&edge='+me.unique_color));
		me.setOpacity(1);
		me.setZIndex(10);
	}else{
		if(document.getElementById('shopName').innerText == "🏠"){
			me.setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+me.char+'&code='+me.code+'&color=ffffff&edge='+me.unique_color));
		}else{
			me.setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+me.char+'&code='+me.code+'&name='+me.safename+'&color=ffffff&edge='+me.unique_color));
		}
		me.setOpacity(1);
		me.setZIndex(3);
	}
}
function zoomShop(id){
	if(shopQR[id].position.lat()==0) toast("位置情報ができませんでした");
	else{
		map.zoom=16;
		var pos = new google.maps.LatLng(shopQR[id].position.lat(),shopQR[id].position.lng()+0.0028);
		map.panTo(pos);
		shopQR[id].setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+shopQR[id].char+'&code='+shopQR[id].code+'&name='+shopQR[id].name+'&color=ffffff&edge='+shopQR[id].unique_color));
		shopQR[id].setOpacity(0.9);
	}
}
function shopName(me){
	if(me.innerText=='🏠') me.innerText = "💬";
	else me.innerText = "🏠";
	if(me.innerText=='💬'){
		for(i=0;shopQR.length>i;i++){shopQR[i].setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+shopQR[i].char+'&name='+shopQR[i].safename+'&code='+shopQR[i].code+'&color=ffffff&edge='+shopQR[i].unique_color));}
	}else{
		for(i=0;shopQR.length>i;i++){shopQR[i].setIcon(new google.maps.MarkerImage('https://uedacity.xsrv.jp/map/sample/label.php?emoji='+shopQR[i].char+'&code='+shopQR[i].code+'&color=ffffff&edge='+shopQR[i].unique_color));}
	}
}
function allTip(me){
	if(me.innerText=='🗨') me.innerText = "💬";
	else me.innerText = '🗨';
	document.getElementById('showSafeHouse').innerText = "🏠";
	zoomChanged();
}
function allSafeHouse(me){
	if(me.innerText=='🏠') me.innerText = "🏡";
	else me.innerText = "🏠";
	document.getElementById('showTip').innerText = '🗨';
	zoomChanged();
}
function volume(me) {
if(me.innerText=='🔊'){me.innerText = '🔈';toast("🔈消音モード");}
	else{ me.innerText = '🔊';toast("🔊通常モード");}
	
	if(me.innerText=='🔊')for(i=0;sounds.length>i;i++) sounds[i].volume = 0.2;
	else for(i=0;sounds.length>i;i++) sounds[i].volume = 0;
}
function language(me){
	if(me.innerText=='🌎'){ me.innerText = '🗾';toast("🗾日本語");}
	else{ me.innerText = '🌎';toast("🌎English");}
}
//この辺からイベント登録
function zoomChanged(){
	try{
var threshold=14;
		if(document.getElementById('showTip').innerText=='💬'){
			if(threshold>map.zoom){
				for(i=0;tip.length>i;i++)  tip[i].setVisible(false);
				for(i=0;ltip.length>i;i++) ltip[i].setVisible(true);
			}else{
				for(i=0;tip.length>i;i++)  tip[i].setVisible(true);
				for(i=0;ltip.length>i;i++) ltip[i].setVisible(false);
			}
		}
		else{
			for(i=0;tip.length>i;i++)  tip[i].setVisible(false);
			for(i=0;ltip.length>i;i++) ltip[i].setVisible(false);
		}
		if(document.getElementById('showSafeHouse').innerText=='🏡'){
			for(i=0;safeHouse.length>i;i++)safeHouse[i].setVisible(true);
		}else{
			for(i=0;safeHouse.length>i;i++)safeHouse[i].setVisible(false);
		}
	}catch(e){}
	preZoom = map.zoom;

}
function addListener0(_map){
	google.maps.event.addListener(map, 'zoom_changed', function() {
		zoomChanged();
	});
	google.maps.event.addListener(_map, 'rightclick', function (event) {
//		showMessage(event.latLng);
		navigator.clipboard.writeText(event.latLng.lat()+"  "+event.latLng.lng()+"  ");
	});
	google.maps.event.addListener(_map, 'mousedown', function (event) {
		start = new Date().getTime();
	});
	google.maps.event.addListener(_map, 'mouseup', function (event) {
		if(start){
			end = new Date().getTime();
			longpress = (500 > end - start) ? false : true;
			if(longpress){
//				showMessage(event.latLng);
			}
		}
	});
}
function addListener1(_map){
	try{
	google.maps.event.addListener(_map, 'click', function (event) {
		playSound(1);
		map.fitBounds(new google.maps.LatLngBounds(tip[_map.id].se,tip[_map.id].nw),1);
//		changeText('subTitle','<ruby>'+_map.name+'<rt>'+_map.kana+'</rt></ruby>');
//自治会メニュー
	});
	google.maps.event.addListener(_map, 'mouseover', function (event) {
		playSound(0);
//		if(document.getElementById('showTip').innerText == '🗨️標識')tip[_map.id].setVisible(true);
		changeOpacity(_map.id,0.8);
	});
	google.maps.event.addListener(_map, 'mouseout', function (event) {
//		if(document.getElementById('showTip').innerText == '🗨️標識')tip[_map.id].setVisible(false);
		changeOpacity(_map.id,0.2);
	});
	google.maps.event.addListener(_map, 'rightclick', function (event) {
//		showMessage(event.latLng);
		navigator.clipboard.writeText(event.latLng.lat()+"  "+event.latLng.lng()+"  ");
	});
	google.maps.event.addListener(_map, 'mousedown', function (event) {
		start = new Date().getTime();
		tip[_map.id].setVisible(true);
	});
	google.maps.event.addListener(_map, 'mouseup', function (event) {
		tip[_map.id].setVisible(false);
		if(start){
			end = new Date().getTime();
			longpress = (500 > end - start) ? false : true;
			if(longpress){
//				showMessage(event.latLng);
			}
		}
	});
	}catch(e){alert(e)}
}
function addListener2(_marker){
	google.maps.event.addListener(_marker, 'click', function (event) {
		playSound(1);
		map.panTo(event.latLng);
		map.setZoom(_marker.zoom);
	});
	google.maps.event.addListener(_marker, 'mouseover', function (event) {
		playSound(0);
		changeOpacities(_marker.list,0.8)
	});
	google.maps.event.addListener(_marker, 'mouseout', function (event) {
		changeOpacities(_marker.list,0.2)
	});
}
function addListener3(_marker){
	google.maps.event.addListener(_marker, 'click', function (event) {
		playSound(1);
		map.fitBounds(new google.maps.LatLngBounds(_marker.se,_marker.nw),1);
	});
	google.maps.event.addListener(_marker, 'mouseover', function (event) {
		changeOpacities(_marker.list,0.8)
	});
	google.maps.event.addListener(_marker, 'mouseout', function (event) {
		changeOpacities(_marker.list,0.2)
	});
}
function addListener4(_marker){
	google.maps.event.addListener(_marker, 'click', function (event) {
		var html = '<table style=\"color:white;font-size:14px\">';
		html += '<tr><td colspan=2 align=center>'+_marker.title+'</td></tr>';
		html += '<tr><td nowrap style=\"border:1px white solid;\">種別</td><td style=\"border:1px white solid;\">'+_marker.type+'</td></tr>';
		if(_marker.community!=null) html += '<tr><td nowrap style=\"border:1px white solid;\">自治会</td><td style=\"border:1px white solid;\">'+_marker.community+'</td></tr>';
		if(_marker.tel!='') html += '<tr><td style=\"border:1px white solid;\">電話番号</td><td style=\"border:1px white solid;\">'+_marker.tel+' 👉<a href=\"tel:'+_marker.tel+'\" style=color:white>☎発信</a></td></tr>';
		if(_marker.d1!=null) html += '<tr><td style=\"border:1px white solid;\">土砂災害</td><td style=\"border:1px white solid;\">'+_marker.d1+' '+_marker.d1txt+'</td></tr>';
		if(_marker.d2!=null) html += '<tr><td style=\"border:1px white solid;\">洪水災害</td><td style=\"border:1px white solid;\">'+_marker.d2+' '+_marker.d2txt+'</td></tr>';
		if(_marker.d3!=null) html += '<tr><td style=\"border:1px white solid;\">地震災害</td><td style=\"border:1px white solid;\">'+_marker.d3+' '+_marker.d3txt+'</td></tr>';
		if(_marker.wifi!=null) html += '<tr><td nowrap style=\"border:1px white solid;\">WIFI</td><td style=\"border:1px white solid;\">'+_marker.wifi+'</td></tr>';
		if(_marker.aed!=null) html += '<tr><td nowrap style=\"border:1px white solid;\">AED</td><td style=\"border:1px white solid;\">'+_marker.aed+'</td></tr>';
		html += '<tr><td nowrap style=\"border:1px white solid;\">ナビ</td><td style=\"border:1px white solid;\"><button onclick=navigation(\"('+_marker.position.lat()+','+_marker.position.lng()+')\")>開始</button></td></tr>';
		html += '</table>';
		st = jsFrame.showToast({
			width: 400,
			height: 300,
			duration: 5000,
			align: 'center',
			style: {
					borderRadius: '12px',
					backgroundColor: 'rgba(0,0,0,0.8)',
			},
			html: html,
			closeButton: true,
			closeButtonColor: 'white'
		});
		// スマホだと地図選択状態になってしまう
		playSound(2);
	});
}

function addListener5(_marker){
	google.maps.event.addListener(_marker, 'dragend', function (event) {
		var pos = _marker.position.toString();
		pos = pos.replace('(','');
		pos = pos.replace(')','');
		posa = pos.split(',');
		fetch('data/updatePosition.php?sid='+_marker.sid+'&lat='+posa[0].trim()+'&lng='+posa[1].trim()).then(function(response) {
			response.text().then(function(text) {
//				alert(text);
			});
		});
	});
	google.maps.event.addListener(_marker, 'mouseover', function (event) {
//		_marker.setZIndex(10);
		forcusIt(_marker,1);
	});
	google.maps.event.addListener(_marker, 'mouseout', function (event) {
//		_marker.setZIndex(3);
		forcusIt(_marker,0);
	});
	google.maps.event.addListener(_marker, 'click', function (event) {
		var html = '<table style=\"color:white;font-size:14px\">';
		html += '<tr><td colspan=2 align=center><h2>'+_marker.char+_marker.name+'</h2></td></tr>';
		html += '<tr><td nowrap style=\"border:1px white solid;\">分類</td><td style=\"border:1px white solid;\">'+_marker.type+'</td></tr>';
		if(_marker.genre!='') html += '<tr><td style=\"border:1px white solid;\">業種</td><td style=\"border:1px white solid;\">'+_marker.genre+'</td></tr>';
		if(_marker.shop!='') html += '<tr><td style=\"border:1px white solid;\">店舗情報</td><td style=\"border:1px white solid;\">'+_marker.shop+'</td></tr>';
		if(_marker.adrs!='') html += '<tr><td style=\"border:1px white solid;\">住所</td><td style=\"border:1px white solid;\">'+_marker.adrs+'</td></tr>';
		if(_marker.bldg!='') html += '<tr><td style=\"border:1px white solid;\">建物情報</td><td style=\"border:1px white solid;\">'+_marker.bldg+'</td></tr>';
		if(_marker.tel!='') html += '<tr><td style=\"border:1px white solid;\">電話番号</td><td style=\"border:1px white solid;\">'+_marker.tel+' 👉<a href=\"tel:'+_marker.tel+'\" style=color:white>☎発信</a></td></tr>';
		if(_marker.hp!='') html += '<tr><td style=\"border:1px white solid;\">HP</td><td style=\"border:1px white solid;\"><a href=\"'+_marker.hp+'\" target=\"_blank\" style=\"color:white\">🏠</a></td></tr>';
		if(_marker.qr=='◎' || _marker.qr=='○') html += '<tr><td style=\"border:1px white solid;\">TicketQR</td><td style=\"border:1px white solid;\">対応</td></tr>';
		if(_marker.qr=='◎') html += '<tr><td style=\"border:1px white solid;\">導入サポート</td><td style=\"border:1px white solid;\">○</td></tr>';
		html += '<tr><td nowrap style=\"border:1px white solid;\">ナビ</td><td style=\"border:1px white solid;\"><button onclick=navigation(\"('+_marker.position.lat()+','+_marker.position.lng()+')\")>開始</button></td></tr>';
		html += '</table>';
		st = jsFrame.showToast({
			width: 400,
			height: 300,
			duration: 5000,
			align: 'center',
			style: {
					borderRadius: '12px',
					backgroundColor: 'rgba(0,0,0,0.8)',
			},
			html: html,
			closeButton: true,
			closeButtonColor: 'white'
		});
		playSound(2);
	});
}