// JScript File

/*
 * Opacity GControl by Klokan Petr Pridal (based on XSlider of Mike Williams)
 */
 

 
function OpacityControl( overlay ) {
  this.overlay = overlay;
}
OpacityControl.prototype = new GControl();

// This function positions the slider to match the specified opacity
OpacityControl.prototype.setSlider = function(pos) {
  var left = Math.round((58*pos));
  this.slide.left = left;
  this.knob.style.left = left+"px";
  this.knob.style.top = "0px"; // correction001
}

// This function reads the slider and sets the overlay opacity level
OpacityControl.prototype.setOpacity = function() {
  this.overlay.getTileLayer().opacity = this.slide.left/58;
  this.map.removeOverlay(this.overlay);
  this.map.addOverlay(this.overlay);
}

// This gets called by the API when addControl(new OpacityControl())
OpacityControl.prototype.initialize = function(map) {
  var that=this;
  this.map = map;

  // Is this MSIE, if so we need to use AlphaImageLoader
  var agent = navigator.userAgent.toLowerCase();
  if ((agent.indexOf("msie") > -1) && (agent.indexOf("opera") < 1)){this.ie = true} else {this.ie = false}

  // create the background graphic as a <div> containing an image
  var container = document.createElement("div");
  container.style.width="70px";
  container.style.height="21px";

  // Handle transparent PNG files in MSIE
  if (this.ie) {
    var loader = "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader("+
      "src='http://www.maptiler.org/img/opacity-slider.png', sizingMethod='crop');";
    container.innerHTML = "<div style='height:21px; width:70px;" +loader+ "' ></div>";
  } else {
    container.innerHTML = '<div style="height:21px; width:70px; background-image:url(http://www.maptiler.org/img/opacity-slider.png)" ></div>';
  }

  // create the knob as a GDraggableObject
  // Handle transparent PNG files in MSIE
  if (this.ie) {
    var loader = "progid:DXImageTransform.Microsoft.AlphaImageLoader("+
      "src='http://www.maptiler.org/img/opacity-slider.png', sizingMethod='crop');";
    this.knob = document.createElement("div");
    this.knob.style.height="21px";
    this.knob.style.width="13px";
    this.knob.style.overflow="hidden";
    this.knob_img = document.createElement("div");
    this.knob_img.style.height="21px";
    this.knob_img.style.width="83px";
    this.knob_img.style.filter=loader;
    this.knob_img.style.position="relative";
    this.knob_img.style.left="-70px";
    this.knob.appendChild(this.knob_img);
  } else {
    this.knob = document.createElement("div");
    this.knob.style.height="21px";
    this.knob.style.width="13px";
    this.knob.style.backgroundImage="url(http://www.maptiler.org/img/opacity-slider.png)";
    this.knob.style.backgroundPosition="-70px 0px";
  }
  container.appendChild(this.knob);
  this.slide=new GDraggableObject(this.knob, {container:container});
  this.slide.setDraggableCursor('pointer');
  this.slide.setDraggingCursor('pointer');
  this.container = container;

  // attach the control to the map
  map.getContainer().appendChild(container);

  // init slider
  this.setSlider( this.overlay.getTileLayer().opacity );

  // Listen for the slider being moved and set the opacity
  GEvent.addListener(this.slide, "dragend", function() {that.setOpacity()});
  //GEvent.addListener(this.container, "click", function( x, y ) { alert(x, y) });

  return container;
}

// Set the default position for the control
OpacityControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 47));
}

/*
 * End opacity control:
 */



//VARIABLES INICIALES	


//ARRAYS DE CAPAS-----------------------------------------------------------------------------START
	var layer4=[]; 
	var custommap4 = new GMapType(layer4, G_SATELLITE_MAP.getProjection(), "SERVIR", G_PHYSICAL_MAP);
