// JScript File to handle user interaction trougth the browser

//create a browser object to ID the current browser;
//create a dragobject for later
var browser = new Browser();
var dragObj = new Object();
dragObj.zIndex = 0;

//javascript class to emcapsulate the div tag and talk to the mapservise for data
function msMap(DivTag, ControlType)
{
    if ( ControlType == null ) { ControlType = 'standard'; }
        
    // Private variables
    var i        = this;
    var mapser;
    var _tagMain = DivTag;
    var _map_w   = parseInt( _tagMain.style.width );
    var _map_h   = parseInt( _tagMain.style.height );
    var _map_w_bord = 0; var _map_h_bord = 0;

    //start in pan mode
    var _action  = 'pan';			// pan, zoom, none
    var _control = ControlType;
    var _mode    = 'map';
    var _attachedMsMap = null; var _referenceMap  = null;
    var _report = null;

    var _zoombox_x_first; var _zoombox_y_first;
    var _zoombox_x_last;  var _zoombox_y_last;

    //start all the div that we'll use later
    var _tagMap       = document.createElement('img');
    var _tagZoombox   = document.createElement('div');
    var _tagToolbar   = document.createElement('div');
    var _tagReference = document.createElement('div');
    var _tagLoading   = document.createElement('img');
    var _tagOverlay   = document.createElement('div'); // Overlay Layer holds tag points and taginfo underneath
    var _tagPoints    = document.createElement('div'); // For overlaying google map type of points
    var _tagInfo      = document.createElement('div'); // info ballon
    
    
    // Disable text/images selection.
    if ( browser.isIE )
    {
      _tagMain.onselectstart = function(){return false;};
      _tagMain.ondrag = function(){return false;};
    } 
    else
    { _tagMain.style.setProperty("-moz-user-select", "none", ""); }

    var _Xselect; var _Yselect;

    // Array to store overlay Points
    var _pointsOverlayArray = new Array();

    // Toolbar Default Icons...
    var localpath = 'App_Themes/Standard/MapControls/btns/';
    var _iconFullExtentButton = localpath + 'button_fullExtent.png';
    var _iconZoomboxButton    = localpath + 'button_zoombox.png';
    var _iconPanButton        = localpath + 'button_pan.png';
    var _iconZoominButton     = localpath + 'button_zoomIn.png';
    var _iconZoomoutButton    = localpath + 'button_zoomOut.png';
    var _iconLoading          = localpath + 'button_loading.png';
    var _iconSelectButton     = localpath + 'button_info.png';
    var _toolbarArray = new Array();
    
    //Class methods         

    //Set Report (the name says it all)
    this.setReport = function(p)
    {
        if (_report != null)
        {
          _tagInfo.removeChild( _tagInfo.childNodes[0] );
          i.setReportNull();
        }
        _report = p;
    }
    
    //Return main div
    this.getMainTag = function() { return _tagMain; }
    
    //Return info tag
    this.getInfoTag = function() { return _tagInfo; }
    
    //Clear Report
    this.setReportNull = function() { delete _report; _report = null; }    
    
    //Set a pretty border around the map
    this.setBorder = function(p)
    {
        _map_w_bord = p;
        _map_h_bord = p;
        _tagMap.style.width  = (i.width()+_map_w_bord+_map_w_bord)+'px';
        _tagMap.style.height = (i.height()+_map_h_bord+_map_h_bord)+'px';
        _tagMap.style.top    = (- _map_w_bord) +'px';
        _tagMap.style.left   = (- _map_h_bord) +'px';
    }
    
    //generic method to add a btn to the _tagToolbar div
    this.addMapTool = function(p_title, p_function, p_icon, p_left, p_top)
    {
        var tool  = document.createElement('img');
        tool.oncontextmenu = function(){return false;};
        tool.onmousedown = function(){return false;};  // Disable drag'n drop
        
        //add event to the image click event        
        add_event(tool, 'click', p_function );
        setAlphaPNG(tool, p_icon);        
        tool.title = p_title;

        //make sure it stands in front on evrything else
        setZindex(tool, '200');
                
        tool.style.margin = '0'; tool.style.padding = '0';
        tool.style.position = 'absolute';
        tool.style.cursor = 'pointer';
        tool.style.display = 'none';
    
        _toolbarArray.push(tool);
        _tagToolbar.appendChild(tool);
        
        if (p_left != null) { setPos(tool, p_left, p_top) }
        
        return tool;
    }
    
    this.width      = function() { return _map_w; }
    this.height     = function() { return _map_h; }
    this.action     = function() { return _action; }
    this.control    = function() { return _control; }
        
    this.setMode    = function(p_mode) { _mode = p_mode; }
    this.setArgs    = function(p_args) { _args = p_args; }
    this.attachMap  = function(myMap) { _attachedMsMap = myMap; }
    this.setReferenceMap = function(myMap) { _referenceMap = myMap; }    
    
    //draw a box on the reference map to show view area
    this.setReferenceBox = function(p_Xmin, p_Xmax, p_Ymin, p_Ymax)
    {    
        Xmin = i.xReal2pixel(p_Xmin); Ymin = i.yReal2pixel(p_Ymin);
        Xmax = i.xReal2pixel(p_Xmax); Ymax = i.yReal2pixel(p_Ymax);

        _tagReference.style.left    = Xmin +'px';
        _tagReference.style.top     = Ymax +'px';
        _tagReference.style.width   = Xmax - Xmin +'px';
        _tagReference.style.height  = Ymin - Ymax +'px';
        _tagReference.style.display = '';
    }               
    
    //method used to store the first click with zoom box
    this.setZoomboxFirst = function(x, y)
    {
        _zoombox_x_first = x - DL_GetElementLeft(_tagMain);
        _zoombox_x_last  = _zoombox_x_first;
        _zoombox_y_first = y - DL_GetElementTop(_tagMain);
        _zoombox_y_last  = _zoombox_y_first;
    }

    //method used to draw zoom box as user draws
    this.setZoomboxWH = function(x, y)
    {
        _zoombox_x_last = x - DL_GetElementLeft(_tagMain);
        _zoombox_y_last = y - DL_GetElementTop(_tagMain);
        _tagZoombox.style.left   =  min(_zoombox_x_first, _zoombox_x_last) + 'px';
        _tagZoombox.style.top    =  min(_zoombox_y_first, _zoombox_y_last) + 'px';
        _tagZoombox.style.width  =  max(_zoombox_x_last,  _zoombox_x_first) -
                                    min(_zoombox_x_last,  _zoombox_x_first) + 'px';
        _tagZoombox.style.height =  max(_zoombox_y_last,  _zoombox_y_first) -
                                    min(_zoombox_y_last,  _zoombox_y_first) + 'px';
        _tagZoombox.style.display = '';
    }
    
    //aplyes the zoom from a zoom box to the map
    this.zoomboxExtent = function()
    {
        _tagZoombox.style.display = 'none';      
        
        if ( i.action() == 'zoom') 
        {
            MapService.ZoomBox ( _zoombox_x_first, _zoombox_x_last,  
                                 _zoombox_y_first, _zoombox_y_last,
                                 i.OnConplete);     
        }           
        else if (i.action() == 'select')
        {
            MapService.QueryArea ( _zoombox_x_first, _zoombox_x_last,  
                                   _zoombox_y_first, _zoombox_y_last,
                                   i.OnConpleteTable);               
        }
    }    
    
    this.setPan = function(x, y)
    {
       MapService.SetPan (x, y, i.OnConplete );
    }
    
    this.redraw = function(redrawAttached)
    {
        _tagLoading.style.display = '';  // Show "loading" image        
        
//        if (i.mapser.imageurl == '')
//        {
//            _tagLoading.style.display = 'none';
//        }
//        else 
//        {          
            _tagMap.src = i.mapser.imageurl;
//        }
        
        //the onload method of the ima will put the loading image back to inviseble mode.

//        if ( _referenceMap != null )	// Draw zoom box in the reference map
//        {
//            _referenceMap.setReferenceBox(_ext_Xmin, _ext_Xmax, _ext_Ymin, _ext_Ymax);
//        }
    }  
        
    //sets map into Zoom mode
    this.setActionZoombox = function()
    { _action = 'zoom'; _tagMap.style.cursor = "crosshair"; }

    //sets map into pan mode
    this.setActionPan = function()
    { _action = 'pan'; _tagMap.style.cursor = "move"; }

    //select mode
    this.setActionSelect = function()
    { _action = 'select'; _tagMap.style.cursor = "pointer"; }

    //stops user from interacting with map
    this.setActionNone = function()
    {
        _action = 'none'; _tagToolbar.style.display = 'none';
        _tagMap.style.cursor = "";
    }    
    
    //map loaded event (hides loading image and other stuff)
    this.mapLoaded = function()
    {
        _tagOverlay.style.left = '0'; _tagOverlay.style.top  = '0';
    
        for(var j=0; j<_pointsOverlayArray.length; j++)
        { 
            _pointsOverlayArray[j].redraw(); 
        }
        
        if ( _report != null ) { _report.redraw(); }

        _tagMap.style.left = (- _map_w_bord) +'px';
        _tagMap.style.top  = (- _map_h_bord) +'px';
        _tagMap.style.display = '';

        // Hide "loading" image when map is loaded
        _tagLoading.style.display = 'none';
    }    

    //functions that comunicate with map obj
    this.fullExtent = function() 
    {   
        MapService.FullExtent(i.OnConplete); 
    }
    
    this.setActionZoomIn = function()
    {
        if ( isNaN(_tagLoading.style.display) )
        { 
            MapService.Zoom(1.40,i.OnConplete ); 
        }
    }
    
    
    this.setActionZoomOut = function()
    {
        if ( isNaN(_tagLoading.style.display) )
        { 
            MapService.Zoom(0.30,i.OnConplete ); 
        }
    }
    
    this.UpdateMap = function()
    {
        ///alert ("finalmente");
        
        if ( isNaN(_tagLoading.style.display) )
        { 
            MapService.GetMS(i.OnConplete ); 
        }
    }
    
    this.OnConplete = function(result)
    {
        i.mapser = result;
        i.redraw();        
    }
    
    this.OnConpleteTable = function(result)
    {
        ShownInfo();        
    }
    
    
    //big big method to initialize the map
    this.init = function()
    { 
        i.boot();        
//        MapService.GetMS(i.newMapObj); 
    }
    
    this.newMapObj= function (result)
    {  
        //alert ("cheguei");         
        i.mapser = result;                                
        i.boot();    
    }
        
    this.boot = function(){     
                  
        //boot main window
        _tagMain.oncontextmenu  = function(){return false;};
        _tagMain.style.border   = '1px solid #7ea3bf';
        _tagMain.style.width    = i.width()+'px';
        _tagMain.style.height   = i.height()+'px';
        _tagMain.style.overflow = 'hidden';
        _tagMain.style.position = 'relative';

        //Anchor div
        var myDiv_1           = document.createElement('div');
        myDiv_1.oncontextmenu = function(){return false;};        
        add_event(myDiv_1, 'mousedown', function(event){ChiamaEvento(event);});        
        setZindex(myDiv_1, '0');        
        myDiv_1.style.position = 'absolute';
        myDiv_1.left           = '0';
        myDiv_1.top            = '0';
        //_tag map is the image with the map
        _tagMap.objRef = i;
        _tagMap.oncontextmenu   = function(){return false;};
        _tagMap.onmousedown     = function(){return false;};  // Disable drag'n drop
        //add method to load event (clear load sign etc)
        add_event(_tagMap, 'load', i.mapLoaded );
        setZindex(_tagMap, '0');
        _tagMap.galleryImg = "no";
        _tagMap.style.width    = (i.width()+_map_w_bord+_map_w_bord)+'px';
        _tagMap.style.height   = (i.height()+_map_h_bord+_map_h_bord)+'px';        
        _tagMap.style.border   = '0 none';
        _tagMap.style.margin   = '0'; _tagMap.style.padding  = '0';
        _tagMap.style.position = 'absolute';
        _tagMap.style.top      = (- _map_w_bord) +'px';
        _tagMap.style.left     = (- _map_h_bord) +'px';
        _tagMap.style.display  = 'none';
                
        //Reference Map
        _tagReference.oncontextmenu    = function(){return false;};
        setZindex(_tagReference, '100');
        _tagReference.style.display    = 'none';
        _tagReference.style.position   = 'absolute';
        _tagReference.style.margin     = '0'; _tagReference.style.padding    = '0';
        _tagReference.style.lineHeight = '0';
        _tagReference.style.border     = '1px solid #000000';
        _tagReference.style.background = '#a0a0a0';
        _tagReference.style.opacity    = '0.21';               // Gecko
        _tagReference.style.filter     = 'alpha(opacity=21)';  // Windows
        
        //zoom box div (the box the user draws while zooming)
        _tagZoombox.oncontextmenu    = function(){return false;};
        setZindex(_tagZoombox, '100');
        _tagZoombox.style.position   = 'absolute';
        _tagZoombox.style.display    = 'none';
        _tagZoombox.style.border     = '1px dashed #000000';
        _tagZoombox.style.margin     = '0px'; _tagZoombox.style.padding    = '0px';
        _tagZoombox.style.lineHeight = '0';
        _tagZoombox.style.background = '#606060';	         //'#f0f0f0';
        _tagZoombox.style.opacity    = '0.2';                // Gecko
        _tagZoombox.style.filter     = 'alpha(opacity=20)';  // Windows

        // Overlay Layer (still dont know what it's for)
        _tagOverlay.oncontextmenu    = function(){return false;};
        setZindex(_tagOverlay, '30');
        _tagOverlay.style.position   = 'absolute';
        
        //popup?
        _tagPoints.oncontextmenu    = function(){return false;};
        setZindex(_tagPoints, '40');
        _tagPoints.style.position   = 'absolute';
        
        //??
        _tagInfo.oncontextmenu   = function(){return false;};
        setZindex(_tagInfo, '50');
        _tagInfo.style.position  = 'absolute';

        //"Loading" image tag
        _tagLoading.oncontextmenu    = function(){return false;};
        _tagLoading.onmousedown = function(){return false;};  // Disable drag'n drop
        setZindex(_tagLoading, '100');
        _tagLoading.style.position   = 'absolute';
        _tagLoading.style.display    = 'none';
        _tagLoading.style.border     = '0';
        _tagLoading.style.margin     = '0'; _tagLoading.style.padding    = '0';
        _tagLoading.style.lineHeight = '0';
        setAlphaPNG(_tagLoading, _iconLoading);
        _tagLoading.style.left = (_map_w - 130) / 2 + 'px';
        _tagLoading.style.top  = (_map_h - 122) / 2 + 'px';

// ---> ToolBar ---------------------------------------------------------------
               
        //tool bar tag
        _tagToolbar.oncontextmenu  = function(){return false;};
        _tagToolbar.style.position = 'absolute';
        _tagToolbar.style.left     = '0'; _tagToolbar.style.top = '0';
                  
        //add commands to tool bar (Zoom etc)
        var my_img_fullext = i.addMapTool('Full Extent' , i.fullExtent,         _iconFullExtentButton);
        var my_img_zoom    = i.addMapTool('Zoom'        , i.setActionZoombox,   _iconZoomboxButton   );
        var my_img_pan     = i.addMapTool('Pan'         , i.setActionPan,       _iconPanButton       );
        var my_img_zoomin  = i.addMapTool('Zoom In'     , i.setActionZoomIn,    _iconZoominButton    );
        var my_img_zoomout = i.addMapTool('Zoom Out'    , i.setActionZoomOut,   _iconZoomoutButton   );
        var my_img_info    = i.addMapTool('Info'        , i.setActionSelect,    _iconSelectButton    );    
        
        //possible positions for the Controll (left rigth etc)
        if ( ( _control == 'standard' )      ||
            ( _control == 'standardRight' )  )
        {
            var l = i.width()-38;
            setPos(my_img_fullext, l, 1);
            setPos(my_img_zoom,    l, 39);
            setPos(my_img_pan,     l, 77);
            setPos(my_img_zoomin,  l, 115);
            setPos(my_img_zoomout, l, 153);
            setPos(my_img_info,    l, 191);
        }

        if ( _control == 'standardLeft' )
        {
          var l = 1;
          setPos(my_img_fullext, l, 1);
          setPos(my_img_zoom,    l, 39);
          setPos(my_img_pan,     l, 77);
          setPos(my_img_zoomin,  l, 115);
          setPos(my_img_zoomout, l, 153);
          setPos(my_img_info,    l, 191);
        }

        if ( _control == 'standardUp' )
        {
          var l = 1;
          setPos(my_img_fullext, 1,   l);
          setPos(my_img_zoom,    39,  l);
          setPos(my_img_pan,     77,  l);
          setPos(my_img_zoomin,  115, l);
          setPos(my_img_zoomout, 153, l);
          setPos(my_img_info,    191, l);
        }

        if ( _control == 'standardCornerLeft' )
        {
            var l = 1;
            setPos(my_img_fullext, 1,  l);
            setPos(my_img_zoom,    39, l);
            setPos(my_img_pan,     77, l);
            setPos(my_img_zoomin,  1,  39);
            setPos(my_img_zoomout, 1,  77);
            setPos(my_img_info,    1, 115);  
        }

        if ( _control == 'standardCornerRight' )
        {
          var l = i.width()-38;
          setPos(my_img_fullext, l,     1);
          setPos(my_img_zoom,    l-38,  1);
          setPos(my_img_pan,     l-76,  1);
          setPos(my_img_zoomin,  l,    39);
          setPos(my_img_zoomout, l,    77);
          setPos(my_img_info,    l,   115);
        }
// <--- ToolBar ---------------------------------------------------------------

        // create link in lower left corner
        var myLink              = document.createElement('a');
        var ref                 = 'http://www.mohid.com';
        
        if (myLink.setAttribute)
        { myLink.setAttribute('href', ref); } 
        else
        { myLink.href = ref }
        
        myLink.oncontextmenu    = function(){return false;};
        setZindex(myLink, '110');
        myLink.style.position   = 'absolute';
        myLink.style.fontFamily = 'Verdana, Arial, Helvetica, sans-serif';
        myLink.style.fontSize   = '11px';
        myLink.style.left       = '2px';
        myLink.style.top        = i.height()-13+'px';
        myLink.appendChild(document.createTextNode("Maretec"));

        //put map image under a fixed div
        myDiv_1.appendChild(_tagMap);
        
        //put poits and info under the overlay div
        _tagOverlay.appendChild(_tagPoints);
        _tagOverlay.appendChild(_tagInfo);
        
        //append all divs to the main div suplied by user (map on bottom loading on top)
        _tagMain.appendChild(myDiv_1);
        _tagMain.appendChild(_tagOverlay);
        _tagMain.appendChild(_tagZoombox);
        _tagMain.appendChild(_tagReference);
        _tagMain.appendChild(myLink);
        _tagMain.appendChild(_tagToolbar);
        _tagMain.appendChild(_tagLoading);
        
        //set initial action
        if ( i.action() == 'zoom' ) { _tagMap.style.cursor = "crosshair"; }
        if ( i.action() == 'pan' ) { _tagMap.style.cursor = "move"; }
    }
    
    //evet trigered when user starts dragging the mouse (with mouse down)
    this.dragStart = function(event)
    {
        var el;
        var x, y;

        dragObj.elNode = _tagMap;

        // Get cursor position with respect to the page.
        if ( browser.isNS )
        {
            x = event.clientX + window.scrollX;
            y = event.clientY + window.scrollY;
        } 
        else
        {
            x = window.event.clientX + document.documentElement.scrollLeft
            + document.body.scrollLeft;
            y = window.event.clientY + document.documentElement.scrollTop
            + document.body.scrollTop;
        }

        // Save starting positions of cursor and element.
        dragObj.cursorStartX = x; 
        dragObj.cursorStartY = y;
        dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
        dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);

        if (isNaN(dragObj.elStartLeft))  dragObj.elStartLeft = 0;
        if (isNaN(dragObj.elStartTop ))  dragObj.elStartTop  = 0;
        
        if ( isNaN(_tagLoading.style.display) )
        {
            //add events to mouse move and mouse up
            if (browser.isNS)
            {
                document.addEventListener("mousemove", i.dragGo,   true);
                document.addEventListener("mouseup",   i.dragStop, true);
                event.preventDefault();
            } 
            else
            {
                document.attachEvent("onmousemove", i.dragGo);
                document.attachEvent("onmouseup",   i.dragStop);
                window.event.cancelBubble = true;
                window.event.returnValue = false;
            }
            //if we need to draw 
            if ( i.action() == 'zoom' ||  i.action() == 'select') { i.setZoomboxFirst(x, y); }
        }
    }
    
    //event used for when user drags the mouse
    this.dragGo = function(event)
    {
        var x, y;

    // Get cursor position with respect to the page.
        if (browser.isNS)
        {
            x = event.clientX + window.scrollX;
            y = event.clientY + window.scrollY;
        } 
        else
        {
            x = window.event.clientX + document.documentElement.scrollLeft
              + document.body.scrollLeft;
            y = window.event.clientY + document.documentElement.scrollTop
              + document.body.scrollTop;
        }

        if ( i.action() == 'pan' )
        {
            // Move map by the same amount the cursor has moved.
            dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
            dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";

            // Move Overlay layer( layer with google map style points)
            _tagOverlay.style.left = parseInt(dragObj.elNode.style.left) +_map_w_bord +'px';
            _tagOverlay.style.top  = parseInt(dragObj.elNode.style.top)  +_map_h_bord +'px';
        }

        if ( i.action() == 'zoom' || i.action() == 'select' ) { i.setZoomboxWH(x, y); }

        if (browser.isNS)
        { event.preventDefault(); } 
        else
        {
            window.event.cancelBubble = true;
            window.event.returnValue = false;
        }
    }
    
    //event when user stops dragging (mouse up)
    this.dragStop = function(event)
    {    
        // Stop capturing mousemove and mouseup events.
        if (browser.isNS)
        {
            document.removeEventListener("mousemove", i.dragGo,   true);
            document.removeEventListener("mouseup",   i.dragStop, true);
        } 
        else
        {
            document.detachEvent("onmousemove", i.dragGo);
            document.detachEvent("onmouseup",   i.dragStop);
        }

        var x, y, xx, yy;        
        if (browser.isNS)
        {
            x = event.clientX + window.scrollX;
            y = event.clientY + window.scrollY;
        } 
        else
        {
            x = window.event.clientX + document.documentElement.scrollLeft
            + document.body.scrollLeft;
            y = window.event.clientY + document.documentElement.scrollTop
            + document.body.scrollTop;
        }
    
        // Move drag element by the same amount the cursor has moved.
        xx = (dragObj.elStartLeft + x - dragObj.cursorStartX);
        yy = (dragObj.elStartTop  + y - dragObj.cursorStartY);

        // Add buffer size
        xx += _map_w_bord;
        yy += _map_h_bord;

        if ( i.action() == 'pan' ) { i.setPan(xx, yy); }
        if ( i.action() == 'zoom' || i.action() == 'select' ) { i.zoomboxExtent(); }
        
//        if ( i.action() == 'select' )
//        {
//          _Xselect = x - DL_GetElementLeft(_tagMap);  //xxx
//          _Yselect = y - DL_GetElementTop(_tagMap);   //xxx
//          i.redraw();
//        }
    }
    
    //must replace with
    this.loadPointsOverlay = function(p_name, p_icon, p_mapfile)
    {
        http_request = false;
        if (window.XMLHttpRequest) // Mozilla, Safari,...
        {
            http_request = new XMLHttpRequest();
            
            if (http_request.overrideMimeType)
            {
                http_request.overrideMimeType('text/xml');
                // See note below about this line
            }
        } 
        else if (window.ActiveXObject) // IE
        {
            try
            {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } 
            catch (e)
            {
                try
                {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } 
                catch (e) {}
            }
        }
        
        if (!http_request)
        {
            alert('Giving up :( Cannot create an XMLHTTP instance');
            return false;
        }
        
        http_request.onreadystatechange = function()
        {
            if (http_request.readyState == 4)
            {
                if (http_request.status == 200)
                {
                    var xml = http_request.responseXML;
                    var mydata = parsePointsFromGML(xml);
                    i.setOverlayPoints(mydata, p_icon);
                } 
                else
                { 
                    alert('There was a problem with the request.'); 
                }
            }
        }
    
        if ( p_mapfile == null ) { p_mapfile = _map_file }
    
        var url = _cgi +'?map='+ p_mapfile +
              '&SERVICE=WFS&VERSION=1.0.0&REQUEST=getfeature&TYPENAME='+
               p_name;
        
        http_request.open('GET', url, true);
        http_request.send(null);
    }
    
    //Overlay points
    this.setOverlayPoints = function(p, p_icon)
    {
        for(var j=0; j<p[0].length; j++)
        {
            var myPoint = new pointOverlay( p_icon, p[0][j], p[1][j], p[2][j], p[3][j] );
            myPoint.setMap(i);
            _pointsOverlayArray.push( myPoint );
        }

        // Z sorting array...
        _pointsOverlayArray.sort(
            function(a,b){if (a.getY()>b.getY()){return -1;}else{return 1;}}
            );

        for(var j=0; j<_pointsOverlayArray.length; j++)
        { 
            _tagPoints.appendChild( _pointsOverlayArray[j].getShd() ); 
        }
        
        //have no idea what is done here
        for(var j=0; j<_pointsOverlayArray.length; j++)
        { 
            _tagPoints.appendChild( _pointsOverlayArray[j].getImg() ); 
        }

        // Redraw...
        for(var j=0; j<_pointsOverlayArray.length; j++)
        { 
            _pointsOverlayArray[j].redraw(); 
        }
    }   
    
    //boot on initialization        
    i.init();
}


