Summary

No overview generated for 'AoiBoxDHTML.js'

/*
Author:       Mike Adair mike.adairATccrs.nrcan.gc.ca
License:      LGPL as per: http://www.gnu.org/copyleft/lesser.html

$Id: AoiBoxDHTML.js 3091 2007-08-09 12:21:54Z gjvoosten $
*/

// Ensure this object's dependancies are loaded.
mapbuilder.loadScript(baseDir+"/widget/WidgetBase.js");

/**
 * Widget to draw an Area Of Interest box of a model.  The box can be drawn with
 * the paint() method and is registered as a listener of the context AOI property.
 * This object works entirely in pixel/line coordinate space and knows nothing
 * about geography.  This widget uses DHTML methods to draw the box.  Since it
 * does not support a targetModel property, it has to be defined as a child widget
 * of the context of the map that the box should be drawn into.
 * WARNING: This widget cannot be used in maps that use button controls.
 * Button controls take care of aoi handling themselves.
 * It is designed for use in locator map setups only.
 * See also MAP-312
 * @deprecated
 * @constructor
 * @base WidgetBase
 * @param widgetNode The node for this object from the Config file.
 * @param model The model that contains this object.
 */
function AoiBoxDHTML(widgetNode, model) {
  WidgetBase.apply(this,new Array(widgetNode, model));

  this.lineWidth = widgetNode.selectSingleNode("mb:lineWidth").firstChild.nodeValue; // Zoombox line width; pass in as param?
  this.lineColor = widgetNode.selectSingleNode("mb:lineColor").firstChild.nodeValue; // color of zoombox lines; pass in as param?
  this.crossSize = parseInt(widgetNode.selectSingleNode("mb:crossSize").firstChild.nodeValue);

  /** draw out the box.
    * if the box width or height is less than the cross size property, then the
    * drawCross method is called, otherwise call drawBox.
    * @param objRef a pointer to this widget object
    */
  this.paint = function(objRef) {
    var aoiBox = objRef.model.getParam("aoi");
    if (aoiBox) {
      var ul = objRef.model.extent.getPL(aoiBox[0]);
      var lr = objRef.model.extent.getPL(aoiBox[1]);
      //check if ul=lr, then draw cross, else drawbox
      if ( (Math.abs( ul[0]-lr[0] ) < objRef.crossSize) && 
          (Math.abs( ul[1]-lr[1] ) < objRef.crossSize) ) {
        objRef.drawCross( new Array( (ul[0]+lr[0])/2, (ul[1]+lr[1])/2) );
      } else {
        objRef.drawBox(ul, lr);
      }
    }
  }
  model.addListener("aoi",this.paint, this);

  /** Hide or show the box.
    * @param vis    boolean true for visible; false for hidden
    * @return       none
    */
  this.setVis = function(vis) {
    var visibility = "hidden";
    if (vis) visibility = "visible";
    this.Top.style.visibility = visibility;
    this.Left.style.visibility = visibility;
    this.Right.style.visibility = visibility;
    this.Bottom.style.visibility = visibility;
  }

  /** Listener to turn the box off
    * @param objRef  reference to this object
    * @return       none
    */
  this.clear = function(objRef) {
    objRef.setVis(false);
  }
  this.model.addListener("bbox",this.clear, this);


  /** Draw a box.
    * @param ul Upper Left position as an (x,y) array in screen coords.
    * @param lr Lower Right position as an (x,y) array in screen coords.
    */
  this.drawBox = function(ul, lr) {
    this.Top.style.left = ul[0] +'px';
    this.Top.style.top = ul[1] +'px';
    this.Top.style.width = lr[0]-ul[0]  +'px';
    this.Top.style.height = this.lineWidth +'px';

    this.Left.style.left = ul[0]  +'px';
    this.Left.style.top = ul[1]  +'px';
    this.Left.style.width = this.lineWidth  +'px';
    this.Left.style.height = lr[1]-ul[1]  +'px';

    this.Right.style.left = lr[0]-this.lineWidth  +'px';
    this.Right.style.top = ul[1]  +'px';
    this.Right.style.width = this.lineWidth +'px';
    this.Right.style.height = lr[1]-ul[1] +'px';

    this.Bottom.style.left = ul[0] +'px';
    this.Bottom.style.top = lr[1]-this.lineWidth  +'px';
    this.Bottom.style.width = lr[0]-ul[0] +'px';
    this.Bottom.style.height = this.lineWidth +'px';

    this.setVis(true);
  }
    
  /** Draw a cross.
    * @param center The center of the cross as an (x,y) array in screen coordinates.
    */
  this.drawCross = function(center) {
    this.Top.style.left = Math.floor( center[0] - this.crossSize/2 ) +'px';
    this.Top.style.top = Math.floor( center[1] - this.lineWidth/2 ) +'px';
    this.Top.style.width = this.crossSize +'px';
    this.Top.style.height = this.lineWidth +'px';
    this.Top.style.visibility = "visible";

    this.Left.style.left = Math.floor( center[0] - this.lineWidth/2 ) +'px';
    this.Left.style.top = Math.floor( center[1] - this.crossSize/2 ) +'px';
    this.Left.style.width = this.lineWidth +'px';
    this.Left.style.height = this.crossSize +'px';
    this.Left.style.visibility = "visible";

    this.Right.style.visibility = "hidden";
    this.Bottom.style.visibility = "hidden";
  }
    
  /** Insert a <div> element into the parentNode html to hold the lines.
    * @return The new <div> node.
    */
  this.getImageDiv = function( ) {
    var newDiv = document.createElement("div");
    newDiv.innerHTML = "<img src='"+config.skinDir+"/images/Spacer.gif' width='1px' height='1px'/>";
    newDiv.style.position = "absolute";
    newDiv.style.backgroundColor = this.lineColor;
    newDiv.style.visibility = "hidden";
    newDiv.style.zIndex = 900;
    if (this.node.style.position != 'absolute' &&
          this.node.style.position != 'relative') {
      this.node.style.position = "absolute";
    }
    this.node.appendChild( newDiv );
    return newDiv;
  }

  /**
   * Called when the parent widget is painted to create the aoi box 
   * @param objRef This object.
   */
  this.loadAoiBox = function(objRef) {
    objRef.Top = objRef.getImageDiv( );
    objRef.Bottom = objRef.getImageDiv( );
    objRef.Left = objRef.getImageDiv( );
    objRef.Right = objRef.getImageDiv( );
    objRef.paint(objRef);
  }
  this.loadAoiBox(this);

}