MeasurePanel = function (newId, newParent, newXPosition, newYPosition, newZIndex, newWidth, newHeight, newVisibility, newMapObject, newMapId)
{
  if (arguments.length > 0)
    this.init(newId, newParent, newXPosition, newYPosition, newZIndex, newWidth, newHeight, newVisibility, newMapObject, newMapId);
};

MeasurePanel.prototype = new GuiWidget();
MeasurePanel.constructor = MeasurePanel;
MeasurePanel.superclass = GuiWidget.prototype;
 
MeasurePanel.prototype.init = function (newId, newParent, newXPosition, newYPosition, newZIndex, newWidth, newHeight, newVisibility,newMapObject, newMapId)
{
  MeasurePanel.superclass.init.call(this, newId, newParent, newXPosition, newYPosition, newZIndex, newWidth, newHeight, newVisibility, "");
  this.id = newId;

  if (newMapId!=null)
  {
    this.mapObject = OBJECT_MANAGER.getControl(newMapId);
    this.mapId = newMapId;
  }
  else
  {
    this.mapObject = newMapObject;
    this.mapId = newMapObject.id;
  }
  
  this.mapObject.measureControl = this;
  this.MeasureConfig = new Object;
  this.MeasureRadioButtonGroup = null;
  this.MeasurePoints = new Array();
  this.MeasurePointImages = new Array();
  this.distanceSourceUnits = 'FT';
  this.distanceUnits = 'FT';

  this.sourceMarkerIMG = document.createElement("IMG");
  this.sourceMarkerIMG.src = './'+GuiWidget.THEME_PATH+GuiWidget.THEME+'/images/measurePointMarker.png';
  
  this.gfx = new jsGraphics(this.mapObject.mapImage.drawPlaneNode.id);
  this.gfx.setColor("#FF0000");
  this.gfx.setStroke(2);
};

MeasurePanel.prototype.draw = function()
{
  var config = OBJECT_MANAGER.getGuiValueById('MeasureConfig');
  this.distanceSourceUnits = document.applicationConfig.mapUnits;
  this.distanceUnits = config.distanceMeasureUnits;
  this.gfx.setColor(config.distanceColor);
  this.gfx.setStroke(parseInt(config.distanceThickness));
  
  var ypos = 0;
  var htmlString = '';
  this.MeasureRadioButtonGroup = this.mapObject.mapPanel.toolbarRadioButtonGroup;

  //declare a widget to contain the query panels.  This will be hidden by default
  this.simplePanelWidget = new GuiWidget(this.id+"themeElement", this.element, 0, 0, 0, this.width(), 230, true, "");
    this.headerCaptionElement = new GuiWidget(this.id+"headerCaptionElement", this.simplePanelWidget.element, 0, 0, 0, this.width(), 20, true, "themeGroupHeader");
    this.headerCaptionElement.element.cbe.innerHtml("Measure");
    this.formContainer = new GuiWidget (this.id+"formContainer", this.simplePanelWidget.element, 0, 20, 0, this.width(), 135, true, "QueryObjectBottom");
        this.MeasureHeader = new GuiWidget(this.id+"MeasureHeader", this.formContainer.element, 10, 0, 0, this.width()-10, 20, true, "");
        this.MeasureHeader.element.cbe.innerHtml('Measure Distance');
        this.MeasureDistanceHeader = new GuiWidget(this.id+"MeasureDistanceHeader", this.formContainer.element, 10, 20, 0, this.width()-10, 20, true, "MeasureDistanceLength");
        this.MeasureDistanceHeader.element.cbe.innerHtml('Distance: ');
        this.MeasureDistanceUnitsHeader = new GuiWidget(this.id+"MeasureDistanceUnitsHeader", this.formContainer.element, 10, 40, 0, this.width()-10, 20, true, "MeasureDistance");
        this.MeasureDistanceUnitsHeader.element.cbe.innerHtml('Length Measurement Units');
        this.MeasureDistanceUnitsSelect = new GuiWidget(this.id+"MeasureDistanceUnitsSelect", this.formContainer.element, 10, 60, 0, this.width()-10, 20, true, "MeasureDistance");
        htmlString = '<select id="'+this.id+'MeasureDistanceUnitsSelect" onchange="+document.getWidgetById(\''+this.id+'\').setDistanceUnits(this.value);">';
        htmlString += '<option value="FT" '; if (this.distanceUnits == 'FT') htmlString+= 'SELECTED'; htmlString+= '>Feet</option>';
        htmlString += '<option value="M" '; if (this.distanceUnits == 'M') htmlString+= 'SELECTED'; htmlString+= '>Meters</option>';
        htmlString += '<option value="YD" '; if (this.distanceUnits == 'YD') htmlString+= 'SELECTED'; htmlString+= '>Yards</option>';
        htmlString += '<option value="MI" '; if (this.distanceUnits == 'MI') htmlString+= 'SELECTED'; htmlString+= '>Miles</option>';
        htmlString += '<option value="KM" '; if (this.distanceUnits == 'KM') htmlString+= 'SELECTED'; htmlString+= '>Kilometers</option>';
        htmlString += '</select>';
        this.MeasureDistanceUnitsSelect.element.cbe.innerHtml(htmlString);
        this.MeasureDistanceStartButton = new RadioButton(this.id+"MeasureStartButton", this.formContainer.element, 10, 85, 0, 100,20,true,'measureDistanceStartButton','',this.MeasureRadioButtonGroup);
        this.MeasureDistanceStartButton.MeasurePanel = this;
        this.MeasureDistanceStartButton.clickEvent = function(e)
        {
          this.MeasurePanel.mapObject.mapPanel.clickMode = 'MeasureDistance';
          this.MeasurePanel.distanceReset();
        };
        this.MeasureDistanceStartButton.setInactiveEvent = function()
        {
          this.MeasurePanel.distanceReset();
        };
        this.MeasureDistanceResetButton = new ImageButton(this.id+"MeasureDistanceResetButton", this.formContainer.element, 10, 110, 0, 100,20,true,'measureDistanceResetButton','');
        this.MeasureDistanceResetButton.MeasurePanel = this;
        this.MeasureDistanceResetButton.clickEvent = function(e)
        {
          this.MeasurePanel.distanceReset();
        };
  this.height(this.simplePanelWidget.height());
};