//------------------Region for aux functions-----------------------

// Determining Element Page Coordinates, Part 4:
// http://www.webreference.com/dhtml/diner/realpos4/9.html
function DL_GetElementLeft(eElement)
{
    if (!eElement && this)                              // if argument is invalid
    {                                                   // (not specified, is null or is 0)
        eElement = this;                                // and function is a method
    }                                                   // identify the element as the method owner

    var DL_bIE = document.all ? true : false;           // initialize var to identify IE

    var nLeftPos = eElement.offsetLeft;                 // initialize var to store calculations
    var eParElement = eElement.offsetParent;            // identify first offset parent element

    while (eParElement != null)
    {                                                   // move up through element hierarchy
        if(DL_bIE)                                      // if browser is IE, then...
        {
            if( (eParElement.tagName != "TABLE") && (eParElement.tagName != "BODY") )
            {                                           // if parent is not a table or the body, then...
                nLeftPos += eParElement.clientLeft;     // append cell border width to calcs
            }
        }
        else                                            // if browser is Gecko, then...
        {
            if(eParElement.tagName == "TABLE")          // if parent is a table, then...
            {                                           // get its border as a number
                var nParBorder = parseInt(eParElement.border);
                if(isNaN(nParBorder))                   // if no valid border attribute, then...
                {                                       // check the table's frame attribute
                    var nParFrame = eParElement.getAttribute('frame');
                    if(nParFrame != null)               // if frame has ANY value, then...
                    {
                        nLeftPos += 1;                  // append one pixel to counter
                    }
                }
                else if(nParBorder > 0)                 // if a border width is specified, then...
                {
                    nLeftPos += nParBorder;             // append the border width to counter
                }
            }            
            // sm 20051010
            if(eParElement.tagName == "DIV")
            {
                var bord = parseInt(eParElement.style.border);
                if ( bord > 0 ) { nLeftPos += bord; }
            }
        }
        
        nLeftPos += eParElement.offsetLeft;             // append left offset of parent
        eParElement = eParElement.offsetParent;         // and move up the element hierarchy
    }                                                   // until no more offset parents exist
    
    return nLeftPos;                                    // return the number calculated
}