//ARRAYS DE CAPAS-----------------------------------------------------------------------------END  
    var tile_lay_01;
    var overlay1;
    var tile_lay_02;
    var overlay2;
    var tile_lay_03;
    var overlay3;
    var tile_lay_04;
    var overlay4;
    var tile_lay_05;
    var overlay5;
    var tile_lay_06;
    var overlay6;
    var tile_lay_07;
    var overlay7;
    var tile_lay_08;
    var overlay8;
    var tile_lay_09;
    var overlay9;
    var tile_lay_10;
    var overlay10;
    var layersWMS = null;
       
    
    var map;
    var layersThemes = null;
    
    function pageLoad(sender, args){
        if(!args.get_isPartialLoad()){
             initMap();
             initWmsLayers();
             
        }
    }       
                    
    function initMap()
    {
        if (GBrowserIsCompatible()) {
            map = new GMap2(document.getElementById("map"));
            map.getMapTypes().length = 0;
    
            map.addMapType(custommap4);
            map.addMapType(G_PHYSICAL_MAP);
            map.addMapType(G_SATELLITE_MAP);
            
            //var bounds = new GLatLngBounds(new GLatLng(-0.8155, -102.2538), new GLatLng(24.3325, -68.40848));
            //map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
            
            map.addControl(new GLargeMapControl());
            map.setMapType(G_PHYSICAL_MAP);
            
            //map.setUIToDefault();
            
            //map.addControl(new GOverviewMapControl());
            
            //map.setCenter(new GLatLng(16,-70), 4);
            map.setCenter(new GLatLng(39.3,-118.10), 4);
            
          }
    
    }  
   
   
        
   function moreOpacity(c_overlay,u)
   {
        alert(c_overlay.getTileLayer().opacity);
        c_overlay.getTileLayer().opacity += u;
        map.removeOverlay(c_overlay);
        map.addOverlay(c_overlay);
    
   
   }
   
   var actualIndex =1;
   var actualTipon= "lay_01";
   
   function overlayOpacity(vop)
   {
        var c_overlay = layersWMS[actualIndex];
        var combox=eval("document.myform." + actualTipon);
        if (combox.checked==true)
        {
            c_overlay.getTileLayer().opacity = vop;
            map.removeOverlay(c_overlay);
            map.addOverlay(c_overlay);
        }
    
   
   }
    
   function initWmsLayers()
   {
        
        if (layersWMS == null)
          layersWMS = {};
        
        tile_lay_01= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_01.myLayers='1';
        tile_lay_01.myFormat='image/png';
        tile_lay_01.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_01.getTileUrl=CustomGetTileUrl;
        
        tile_lay_01.opacity = 1.0; // Default opacity value
        tile_lay_01.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_01.getOpacity = function() { return this.opacity; }
        overlay1 = new GTileLayerOverlay( tile_lay_01 );
        layersWMS[1] = overlay1;
        
        
        /*map.addOverlay(overlay);
        map.addControl(new OpacityControl( overlay ));*/
        
        
        
        tile_lay_02= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_02.myLayers='2';
        tile_lay_02.myFormat='image/png';
        tile_lay_02.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_02.getTileUrl=CustomGetTileUrl;
        
        
        tile_lay_02.opacity = 1.0; // Default opacity value
        tile_lay_02.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_02.getOpacity = function() { return this.opacity; }
        overlay2 = new GTileLayerOverlay( tile_lay_02 );
        layersWMS[2] = overlay2;        
        
        tile_lay_03= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_03.myLayers='3';
        tile_lay_03.myFormat='image/png';
        tile_lay_03.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_03.getTileUrl=CustomGetTileUrl;
        
        tile_lay_03.opacity = 1.0; // Default opacity value
        tile_lay_03.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_03.getOpacity = function() { return this.opacity; }
        overlay3 = new GTileLayerOverlay( tile_lay_03 );
        layersWMS[3] = overlay3;
        
        tile_lay_04= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_04.myLayers='4';
        tile_lay_04.myFormat='image/png';
        tile_lay_04.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_04.getTileUrl=CustomGetTileUrl;
        
        
        tile_lay_04.opacity = 1.0; // Default opacity value
        tile_lay_04.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_04.getOpacity = function() { return this.opacity; }
        overlay4 = new GTileLayerOverlay( tile_lay_04 );
        layersWMS[4] = overlay4;
        
        tile_lay_05= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_05.myLayers='5';
        tile_lay_05.myFormat='image/png';
        tile_lay_05.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_05.getTileUrl=CustomGetTileUrl;
        
        tile_lay_05.opacity = 1.0; // Default opacity value
        tile_lay_05.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_05.getOpacity = function() { return this.opacity; }
        overlay5 = new GTileLayerOverlay( tile_lay_05 );
        layersWMS[5] = overlay5;
        
        
        tile_lay_06= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_06.myLayers='6';
        tile_lay_06.myFormat='image/png';
        tile_lay_06.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_06.getTileUrl=CustomGetTileUrl;
        
        tile_lay_06.opacity = 1.0; // Default opacity value
        tile_lay_06.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_06.getOpacity = function() { return this.opacity; }
        overlay6 = new GTileLayerOverlay( tile_lay_06 );
        layersWMS[6] = overlay6;
        
        tile_lay_07= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_07.myLayers='7';
        tile_lay_07.myFormat='image/png';
        tile_lay_07.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_07.getTileUrl=CustomGetTileUrl;
        
        tile_lay_07.opacity = 1.0; // Default opacity value
        tile_lay_07.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_07.getOpacity = function() { return this.opacity; }
        overlay7 = new GTileLayerOverlay( tile_lay_07 );
        layersWMS[7] = overlay7;
        
        
        
        /*
        tile_lay_08= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_08.myLayers='8';
        tile_lay_08.myFormat='image/png';
        tile_lay_08.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_08.getTileUrl=CustomGetTileUrl;
        */
        
        tile_lay_09= new GTileLayer(new GCopyrightCollection(""),1,17);
        tile_lay_09.myLayers='9';
        tile_lay_09.myFormat='image/png';
        tile_lay_09.myBaseURL='http://portalgis.cathalac.org/ArcGIS/services/CAR_WMS/MapServer/WMSServer?';
        tile_lay_09.getTileUrl=CustomGetTileUrl;
        
        tile_lay_09.opacity = 1.0; // Default opacity value
        tile_lay_09.isPng = function() { return true;}; // Transparency is active
        // Older version of IE (< 7.0) has either transparency or changeable opacity. Not both in the same time.
        tile_lay_09.getOpacity = function() { return this.opacity; }
        overlay9 = new GTileLayerOverlay( tile_lay_09 );
        layersWMS[9] = overlay9;
        
        
        /*
        tile_lay_10= new GTileLayer(new GCopyrightCollection(""),1,17);
        //tile_lay_10.myLayers='10';
        tile_lay_10.myLayers = 'Continentes';
        tile_lay_10.myFormat='image/gif';
        //tile_lay_10.myBaseURL='http://maps3.cathalac.org/arcgismaps3/services/Maps/unep_cep_wms_test1/MapServer/WMSServer?';
        tile_lay_10.myBaseURL = 'http://maps.cathalac.org/wmsconnector/com.esri.wms.Esrimap?ServiceName=dataframeworklayers&';
        tile_lay_10.getTileUrl=CustomGetTileUrl;
        */

        



 }
    
      
