var map;
var noaa;
var nssl;
var parmarker;
var cases = "http://ewp.nssl.noaa.gov/projects/shave/damage_surveys/cases.xml";
var casemarkers = [];
var myCurTornPts = [];
var curTornPhotos = [];
var showCurTornPhotos;
var showCurTornPts;
var tornado = new GIcon();
tornado.iconSize = new GSize(24,24);
tornado.iconAnchor = new GPoint(10,10);
tornado.infoWindowAnchor = new GPoint(16,0);
tornado.image = "http://ewp.nssl.noaa.gov/projects/shave/data/icons/damagesurveytorn.png";
var start = new GIcon();
start.iconSize = new GSize(15,26);
start.iconAnchor = new GPoint(7,26);
start.infoWindowAnchor = new GPoint(8,0);
start.image = "http://ewp.nssl.noaa.gov/projects/shave/data/icons/dd-start.png";
var mid = new GIcon();
mid.iconSize = new GSize(15,26);
mid.iconAnchor = new GPoint(7,26);
mid.infoWindowAnchor = new GPoint(8,0);
mid.image = "http://ewp.nssl.noaa.gov/projects/shave/data/icons/dd-mid.png";
var end = new GIcon();
end.iconSize = new GSize(15,26);
end.iconAnchor = new GPoint(7,26);
end.infoWindowAnchor = new GPoint(8,0);
end.image = "http://ewp.nssl.noaa.gov/projects/shave/data/icons/dd-end.png";
var photo = new GIcon();
photo.iconSize = new GSize(21,31);
photo.iconAnchor = new GPoint(7,30);
photo.infoWindowAnchor = new GPoint(15,15);
photo.image = "http://ewp.nssl.noaa.gov/projects/shave/data/icons/photo.png";

function load() {
  map = new GMap2(document.getElementById("map"));
  map.setCenter(new GLatLng(35.235833,-97.461944), 7);
  map.savePosition();
  map.enableDoubleClickZoom();
//  map.addControl(new GSmallMapControl());
  map.addControl(new GSmallZoomControl());
  map.addControl(new GScaleControl());
  var noaaX = 538;
  var noaaY = 338;
  noaa = new GScreenOverlay("http://wdssii.nssl.noaa.gov/geotiff/colormaps/noaa.gif", new GScreenPoint(noaaX,noaaY), new GScreenPoint(0, 0), new GScreenSize(60,60));
  var nsslY = noaaY - 62;
  nssl = new GScreenOverlay("http://wdssii.nssl.noaa.gov/geotiff/colormaps/nssl.gif", new GScreenPoint(noaaX,nsslY), new GScreenPoint(0, 0), new GScreenSize(60,60));
  map.addOverlay(noaa);
  map.addOverlay(nssl);
  var par = new GIcon();
  par.iconSize = new GSize(24,24);
  par.iconAnchor = new GPoint(10,10);
  par.infoWindowAnchor = new GPoint(16,0);
  par.image = "http://ewp.nssl.noaa.gov/projects/shave/data/icons/par.png";
  parmarker = new GMarker(new GLatLng(35.235833,-97.461944), {icon:par, title:"MPAR"});
  var parinfo = "For more information, visit <a href=\"http://www.nssl.noaa.gov/divisions/radar/par/\">NSSL PAR Page</a>";
  GEvent.addListener(parmarker,"click",function(){
    parmarker.openInfoWindowHtml(parinfo,{maxWidth:175});
  });
  map.addOverlay(parmarker);
  GEvent.addListener(map,"clearoverlays",function() {
    map.addOverlay(noaa);
    map.addOverlay(nssl);
    map.addOverlay(parmarker);
  });
  GEvent.addListener(map,"mousemove", function(mousePt) {
    var lat = mousePt.lat().toString();
    var point = lat.search(/\./) + 6;
    var latd = lat.slice(0,point);
    var lng = mousePt.lng().toString();
    var point = lng.search(/\./) + 6;
    var lngd = lng.slice(0,point);
    document.getElementById("readout").innerHTML = "Lat: " + latd + " Lon: " + lngd;
  });
  addCases();
}

function resetMap() {
  map.clearOverlays();
  map.returnToSavedPosition();
  document.getElementById('text').innerHTML = "";
  for (var c=0;c<casemarkers.length;c++) {
    map.addOverlay(casemarkers[c]);
  }
  curTornPhotos = [];
  myCurTornPts = [];
}

function createMarker(point,micon,descrip,mtitle) {
  var marker = new GMarker(point,{icon:micon,title:mtitle});
  GEvent.addListener(marker,"click",function() {
      map.panTo(marker.getPoint());
      marker.openInfoWindowHtml(descrip, {maxWidth:250});
  });
  return marker;
}

function clickTornado(indexp1) {
  resetMap();
  indexp1--;
  GEvent.trigger(casemarkers[indexp1], "click");
  document.location.href = "#map";
}