//same stuff but for top
function DL_GetElementTop(eElement)
{
    if (!eElement && this)                          // if argument is invalid
    {                                               // (not specified, is null or is 0)
        eElement = this;                            // and function is a method
    }                                               // identify the element as the method owner

    var DL_bIE = document.all ? true : false;       // initialize var to identify IE

    var nTopPos = eElement.offsetTop;               // initialize var to store calculations
    var eParElement = eElement.offsetParent;        // identify first offset parent element

    while (eParElement != null)
    {                                               // move up through element hierarchy
        if(DL_bIE)                                  // if browser is IE, then...
        {
            if( (eParElement.tagName != "TABLE") && (eParElement.tagName != "BODY") )
            {                                       // if parent a table cell, then...
                nTopPos += eParElement.clientTop;   // append cell border width to calcs
            }
        }
        else                                        // if browser is Gecko, then...
        {
            if(eParElement.tagName == "TABLE")      // if parent is a table, then...
            {                                       // get its border as a number
                var nParBorder = parseInt(eParElement.border);
                
                if(isNaN(nParBorder))               // if no valid border attribute, then...
                {                                   // check the table's frame attribute
                    var nParFrame = eParElement.getAttribute('frame');
                    if(nParFrame != null)           // if frame has ANY value, then...
                    {
                        nTopPos += 1;               // append one pixel to counter
                    }
                }
                else if(nParBorder > 0)             // if a border width is specified, then...
                {
                    nTopPos += nParBorder;          // append the border width to counter
                }
            }
            // sm 20051010
            if(eParElement.tagName == "DIV")
            {
                var bord = parseInt(eParElement.style.border);
                if ( bord > 0 ) { nTopPos += bord; }
            }
        }
        nTopPos += eParElement.offsetTop;           // append top offset of parent
        eParElement = eParElement.offsetParent;     // and move up the element hierarchy
    }                                               // until no more offset parents exist
    return nTopPos;                                 // return the number calculated
}

