function setAttribute (object, attributeName, attributeValue)
{
var attributeNode = document.createAttribute (attributeName);
attributeNode.value = attributeValue;
object.setAttributeNode (attributeNode);
} // end setAttribute method

function selectnewproperty(property_id) {
	hideDetailViews();
	showDetailView( 'prop_buildinginfo' );
	
	var url="ajax/ajax_properties_loader.php?id=" + property_id + "&rd=" + Math.random();

	$.get(url, "", function(data){
		response_array = data.split("|||");
		
		//alert(response_array.length);
		
		images_array = response_array[0].split("~");
		document.getElementById('property_image').src = images_array[0];
		//document.getElementById('property_image2').src = images_array[0];
		document.getElementById('building_info').innerHTML = response_array[1];
		document.getElementById('button_building_info').innerHTML = response_array[2];
		document.getElementById('button_panoramic_views').innerHTML = response_array[3];
		document.getElementById('button_explore_nearby').innerHTML = response_array[4];
		document.getElementById('button_floorplans').innerHTML = response_array[5];	
		//document.getElementById('button_flyer').innerHTML = response_array[13];	
		document.getElementById('bldg_label').src = response_array[6];
		document.getElementById('replace_panoramic').style.backgroundImage = "url(/" + response_array[7] + ")";		
		document.getElementById('map_leasing').innerHTML = response_array[8];
		document.getElementById('pagenavigation').innerHTML = response_array[9];
		
		w =  response_array[14];
		PhotoNav.init('pano_navigate', 398, w);

		
		var poi_field = '';
	//	pio_images_array = response_array[10].split("~");	
	//	pio_links_array = response_array[11].split("~");
		poi_field = response_array[12].split("~");
	//	for ( var i in pio_images_array ){
	//		poi_field += '<tr><td align="center" valign="middle"><a href="'+pio_links_array[i]+'" target="_blank"><img src="'+pio_images_array[i]+'" border="0" /></a></td><td>'+pio_text_array[i]+'</td></tr>';
	//	}
		address = poi_field+ ", Seattle WA";
		
		OnLoad();
		document.getElementById('prop_floorplans').innerHTML = response_array[13];	
       
		
		//this is where we the images array up, we can add links and text later if we want to 
		 var gallery_array = new Array();
		 for ( var i in images_array ){
			 gallery_array[i] = new Array();
			 gallery_array[i][0] = images_array[i];   //Image Src
			 gallery_array[i][1] = "";   //Link URL
			 gallery_array[i][2] = "";   //Target
			 gallery_array[i][3] = "";   //Description   		
			
		 }
		
		var buildings_gallery=new fadeSlideShow({																															
			wrapperid: "fading_bldg_images", //ID of blank DIV on page to house Slideshow
			dimensions: [400, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
			imagearray: gallery_array,
			displaymode: {type:'auto', pause:5000, cycles:0, wraparound:false},
			persist: false, //remember last viewed slide and recall within same session?
			fadeduration: 1000, //transition duration (milliseconds)
			descreveal: "ondemand",
			togglerid: ""
		})		
	});
	

	if (property_id != '')
	{
		values_array = document.getElementById('id_values').value.split("~");

		for ( var i in values_array ){
			document.getElementById(values_array[i]).className='prop_regular';
			
			
			setAttribute (document.getElementById(values_array[i]), "onMouseOut", "this.className='prop_regular'");
			
			//document.getElementById(values_array[i]).onmouseout="this.className='prop_regular'";
		}

		
		document.getElementById(property_id).className='prop_selected';
		setAttribute (document.getElementById(property_id), "onMouseOut", "this.className='prop_selected'");
	}
}


function update_panoramic(property_id, image_id, currentpage) {	
	var url="/ajax/ajax_update_panoramic.php?property_id=" + property_id + "&image_id=" + image_id + "&currentpage=" + currentpage;
	$.get(url, "", function(data){			
		response_array = data.split("|||");
		document.getElementById('replace_panoramic').style.backgroundImage = "url(/" + response_array[0] + ")";	
		//reset page nav
		document.getElementById('pagenavigation').innerHTML = response_array[1];
		
		w =  response_array[2];
		PhotoNav.init('pano_navigate', 398, w);
	});
}



function hideDetailViews()
{
	var zPropLanding = document.getElementById("prop_landing");
	var zBuildingView = document.getElementById("prop_buildinginfo");
	var zPanoramicView = document.getElementById("prop_panoramic");
	var zExploreView = document.getElementById("prop_explore");
	var zFloorplansView = document.getElementById("prop_floorplans");
	
	if(zPropLanding)
	{
		zPropLanding.style.display = "none";
	}
	if(zBuildingView)
	{
		zBuildingView.style.display = "none";
	}
	if(zPanoramicView)
	{
		zPanoramicView.style.display = "none";
	}
	if(zExploreView)
	{
		zExploreView.style.display = "none";
	}
	if(zFloorplansView)
	{
		zFloorplansView.style.display = "none";
	}
}

function showDetailView( pViewId )
{
	var zDetailView = document.getElementById(pViewId);
	
	if(zDetailView)
	{
		zDetailView.style.display = "block";
	}

}

function clearButtonsState()
{
	var zBtnBuilding = document.getElementById("buildinginfo");
	var zBtnPanoramic = document.getElementById("panoramic");
	var zBtnExplore = document.getElementById("explore");
	var zBtnFloorplans = document.getElementById("floorplans");

	if(zBtnBuilding)
	{
		zBtnBuilding.src = "images/clear_2x2.gif";
	}
	if(zBtnPanoramic)
	{
		zBtnPanoramic.src = "images/clear_2x2.gif";
	}
	if(zBtnExplore)
	{
		zBtnExplore.src = "images/clear_2x2.gif";
	}
	if(zBtnFloorplans)
	{
		zBtnFloorplans.src = "images/clear_2x2.gif";
	}
}

function setButtonActive( pId )
{
	
	clearButtonsState();
	
	var zImg = document.getElementById(pId);
	
	if(zImg)
	{
		zImg.src = "images/buttons/" + pId + "_over.png";
	}
}

function toggleView( pViewId, pImgBtnId )
{
	hideDetailViews();
	showDetailView( pViewId );
	setButtonActive( pImgBtnId );
	var leftDiv = document.getElementById("propleftside");
	if (pViewId == "prop_explore") {
		leftDiv.className = "left_default_bg2";
		map.checkResize();
		map.setCenter(point, 15);	
	}
	 else {	
	   leftDiv.className = "left_default_bg";
	}
}

function init() {
 var contentDiv = document.getElementById('pio_table');
  var localDiv =  document.getElementById('search_results');
  contentDiv.innerHTML = ''; // Clear any content currently in the Div
  localDiv.innerHTML = '';
  // Next thing we have to do is build two divs to hold our stuff
  var mapContainer = document.createElement('div'); // build the map div
  mapContainer.style.height = '420px'; // set the map height
  mapContainer.style.width = '750px'; // set the map width
  mapContainer.id = "mapcontainer";

  
  controlContainer = document.createElement('div'); // build the control div
  controlContainer.style.width = '300px'; // set the control width
  controlContainer.id ="controlContainer";
  // Now we have to add these divs to the content div in the document body
  
   contentDiv.appendChild(mapContainer);
   //not showing search container now
  localDiv.appendChild(controlContainer);

  // We're ready to build our map...
  map = new google.maps.Map2(mapContainer);
//  map.setCenter(new GLatLng(47.6062095, -122.3320708));
  // ...and add a couple of controls.
  map.addControl(new google.maps.SmallMapControl()); // Add a small map control
  map.addControl(new google.maps.MapTypeControl()); // Add the map type control			
 geocoder = new GClientGeocoder();


  

  // We'll wait to the end to actually initialize the map
  // So let's build the search control
  searchControl = new google.search.SearchControl();
   searcher = new google.search.LocalSearch(); // create the object

searcher.setCenterPoint(map);
}	

function OnLoad() {

  // Create a SearcherOptions object to ensure we can see all results
  var options = new google.search.SearcherOptions(); // create the object
  options.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);

  // Add the searcher to the SearchControl
 
  searchControl.addSearcher(searcher , options);

 
 // And second, we need is a search complete callback!
  searchControl.setSearchCompleteCallback(searcher , function() {
    map.clearOverlays();
    var results = searcher.results; // Grab the results array
	 // bind the searcher to the map
    var baseIcon = new GIcon(G_DEFAULT_ICON);
     var letteredIcon = new GIcon(baseIcon);
    // We loop through to get the points
    for (var i = 0; i < results.length; i++) {
	   var letter = String.fromCharCode("A".charCodeAt(0) + i);
     //  var letteredIcon = new GIcon(baseIcon);
       letteredIcon.image = "http://www.google.com/mapfiles/marker" + letter + ".png";

	
      var result = results[i]; // Get the specific result
      var markerLatLng = new google.maps.LatLng(parseFloat(result.lat),
                                                parseFloat(result.lng));
	  markerOptions = { icon:letteredIcon };
      var marker2 = new google.maps.Marker(markerLatLng, markerOptions); // Create the marker


      // Bind information for the infoWindow aka the map marker popup
      marker2.bindInfoWindow(result.html.cloneNode(true));
      result.marker = marker2; // bind the marker to the result
      // add the marker to the map
	  map.addOverlay(marker2);
	  
    }
	
map.setCenter(point, 13);	
map.addOverlay(marker);

//marker.openInfoWindowHtml(place.address);	
map.checkResize();
	   
			  
  });

  // Draw the control
  searchControl.draw(controlContainer);

  // Set the map's center point and finish!
 // map.setCenter(new google.maps.LatLng(37.443915 , -122.163610), 11);
 
geocoder.getLocations(address, addToMap); 

 // Execute an initial search
 
  
}
function addToMap(response)
   {
      // Retrieve the object
      place = response.Placemark[0];
       
      // Retrieve the latitude and longitude
      point = new GLatLng(place.Point.coordinates[1],
                          place.Point.coordinates[0]);
     
     map.setCenter(point, 15);
     var blueIcon = new GIcon(G_DEFAULT_ICON);
     blueIcon.image = "http://www.martinselig.com/images/mapicons/blank.png";
     // Set up our GMarkerOptions object
     var markerOptions = { icon:blueIcon };

     
      // Create a marker
      marker = new GMarker(point, markerOptions);
     
      // Add the marker to map
   //   map.addOverlay(marker);
      // Add address information to marker
   //   marker.openInfoWindowHtml(place.address);
	   searchControl.execute(' ');
	    // Center the map on this point
       
	
   }