// JavaScript Document

var html_list = '';
var map;

var points = [];
var change_place = true;

// Opera
if(navigator.userAgent.indexOf("Opera") != -1){
	var MAX_LEN = 200;

// MSIE
}else if(navigator.userAgent.indexOf("MSIE") != -1){
	var MAX_LEN = 200;

// FireFox
}else if(navigator.userAgent.indexOf("Firefox") != -1){
	var MAX_LEN = 200;

// Netscape
}else if(navigator.userAgent.indexOf("Netscape") != -1){
	var MAX_LEN = 200;

// Safari
}else if(navigator.userAgent.indexOf("Safari") != -1){
	var MAX_LEN = 200;

// 不明
}else{
	var MAX_LEN = 200;
}

var pages = 0;
var max_count = 0;
var type = '1';
var legend = '1';

var myicon = [];

// **********
// Initialize
// **********
function load( lat, lng, zoom) {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("gmap"));
		map.addMapType(G_SATELLITE_3D_MAP);			// Google Earth API対応
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.setCenter(new GLatLng( lat, lng ), zoom);
		
		for(i=0; i<=7; i++){
			myicon[i] = new GIcon();
			myicon[i].image = 'images/chika' + i + '.png';
			myicon[i].iconSize = new GSize(15, 15);
			myicon[i].iconAnchor = new GPoint(7, 7);
			myicon[i].infoWindowAnchor = new GPoint(7, 7);
		}
		
		if(document.getElementById("city_code").value != ''){
			change_city();
		}
	}
}

function ajax_city(){
	try {
		xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
	} catch(e) {
		xmlHttp=new XMLHttpRequest();
	}
	var pref = document.getElementById("pref_code").value;
	if(pref == ''){
		pref = '0';
	}
	document.getElementById("city_code").length = 0;

	xmlHttp.open('GET', 'ajax_citylist.php?pref_code=' + pref, true);
	xmlHttp.onreadystatechange = handleHttpResponse1;
	xmlHttp.send(null);
}

function handleHttpResponse1() {
	if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
		var xmlDoc = xmlHttp.responseXML;
		if (xmlDoc.documentElement) {
			var len = xmlDoc.getElementsByTagName('city').length;
			var codelist = xmlDoc.getElementsByTagName('code');
			var namelist = xmlDoc.getElementsByTagName('name');
			
			document.getElementById("city_code").options[0] = new Option('選択してください', '');

			for(i = 0; i < len; i++){
				code = codelist[i].childNodes[0].nodeValue;
				if(namelist[i].childNodes[0].nodeValue != ''){
					name = namelist[i].childNodes[0].nodeValue;
				}else{
					name = '';
				}
				document.getElementById("city_code").options[i+1] = new Option(name, code);
			}
		}
	}
}

function get_cityloc(){
	xmlHttp2 = GXmlHttp.create();

	var city = document.getElementById("city_code").value;

	if(city != ''){
		xmlHttp2.open('GET', 'ajax_cityloc.php?city_code=' + city, true);
		xmlHttp2.onreadystatechange = handleHttpResponse2;
		xmlHttp2.send(null);
	}
}

function handleHttpResponse2() {
	if (xmlHttp2.readyState == 4 && xmlHttp2.status == 200) {
		var xmlDoc = xmlHttp2.responseXML;
		if (xmlDoc.documentElement) {
			var len = xmlDoc.getElementsByTagName('city').length;
			var latlist = xmlDoc.getElementsByTagName('lat');
			var lnglist = xmlDoc.getElementsByTagName('lng');
			lat = latlist[0].childNodes[0].nodeValue;
			lng = lnglist[0].childNodes[0].nodeValue;

			change_place = true;
			map.setCenter(new GLatLng(lat, lng), 13);
			
			showData(0);
		}
	}
}

function change_city() {
	var legend = document.getElementsByName("legend");

	if(legend[0].checked == true){
		document.getElementById("legend1").style.display = "block";
		document.getElementById("legend2").style.display = "none";
		kind = '1';
	} else {
		document.getElementById("legend1").style.display = "none";
		document.getElementById("legend2").style.display = "block";
		kind = '2';
	}
		
	get_cityloc();
}

// **********
// Show data
// **********

