var map = null;
        var panorama = null;
        
        // default location - should be a location with a street view panorama available
        //var latlng = new GLatLng(<?php echo $property_latitude; ?>, <?php echo $property_longitude; ?>);
        var marker = null;
        var bearing = 0;
        
        var streetviewClient = null;
        
        // size of panorama in small mode
        var smallStreetviewWidth = 300;
        var smallStreetviewHeight = 200;

        // size of panorama in large mode
        // * Note: largeStreetviewWidth overflows bounds of info window - 660 x 330 fits ok
        var largeStreetviewWidth = 300;
        var largeStreetviewHeight = 200;

        // current streetview panorama dimensions
        var streetviewWidth = smallStreetviewWidth;
        var streetviewHeight = smallStreetviewHeight;

        // dimensions of browser window
        var windowWidth = 0;
        var windowHeight = 0;
        
        var streetTitle = "";       // Area title display above Street View panorama
        var streetViewSize = 0;     // 0=Small 1=Large        
       
        var isIE = true;            // is internet explorer
            
var streetOverlay = null;
var streetOverlay_added = false; //flags if the overlay was added or not
// A toggle_street_view is a GControl that toggles between street view and non street view on Google Maps.

// We define the function first
function toggle_street_view() {
}

// To "subclass" the GControl, we set the prototype object to an instance of the GControl object
toggle_street_view.prototype = new GControl();

// Creates a one DIV for each of the buttons and places them in a container DIV which is returned as our control element. We add the control to
// to the map container and return the element for the map class to position properly.
toggle_street_view.prototype.initialize = function(map) {
var container = document.createElement("div");

var button_street_view = document.getElementById('street_view_button');
container.appendChild(button_street_view);
GEvent.addDomListener(button_street_view, "click", function() {
  if(!streetOverlay_added){
	 map.addOverlay(streetOverlay);
	 streetOverlay_added = true;
	 var map_click_event = GEvent.addListener(map, "click", function(overlay, point) {
                if (point && streetOverlay_added)
                    initPanorama(point);
     });
	 
  }else{ //streetOverlay_added
	map.removeOverlay(streetOverlay);
	streetOverlay_added = false;
	GEvent.removeListener(map_click_event);

  }//endif !streetOverlay_added
});  
map.getContainer().appendChild(container);
return container;
}//ends function

// By default, the control will appear in the top left corner of the map with 7 pixels of padding.
toggle_street_view.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(260, 7));
}//ends function