MeasurePanel.prototype.resize = function(newWidth, newHeight)
{
  this.element.cbe.resizeTo(newWidth, this.height());
};

MeasurePanel.prototype.distanceReset = function()
{
  this.MeasureDistanceHeader.element.cbe.innerHtml('Distance: ');
  for (var lcv=0;lcv < this.MeasurePointImages.length;lcv++)
  {
    this.mapObject.mapImage.parentElement.removeChild(this.MeasurePointImages[lcv]);
    delete(this.MeasurePointImages[lcv]);
  }
  delete(this.MeasurePointImages);
  delete(this.MeasurePoints);
  this.MeasurePoints = new Array();
  this.MeasurePointImages = new Array();
  this.gfx.clear();
};

MeasurePanel.prototype.distanceAddPoint = function(x,y)
{
  var pos = this.MeasurePoints.length;
  this.MeasurePoints[pos] = new Array();
  this.MeasurePoints[pos].x = x;
  this.MeasurePoints[pos].y = y;
};

MeasurePanel.prototype.distanceAddPointImage = function(measurePointX,measurePointY,Z)
{
  var pos = this.MeasurePointImages.length;
  var img = document.cbe.createElement("IMG");
  var tooltip = 'Measure Point #'+(pos+1);
  img.setAttribute('title',tooltip);
  img.src = this.sourceMarkerIMG.src;
  this.mapObject.mapImage.parentElement.appendChild(img);
  img.cbe.zIndex(Z);
  //var imgWidth = this.sourceMarkerIMG.width;
  //var imgHeight = this.sourceMarkerIMG.height;
  //force size to 10x10; IE has a problem with determining image size of source image
  var imgWidth = 10;
  var imgHeight = 10;
  img.cbe.width(imgWidth);
  img.cbe.height(imgHeight);
  
  //var centerX = measurePointX - Math.floor(imgWidth/2);
  //var centerY = measurePointY - Math.floor(imgHeight/2);
  //anchor by lower right point
  var centerX = measurePointX - imgWidth;
  var centerY = measurePointY - imgHeight;
  img.cbe.moveTo(centerX,centerY);
  img.cbe.show();
  img.realX = measurePointX;
  img.realY = measurePointY;
  this.MeasurePointImages[pos] = img;
  
  // add the line
  if (pos > 0)
  {
    var lastPt = this.MeasurePointImages[pos-1];
    var dx = 2;
    var dy = 29;
    this.gfx.drawLine(lastPt.realX-dx,lastPt.realY-dy,measurePointX-dx,measurePointY-dy);
    this.gfx.paint();
  }
};

