function getobj(id) {
  return document.getElementById ? document.getElementById(id) : document.all[id];
}
    
var id;
var ms = 0;


var xmlHttp = false;
try {
  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
  try {
    xmlHtp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  catch(e2) {
    xmlHttp = false;
  }
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
  xmlHttp = new XMLHttpRequest();
}

if (!xmlHttp) { alert("Error creating XMLHttpRequest object!"); }

function infoBox(id) {
  var kill = getobj("info"+id);
  if (kill) {
    kill.parentNode.removeChild(getobj("info"+id)); 
  }
  else {
    var Timer = new Date();
    ms = Timer.getTime();
    var url = "index.cgi?info=" + id;
    xmlHttp.open("GET", url, true);
    xmlHttp.onreadystatechange = updateInfoBox;
    xmlHttp.send(null);
    add(getobj('caption'+id).parentNode,"div",{id:"info"+id,className:"infobox"});
    getobj("info"+id).appendChild(document.createTextNode("Loading..."));
  }
}



function add(parent, tag, attr) {
  var el = document.createElement(tag);
  if (attr) {
    for (key in attr) {
      el[key] = attr[key];
    }
  }
  return parent.appendChild(el);
}


function updateInfoBox() {
  if (xmlHttp.readyState == 4) {
    if (xmlHttp.status == 200) {
      var data = azure.unenc(xmlHttp.responseText);
      if (data.hits == null) { data.hits = 0; }
      var info = "Data for Pic ID#" + data.id;

      getobj("info"+data.id).removeChild(getobj("info"+data.id).firstChild);
      add(getobj("info"+data.id),"span",{id:"infospan"+data.id});
      getobj("info"+data.id).firstChild.appendChild(document.createTextNode(info));

      add(getobj("info"+data.id),"div",{id:"infocontainer"+data.id,className:"infocontainer"});
      var dl = add(getobj("infocontainer"+data.id),'dl',{id:"dl"+data.id});


      add(dl, 'dt').innerHTML = "Views";
      add(dl, 'dd').innerHTML = data.hits;


      var time = data.pictime.split(" ");
      var date = time[0].split("-");

      if (date[0][0] == 2) {
        add(dl, 'dt').innerHTML = "Date";
        add(dl, 'dd').innerHTML = date[1] + "/" + date[2] + "/" + date[0][2]+date[0][3];
        add(dl, 'dt').innerHTML = "Time";
        add(dl, 'dd').innerHTML = time[1];
      }

      
      add(dl, 'dt').innerHTML = "Favorite";
      if (data.fav == "y") {
	add(dl, 'dd').innerHTML = "Yes";
      }
      else {
	add(dl, 'dd').innerHTML = "No";
      }
      
      
      if(data.iso != "N/A") {
        add(dl, 'dt').innerHTML = "ISO";
        add(dl, 'dd').innerHTML = data.iso;
      }


      if (data.flash != -1) {
        add(dl, 'dt').innerHTML = "Flash";
        var flash = "N/A";
        if (data.flash == 0) { flash = "No"; }
        if (data.flash == 1) { flash = "Yes"; }      
        add(dl, 'dd').innerHTML = flash;
      }


      if (data.fnumber != -1) {
        add(dl, 'dt').innerHTML = "FNumber";
        add(dl, 'dd').innerHTML = data.fnumber;
      }


      if (data.exposure != "N/A") {
        add(dl, 'dt').innerHTML = "Exposure";
        add(dl, 'dd').innerHTML = data.exposure + "s";
      }





      if (data.focallength != -1) {
        add(dl, 'dt').innerHTML = "Focal Length";
        add(dl, 'dd').innerHTML = data.focallength + "mm";
      }



      // I don't want one or the other.. both only
      if (data.width != -1 && data.height != -1) {
        add(dl, 'dt').innerHTML = "Width";
        add(dl, 'dd').innerHTML = data.width + "px";
        add(dl, 'dt').innerHTML = "Height";
        add(dl, 'dd').innerHTML = data.height + "px";
      }


      if (data.model != "N/A") {
        var prefix = "";
        if (data.model != "Panorama" && data.model != "DCR-TRV27") { prefix = "Canon "; }
          add(dl, 'dt').innerHTML = "Model";
          add(dl, 'dd').innerHTML = prefix + data.model;
        }
      }


      var ret1 = add(dl, 'dt')
      ret1.innerHTML = "Retrieved in";
      ret1.style.color = "#aaaaaa";
      var Timer = new Date();
      var ret2 = add(dl, 'dd')
      ret2.innerHTML = "" + (Timer.getTime()-ms) + "ms";
      ret2.style.color = "#aaaaaa";
      ms = 0;


    
    if (xmlHttp.status == 500) {
      alert("500 - Houston we have a problem");
    }
  }
}