function onComplete(result)
{
    return result;
}

// Aux function to determine browser and version.
function Browser()
{
    var ua, s, i;

    this.isIE    = false;
    this.isNS    = false;
    this.isOP    = false;
    this.name    = navigator.appName;
    this.version = null;

    ua = navigator.userAgent;
    //alert(navigator.vendor);

    // Firefox:
    // Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.10) Gecko/20050716 Firefox/1.0.6

    // Explorer:
    // Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1)

    // Opera:
    // Mozilla/4.0 (compatibile; MSIE 6.0; Windows NT 5.1; en) Opera 8.50

    if ((navigator.userAgent).indexOf("Opera")!=-1)
    {
        this.isOP = true;
    } else
    if (navigator.appName=="Netscape")
    {
        this.isNS = true;
    } else
    if ( (navigator.appName).indexOf("Microsoft") != -1 )
    {
        this.isIE = true;
    }
    return;
}

//min max functions
function min(a, b) { if ( a < b ) { return a; } else { return b; } }
function max(a, b) { if ( a > b ) { return a; } else { return b; } }

//function to attach event handlers
function add_event(obj, event_id, func)
{
    
    if (obj.addEventListener)
    {                
        obj.addEventListener( event_id, func, false );
    } 
    else if(obj.attachEvent)
    {    
        event_id = 'on'+event_id;
        obj.attachEvent( event_id, func )
    } 
    else
    { obj[event_id] = func; }
    
}