function handleNoFlash(errorCode) {
	if (errorCode == 603) {
	alert("Error: Flash doesn't appear to be supported by your browser");
	return;
	}
}  //ends function
        
        // create map with street view enabled and initial location marker
        function initStreetMap(){
            // check if internet explorer
            if ( typeof( window.innerHeight ) == 'number' )
                isIE = false;


			//map = new GMap2(document.getElementById("map_canvas"));
			//map.addControl(new GSmallMapControl());
			//map.setCenter(latlng, 13);
			streetOverlay = new GStreetviewOverlay();
			//map.addControl(new GMapTypeControl());
			map.addControl(new toggle_street_view());
			//map.addOverlay(new GMarker(latlng));
			
			streetviewClient = new GStreetviewClient();
			
			//initPanorama(latlng);  
        }

        function updateMarker()
        {
            if (!marker)
            {
                // Create Street View Marker (Once only)
                var icon = new GIcon();

                var imageNum = Math.round(bearing/22.5) % 16;
                var imageUrl = "http://maps.google.com/intl/en_us/mapfiles/cb/man_arrow-" + imageNum + ".png";
                
                icon.image = imageUrl;
                icon.iconSize = new GSize(49,52);
                icon.iconAnchor =  new GPoint(25,36);
                icon.infoWindowAnchor = new GPoint(25,6);        
                
                marker = new GMarker(latlng, {"icon":icon, "draggable":true});
                 
                GEvent.addListener(marker, "dragstart", function()
                   {     
                        map.closeInfoWindow();
                   }
                ); 
                             
                GEvent.addListener(marker, "dragend", function()
                   {            
                        latlng = marker.getPoint();
                        
                        initPanorama(latlng); 
                   }
                );              
                
                GEvent.addListener(marker, "click", function()
                   {  
                        displayStreetInfoWindow();
                   }
                );              
                
                map.addOverlay(marker);
                displayStreetInfoWindow();
            }
            else
            {
                // Update Street View Title
                var titleDiv = document.getElementById("titleDiv");
                if (titleDiv)
                {
                    titleDiv.innerHTML = streetTitle;
                }
                
                // update marker image
                var imageNum = Math.round(bearing/22.5) % 16;
                var imageUrl = "http://maps.google.com/intl/en_us/mapfiles/cb/man_arrow-" + imageNum + ".png";                
                marker.setImage(imageUrl);
              
                // update marker location
                marker.setPoint(latlng);
                
                // move info window to current marker location
                map.getInfoWindow().reposition(latlng, new GSize(0,-30));
            }

        }
        
        // return html for the resizing buttons displayed above a street view panorama
        function getSizeHtml()
        {
            var html =             
                 "<input type='button' value='S' onclick='panSize(0)' style='width:20px" + (streetViewSize==0 ? ";font-weight:bold" : "")  + "' title='Small' />" +
                 "<input type='button' value='Max' onclick='panSize(2)' style='width:40px" + (streetViewSize==2 ? ";font-weight:bold" : "")  + "' title='Maximize'/>";
            return html;
        }
        
        // apply the selected street view size
        function panSize(a)
        {
            if (a == streetViewSize)
            {
                return;
            }
            
            map.closeInfoWindow();
            
            streetViewSize = a;
            switch (streetViewSize)
            {
                case 0 :
                    streetviewWidth = smallStreetviewWidth;
                    streetviewHeight = smallStreetviewHeight;
                    break;
                case 1 :
                    streetviewWidth = largeStreetviewWidth; 
                    streetviewHeight = largeStreetviewHeight;
                    break;
                case 2 :
				resizeMap();
                    streetviewWidth = windowWidth;
                    streetviewHeight = windowHeight;
                    break;
            }
            
            if (streetViewSize == 2)    // Maximize - hide map and show the full panorama div
            {
                document.getElementById("frameDiv").style.display = "none";
                document.getElementById("fullDiv").style.display = "block";
                displayFullScreenPanorama();
            }
            else
            {                
                document.getElementById("frameDiv").style.display = "block";
                document.getElementById("fullDiv").style.display = "none";
                displayStreetInfoWindow();

                map.checkResize();
                panorama.checkResize();
            }
            
            
        }

        // create fullscreen panorama
        function displayFullScreenPanorama()
        {
            var html = 
                "<table cellspacing=5 cellpadding=0 style='width:" + windowWidth + "px'><tr style='height:20px'><td style='width:" + (windowWidth-110) + "px'>" +
                "<div id='titleDiv' style='font-weight:bold'>" + streetTitle + "</div>" +
                "</td><td align=right style='width:100px'>" +
                "<div id='sizeDiv'>" + getSizeHtml() + "</div>" +
                "</td></tr><tr><td colspan='2'>" +                
                "<div id='maxDiv' style='width:" + (windowWidth-10) + "px;height:" + (windowHeight - 40) + "px' ></div>" +
                "</td></tr></table>";
                
            document.getElementById("fullDiv").innerHTML = html;
                
            var panDiv = document.getElementById("maxDiv");
            panorama = new GStreetviewPanorama(panDiv);
            panorama.setLocationAndPOV(latlng, {"yaw":bearing});

            // record changes in location and bearing
            GEvent.addListener(panorama,"yawchanged",function(a)
                 {
                    bearing = parseFloat(a);
                 });

            GEvent.addListener(panorama,"initialized",function(a)
                 {
                    latlng = a.latlng;
                    streetTitle = a.description;
                    
                    document.getElementById("titleDiv").innerHTML = streetTitle;
                 });    
        }
                
        // create info window panorama
        function displayStreetInfoWindow()
        {
            var html = "";
            if (streetTitle == "")
            {
                html = "Street View Unavailable";
            }
            else
            {
                html = 
                "<table cellspacing=0 cellpadding=0 style='width:" + streetviewWidth + "px'><tr style='height:24px'><td style='width:" + (streetviewWidth-100) + "px'>" +
                "<div id='titleDiv' style='font-weight:bold'>" + streetTitle + "</div>" +
                "</td><td align=right style='width:100px'>" +
                //"<div id='sizeDiv'>" + getSizeHtml() + "</div>" +
                "</td></tr><tr><td colspan='2' align='center'>" +                
                "<div id='panDiv' style='width:" + streetviewWidth + "px;height:" + streetviewHeight + "px' ></div>" +
                "</td></tr></table>";
            }

            // NOTE: neither open infowindow function below opens a correct size info window
            // maximum size apppears to be 670px
            marker.openInfoWindowHtml(html, {"maxWidth":1000})
            
            // marker.openInfoWindowHtml(html);
            
            // delay loading panorama until info window is visible
            setTimeout("displayStreetInfoWindow2()", 500);
        }
            
    function displayStreetInfoWindow2()
    {
            var panDiv = document.getElementById("panDiv");
            panorama = new GStreetviewPanorama(panDiv);
            panorama.setLocationAndPOV(latlng, {"yaw":bearing});
            
            // listen for changes in bearing and latlng and update marker accordingly
            GEvent.addListener(panorama,"yawchanged",function(a)
                 {
                    bearing = parseFloat(a);
                    updateMarker();
                 });

            GEvent.addListener(panorama,"initialized",function(a)
                 {
                    latlng = a.latlng;
                    streetTitle = a.description;
                    
                    updateMarker();
                 });    

        }
          
        // find nearest panorama      
        function initPanorama(point)
        {    
            map.closeInfoWindow();  
            streetviewClient.getNearestPanorama(point, initPanorama2);
        }

        function initPanorama2(param)
        {
            // validate new location
            var valid = true;
            if (param == null)
            {
                valid = false;
            }
            else
            {
                var location = param.location;

                if (location == null)
                {
                    valid = false;
                }
            }        
            
            if (!valid)
            {
                // No Street View Available
                streetTitle = "";
                return;    
            }
            
            // store streetview location and title
            latlng = location.latlng;
            streetTitle = location.description;

            updateMarker();
            
            displayStreetInfoWindow();
         
        }

        // when main window is resized resize map and full screen div
        function resizeMap()
        {
            if (isIE)
            {
                windowWidth = parseInt(document.documentElement.clientWidth);
                windowHeight = parseInt(document.documentElement.clientHeight);
            }
            else
            {
                windowWidth = parseInt(window.innerWidth);
                windowHeight = parseInt(window.innerHeight);
            }
            

            
            document.getElementById("fullDiv").style.width = windowWidth + "px";
            document.getElementById("fullDiv").style.height = windowHeight + "px";
                
            if (map)
            {
                map.checkResize();
            }
            if (panorama)
            {
                panorama.checkResize();
            }
            
            if (streetViewSize == 2)
            {
                displayFullScreenPanorama();
            }
        }