function createPhotoMarker(point,micon,html) {
  var marker = new GMarker(point,{icon:micon,title:"Photo"});
  GEvent.addListener(marker,"click",function() {
    document.getElementById("text").innerHTML = html;
  });
  return marker;
}

function addCases() {
  var row = document.getElementById("tornadoes").insertRow(0);
  row.insertCell(0).innerHTML = "";
  row.insertCell(1).innerHTML = "Date";
  row.insertCell(2).innerHTML = "Location(s)";
  row.insertCell(3).innerHTML = "Rating*";
  row.insertCell(4).innerHTML = "Surveyor(s)";
  var numrows = 1;
  var request = GXmlHttp.create();
  request.open("GET", cases, true);
  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      var xmlDoc = GXml.parse(request.responseText);
      //loop the cases in the XML
      var tornadoes = xmlDoc.documentElement.getElementsByTagName("tornado");
      var tmarker;
      for (var t=0;t<tornadoes.length;t++) {
        var row = document.getElementById("tornadoes").insertRow(numrows);
        var rownum = numrows;
        numrows++;
        var tlat = tornadoes[t].getAttribute("lat");
        var tlon = tornadoes[t].getAttribute("lon");
        var tpt = new GLatLng(tlat,tlon);
        var tday = tornadoes[t].getAttribute("day");
        lday = tday.replace(/\s/g, "");
        var tname = tornadoes[t].getAttribute("name");
        var rating = tornadoes[t].getAttribute("rating");
        var link = "showDetails(\"" + tname + "\",\"" + lday + "\",\"" + tlat + "\",\"" + tlon + "\")";
        row.insertCell(0).innerHTML = "<input type=\"submit\" value=\"" + rownum + "\" onclick='clickTornado(" + rownum + ")'>";
        row.insertCell(1).innerHTML = tday;
        tname = tname.replace(/_[0-9]+$/, "");
        row.insertCell(2).innerHTML = tname;
        row.insertCell(3).innerHTML = rating;
        row.insertCell(4).innerHTML = tornadoes[t].getAttribute("survey");
        var descrip = GXml.value(tornadoes[t]) + "<hr><input type=\"submit\" value=\"Details\" onClick='" + link + "'>";
        tmarker = createMarker(tpt, tornado, descrip, rating);
        map.addOverlay(tmarker);
        casemarkers.push(tmarker);
      }
    }
  }
  request.send(null);
}

function createTornadoLine(points,descrip) {
  var tcolor = "#FF00FF";
  var line = new GPolyline(points,tcolor,6,0.6);
  GEvent.addListener(line,"click",function() {
    document.getElementById("text").innerHTML = descrip;
  });
  return line;
}

function createWindPolygon(points,descrip) {
  var color = "#87CEEB";
  var polygon = new GPolygon(points,color,3,0.6,color,0.2);
  GEvent.addListener(polygon,"click",function() {
    document.getElementById("text").innerHTML = descrip;
  });
  return polygon;
}