//function to set index of div css
function setZindex(p_tag, p)
{
    if (p_tag.setAttribute)
    { p_tag.setAttribute('style', 'z-index:'+p+';'); } 
    else
    { p_tag.style.zIndex = p; }
}

// attach dragstart event
function ChiamaEvento(e)
{
    var i;
    if (e.srcElement) {i = e.srcElement.objRef}
    if (e.target)     {i = e.target.objRef}
    i.dragStart(e);
}

//set position of div tags
function setPos(p_obj, p_x, p_y)
{
  p_obj.style.left    = p_x+'px';
  p_obj.style.top     = p_y+'px';
  p_obj.style.display = '';
}

//create cool transparency effects
function setAlphaPNG( p_imgTag, p_src )
{
    if ( browser.isIE )
    {
        p_imgTag.src = 'App_Themes/Standard/MapControls/pixel.gif';
        p_imgTag.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader"+
                                "(src='"+p_src+"',sizingMethod='image')";      
    } 
    else
    {
        p_imgTag.src = p_src;
    }
}

//calss representing a point overlay (including values stored)
function pointOverlay( p_icon, p_x, p_y, p_item_name, p_item_value )
{
    var _msMap = null;
    var _img   = null;	            //Point image
    var _shd   = null;	            //shadow like in Gmaps
    var _x     = parseFloat(p_x);	// Real coord X
    var _y     = parseFloat(p_y);	// Real coord Y
    var _icon  = p_icon;
    var _item_name  = p_item_name; 
    var _item_value = p_item_value;
    var _offsetX = 0;  
    var _offsetY = 0;

    //Various get methods
    this.setMap = function(m) { _msMap = m; }
    this.getMap = function()  { return _msMap; }
    this.getImg = function()  { return _img; }
    this.getShd = function()  { return _shd; }
    this.getX   = function()  { return _x; }
    this.getY   = function()  { return _y; }
    
    //function that returns a table with name /values
    this.getHtmlAttributes = function()
    {
        var ret = "<table>";
        for (var j=0; j<_item_name.length; j++)
        {
            ret += "<tr><td>"+ _item_name[j] +
                   "</td><td style='padding-left: 8px;'><B>"+ _item_value[j] +"</B></td></tr>";
        }
        ret += "</table>";
        return ret;
    }
  
    this.getInfoX = function() { return _msMap.xReal2pixel(_x); }
    this.getInfoY = function() { return Math.round(_msMap.yReal2pixel(_y) - (parseInt(_img.offsetHeight)/2) ); }
    
    //function to draw point
    this.redraw = function()
    {
        // se e` visibile (coordinate del punto interne al box della mappa)...
        if ( _msMap.isPointInMap( _x - _msMap.wPixel2real(_offsetX),
                              _y + _msMap.hPixel2real(_offsetY),
                              _msMap.wPixel2real(_offsetX),
                              _msMap.hPixel2real(_offsetY) ) )
        {
            //set position of main image
            setPos(_img, _msMap.xReal2pixel(_x) - _offsetX,
                         _msMap.yReal2pixel(_y) - _offsetY);
            //set position of secondary image
            setPos(_shd, _msMap.xReal2pixel(_x) - _offsetX,
                   _msMap.yReal2pixel(_y) - _offsetY);
        } 
        else //hide away
        { this.setVisible(false); }
    }

    
    //change visibility status of point display
    this.setVisible = function(p_bool)
    {
        var str = null;
        if (p_bool) {str = '';} else {str = 'none';}
        _img.style.display = str;
        _shd.style.display = str;
    }

    this.getWidth  = function() { return parseInt(_img.style.width); }
    this.getHeight = function() { return parseInt(_img.style.height); }
    
    //show report
    this.showReport = function()
    {
        var pnt = new msReport(this, 'Info');
        _msMap.setReport(pnt);
    }

    // Initialization...
    _img = _icon.getImage(); _shd = _icon.getShadow();
    _offsetX = _icon.getShiftX() -1;
    _offsetY = _icon.getShiftY() -1;
    
    //  show tag on mouseover????????
    //  if (p_title != null) { _img.title = p_title; }
    
    _img.objRef = this;

    add_event(_img, 'click', function(event){pointOverlayEvent(event);} );
}

