  
var map;
OpenLayers.IMAGE_RELOAD_ATTEMPTS = 5;
OpenLayers.Util.onImageLoadErrorColor = "transparent";

//function loadMap() {


Ext.onReady(function(){

//  Ext.onReady(function() {  
//	   setTimeout(function(){  
//	     Ext.get('loading').remove();  
//	     Ext.get('loading-mask').fadeOut({remove:true});  
//	   }, 250);  
//	 });  
	
	
 // basic tabs 1, built from existing content
 var tabs = new Ext.TabPanel({
   renderTo: 'tabs1',
   //width:900,
   activeTab: 0,
   frame:true,
   defaults:{autoHeight: true, autoWidth: true},
   items:[
       {contentEl:'forecast', title: 'Forecast'},
       {contentEl:'methodology', title: 'Methodology'},
       {contentEl:'analog', title: 'Using Long Lead Forecasts', autoLoad: 'content/long_lead_forecast.html'},
       {contentEl:'about', title: 'About', autoLoad: 'content/disclaimer.html'}
   ]
 });
 
 var tabs = new Ext.TabPanel({
   renderTo: 'tabs2',
   activeTab: 0,
   frame:true,
   defaults:{autoHeight: true, autoWidth: true},
   items:[
          { contentEl:'summary', title: 'Summary', autoLoad: 'content/methodology_summary.html'},
          { contentEl:'selection', title: 'Explanatory Variable Selection', autoLoad: 'content/methodology_selection.html' },
          { contentEl:'uncertainty', title: 'Uncertainty' },           
          { contentEl:'references', title: 'References', autoLoad: 'content/references.html' }
   ]
 });
 
 var tabs = new Ext.TabPanel({
   renderTo: 'tabs3',
   activeTab: 0,
   frame:true,
   defaults:{autoHeight: true, autoWidth: true},
   items:[
          { contentEl:'historical', title: 'Historical Performance of Forecasts', autoLoad: 'content/methodology_uncertainty_historical.html' },
 { contentEl:'probabilistic', title: 'Probabilistic Forecast and Error Quantification', autoLoad: 'content/methodology_uncertainty_probabilistic.html'}
   ]
     });         
   //tabs built from JS

  function handleActivate(tab){
    alert(tab.title + ' was activated.');
  }

  var geo_host = "http://"+window.location.hostname+":8080/geoserver/wms?";

  var options = {
    projection: new OpenLayers.Projection("EPSG:900913"),
    //displayProjection: new OpenLayers.Projection("EPSG:900913"),
    units: "m",
    maxResolution: 156543.0339,
    maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34, 20037508.34, 20037508.34),
    numZoomLevels:22
  };
  
  var map = new OpenLayers.Map('map',options);

  var ghyb = new OpenLayers.Layer.Google(
      "Google Hybrid",{type: G_HYBRID_MAP,sphericalMercator: true },{isBaseLayer: true}
  );
  var gphy = new OpenLayers.Layer.Google(
      "Google Physical",{type: G_PHYSICAL_MAP,sphericalMercator: true },{isBaseLayer: true}
  );
  map.addLayers([gphy,ghyb]);

  var lowStyle = new OpenLayers.StyleMap(OpenLayers.Util.applyDefaults(
      {fillColor: "#0EA007", fillOpacity: 0.6, strokeColor: "#0EA007"},
      OpenLayers.Feature.Vector.style["default"]));
  var mediumStyle = new OpenLayers.StyleMap(OpenLayers.Util.applyDefaults(
      {fillColor: "#E0A200", fillOpacity: 0.6, strokeColor: "#E0A200"},
      OpenLayers.Feature.Vector.style["default"]));
  var highStyle = new OpenLayers.StyleMap(OpenLayers.Util.applyDefaults(
      {fillColor: "#FF0000", fillOpacity: 0.6, strokeColor: "#FF000"},
      OpenLayers.Feature.Vector.style["default"]));

  var may2010_layer = new OpenLayers.Layer.Vector("May 2010 Forecast", {styleMap: highStyle});
  map.addLayer(may2010_layer);
  var april2010_layer = new OpenLayers.Layer.Vector("April 2010 Forecast", {styleMap: mediumStyle});
  map.addLayer(april2010_layer);
  var march2010_layer = new OpenLayers.Layer.Vector("March 2010 Forecast", {styleMap: mediumStyle});
  map.addLayer(march2010_layer);
  var march2009_layer = new OpenLayers.Layer.Vector("March Forecast", {styleMap: lowStyle});
  map.addLayer(march2009_layer);
  var april2009_layer = new OpenLayers.Layer.Vector("April Forecast", {styleMap: mediumStyle});
  map.addLayer(april2009_layer);
  var may2009_layer = new OpenLayers.Layer.Vector("May Forecast", {styleMap: highStyle});
  map.addLayer(may2009_layer);

  OpenLayers.loadURL("maps/ak_borel_forest.geojson",
        null,this,onGeoJsonLoadSuccess,onGeoJsonLoadFailure
  );
               
  function onGeoJsonLoadSuccess(data) {
    var geojson_format = new OpenLayers.Format.GeoJSON();
    may2010_layer.addFeatures(geojson_format.read(data.responseText));
    april2010_layer.addFeatures(geojson_format.read(data.responseText));
    march2010_layer.addFeatures(geojson_format.read(data.responseText));
    march2009_layer.addFeatures(geojson_format.read(data.responseText));
    april2009_layer.addFeatures(geojson_format.read(data.responseText));
    may2009_layer.addFeatures(geojson_format.read(data.responseText));
  }
  function onGeoJsonLoadFailure(data) {alert('foo');  };

  may2010_layer.setVisibility(false);
  april2010_layer.setVisibility(false);
  march2010_layer.setVisibility(false);
  march2009_layer.setVisibility(false);
  april2009_layer.setVisibility(false);
  may2009_layer.setVisibility(false);
  
  var firehist = new OpenLayers.Layer.WMS("Fire History 1942-2007",geo_host,
    {
	    singleTile: true,
	    styles: 'polygon',
	    layers: 'akfirehist07_google',
	    format: 'image/png',
	    transparent: true
    },{isBaseLayer: false, buffer: 0,gutter: 10}
  );
//  var fireoptions = new OpenLayers.Layer.WMS("Fire Management Options",
//    "http://zeus.neptuneinc.org:8080/geoserver/wms?",
//    {
//        singleTile: true,
//        //styles: '',
//        layers: 'fireoptions',
//        format: 'image/png',
//        transparent: true
//    },{isBaseLayer: false, buffer: 0,gutter: 10}
//  );
  //map.addLayers([firehist,fireoptions]);
  map.addLayer(firehist);
  firehist.setVisibility(false);
  //fireoptions.setVisibility(false);
  
  //map.addControl(new OpenLayers.Control.LayerSwitcher());
  map.setCenter(new OpenLayers.LonLat(-17000000, 9500000), 4);

  // green  icon: "graphics/square_00ff00fd_filled_16x16.png",
  // yellow icon: "graphics/square_FFFF00_filled_16x16.png",
  // red    icon: "graphics/square_ff0000fd_filled_16x16.png",
  
  var model = [{
    text: "Base Layers",
    expanded: false,  
      children: [{
        text: "Google Physical",
        checked: true,
        layerName: "Google Physical"
      },{
          text: "Google Hybrid",
          checked: false,
          layerName: "Google Hybrid"
      }]
		  },{
		    text: "2010 Forecasts",
		    expanded: true,
		      children: [
	         { 
						  text: "May [High]",
						  radio: true,
						  radioGrp: 'forecasts',
						  layerName: "May 2010 Forecast",
						  icon: "graphics/square_ff0000fd_filled_16x16.png",
						  checked: true
	         },
           { 
						  text: "April [Moderate]",
						  radio: true,
						  radioGrp: 'forecasts',
						  layerName: "April 2010 Forecast",
						  icon: "graphics/square_E0A200_filled_16x16.png",
						  checked: false
          },
          {
              text: "March [Moderate]",
							radio: true,
							radioGrp: 'forecasts',
							layerName: "March 2010 Forecast",
							icon: "graphics/square_E0A200_filled_16x16.png",
							checked: false
			      }
		      ]
		   },{
			    text: "2009 Forecasts",
			    expanded: false,
			      children: [
			   	      {
			   	      	text: "May [High]",
									radio: true,
				 					radioGrp: 'forecasts',
			   	      	layerName: "May Forecast",
			   	      	icon: "graphics/square_ff0000fd_filled_16x16.png",
			   	      	checked: false
			  	      },{
			  	      	text: "April [Moderate]",
									radio: true,
									radioGrp: 'forecasts',
			  	      	layerName: "April Forecast",
			  	      	icon: "graphics/square_E0A200_filled_16x16.png",
			  	      	checked: false
				      },{
									text: "March [Low]",
									radio: true,
									radioGrp: 'forecasts',
									layerName: "March Forecast",
									icon: "graphics/square_00ff00fd_filled_16x16.png",
									checked: false
				      }
			      ]
			   },{
	        text: "Other Layers",
	        expanded: false,
	          children: [{
	            text: "Fire History 1942-2007",
	            layerName: "Fire History 1942-2007",
	            checked: false
	          }
	          //,{
	          //  text: "Fire Management Options",
	          //  layerName: "Fire Management Options",
	          //  checked: false
	          //}
      ]
  }];

  var tree = new mapfish.widgets.LayerTree({map: map, el: 'tree', model: model}); 
  //var tree = new mapfish.widgets.LayerTree({map: map, el: 'tree', showWmsLegend: true}); 
  tree.render();

});
