//VirtualEarth.js
//Displays images on Virtual Earth satellite map.
//Grant Schindler
//Updated: 2005.12.19
//Updated: 2006.06.04

var map = null;
var gNum = 150; // Initial and Maximum number of Pushpins
var visible = new Array(gNum);
var gLat = new Array(gNum);
var gLon = new Array(gNum);
var gName= new Array(gNum);
var gAlt = new Array(gNum);
var prevX = -1;
var prevY = -1;
	
//---------------------------------------------
//Add Pushpin with Clickable ID Number or Image
//---------------------------------------------

function addImage(id)
{
  var w = 10; var h = 10;
  var imgw = 1; var imgh = 1;
  var style = 'pin';
  var contents = id; //number displayed is one more than its index, to match 4d-cities
  var iconURL = '';

  //document.write('<style type="text/css" media=screen> </style>');
  
  if (visible[id]){
    w = 164; h = 124;
    imgw = 160; imgh = 120;
    style = 'pinimage';
    contents = '<img width="' + imgw + '" height="' + imgh + '" border="0" name=4dcities' + id + ' alt = "">';
    window.setTimeout('delayedLoad(' + id + ')',1); //Internet Explorer - delay 1 millisecond before loading
  }
  
  //Experiment With Changing Color Per Pin
  //pin.background = "#000000";
  //style = "pin{width:20px;height:15px;font-family:Arial,sans-serif;font-weight:bold;font-size:8pt;color:White;overflow:hidden;cursor:pointer;text-decoration:none;text-align:center;background:#0000FF;border:1px solid #000000;z-index:5;}";
  //document.getElementById('pin').style.background = "#FF00FF";

  VEPushpin.ShowDetailOnMouseOver = false;
  VEPushpin.OnMouseOverCallback = function(x, y, title, details)  
  {
	if (!(prevX == x && prevY == Y))
        {
                prevX = x;
                prevY = y;
                swapImage(title);
        }
  }
  if (visible[id]){
   iconURL = 'http://www.cc.gatech.edu/~dellaert/4d-cities/' + gName[id];
  }

  map.AddPushpin( new VEPushpin( id, new VELatLong(gLat[id], gLon[id]), iconURL, 
        '' + id + '', contents, style ) );

  //map.AddPushpin(id, gLat[id], gLon[id], w, h, style, 
  // '<a href="javascript:void(0)" onClick="swapImage(\'' + id + '\');">' + contents + '</a>');
}

function delayedLoad(id){
  var imgID = '4dcities' + id;
  document.images[imgID].src = 'http://www.cc.gatech.edu/~dellaert/4d-cities/' + gName[id];
}

//---------------------------------------------
//Load XML Data into Arrays, Create Pushpins
//---------------------------------------------

function parseXML(database){
  var cameras = database.getElementsByTagName('camera');      
  var ids = database.getElementsByTagName('id');
  var lats = database.getElementsByTagName('lat');
  var lons = database.getElementsByTagName('lon');
  var alts = database.getElementsByTagName('altitude');
  var paths = database.getElementsByTagName('path');
  gNum = cameras.length; //set gNum to number of entries in xml file
  
  var i = 0;
  for (i=0; i<gNum; i++){
    visible[i] = 0;
    //gID[i] = ids[i].firstChild.nodeValue; // ignore id for now 
    gLat[i] = lats[i].firstChild.nodeValue;
    gLon[i] = lons[i].firstChild.nodeValue;
    gAlt[i] = alts[i].firstChild.nodeValue;
    gName[i] = paths[i].firstChild.nodeValue;
    
    if (i == 0 || i == 3 || i == 62)
      { visible[i] = 1;}
    else
      {addImage(i);}
  }
  
  addImage(0);
  addImage(3);
  addImage(62);
}


//---------------------------------------------
//Main Function - Puts up Map, Calls Import XML
//---------------------------------------------

function OnPageLoad()
{
  //Candler Building = (33.756761,-84.388)
  //map = new VE_MapControl(33.756561,-84.3878,17,'h',"relative",10,10,800,600);
  //document.body.appendChild(map.element);
  map = new VEMap('map');
  map.LoadMap(new VELatLong(33.756961,-84.3878), 17, 'h', false);
  //var tag = document.getElementById("map");
  //tag.appendChild(map.element);
  importXML( '../xml/complete_data_set.xml', 'parseXML' );
}


//---------------------------------------------
//Called by Onclick to Swap Image & Index Pins
//---------------------------------------------
function swapImage(n)
{
  map.DeletePushpin(n); 
  visible[n] = !(visible[n]); 
  addImage(n);
}

//Show All Images - For Debugging 
//<a href="javascript:void()" onClick="showAll()">Show All Images</a>
function showAll(){
  var i = 0;
  for (i=0; i<gNum; i++){
    if (visible[i] == 0) {map.DeletePushpin(i); visible[i] = 1; addImage(i);};
  }
}