// pointOverlay Click Event
function pointOverlayEvent(e)
{
    var p;
    if (e.srcElement) { p = e.srcElement.objRef; }
    if (e.target)     { p = e.target.objRef; }
    //pnt = new msReport(p);
    p.showReport();
}


// msIcon class
function msIcon( p_img, p_shd, p_offsetX, p_offsetY )
{
    var _img_name = p_img;
    var _shd_name = p_shd;
    var _offsetX = 1;	// Distanza del target dall'angolo
    var _offsetY = 1;	// alto-sinistra.

    if ( p_offsetX != null ) { _offsetX = p_offsetX; }
    if ( p_offsetY != null ) { _offsetY = p_offsetY; }

    if ( p_img == null )
    {
        _img_name = 'http://datacrossing.crs4.it/img/mm_20_red.png';
        _shd_name = 'http://datacrossing.crs4.it/img/mm_20_shadow.png';
        _offsetX  = 6; _offsetY = 19;
    }

    this.getShiftX = function() { return _offsetX; }
    this.getShiftY = function() { return _offsetY; }
    
    //return image
    this.getImage = function()
    {
        var tmp = document.createElement('img');
        tmp.oncontextmenu  = function(){return false;};
        tmp.onmousedown = function(){return false;};  // Disable drag'n drop
        setZindex(tmp, '110');
        tmp.style.position = 'absolute';
        tmp.style.cursor   = 'pointer';
        setAlphaPNG(tmp, _img_name);
        return tmp;
    }
  
    //return shadow
    this.getShadow = function()
    {
        var tmp = document.createElement('img');
        tmp.oncontextmenu  = function(){return false;};
        tmp.onmousedown = function(){return false;};
        setZindex(tmp, '109');
        tmp.style.position = 'absolute';
        setAlphaPNG(tmp, _shd_name);
        return tmp;
    }
}

