Ext.onReady(function(){
		/**********
    // create the Data Store
    var store = new Ext.data.Store({
        // load using HTTP
        url: 'data/hostsites.xml',

        // the return will be XML, so lets set up a reader
        reader: new Ext.data.XmlReader({
               // records will have an "marker" tag
               record: 'marker',
               totalRecords: '@total'
           }, [
               // set up the fields mapping into the xml doc
               // The first needs mapping, the others are very basic
               'address','lat','lng'
           ]),
					 listeners: {
           	'load' : { fn: function() {console.log('adam');createMarkers(this);}},
           }
    });
		***********/
    var store = new Ext.data.JsonStore({
      url: 'gmap-ajax.php',
      totalProperty: "results",  
      root: 'marker',
      fields: ['name','lat','lng','address','address2','city','state','zipcode','phone','venueid','url'],
    	listeners: {
      	'load' : { fn: function() {createMarkers(this);}},
      }
    });

		
		var createMarkers = function(store) {
			var first = true;
			
			store.data.each(function(record) {
				var lngLat = new Array(record.data.lng, record.data.lat);
				//var marker = new GMarker(lngLat,{title:record.data.name});
        var lat = parseFloat( record.data.lat);
        var lng = parseFloat(record.data.lng);
        var point = new GLatLng(lat,lng);
				var htmlDat = '<span style=\'font-weight:bold;\'>'+record.data.name+'</span><br>'+record.data.address+'<br>'+record.data.city+'<br>'+record.data.state+'<br>'+record.data.zipcode+'<br>'+record.data.phone
				
				if (record.data.url != '')
					htmlDat += '<br><a href="'+record.data.url+'" class="mapLink"	target="_new">Go to website</a>';
					
				htmlDat += '<br><br><a href="home.php?cat=1&vid='+record.data.venueid+'" class="mapLink"	>Click here for class info</a>';

				createMarker(record,point,'adam',htmlDat);					 	
			});	
		};
		
		var createMarker = function (record,point,name,html) {
  		var map = Ext.getCmp('map').getMap();
  				var marker = new GMarker(point,{title:record.data.name});
  				record.set('marker', marker);
  				marker.record = record;
  					GEvent.addListener(marker, "click", function() {					
  					marker.openInfoWindowHtml(html);												
  				});
  		map.addOverlay(marker);
  		};


 var mapwin = new Ext.Panel({
    autoEl: {},
		width:550,
              height:450,
		title: 'Map of all hostsites',
		footer: true,
    items: {
		id: 'map',
    xtype: 'gmappanel',
    region: 'center',
    zoomLevel: 3,
    gmapType: 'map',
    mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
    mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
    setCenter: {
  		lat: 33.434623,
  		lng: -94.043099
		}
    },
    listeners: {
    	'render' : { fn: function() { store.load();}},
    }
 });
 
 mapwin.render('gmap-display'); // end state selector	


});