
var streetview;
var map;
var marker;
var locationplace;
var startplace;
var streetviewoverlay;
var mapsize=15;
var mapcontrol;
var maptypectrl;
var scalectrl;
var gGeo;


var RANGE = 3;
var MAXHIT = 30;
var ZOOM_SIZE = 16;
var POPDIV_ID = "_shopphoto";

//-------------------------------------------------------------------
// HTMLイベントハンドラ設定

window.onload = function() {
    load();
    setEvent();
}

//-------------------------------------------------------------------
// Googleマップ初期化

function load() {
  if (GBrowserIsCompatible()) {
    streetview = new GStreetviewPanorama(document.getElementById("pano"));
    locationplace = new GLatLng(35.6829, 139.7653);
    var pov = {yaw:-1,pitch:0};
    streetview.setLocationAndPOV(locationplace,pov);
    

    map = new GMap2(document.getElementById("mymap"));
    map.setCenter(locationplace, mapsize);
    map.addMapType(G_PHYSICAL_MAP);
    mapcontrol = new GLargeMapControl();
    map.addControl(mapcontrol);
    maptypectrl = new GMapTypeControl();
    map.addControl(maptypectrl);
    scalectrl = new GScaleControl();
    map.addControl(scalectrl);
    map.addControl(new GOverviewMapControl(new GSize(200,200)));
    geocoder = new GClientGeocoder(); 
　　map.openInfoWindowHtml(map.getCenter(),
                           "【手順1】<br>マーカーの最初の位置は東京駅になっています。<br>上記の検索窓に駅名、地名、住所etcを入力し検索をするか<br>ズームを調整しながらランチや宴会をしたい候補地までマーカーを<br>ドラッグ＆ドロップして下さい");
　
　　
    marker = new GMarker(locationplace, {draggable: true});
    map.addOverlay(marker);

    streetviewoverlay = new GStreetviewOverlay();
    map.addOverlay(streetviewoverlay);

    GEvent.addListener(streetview, "initialized", function(loc) {
      marker.setLatLng(loc.latlng);
      map.setCenter(loc.latlng, mapsize);
      locationplace = loc.latlng;
    });
    
    
    GEvent.addListener(map, "zoomend", function(oldLevel, newLevel) {
      mapsize=newLevel;
    });

    GEvent.addListener(map, "dblclick", function(overlay,point) {
      var viewclient = new GStreetviewClient();
      viewclient.getNearestPanoramaLatLng(point, function(latlng){
        if (latlng){
          map.setCenter(latlng);
          marker.setLatLng(latlng);
          streetview.setLocationAndPOV(latlng, mapsize);
        }
      });
    });

    GEvent.addListener(marker, "dragstart", function() {
      startplace = marker.getLatLng();
    });

    GEvent.addListener(marker, "dragend", function() {
      var nextplace = marker.getLatLng();
      var viewclient = new GStreetviewClient();
      viewclient.getNearestPanoramaLatLng(nextplace, function(latlng){
        if (latlng){
          marker.setLatLng(latlng);
          marker.openInfoWindowHtml("【手順2】<br>次にランチや宴会をしたい場所をダブルクリック♪<br>厳選された候補30店舗が地図上にマークされます<br>同時にストリートビューが連動します。")
          streetview.setLocationAndPOV(latlng);
        } else {
          marker.setLatLng(startplace);
        }
      });
    });
  }
}


	
//-------------------------------------------------------------------

 // address(住所)をGLatLngオブジェクト(緯度、経度情報を含んだオブジェクト)に変換する  
        function showAddress(address) {  
            geocoder.getLatLng(  
                address,  
                function(point) {  
 
                    // pointはGLatLngオブジェクト  
                    if (!point) {  
 
                        alert(address + " という住所は検索できませんでした");  
 
                    } else {  
 
                map.setCenter(point, 17);  
 
                // マーカオブジェクトを生成する  
                var marker = new GMarker(point);  
 
                // マーカを表示させる  
                map.addOverlay(marker);  
 
                // 住所を表示させる  
                marker.openInfoWindowHtml(address + "周辺を表示しています。<br>【手順2】<br>ランチや宴会をしたい場所をダブルクリック♪<br>厳選された候補30店舗が地図上にマークされます。<br><br>【手順3】<br>候補としてマークされたお店の近くをダブルクリック！<br>お店の周りがストリートビューで確認できます<br>候補のお店のマーカーをクリックすると店舗詳細情報がでます。<br><br>注）ストリートビュー非対応地域では連動しません。 ");  
 
                    }  
                }  
            );  
        }  
 
 
    //]]>  