MeasurePanel.prototype.distanceCalculate = function()
{
  var dist = 0;
  var distStr = '0'+this.distanceUnits.toLowerCase();
  if (this.MeasurePoints.length > 1)
  {
    var segment = 0;
    var previousSegmentStr = 0;
    for (var lcv=0;lcv < this.MeasurePoints.length-1;lcv++)
    {
      var pt1 = this.MeasurePoints[lcv];
      var pt2 = this.MeasurePoints[lcv+1];
      previousSegment = Math.floor(this.convertUnits(segment)*100)/100+''+this.distanceUnits.toLowerCase();
      if(this.distanceSourceUnits=='LL'){
        //pt<n>.x=longitude; pt<n>.y=latitude
        var R = 6372.795; // earth's mean radius in km
        var p1={lat:pt1.y*Math.PI/180,lon:pt1.x*Math.PI/180};
        var p2={lat:pt2.y*Math.PI/180,lon:pt2.x*Math.PI/180};
        var dLat  = p2.lat - p1.lat;
        var dLong = p2.lon - p1.lon;
        var a = Math.sin(dLat/2) * Math.sin(dLat/2) + Math.cos(p1.lat) * Math.cos(p2.lat) * Math.sin(dLong/2) * Math.sin(dLong/2);
        var c=2*(Math.asin(Math.sqrt(a)))
        var d = R * c;
        segment=d;
      }
      else{
        segment = Math.sqrt( Math.pow(pt2.x - pt1.x,2) + Math.pow(pt2.y - pt1.y,2) );
      }
      if (lcv > 0)
      {
        var tooltip = 'Measure Point #'+(lcv+1);
        tooltip += ', distance = '+distStr;
        tooltip += ', segment = '+previousSegment;
        this.MeasurePointImages[lcv].setAttribute('title',tooltip);
      }
      dist += segment;
      distStr = Math.floor(this.convertUnits(dist)*100)/100+''+this.distanceUnits.toLowerCase();
    }
    lcv = this.MeasurePoints.length-1;
    if (lcv > 0)
    {
      previousSegment = Math.floor(this.convertUnits(segment)*100)/100+''+this.distanceUnits.toLowerCase();
      var tooltip = 'Measure Point #'+(lcv+1);
      tooltip += ', distance = '+distStr;
      tooltip += ', segment = '+previousSegment;
      this.MeasurePointImages[lcv].setAttribute('title',tooltip);
    }
  }
  this.MeasureDistanceHeader.element.cbe.innerHtml('Distance: '+distStr);
  return(dist);
};

MeasurePanel.prototype.convertUnits = function(dist)
{
  if (this.distanceSourceUnits == this.distanceUnits)
    return(dist);
  var newdist = 0;
  /* step 1: convert to ft */
  switch (this.distanceSourceUnits)
  {
    case 'FT':
      newdist = dist;
      break;
    case 'YD':
      newdist = dist * 3;
      break;
    case 'MI':
      newdist = dist * 5280;
      break;
    case 'M':
      newdist = dist * 3.2808399;
      break;
    case 'LL':
    case 'KM':
      newdist = dist * 3280.8399;
      break;
  }
  /* step 2: convert from ft to requested units */
  switch (this.distanceUnits)
  {
    case 'FT':break;
    case 'YD':
      newdist = newdist / 3.0;
      break;
    case 'MI':
      newdist = newdist / 5280.0;
      break;
    case 'M':
      newdist = newdist / 3.2808399;
      break;
    case 'KM':
      newdist = newdist / 3280.8399;
      break;
  }
  return(newdist);
};

MeasurePanel.prototype.setDistanceUnits = function(newUnits)
{
  this.distanceUnits = newUnits;
  this.distanceCalculate();
};

