var bpsShops, fortressbpsShops, homeShops, citiCallShops, chungYuenShops;    
var bps, fortress, gome, citiCall, chungYuen;
var map;

function openWin(shop){
  window.open('lmxdownload.html?shop='+shop,'_blank','height=320, width=600, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
}
    
function initialize() {
  //define BPS imange and location
  bpsShops = new Array();
  fortressShops = new Array();
  homeShops = new Array();
  citiCallShops = new Array();
  chungYuenShops = new Array();
  
  defineVar();

  if (GBrowserIsCompatible()) {
    // Define definition
    map = new GMap2(document.getElementById("map_canvas"));
    map.addControl(new GLargeMapControl());
    map.addControl(new GScaleControl());
    map.addControl(new GMapTypeControl());
//    map.addControl(new GOverviewMapControl);  
    map.setCenter(new GLatLng(22.382143, 114.188268), 11);
    
    // Set up our GMarkerOptions object
    var blueIcon = new GIcon(G_DEFAULT_ICON);
    blueIcon.image = "./images/blue_icon.png";		
		markerBlueOptions = { icon:blueIcon };

    var redIcon = new GIcon(G_DEFAULT_ICON);
    redIcon.image = "./images/red_icon.png";		
		markerRedOptions = { icon:redIcon };
  
    var greenIcon = new GIcon(G_DEFAULT_ICON);
    greenIcon.image = "./images/green_icon.png";		
		markerGreenOptions = { icon:greenIcon };

    var orangeIcon = new GIcon(G_DEFAULT_ICON);
    orangeIcon.image = "./images/orange_icon.png";		
		markerOrangeOptions = { icon:orangeIcon };

    var pinkIcon = new GIcon(G_DEFAULT_ICON);
    pinkIcon.image = "./images/pink_icon.png";		
		markerPinkOptions = { icon:pinkIcon };

    //set default flag  
    defineShopArray(bps, bpsShops);
    setBPSLoaction(bpsShops, markerBlueOptions);   
  }else {
    alert("Sorry, the Google Maps API is not compatible with this browser");
  }//if
}//initialize

// Creates a marker at the given point
// Clicking the marker will hide it
function createMarker(latlng, number, shop, markerFlag) {  
  var marker = new GMarker(latlng, markerFlag);
  marker.value = number;
  GEvent.addListener(marker,"click", function() {
    var myHtml = '<table border=0 cellpadding=0 cellspacing=0>' + '<tr>    ' + 
    '<td rowspan=5> <img src="images/' + shop[1] + '" border="0" width="250" height="150"></td>    ' +
    '<td rowspan=5>&nbsp;&nbsp;&nbsp;</td>    ' +
    '<td><font face="Arial, Helvetica, sans-serif" size="2">' + shop[5] + '分店</font></td> '+
    '</tr> ' +    
    '<tr> <td><font face="Arial, Helvetica, sans-serif" size="2">地址: ' + shop[6] + '</font></td> </tr>' +   
    '<tr> <td><font face="Arial, Helvetica, sans-serif" size="2">電話: ' + shop[7] + '</font></td> </tr>' +   
    '<tr> <td><font face="Arial, Helvetica, sans-serif" size="2">營業時間: ' + shop[8] + '</font></td> </tr>' +   
    '<tr> <td><a HREF="javascript:void(0)" onclick=openWin('+ shop[4] +')><img src="images/NokiaIcon_v2.gif" border="0"></a></td> </tr>' +   
    '</table>';
    map.openInfoWindowHtml(latlng, myHtml);
  });
  return marker;
}//createMarker

function createOthersMarker(latlng, number, shop, markerFlag) {
  var marker = new GMarker(latlng, markerFlag);
  marker.value = number;
  GEvent.addListener(marker,"click", function() {
    var myHtml = '<font face="Arial, Helvetica, sans-serif" size="2">地址: ' + shop[3] + '</font>';
    map.openInfoWindowHtml(latlng, myHtml);
  });
  return marker;
}//createOthersMarker

// set BPS flag
function setBPSLoaction(shop, mark){
  // Add markers to the map 
  for (var i = 0; i < shop.length; i++) {
    if (shop[i][1] != 0){
      var latlng = new GLatLng(shop[i][2],shop[i][3]);
      map.addOverlay(createMarker(latlng, i, shop[i], mark ));
    }
  }//for  
}//setBPSLoaction  

// set BPS flag
function setOthersLoaction(shop, mark){
  // Add markers to the map 
  for (var i = 0; i < shop.length; i++) {
    if (shop[i][1] != 0){
      var latlng = new GLatLng(shop[i][1],shop[i][2]);
      map.addOverlay(createOthersMarker(latlng, i, shop[i], mark ));
    }
  }//for  
}//setBPSLoaction  

//trigger by user event
function setFlag(mapForm){
  map.clearOverlays();
  
  if (mapForm.BPS.checked ){
    setBPSLoaction(bpsShops, markerBlueOptions);
  }
  if (mapForm.Fortress.checked ){
    setOthersLoaction(fortressShops, markerRedOptions);
  }  
  if (mapForm.Gome.checked ){
    setOthersLoaction(homeShops, markerGreenOptions);
  }  
  if (mapForm.CitiCall.checked ){
    setOthersLoaction(citiCallShops, markerOrangeOptions);
  }  
  if (mapForm.ChungYuen.checked ){
    setOthersLoaction(chungYuenShops, markerPinkOptions);
  }    
}//setFlag

function resetCheckBox(mapForm){
    mapForm.BPS.checked = true;
    mapForm.Fortress.checked = false;
    mapForm.Gome.checked = false;
    mapForm.CitiCall.checked = false;
    mapForm.ChungYuen.checked = false;
    mapForm.All.checked = false;
}

function selectAll(mapForm){
  if (mapForm.All.checked ){
    mapForm.BPS.checked = true;
    mapForm.Fortress.checked = true;
    mapForm.Gome.checked = true;
    mapForm.CitiCall.checked = true;
    mapForm.ChungYuen.checked = true;
  }
  
  if (!mapForm.All.checked ){
    mapForm.BPS.checked = false;
    mapForm.Fortress.checked = false;
    mapForm.Gome.checked = false;
    mapForm.CitiCall.checked = false;
    mapForm.ChungYuen.checked = false;
  }
  setFlag(mapForm);
}// selectAll

function defineShopArray(shop, shopArray) {
  var qsParm = new Array();
  var parms = shop.split(';');
  for (var i=0; i<parms.length; i++) {
    var pos = parms[i].indexOf('=');
    if (pos > 0) {
      var key = parms[i].substring(0,pos);
      var val = parms[i].substring(pos+1);
      var cor = val.split(',');
      shopArray[i]=new Array();
      shopArray[i][0] = key;   
      for (var j=0; j<cor.length; j++){
        shopArray[i][j+1] = cor[j];
      }//for
    }//if
  }//for
} //defineShopArray