// マーカを作る

function createGMarker(title, html, lat, lng) {
    var infoObj = new Object();
    infoObj.title = title;
    var gpObj = new GLatLng(lat, lng);
    var marker = new GMarker(gpObj, infoObj);
    map.addOverlay(marker);
    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(html);
    });
}

//---------------------------------------------------------------------
// イベントハンドラ設定

function setEvent() {
    GEvent.addListener(map, "click", function(lay, point) {
        if (lay == null) {
            map.clearOverlays();
            _d("info","＊ 最適な会場を検索中！しばらくお待ちください ＊");
            var lat = Math.round(chgWgs2TkyLat(point.y, point.x)*100000)/100000;
            var lng = Math.round(chgWgs2TkyLng(point.y, point.x)*100000)/100000;
            var gurunaviUrl = getGurunaviUrl(lat, lng);
            xml2Json(gurunaviUrl,"callBackX2J");
        }
    });

    GEvent.addListener(map, "infowindowclose", function() {
        sPhotoClose();
    });
}

//-------------------------------------------------------------------
// 地図上にすべての飲食店マーカを設置する

function setMarkers(res) {

    if (! res.total_hit_count) {
        _d("info", "該当情報が登録されていません。エラー番号:" + res.error.code);
    }
    else {
        _d("info", "幹事くんの検索結果&nbsp;" + res.total_hit_count + "&nbsp;件です。BEST店舗を厳選しました");
        if(res.total_hit_count == 1) {
            shopName = res.rest.name;
            objShop = res.rest;
            createMarker(objShop,shopName);
        }
        else {
            for (shopName in res.rest) {
                objShop = eval("res[\"rest\"][\"" + shopName + "\"]");
                createMarker(objShop,shopName);
            }
        }
    }
}

//-------------------------------------------------------------------
// 地図上に飲食店マーカを１つ設置する

function createMarker(objShop, shopName) {
    shopName = shopName.replace(/<[ \t]*[Bb][Rr][ \t]*>/, "・");
    var tTitle = createShopTitle(objShop, shopName);
    var tHtml = createShopInfoHtml(objShop, shopName);
    createGMarker(tTitle, tHtml, objShop.latitude, objShop.longitude);
}

//-------------------------------------------------------------------
// マーカのチップヘルプ

function createShopTitle(objShop, shopName) {
    var sTitle = shopName +
        "(" + errChk(objShop.code.category_name_l.content) +
        ":" + errChk(objShop.code.category_name_s.content) +
        "/" + errChk(objShop.budget) + "円)";
    return sTitle;
}

//-------------------------------------------------------------------
// 情報ウィンドウ内に表示するHTMLコード作成

function createShopInfoHtml(objShop, shopName) {
    var sBody = "<table width=\"480\">" +
        "<tr><th colspan=\"2\">" + shopName + "</th></tr>" +
        "<tr><td>■種別</td><td>" +
        errChk(objShop.code.category_name_l.content) +
        "&nbsp;/&nbsp;" +
        errChk(objShop.code.category_name_s.content) +
        "</td></tr>" +
        "<tr><td>■営業</td><td>" + 
        errChk(objShop.opentime) + "&nbsp;/&nbsp;" +
        errChk(objShop.holiday) + "</td></tr>" +
        "<tr><td>■予算</td><td>" +
        errChk(objShop.budget) + "円</td></tr>" +
        "<tr><td><nobr>■アクセス</nobr></td><td>" +
        errChk(objShop.access.line) + "&nbsp;" +
        errChk(objShop.access.station) + "<br />&nbsp;(&nbsp;" +
        errChk(objShop.access.station_exit) + "&nbsp;から&nbsp;" +
        errChk(objShop.access.walk) + "分&nbsp;)&nbsp;" +
        "</td></tr>";
        "<tr><td>■住所</td><td>" +
        errChk(objShop.address) + "</td></tr>" +
        "<tr><td>■電話</td><td>" + errChk(objShop.tel) + "</td></tr>";

    if (varChk(objShop.url, "string")) {
        sBody += "<tr><td>■HPはこちら>></td>" +
            "<td><a href=\"" + objShop.url + "\" target=\"blank\">" +
            objShop.url + "</td></tr>";
    }

    sBody += "<tr><td colspan=\"2\">" + errChk(objShop.pr.pr_long);

    if (varChk(objShop.image_url.shop_image1,"string")) {
        sBody += "&nbsp;<span onClick=\"sPhotoDsp('" +
            objShop.image_url.shop_image1 +
            "')\"><br />[【要チェック】お店の雰囲気、メニューの画像はこちら]</span>&nbsp;</td></tr>";
    }

    sBody += "</table>";
    return sBody;
}