//MAPAS DE WMS-----------------------------------------------------------END

//FUNCIONES VARIAS-----------------------------------------------------------------------------START
function clearing()
{
    /*
    document.myform.smokeshms.checked=false;
    document.myform.fireshms.checked=false;
    document.myform.fires.checked=false;
    document.myform.volcanes.checked=false;
    document.myform.aprot.checked=false;
    document.myform.zvh.checked=false;
    document.myform.wms[0].checked=true;
    */
}

//function layeres(capanew,tipon,indice){
//    combox=eval("document.myform."+tipon);
//    if (document.myform.wms[0].checked)
//    {
//        tiponcito=document.myform.wms[0].value;
//    }
//    else if(document.myform.wms[1].checked)
//    {
//        tiponcito=document.myform.wms[1].value;
//    }
//    if (combox.checked==true)
//    {
//        /*layer4.shift();
//        //layer4.unshift(eval(tiponcito+".getTileLayers()[0]"));
//        var w_layer = eval(tiponcito+".getTileLayers()[0]");
//        layer4.unshift(w_layer);
//        layer4.push(capanew);*/
//        map.addOverlay(overlay1);
//        
//    }
//    else
//    {
//        //indexx=layer4.indexOf(capanew);
//        /*indexx = indexOfElement(capanew, layer4); 
//        layer4.splice(indexx,1); */
//        map.removeOverlay(overlay1);
//    }
// 
//    //refrescarmapa4();
//    
//    
//}