//report class encapsulated the pretty ballon shown
//when the user clicks an icon
function msReport( p_pnt, p_title )
{
    var _pointOverlay = p_pnt;
    var d = document.createElement('div'); 
    p_pnt.getMap().getInfoTag().appendChild(d);
    var _content = document.createElement('div');
    var _scrollX = 16;  // ??????
    var _scrollY = 0;
    var _title = p_title;
    var j = this;

    // Set _content style
    _content.style.paddingTop = '6px';
    _content.style.fontSize = '80%';
    
    //redraw function 
    this.redraw = function()
    {
        var h    = parseInt(d.offsetHeight);
        var os_x = _scrollX;
        var os_y = _scrollY +h;

        d.style.left = p_pnt.getInfoX() -os_x +'px';
        d.style.top  = p_pnt.getInfoY() -os_y +'px';
    }

  // close window
    this.close = function()
    {
        //d.removeChild( d.childNodes[0] );
        var taginfo = p_pnt.getMap().getInfoTag();
        taginfo.removeChild( taginfo.childNodes[0] );
        p_pnt.getMap().setReportNull();
        delete j;
    }

    // fill with html
    this.setContent = function(p_html) { _content.innerHTML = p_html; }

    //boot method
    this.init = function()
    {
        // Main DIV container
        d.oncontextmenu  = function(){return false;};
        d.style.position = 'absolute';

        // External table (borders)
        var t_b  = document.createElement('table');
        t_b.cellSpacing = '0'; t_b.cellPadding = '0';
        var tb_b = document.createElement('tbody'); t_b.appendChild(tb_b);
        var tr_a = document.createElement('tr'); tb_b.appendChild(tr_a);
        var tr_w = document.createElement('tr'); tb_b.appendChild(tr_w);
        var tr_b = document.createElement('tr'); tb_b.appendChild(tr_b);
        var tr_c = document.createElement('tr'); tb_b.appendChild(tr_c);
        var tr_d = document.createElement('tr'); tb_b.appendChild(tr_d);

        var td_a1 = document.createElement('td'); tr_a.appendChild(td_a1);
        var td_a2 = document.createElement('td'); tr_a.appendChild(td_a2);
        var td_a3 = document.createElement('td'); tr_a.appendChild(td_a3);

        // Close button
        var td_w1 = document.createElement('td'); tr_w.appendChild(td_w1);
        var td_w2 = document.createElement('td'); tr_w.appendChild(td_w2);
        var td_w3 = document.createElement('td'); tr_w.appendChild(td_w3);

        var td_b1 = document.createElement('td'); tr_b.appendChild(td_b1);
        var td_b2 = document.createElement('td'); tr_b.appendChild(td_b2);
        var td_b3 = document.createElement('td'); tr_b.appendChild(td_b3);

        var td_c1 = document.createElement('td'); tr_c.appendChild(td_c1);
        var td_c2 = document.createElement('td'); tr_c.appendChild(td_c2);
        var td_c3 = document.createElement('td'); tr_c.appendChild(td_c3);

        var td_d1 = document.createElement('td'); tr_d.appendChild(td_d1);
        var td_d2 = document.createElement('td'); tr_d.appendChild(td_d2);
        var td_d3 = document.createElement('td'); tr_d.appendChild(td_d3);

        //put the pretty box around the div
        var ang_a = document.createElement('img'); setAlphaPNG(ang_a, '/img/angolo_a.png');
        ang_a.onmousedown = function(){return false;};
        var ang_b = document.createElement('img'); setAlphaPNG(ang_b, '/img/angolo_b.png');
        ang_b.onmousedown = function(){return false;};
        var ang_c = document.createElement('img'); setAlphaPNG(ang_c, '/img/angolo_c.png');
        ang_c.onmousedown = function(){return false;};
        var ang_d = document.createElement('img'); setAlphaPNG(ang_d, '/img/angolo_d.png');
        ang_d.onmousedown = function(){return false;};
        var arrow = document.createElement('img'); setAlphaPNG(arrow, '/img/report_arrow.png');
        arrow.onmousedown = function(){return false;};

        td_a1.appendChild(ang_a); td_a3.appendChild(ang_b);
        td_c1.appendChild(ang_d); td_c3.appendChild(ang_c);
        td_d2.appendChild(arrow);
        td_b2.appendChild(_content);

        setAlphaBackgroundPNG(td_b2, '/img/report_x.png');
        setAlphaBackgroundPNG(td_b1, '/img/report_l.png');
        setAlphaBackgroundPNG(td_b3, '/img/report_r.png');
        setAlphaBackgroundPNG(td_a2, '/img/report_t.png');
        setAlphaBackgroundPNG(td_c2, '/img/report_d.png');
        setAlphaBackgroundPNG(td_w1, '/img/report_l.png');
        setAlphaBackgroundPNG(td_w2, '/img/report_x.png');
        setAlphaBackgroundPNG(td_w3, '/img/report_r.png');

        var close = document.createElement('img'); setAlphaPNG(close, '/img/close.png');
        add_event(close, 'click', function(){ j.close(); } );

        // Info window Title
        var tt = document.createElement('table'); tt.style.width = "100%";
        var tt_b = document.createElement('tbody'); tt.appendChild(tt_b);
        var tt_tr = document.createElement('tr'); tt_b.appendChild(tt_tr);
        var tt_td1 = document.createElement('td'); tt_tr.appendChild(tt_td1);
        var tt_td2 = document.createElement('td'); tt_tr.appendChild(tt_td2);
        var title = document.createTextNode(_title);
        tt_td1.style.fontWeight = 'bold'; tt.cellSpacing = '0'; tt.cellPadding = '0';
        tt_td1.style.borderBottom = '1px dashed #d0d0d0';
        tt_td1.appendChild(title); tt_td2.appendChild(close);
        tt_td2.style.textAlign = 'right';
        td_w2.appendChild(tt);

        d.appendChild(t_b);

        // BUG Firefox 1.0.7 ??? ////////
        if (browser.isNS)
        {
            d.style.display = 'table';
        }
    }
    this.init();
    this.setContent( p_pnt.getHtmlAttributes() );
    this.redraw();
}

//glue img to background
function setAlphaBackgroundPNG( p_Tag, p_src )
{
    if ( browser.isIE )
    {
        p_Tag.style.backgroundImage = 'none';
        p_Tag.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader"+
                            "(src='"+p_src+"',sizingMethod='scale')";
    } 
    else
    {
        p_Tag.style.backgroundImage = "url('"+p_src+"')";
    }
}