var map, layer, basemap, gmap, hybrid, measureControls, stations_corridors;
        var satellite = 0;
        var mapservUrl = "http://www.parkinfo.org/cgi-bin/mapserv";

        //workaround to get vectors working in Firefox 3
        OpenLayers.Renderer.SVG.prototype.supported = function() {
            var svgFeature = "http://www.w3.org/TR/SVG11/feature#";
            return (document.implementation &&
               (document.implementation.hasFeature("org.w3c.svg", "1.0") ||
                document.implementation.hasFeature(svgFeature + "SVG", "1.1") ||
                document.implementation.hasFeature(svgFeature + "BasicStructure", "1.1") ));
        };


        function init(){
            var options = {
                scales: [1734000, 867000, 433000, 217000, 108000, 54000, 27000,
                         14000, 6771,  3385, 1693, 846, 423],
                numZoomLevels: 26,
                projection: "EPSG: 54004",
                units: "m",
                maxResolution: 156543.0339,
                maxExtent: new OpenLayers.Bounds(-13852285, 4300636,
                                                 -13374100, 4659904),
                displayUnits: 'mi',
                handlerOptions: {
                    freehand: true,
                    persist: true
                }
            };
            var circleOptions = {
                displayUnits: 'mi',                
                handlerOptions: {
                    sides: 35,
                    persist: true
                }
            };
            measureControls = {
                line: new OpenLayers.Control.Measure(
                            OpenLayers.Handler.Path, options),
                polygon: new OpenLayers.Control.Measure(
                            OpenLayers.Handler.Polygon, options),
                circle: new OpenLayers.Control.Measure(
                            OpenLayers.Handler.RegularPolygon, circleOptions)
            };
            var control;


            map = new OpenLayers.Map('map', options);
            for(var key in measureControls) {
                control = measureControls[key];
                control.onMeasure = handleMeasurements;
                map.addControl(control);
            }
            document.getElementById('noneToggle').checked = true;

            basemap= new OpenLayers.Layer.Image(
                'Regional Map',
                'images/ForWeb1rev3_470.jpg',
                new OpenLayers.Bounds(-13798306.881, 4393212.254,
                                      -13466257.707, 4689513.626),
                new OpenLayers.Size(532, 470)
            );
            gmap = new OpenLayers.Layer.GoogleMercator(
                "Google",
                {
                    minZoomLevel: 8,
                    maxZoomLevel: 26
                }
            );
            hybrid = new OpenLayers.Layer.GoogleMercator(
                "Streets & Imagery",
                {
                    type: G_HYBRID_MAP,
                    minZoomLevel: 8,
                    maxZoomLevel: 26
                }
            );


            var bart = new OpenLayers.Layer.WMS(
                "BART Lines",
                mapservUrl + "?map=GCC_mercator.map&",
                {
                    layers: 'BART_Lines', transparent:'true',
                    format:'image/png', numZoomLevels: 26
                },
                {isBaseLayer: false, visibility: false}
            );

            var commuter = new OpenLayers.Layer.WMS(
                "Commuter Rail",
                mapservUrl + "?map=GCC_mercator.map&",
                {
                    layers: 'Commuter_Rail', transparent:'true',
                    format:'image/png', numZoomLevels: 26
                },
                {isBaseLayer: false, visibility: false}
            );

            var ferry = new OpenLayers.Layer.WMS(
                "Ferry Lines",
                mapservUrl + "?map=GCC_mercator.map&",
                {
                    layers: 'Ferry_Lines', transparent:'true',
                    format:'image/png', numZoomLevels: 26
                },
                {isBaseLayer: false, visibility: false}
            );

            var lightrail = new OpenLayers.Layer.WMS(
                "Light Rail",
                mapservUrl + "?map=GCC_mercator.map&",
                {
                    layers: 'Light_Rail', transparent:'true',
                    format:'image/png', numZoomLevels: 26
                },
                {isBaseLayer: false, visibility: false}
            );

            
             stations_corridors = new OpenLayers.Layer.GML("Stations & Corridors", 
                  "http://greatcommunities.org/xml_files/stations_corridors.xml", 
                  {'format': OpenLayers.Format.GML}); 

              
            map.addLayers([basemap, gmap, hybrid, bart, commuter, ferry, lightrail, stations_corridors]);

			OpenLayers.Control.SelectFeature.prototype.select= function(feature) {
    		// Store feature style for restoration later
   		 if(feature.originalStyle == null) {
        		feature.originalStyle = feature.style;
    		 }
    	 	 this.stations_corridors.selectedFeatures.push(feature);
    		 feature.style = feature.selectStyle ?
                    feature.selectStyle : this.selectStyle;
    		this.stations_corridors.drawFeature(feature);
    		this.onSelect(feature);
		}; 



            stations_corridors.preFeatureInsert= function(feature) {
	 		  feature.selectStyle = OpenLayers.Util.extend({}, feature.style);
                      if (feature.attributes['ms:CollStatus']=="Active" || feature.attributes['ms:CollStatus']=="Completed"){
                             if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
                                feature.style.strokeColor = "#7D0000";
                                feature.style.fillColor = "red";                                  
                                feature.style.strokeWidth = 1;
                                feature.style.pointRadius = 8;
                                feature.style.fillOpacity = 0.8;
                                feature.selectStyle.strokeColor = "#7D0000";
                                feature.selectStyle.fillColor = "red";                                  
                                feature.selectStyle.strokeWidth = 1;
                                feature.selectStyle.pointRadius = 8;
                                feature.selectStyle.fillOpacity = 0.8;
                             } else {                                
                                feature.style.strokeColor = "red";
                                feature.style.strokeWidth = 3;
                                feature.selectStyle.strokeColor = "red";
                                feature.selectStyle.strokeWidth = 3;
                             }
                     } else {
                             if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
                                feature.style.strokeColor="blue";
                                feature.style.fillColor="blue"; 
                                feature.style.strokeWidth= 1;
                                feature.style.pointRadius = 4;
                                feature.selectStyle.strokeColor="blue";
                                feature.selectStyle.fillColor="blue"; 
                                feature.selectStyle.strokeWidth= 1;
                                feature.selectStyle.pointRadius = 4;                                
                             } else {
                                feature.style.strokeColor = "blue";                             
                                feature.style.strokeWidth = 3;
                                feature.selectStyle.strokeColor = "blue";                             
                                feature.selectStyle.strokeWidth = 3;
                             }                                                       
                     }
            }

            map.setCenter(new OpenLayers.LonLat(-13626115,4535962), 0);
            map.addControl(new OpenLayers.Control.LayerSwitcher({activeColor:"#436976"}));
            
            map.events.register("zoomend", map, function() {
                if (map.getZoom() <=0 && (satellite == 0)) {
                    map.setBaseLayer(basemap);
                }
                if (map.getZoom() >=1 && map.getZoom() <=6 && (satellite == 0)) {
                    satellite = 1;
                    map.setBaseLayer(gmap);
                }
                if (map.getZoom() >=7 && (satellite == 1)) {
                    map.setBaseLayer(hybrid);
                    satellite = 0;
                }            
            });

            drawControls = {
                selectCorridor: new OpenLayers.Control.SelectFeature(stations_corridors, {callbacks: {'up':feature_info}})             
            };

            for(var key in drawControls) {
                map.addControl(drawControls[key]);
            }
            drawControls.selectCorridor.activate();
            
        }

           OpenLayers.Layer.GML.prototype.getFeatureByFid = function(featureFid) {
    		var feature = null;
    		for(var i=0; i<this.features.length; ++i) {
        		if(this.features[i].fid == featureFid) {
            			feature = this.features[i];
            			break;
        		}
    		}
    		return feature;
	    };

        function handleMeasurements(geometry, length, area, units) {
            var element = document.getElementById('output');
            var out = "";
            if(geometry.CLASS_NAME == "OpenLayers.Geometry.LineString") {
                out += "length: " + length.toFixed(2) + " " + units;
            } else {
                out += "perimeter: " + length.toFixed(2) + " " + units + "<br />";
                out += "area: " + toAcres(area, 'mi') + " acres";
            }
            element.innerHTML = out;
        }

        function toggleControl(element) {
            for(key in measureControls) {
                var control = measureControls[key];
                if(element.value == key && element.checked) {
                    control.activate();
                } else {
                    control.deactivate();
                }
            }
        }
    

        function zoomToStation () {
		/* note: the value for station or corridor in the select option needs 
                 to correspond with the fid in the GML file
              */             
              var currentStation = $('stationselector').options[$('stationselector').selectedIndex].value;
            if (currentStation == 'All Stations') {
                satellite = 0;
                map.setCenter(new OpenLayers.LonLat(-13626115,4535962), 0);                            
                OpenLayers.Util.getElement('stationFacts').innerHTML = "";
                
            } else {
                satellite = 1;
                var feature = stations_corridors.getFeatureByFid(currentStation);
                feature_info(feature); 
            }
        }

        var displayedFeature = null;
    
        function feature_info(feature) {
            //get the lat and lon of the feature and zoom to it
            var lon = feature.attributes['ms:lon'];
            var lat = feature.attributes['ms:lat'];       
            map.setCenter(new OpenLayers.LonLat(lon,lat), 7);
            map.setBaseLayer(hybrid);
            //set the HTML
                var contentHTML =  "<table width='220px'>";
                contentHTML +=  "<tr><td><b>" + feature.attributes['ms:title'] + "</b></td></tr>";
                
                if (feature.attributes['ms:Desc']) { 
                contentHTML +=  "<tr><td><b>Description: </b>" + feature.attributes['ms:Desc'] + "</td></tr>";
                }     
                contentHTML +=  "<tr><td><b>Collaborative Status: </b>" + feature.attributes['ms:CollStatus'] + "</td></tr>";
                if (feature.attributes['ms:GCCLead']) { 
                contentHTML +=  "<tr><td><b>Lead Organization: </b><br><a href=" + feature.attributes['ms:Ld_Web'] + " target='_blank'>" + feature.attributes['ms:GCCLead'] + "</a><br>" + feature.attributes['ms:Ld_Contact'] + "<br>" + feature.attributes['ms:Ld_Phone'] + "<br>" + feature.attributes['ms:Ld_Email'] + "</td></tr>";
                }                   
                if (feature.attributes['ms:LocalPartners']) { 
                contentHTML +=  "<tr><td><b>Local Partner(s): </b>" + feature.attributes['ms:LocalPartners'] + "</td></tr>";
                }                
                if (feature.attributes['ms:CityWeb']) { 
                contentHTML +=  "<tr><td><a href=" + feature.attributes['ms:CityWeb'] + " target='_blank'>City Website</a></td></tr>";
                }
                if (feature.attributes['ms:TransitAgency']) { 
                contentHTML +=  "<tr><td><b>Transit Agency: </b>" + feature.attributes['ms:TransitAgency'] + "</td></tr>";
                }
                if (feature.attributes['ms:City']) { 
                contentHTML +=  "<tr><td><b>City: </b>" + feature.attributes['ms:City'] + "</td></tr>";
                }
                if (feature.attributes['ms:County']) { 
                contentHTML +=  "<tr><td><b>County: </b>" + feature.attributes['ms:County'] + "</td></tr>";
                }
                if (feature.attributes['ms:Exist_Expa']) { 
                contentHTML +=  "<tr><td><b>Existing/Expansion Transit Station: </b>" + feature.attributes['ms:Exist_Expa'] + "</td></tr>";
                }
                if (feature.attributes['ms:Plan_Beg']) { 
                contentHTML +=  "<tr><td><b>Plan Start Date: </b>" + feature.attributes['ms:Plan_Beg'] + "</td></tr>";
                }                
                if (feature.attributes['ms:Plan_Comp']) { 
                contentHTML +=  "<tr><td><b>Plan End Date: </b>" + feature.attributes['ms:Plan_Comp'] + "</td></tr>";
                }                
                                                      
                contentHTML +=  "<tr id='stationLink'><td><b><a href=" + feature.attributes['ms:StationURL'] + " target='_blank'>Detailed View</a> | <a href=" + feature.attributes['ms:StationURL'] + "/edit target='_blank'>Edit Station</b></a></td></tr>";
                contentHTML +=  "<tr><td>Station last modified on " + feature.attributes['ms:ModifDate'] + "</td></tr>";
                contentHTML += "</table>";

            OpenLayers.Util.getElement('stationFacts').innerHTML = contentHTML;

        }   

        function toAcres(area, units) {
            // keys are linear measure, conversion is for area
            unitsPerAcre = {
                'inches': 43560 * 144,
                'ft': 43560,
                'mi': 1 / 640,
                'm': 4046.856422,
                'km': 1 / 247.10538,
                'dd': 0.69743425
            };
            unitsPerAcre['in'] = unitsPerAcre['inches'];
            unitsPerAcre['degrees'] = unitsPerAcre['dd'];
            var acres = (area / unitsPerAcre[units]).toFixed(2);
            return acres;
        }

        function setCircleRadius(radius) {
            measureControls.circle.handler.setOptions({
                radius: radius,
                angle: 0
            });
        }