function layeres(index,tipon){
    
    combox=eval("document.myform."+tipon);
    if (combox.checked==true)
    {
        map.addOverlay(layersWMS[index]);
    }
    else
    {
        map.removeOverlay(layersWMS[index]);
    }
    
}



function indexOfElement(obj, arr)
{
    
    for(var i=0; i<arr.length; i++){
        if(arr[i]==obj){
            return i;
        }
    }
    return -1;

}


function fondogoogle()
{
    if (document.myform.wms[0].checked)
    {
        tiponcito=document.myform.wms[0].value;
    }
    else if(document.myform.wms[1].checked)
    {
        tiponcito=document.myform.wms[1].value;
    }
    
    layer4.shift();
    layer4.unshift(eval(tiponcito+".getTileLayers()[0]"));
    refrescarmapa4();
}

function refrescarmapa4()
{
    
    var actualCenter = map.getCenter();
    var actualBounding = map.getBoundsZoomLevel(map.getBounds());
    
    map.setMapType(G_PHYSICAL_MAP);
    map.setMapType(custommap4);
    //map.setZoom(5);
    
    map.setCenter(actualCenter, actualBounding); 
    
}

//FUNCIONES VARIAS-----------------------------------------------------------------------------END

// Funciones de Treeview



function ClientTheme_NodeChecked(sender, eventArgs) {

    verNodos();

    var node = eventArgs.get_node();
    var url = node.get_attributes().getAttribute("url");
    var id = node.get_attributes().getAttribute("idTheme");
    var name = node.get_attributes().getAttribute("name");
    var checked = node.get_checked();
    //alert(themeURL);

    //toggleGeoXML(url, checked, id, name);
    
    loadMarkers("GetXmlData.aspx?idTheme=" + id,id,name,checked);
    

}

var flagload = true;

function loadlayersThemes(treeView) {

    if (layersThemes!= null && flagload == false)
        return;

     if (layersThemes == null)
       layersThemes = {};
    
    flagload = false;

    var allNodes = treeView.get_allNodes();

    for (var i = 0; i < allNodes.length; i++) {
        var node = allNodes[i];

        if (node.get_attributes().getAttribute("idTheme")) {

            var url = node.get_attributes().getAttribute("url");
            var id = node.get_attributes().getAttribute("idTheme");
            var name = node.get_attributes().getAttribute("name");

            layersThemes[id] = {};
            layersThemes[id].url = url;
            layersThemes[id].name = name;
            layersThemes[id].markerGroups = [];
            layersThemes[id].markerHtml = [];
        }
    }

}


function loadMarkers(url,id,name, checked) {
        
        
        if(layersThemes[id] == null)
        {
            flagload = true;
            verNodos();
            
        }
        
        if(layersThemes[id].markerGroups.length == 0 && checked)
        {
            GDownloadUrl(url, function(data) {
              var xml = GXml.parse(data);
              var markers = xml.documentElement.getElementsByTagName("marker");
              
              addLayerTab(TabPanelSelectedLayers, id, name, 'GridDataTheme.aspx?idTheme=' + id);
              
              for (var i = 0; i < markers.length; i++) {
                var iconUrl = markers[i].getAttribute("icon");
                var idTheme = markers[i].getAttribute("idTheme");
                var htmlContent = "";
                if(markers[i].text)
                  htmlContent = markers[i].text;
                else
                  htmlContent = markers[i].textContent;
                  
                //alert(htmlContent);
                var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                        parseFloat(markers[i].getAttribute("lng")));
                var marker = createMarker(point, idTheme, iconUrl, htmlContent);
                map.addOverlay(marker);
              }
            });
        }
        else
        {
            toggleGroup(id);
                    
        }
      
    }


