/* 
 * Created by David Galvis
 * Dependencies: jQuery 1.2
 */

function Area(){

}

Area.prototype =
{
    x : 0.008000, // Area width
    y : 0.005000, // Area height
    centerIcon : '../images/move.png',
    polygon : null,
    zoom: 13,

    /**
     * Initializes the area
     */
    init: function(){

        // Center marker
        var _this = this;
        var icon = new GIcon(G_DEFAULT_ICON);
        icon.image = this.centerIcon;
        icon.iconSize = new GSize(16,16);
        icon.iconAnchor = new GPoint(8, 10);
        icon.shadow = false;

        this.center = new GMarker(map.getCenter(), {draggable: true, icon:icon, title: 'Drag this marker to move the area'});
        var coords = new GLatLng(this.center.getLatLng().lat() + this.y, this.center.getLatLng().lng() + this.x);

        // Resize marker
        var icondrag = new GIcon(G_DEFAULT_ICON);
        icondrag.image = this.centerIcon;
        icondrag.iconSize = new GSize(22,22);
        icondrag.iconAnchor = new GPoint(3, 18);
        icondrag.shadow =false;
        icondrag.image = '../images/resize.png';
        this.dragger = new GMarker(coords, {draggable: true, title: 'Drag this marker to resize the area', icon:icondrag});
        this.dragger.setLatLng(coords);

        
        GEvent.addListener(this.center, "dragend", function() {
            _this.draw();
            _this.move();
        });

        GEvent.addListener(this.center, "mouseover", function() {
            //alert('test');
        });

        GEvent.addListener(this.dragger, "dragend", function() {
            _this.calculate();
            _this.draw();
        });

        map.addOverlay(this.center);
        map.addOverlay(this.dragger);
        map.setZoom(this.zoom);
        this.draw();
    },

    /**
     * Draws the polygon
     */
    draw: function(){
      if (this.polygon)
          map.removeOverlay(this.polygon) ;

      this.polygon = new GPolygon([
      new GLatLng(this.center.getLatLng().lat() + this.y, this.center.getLatLng().lng() + this.x),
      new GLatLng(this.center.getLatLng().lat() + this.y, this.center.getLatLng().lng() - this.x),
      new GLatLng(this.center.getLatLng().lat() - this.y, this.center.getLatLng().lng()- this.x),
      new GLatLng(this.center.getLatLng().lat() - this.y, this.center.getLatLng().lng() + this.x),
      new GLatLng(this.center.getLatLng().lat() + this.y, this.center.getLatLng().lng() + this.x)],
      "#176E7F", 2, 1, "#5FE4FF", 0.4);

      map.addOverlay(this.polygon);
    },

    /**
     * Moves the drager to the top-right point of the area
     */
    move: function(){
        var coords = new GLatLng(this.center.getLatLng().lat() + this.y, this.center.getLatLng().lng() + this.x);
        this.dragger.setLatLng(coords);
    },

    /**
     * Calculates the size of the area depending on the drager position
     */
    calculate: function(){
        this.x = Math.abs(this.center.getLatLng().lng() - this.dragger.getLatLng().lng());
        this.y = Math.abs(this.center.getLatLng().lat() - this.dragger.getLatLng().lat());
    },

    /**
     * Removes the area
     */
    destroy: function(){
        map.removeOverlay(this.polygon);
        map.removeOverlay(this.center) ;
        map.removeOverlay(this.dragger) ;
    },

    /**
     * Resurns a JSON object containing the top-left and bottom-right coords of the area
     */
    getCoords: function(){
        var coords = {};
        coords.leftBottom = {};
        coords.rightTop = {};

        coords.leftBottom.y =  Math.abs(this.center.getLatLng().lng() - this.x);
        coords.leftBottom.x =  Math.abs(this.center.getLatLng().lat() - this.y);
        coords.rightTop.y =  Math.abs(this.center.getLatLng().lng() + this.x);
        coords.rightTop.x =  Math.abs(this.center.getLatLng().lat() + this.y);

        return coords;
    },

    /**
     * Draws the area without the markers (read only)
     */
    visualize: function(areaCoords){

      var coords = areaCoords;
      coords.rightBottom.x = coords.leftBottom.x + (coords.rightTop.x - coords.leftBottom.x);
      coords.rightBottom.y = coords.rightTop.y - (coords.rightTop.y - coords.leftBottom.y);
      coords.leftTop.x = coords.leftBottom.x;
      coords.leftTop.y = coords.rightTop.y;

      var polygon = new GPolygon([
      new GLatLng(coords.leftBottom.y, coords.leftBottom.x),
      new GLatLng(coords.leftTop.y, coords.leftTop.x),
      new GLatLng(coords.rightTop.y, coords.rightTop.x),
      new GLatLng(coords.rightBottom.y, coords.rightBottom.x),
      new GLatLng(coords.leftBottom.y, coords.leftBottom.x)],
      "#176E7F", 2, 1, "#5FE4FF", 0.4);
      
      // Adds the area until the map is loaded
      t = setTimeout(function(){
          try{
            map.addOverlay(polygon);
            clearTimeout(t);
          } catch(e){}
      }, 1000);
    }
};

//myArea = new Area();
//myArea.init();