//-------------------------------------------------------------------
// 店舗データの特定項目が未定義か、空欄だった場合の判定

function errChk(tgd) {
    return varChk(tgd,"string") ? tgd : "---";
}

//-------------------------------------------------------------------
// 店舗写真の表示

var photoDiv;

function sPhotoDsp(imageUrl) {
    photoDiv = createDiv(POPDIV_ID,80,800);
    document.getElementById(POPDIV_ID).innerHTML = 
        "<div id=\"photocnt\" onClick=\"sPhotoClose()\"><img src=\"" +
        imageUrl +
        "\" /><br />提供：ぐるナビ</div>";
}

//-------------------------------------------------------------------
// 店舗写真を消す

function sPhotoClose() {
    removeDiv(POPDIV_ID);
}

//-------------------------------------------------------------------
// 「ぐるナビ」データアクセスURL作成

function getGurunaviUrl(lat, lng) {
    var gurunaviApi = "http://api.gnavi.co.jp/ver1/RestSearchAPI/";
    var gurunaviKey = "2096ee14459046f1d28b4390723b04a6";
    var queri = gurunaviApi + "?keyid=" + gurunaviKey +
        "&coordinates_mode=2" +
        "&latitude=" + lat +
        "&longitude=" + lng +
        "&range=" + RANGE +
        "&hit_per_page=" + MAXHIT;
    return queri;
}

//-------------------------------------------------------------------
// APIアクセス中継

function xml2Json(url,callback) {
    var proxyUrl = "http://app.drk7.jp/xml2json/";
    var callUrl = proxyUrl + "var=" + callback + "&url=" + encodeURIComponent(url);
    var script = document.createElement('script');
    script.charset = 'UTF-8';
    script.src = callUrl;
    document.body.appendChild(script);
}

//-------------------------------------------------------------------
// JSONPコールで使用するコールバック関数

var callBackX2J = {}
callBackX2J.onload = function(res) {
    setMarkers(res);
}

//-------------------------------------------------------------------
// 測地系の変換
//  ※本コードはNowral氏が下記に公開されている変換式を参考にしています。
//  http://homepage3.nifty.com/Nowral/index.html

function chgTky2WgsLng(lat, lng) {
    return (lng - lat * 0.000046038 - lng * 0.000083043 + 0.010040);
}

function chgTky2WgsLat(lat, lng) {
    return (lat - lat * 0.00010695 + lng * 0.000017464 + 0.0046017);
}

function chgWgs2TkyLng(lat, lng) {
    return (lng + lat * 0.000046047 + lng * 0.000083049 - 0.010041);
}

function chgWgs2TkyLat(lat, lng) {
    return (lat + lat * 0.00010696 - lng * 0.000017467 - 0.0046020);
}

//-------------------------------------------------------------------
// htmlコード挿入

function _d(id, htmlTxt) {
    document.getElementById(id).innerHTML = htmlTxt;
}

//-------------------------------------------------------------------
// divブロック挿入

function createDiv(id,right,top) {
    var outDiv;
    outDiv =document.createElement('div');
    outDiv.id = id;
    document.body.appendChild(outDiv);

    var tgdStyle = document.getElementById(id).style;
    tgdStyle.position = "absolute";
    tgdStyle.right = right + "px";
    tgdStyle.top = top + "px";
    tgdStyle.background = "white";
}

//-------------------------------------------------------------------
// divブロックの削除

function removeDiv(id) {
    var outDiv = document.getElementById(id);
    document.body.removeChild(outDiv);
}

//-------------------------------------------------------------------
// 要素のタイプを確認する

function varChk(tgd,type) {
    return typeof(tgd) == type ? true : false;
}

// Googleマップ：スケール変更

function scaleChg(tScale) {
    mapScale = tScale;
    map.setZoom(mapScaleTbl[mapScale]);
}

// EOF