function addLayerTab(tabPanel, id, name, url) 
{
            var tab = tabPanel.getComponent(id);
            if (!tab) {
                tab = tabPanel.add({ 
                    id: id, 
                    title: name, 
                    closable:false,                    
                    autoLoad: {
                        showMask: true,
                        url: url,
                        mode:'iframe',
                        maskMsg: 'Loading ' + url + '...'
                    }                    
                });

            }
            tabPanel.setActiveTab(tab);
 }




function createMarker(point, idTheme, iconUrl, htmlContent) {
      var newIcon = getLayerIcon(iconUrl);
      var marker = new GMarker(point, {icon: newIcon});
      layersThemes[idTheme].markerGroups.push(marker);
      layersThemes[idTheme].markerHtml.push(htmlContent);
      //var html = "<b>" + idTheme + "</b> <br/>" + iconUrl;
      var html = htmlContent;
      GEvent.addListener(marker, 'click', function() {
        //marker.openInfoWindowHtml(html);
        showInfoWindow(marker, html);
      });
      
      return marker;
    }
    
function showInfoWindow(marker, html)
{
    var actualCenter = map.getCenter();
    var actualBounding = map.getBoundsZoomLevel(map.getBounds());
        
    marker.openInfoWindowHtml(html);
    
    GEvent.addListener(map,'infowindowclose',function(){
        map.panTo(actualCenter);
        //map.setCenter(actualCenter, actualBounding);
        
    });


}    
    
function getLayerIcon(iconUrl) {
      
        var icon = new GIcon();
        icon.image = iconUrl;
        icon.iconAnchor = new GPoint(22, 22);
        icon.infoWindowAnchor = new GPoint(22, 0);
        icon.iconSize = new GSize(32, 32);
        
        return icon;
    }    
    
function toggleGroup(idTheme) {
  for (var i = 0; i < layersThemes[idTheme].markerGroups.length; i++) {
    var marker = layersThemes[idTheme].markerGroups[i];
    if (marker.isHidden()) {
      marker.show();
    } else {
      marker.hide();
    }
  } 
  
  var tab = TabPanelSelectedLayers.getComponent(idTheme);
  if (tab) {
      TabPanelSelectedLayers.closeTab(tab, 'hide');
      TabPanelHidden.addTab(tab);

  }
  else
  {
      var tab2 = TabPanelHidden.getComponent(idTheme);
      if (tab2) {
          TabPanelHidden.closeTab(tab2, 'hide');
          TabPanelSelectedLayers.addTab(tab2);

      }
  }
  
}


function findShowMarker(idTheme, lat, lon)
{
    for (var i = 0; i < layersThemes[idTheme].markerGroups.length; i++) {
        var marker = layersThemes[idTheme].markerGroups[i];
        if (!marker.isHidden()) {
            var latlon = marker.getLatLng();
            var mlat = latlon.lat();
            var mlon = latlon.lng(); 
            if(mlat == lat && mlon == lon)
                marker.openInfoWindowHtml(layersThemes[idTheme].markerHtml[i]);
        } 
    } 

}


////////////////////////////////////

function toggleGeoXML(url, checked, id, name) {

    if (checked) {
        var geoXml = new GGeoXml(layersThemes[id].url);
        GEvent.addListener(geoXml, 'load', function() {
            if (geoXml.loadedCorrectly()) {
                geoXml.gotoDefaultViewport(map);
                layersThemes[id].geoxml = geoXml;
                document.getElementById("status").innerHTML = "";
            }
        });
        layersThemes[id].geoXml = geoXml;
        map.addOverlay(layersThemes[id].geoXml);
        document.getElementById("status").innerHTML = "Loading...";

    } else if (layersThemes[id].geoXml) {
        map.removeOverlay(layersThemes[id].geoXml);
    }
    
}