function showDetails(name,day,lat,lng) {
  map.clearOverlays();
  myCurTornPts = [];
  curTornPhotos = [];
  document.location.href = "#map"
  var zoompt = new GLatLng(parseFloat(lat),parseFloat(lng));
  map.setCenter(zoompt,12);
  map.clearOverlays();
  var dayxml = "http://ewp.nssl.noaa.gov/projects/shave/damage_surveys/" + day + "/tornadoes.xml";
  var request = GXmlHttp.create();
  request.open("GET", dayxml, true);
  request.onreadystatechange = function() {
    if (request.readyState == 4 && request.status == 200) {
      var xmlDoc = GXml.parse(request.responseText);
      //loop the tornadoes; find the one we're looking for
      var tornadoes = xmlDoc.documentElement.getElementsByTagName("tornado");
      for (var t=0;t<tornadoes.length;t++) {
        var tname = tornadoes[t].getAttribute("name");
        if (tname == name) {
          var track = tornadoes[t].getElementsByTagName("track")[0];
          var points = track.getElementsByTagName("point");
          var path = [];
          for (var p=0;p<points.length;p++) {
            var tmplat = parseFloat(points[p].getAttribute("lat"));
            var tmplng = parseFloat(points[p].getAttribute("lon"));
            var tmppt = new GLatLng(tmplat,tmplng);
            path.push(tmppt);
            var ptmarker;
            var ptdescrip = "LAT: " + tmplat.toString() + "<br/>LON: " + tmplng.toString();
            if (p==0) {
              ptmarker = createMarker(tmppt,start,ptdescrip,"Start");
            } else if (p == points.length-1) {
              ptmarker = createMarker(tmppt,end,ptdescrip,"End");
            } else {
              ptmarker = createMarker(tmppt,mid,ptdescrip,"Midpoint");
            }
            myCurTornPts.push(ptmarker);
          }
          showCurTornPts = false;
          showCurTornPhotos = true;
          var starttime = parseFloat(tornadoes[t].getAttribute("starttime")) * 1000;
          var starttimestr = new Date(starttime);
          starttimestr = starttimestr.toGMTString();
          var endtime = parseFloat(tornadoes[t].getAttribute("endtime")) *  1000;
          var endtimestr = new Date(endtime);
          endtimestr = endtimestr.toGMTString();
          var lengthinmiles = tornadoes[t].getAttribute("length");
          var widthinyds = tornadoes[t].getAttribute("width");
          var descrip = "Length: " + lengthinmiles + " miles<br/>Width:&nbsp;&nbsp;" + widthinyds + " yards<br>Start time: " + starttimestr + "<br>End time:&nbsp&nbsp;" + endtimestr + "<br/>";
          var haveImages = tornadoes[t].getElementsByTagName("images")[0] != null;
          if (showCurTornPts) {
            descrip += "<input id='latlondetails' type='submit' value='Hide Lat/Lon Details' onclick='showCurrentPoints()' />";
          } else {
            descrip += "<input id='latlondetails' type='submit' value='Show Lat/Lon Details' onclick='showCurrentPoints()' />";
          }
          if (showCurTornPhotos && haveImages) {
            descrip += "&nbsp;&nbsp;<input id='photos' type='submit' value='Hide Photos' onclick='showCurrentPhotos()' />";
          } else if (haveImages) {
           descrip += "&nbsp;&nbsp;<input id='photos' type='submit' value='Show Photos' onclick='showCurrentPhotos()' />"; 
          }
          document.getElementById("text").innerHTML = descrip;
          var line = createTornadoLine(path,descrip);
          if (haveImages) {
            var images = tornadoes[t].getElementsByTagName("images")[0].getElementsByTagName("image");
            for (var i=0;i<images.length;i++) {
              var link = "http://ewp.nssl.noaa.gov/projects/shave/damage_surveys/" + day + "/images/" + images[i].getAttribute("filename");
              var pdescrip = "<img src='" + link + "' height=400 width=600 /><br/>" + GXml.value(images[i]) + "<br/>DI: " + images[i].getAttribute("di") + "<br/>DOD: " + images[i].getAttribute("dod");
              var plat = parseFloat(images[i].getAttribute("lat"));
              var plng = parseFloat(images[i].getAttribute("lon"));
              var photomarker = createPhotoMarker(new GLatLng(plat,plng),photo,pdescrip);
              map.addOverlay(photomarker);
              curTornPhotos.push(photomarker);
            }
          }
          map.addOverlay(line);
          var haveAddInfo = tornadoes[t].getElementsByTagName("other")[0] != null;
          if (haveAddInfo) {
            var polygons = tornadoes[t].getElementsByTagName("other")[0].getElementsByTagName("polygon");
            for (var o=0;o<polygons.length;o++) {
              var pdescrip = polygons[o].getAttribute("description");
              var verticies = polygons[o].getElementsByTagName("point");
              var poly = [];
              for (var v=0;v<verticies.length;v++) {
                var tmplat = parseFloat(verticies[v].getAttribute("lat"));
                var tmplng = parseFloat(verticies[v].getAttribute("lon"));
                poly.push(new GLatLng(tmplat,tmplng));
              }
              poly.push(new GLatLng(parseFloat(verticies[0].getAttribute("lat")), parseFloat(verticies[0].getAttribute("lon"))));
              var polygon = createWindPolygon(poly,pdescrip);
              map.addOverlay(polygon);
            }
          }
          break;
        }
      }
    } else {
      document.getElementById("text").innerHTML = "No details available";
    }
  }
  request.send(null)
}

function showCurrentPhotos() {
  if (showCurTornPhotos) {
    showCurTornPhotos = false;
    for (var p=0;p<curTornPhotos.length;p++) {
      map.removeOverlay(curTornPhotos[p]);
    }
    document.getElementById('photos').value = 'Show Photos';
  } else {
    showCurTornPhotos = true;
    for (var p=0;p<curTornPhotos.length;p++) {
      map.addOverlay(curTornPhotos[p]);
    }
    document.getElementById('photos').value = 'Hide Photos';
  }
}

function showCurrentPoints () {
  if (showCurTornPts) {
    showCurTornPts = false;
    for (var p=0;p<myCurTornPts.length;p++) {
      map.removeOverlay(myCurTornPts[p]);
    }
    document.getElementById("latlondetails").value = "Show Lat/Lon Details";
  } else {
    showCurTornPts = true;
    for (var p=0;p<myCurTornPts.length;p++) {
      map.addOverlay(myCurTornPts[p]);
    }
    document.getElementById("latlondetails").value = "Hide Lat/Lon Details";
  }
}