var gMap=null;
var gClickMarker=null;
var gPointMarker=[];
var gTweets=null;
var gPopup=null;
var gCircle=null;
var gPos=null;
var gRad=10;//km
function initGmapTweet(paramLat,paramLng){
  gPos=new google.maps.LatLng(paramLat,paramLng);
  var myOptions={
    zoom: 12,
    center: gPos,
    scrollwheel: false,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  gMap=new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  google.maps.event.addListener(gMap, 'click', function (event){
    doClickMap(event.latLng);
  });
  doClickMap(gPos);
}
function doClickMap(ll){
//  var msg = "<p>gPosition:" + ll.lat() + "/" + ll.lng() + "</p>";
//  var msg="";
//  $("#divMsg").html(msg);

  if(gClickMarker) gClickMarker.setMap(null);
  gClickMarker=new google.maps.Marker({
    position: ll,
    map: gMap
//    title: msg
  });
  if(gCircle) gCircle.setMap(null);
  gCircle=new google.maps.Circle({
    center: ll,
    fillColor: '#0000FF',
    fillOpacity: 0.2,
    map: gMap,
    radius: (gRad * 1000),
    strokeColor: '#0000FF',
    strokeOpacity: 1,
    strokeWeight: 1
  });
  gCircle.setMap(gMap);
  $(gPointMarker).each(function () {this.setMap(null);});
  gPointMarker=[];

  var url = "http://search.twitter.com/search.json?geocode=$lat$%2C$lon$%2C$rad$km&rpp=10&callback=?".replace("$rad$", gRad).replace("$lat$", ll.lat()).replace("$lon$", ll.lng());
  $.getJSON(url, function(json){
    if(json.results){
      gTweets=json;
      dispTweets();
    }else{
      var res="Not Found. Please Retry.";
      $("#divMsg").html($("#divMsg").html() + "<br/>" + res);
    }
  });
}
function dispTweets(){
  if(gTweets && gTweets.results){
    var res="<table border=\"0\" cellpading=\"0\" cellspacing=\"0\"><tr><td colspan=\"3\"><hr></td></tr>";
    for(var idx=0; idx<gTweets.results.length; idx++){
      var result=gTweets.results[idx];
      var info="<tr><td rowspan=\"2\"><img src=\""+result.profile_image_url+"\" width=\"25px\" height=\"25px\"></td>";
      var d=new Date();
      d.setTime(Date.parse(result.created_at));
      result.created_at_str=d.getFullYear()+"/"+pad0(d.getMonth()+1)+"/"+pad0(d.getDate())+"<br>"+ pad0(d.getHours())+":"+pad0(d.getMinutes())+":"+pad0(d.getSeconds());
      info += "<td>";
      if(result.geo){
        info += "<a href='javascript:void(0);' onclick='popupTweet(%idx%);return false;' title='%ll%'>".replace("%ll%", result.geo.coordinates[0] + "/" + result.geo.coordinates[1]).replace("%idx%", idx);
        info += result.from_user;
        info += "</a>";
      }else{
        info += "<a href=\"http://twitter.com/" + result.from_user + "\" target=\"_blank\">" + result.from_user + "</a>";
      }
      info += "</td>";
      info += "<td rowspan=\"2\" class=\"text1\">" + result.text + "</td></tr>";
      info += "<tr><td nowrap>" + result.created_at_str + "</td>";
      res += (info + "</tr><tr><td colspan=\"3\"><hr></td></tr>");
      if(result.geo && result.geo.type.toLowerCase()=="point"){
        var marker=new google.maps.Marker({
          icon: "http://maps.google.co.jp/mapfiles/ms/icons/blue-dot.png",
          position: new google.maps.LatLng(result.geo.coordinates[0], result.geo.coordinates[1]),
          map: gMap,
          title: result.from_user+" - "+result.created_at_str,
          twIdx: idx
        });
        gTweets.results[idx].markerIdx=gPointMarker.length;
        google.maps.event.addListener(marker, 'click', function() { popupTweet(this.twIdx) });
        gPointMarker.push(marker);
      }
    }
    $("#divMsg").html( res + "</table>");
  }
}
function pad0(x){
  if(x<10) return "0"+x+"";
  return x;
}
function popupTweet(twIdx){
  if(gPopup) gPopup.close();
  if(gTweets){
    var result=gTweets.results[twIdx];
    var tw="";
    tw += ("<a href='http://twitter.com/%user%'>%user%</a><br/>".replace(/%user%/g, result.from_user));
    tw += "<a href='http://twitter.com/%user%/status/%id%'>%time%</a><br/>".replace("%user%", result.from_user).replace("%id%", result.id).replace("%time%", result.created_at_str);
    tw += result.text;
    tw="<div>"+tw+"</div>";
    gPopup = new google.maps.InfoWindow({content: tw, maxWidth:100});
    gPopup.open(gMap, gPointMarker[result.markerIdx]);
  }
}


