// JavaScript Document
var _base_url = "http://www.youbike.com.tw/upage/googlemap"
var _is_mapplet = true;

// create a costomized maker and specify the behavior of click 
function createMarker(index, station){

  // costomized icon
  // reference - http://code.google.com/apis/maps/documentation/reference.html#GIcon
  // example - http://code.google.com/apis/maps/documentation/examples/icon-custom.html
  var giantIcon = new GIcon(G_DEFAULT_ICON);
  giantIcon.image = _base_url+"/marker.png";
//giantIcon.shadow = "";
  giantIcon.iconSize = new GSize(30, 30);

  var marker = new GMarker(new GLatLng(station.lat, station.lng), {icon:giantIcon});
  var availVacancy = station.capacity - station.availBike;

  GEvent.addListener(marker, "click", function () {

  var query = _base_url+"/giant_stations.js"; //"/fetch_station_info.php?id="+station.id;

    

    var action = function (data){
          eval(data); // var _g_station_info = {"id": xx, "availBike":, xx}
          if(typeof giant.station != "undefine" && station.id == giant.station[station.id-1].id){
            _info = giant.station[station.id-1];
            station.availBike = _info.availBike;
            var availVacancy = station.capacity - station.availBike;
            var str = "<h4>"+station.name+"</h4>"
                      +"<h5><b>可借車數:</b> "+station.availBike+"<br/>"
                      +"<b>可停車位:</b> "+availVacancy+"</h5>";
            marker.openInfoWindowHtml(str);
//            document.getElementById("station").innerHTML = str;
//            document.getElementById("station_opts").selectedIndex = index;
          }
        };
        
    if(_is_mapplet){
      _IG_FetchContent(query, action, { refreshInterval: 1 });
    }else{
      GDownloadUrl(query, action);
    }
  });
  
  return marker;
}

// initialization
// @param map - GMap2 object
// @param isMapplet - boolean type, default value is true
function initialize(map, isMapplet) {

  // Center the map in the Mediterranean and zoom out to a Xinyi District view
  var viewPortCenter = new GLatLng(25.036558, 121.564493);
  var latMax = 0, latMin = 1000, lngMax = 0, lngMin = 1000;
  var zoom = 15;

  map.setCenter(viewPortCenter, zoom);
  map.setMapType(G_NORMAL_MAP);
  
  if(typeof isMapplet != "undefined" && !isMapplet){
    map.addControl(new GSmallMapControl());
    _is_mapplet = false;
  }else{
    _is_mapplet = true;
  }

  // giant is a json object that defined in giant_stations.json
  if (typeof giant != "undefined" && giant.station != null && giant.station.length > 0){
    for(var i in giant.station){
      giant.station[i].marker = createMarker(i, giant.station[i]);
      map.addOverlay(giant.station[i].marker);
/*
      // calculate bounding box to include all stations
      latMin = Math.min(latMin, giant.station[i].lat);
      latMax = Math.max(latMax, giant.station[i].lat);
      lngMin = Math.min(lngMin, giant.station[i].lng);
      lngMax = Math.max(lngMax, giant.station[i].lng);
*/
    }
    // move viewport to center of the calculated bounding box
//    map.setCenter(new GLatLng((latMin+latMax)/2, (lngMin+lngMax)/2), zoom);
  }else{
    alert("no station information"+giant);
  }

  var gx = new GGeoXml(_base_url+"/xinyi_bicycle_way.xml");
  map.addOverlay(gx);
}

// called after initialize() to update <select> object
// put names of all stations in the list
function updateStationList(obj){
  if(obj.type.indexOf("select") > -1 
    && typeof giant != "undefined" && giant.station != null && giant.station.length > 0){
    for(var i in giant.station){
      var opt = document.createElement('option');
      opt.text = giant.station[i].name;
      opt.value = i;
      obj.add(opt, null);
    }
  } 
}

// behavior of onchanged event of <select> object
// show station information
function selectStation(num){
  var station = giant.station[num];
  
  station.availBike = Math.round(Math.random() * 1000) % station.capacity; 
  var availVacancy = station.capacity - station.availBike;
  var str = "<h3>"+station.name+"</h3>"
            +"<b>地址:</b> "+station.address+"<br/>"
            +"<b>可借車數:</b> "+station.availBike+"<br/>"
            +"<b>可停車位:</b> "+availVacancy;
  station.marker.openInfoWindowHtml(str);
  document.getElementById("station").innerHTML = str;
}