// ***** データ表示 *****
function showData(page) {
	map.clearOverlays();
	
	html_list = '';
	document.getElementById("result").innerHTML = '';
	document.getElementById("paging").innerHTML = '';
	document.getElementById("list").innerHTML = '';

	// 座標移動の場合、再度データ取得
	if(change_place == true){
		change_place = false;

		var radio = document.getElementsByName("type");

		if(radio[0].checked == true){
			type = '1';
			var json = 'json_tikakouji_list.php';
		} else {
			type = '2';
			var json = 'json_tikatyousa_list.php';
		}

		GDownloadUrl(json + '?kind=' + kind + '&city_code=' + document.getElementById("city_code").value,
		function(data, responseCode) {
			eval("points=" + data);
			
			if(data != null){
				max_count = points.length;
				
				var max = points.length;
				if(max > MAX_LEN){
					max = MAX_LEN;
				}

				for(var i = 0; i < max; i++) {
					createMarker(
						points[i].no,
						points[i].lat,
						points[i].lng,
						points[i].usage,
						points[i].address,
						points[i].icon,
						points[i].name1,
						points[i].name2,
						points[i].value1,
						points[i].value2,
						points[i].ratio,
						0			// mode:0（一覧）、1（吹き出し表示）
					);
				}
				document.getElementById("list").innerHTML = html_list;
				
				// ページング
				document.getElementById("result").innerHTML = '<b>' + max_count + '</b>件　（1 - ' + max + '件を表示）<br />';
				
				if(max_count > MAX_LEN){
					if(points.length % MAX_LEN != 0){
						pages = ((max_count - (max_count % MAX_LEN)) / MAX_LEN) + 1;
					}else{
						pages = max_count / MAX_LEN;
					}
				}else{
					pages = 1;
				}
				var html_paging = '<font color="#aaaaaa">前へ</font>　　';
				if(pages >= 2){
					html_paging += '<a href="javascript:showData(1);">次へ</a>';
				}else{
					html_paging += '<font color="#aaaaaa">次へ</font>';
				}
				
				document.getElementById("paging").innerHTML = html_paging;
			}
		});

	// 移動していない場合（前ページ、次ページを表示）
	} else {
		var max = (page + 1) * MAX_LEN;
		if(max > max_count){
			max = max_count;
		}
		
		for(var i = page * MAX_LEN; i < max; i++) {
			createMarker(
					points[i].no,
					points[i].lat,
					points[i].lng,
					points[i].usage,
					points[i].address,
					points[i].icon,
					points[i].name1,
					points[i].name2,
					points[i].value1,
					points[i].value2,
					points[i].ratio,
					0			// mode:0（一覧）、1（吹き出し表示）
			);
		}
		document.getElementById("list").innerHTML = html_list;
		
		// ページング
		document.getElementById("result").innerHTML = '<strong>' + max_count + '</strong>件　（' + ((page * MAX_LEN)+1) + ' - ' + max + '件を表示）<br/>';
		
		if(page == 0){
			var html_paging = '<font color="#aaaaaa">前へ</font>　　';
		}else{
			var html_paging = '<a href="javascript:showData(' + (page - 1) + ');">前へ</a>　　';
		}

		if(page < (pages - 1)){
			html_paging += '<a href="javascript:showData(' + (page + 1) + ');">次へ</a>';
		}else{
			html_paging += '<font color="#aaaaaa">次へ</font>';
		}
		
		document.getElementById("paging").innerHTML = html_paging;
	}
}

// **********
// Create one marker
// **********
function createMarker(no, lat, lng, usage, address, icon, name1, name2, value1, value2, ratio, mode) {

	var point = new GPoint(parseFloat(lng), parseFloat(lat));
	var marker = new GMarker(point, myicon[icon]);

	var html = '<div style="width:300px;height:150px;"><font size="2">';
	if(type == '1'){
		html    += '<a target="_blank" href="datak-' + no + '.html">' + address + '</a><br />';
	}else{
		html    += '<a target="_blank" href="datat-' + no + '.html">' + address + '</a><br />';
	}
	html    += '</font><table border="0" width="280" style="font-size:small;"><tr><td>';
	html    += '【' + usage + '】<br />';
	html    += name2 + '年:' + value2 + '<br />';
	html    += name1 + '年:' + value1 + '<br />';
	html    += '前年比:' + ratio + '%<br />';
	html    += '</td>'
	html    += '<td>';
	if(type == '1'){
		html    += '<a target="_blank" href="datak-' + no + '.html"><img src="tikakouji_graph.php?type=s&no=' + no +  '" height="100" border="0" /></a>';
	}else{
		html    += '<a target="_blank" href="datat-' + no + '.html"><img src="tikatyousa_graph.php?type=s&no=' + no +  '" height="100" border="0" /></a>';
	}
	html    += '</td>';
	html    += '</tr>';
	html    += '<tr><td colspan="2" align="center">';
	if(type == '1'){
		html    += '<a target="_blank" href="datak-' + no + '.html"><img src="images/syousai.gif" width="53" height="24" border="0" /></a>';
	}else{
		html    += '<a target="_blank" href="datat-' + no + '.html"><img src="images/syousai.gif" width="53" height="24" border="0" /></a>';
	}
	html    += '</td></tr>';
	html    += '</table></div>';

	GEvent.addListener(marker, 'click', function() {
		marker.openInfoWindowHtml(html);
	});

	map.addOverlay(marker);
	
	// 一覧
	if(mode == 0) {
		html_list += '<img src="images/chika' + icon + '.png">&nbsp;' + "<a href=\"javascript:createMarker('" + no + "','" + lat + "','" + lng + "','" + usage + "','" + address + "','" + icon + "','" + name1 + "','" + name2 + "','" + value1 +  "','" + value2 + "','" + ratio + "', 1);\">";
		if(type == '1'){
			html_list += address + '</a> <a target="_blank" href="datak-' + no + '.html"><img src="images/item.gif" border="0" alt="詳細"/></a><br />';
		}else{
			html_list += address + '</a> <a target="_blank" href="datat-' + no + '.html"><img src="images/item.gif" border="0" alt="詳細"/></a><br />';
		}

	// 吹き出し表示
	} else {
		marker.openInfoWindowHtml(html);
	}
}