$().ready(function () {
		ourExpertsObj = new OurExperts();
	});
	
	var OurExperts		= {};
	var ourExpertsObj 	= null;
	OurExperts = PTM.extend({
	    init: function(){
			this._super();
			
			this.recent_trips =  (typeof(recent_trips) == 'undefined')?[]:recent_trips;
			this.upcoming_trips =  (typeof(upcoming_trips) == 'undefined')?[]:upcoming_trips;
			
			this.ui = {};
			this.ui.map = null;
			this.ui.map_init = (typeof(init_map) == 'undefined')?false:init_map;
			this.ui.markers = new Array();
			this.ui.marker = {};
			this.ui.marker.image 	= null;
			this.ui.marker.shadow 	= null;
			this.ui.marker.shape 	= null;
			
			this.resetUi();
		},
		resetUi: function(){
			if(this.ui.map_init === true){
				this.googleMapInit();
			}
		},
		tabUi: function() {
			$("#agent_info ul").idTabs(this.ui.default_tab);
		},
		googleMapInit: function() {
			var latlng = new google.maps.LatLng(26.116, 14.414);
		    var myOptions = {
		      zoom: 0,
		      center: latlng,
		      disableDefaultUI: true,
		      mapTypeId: google.maps.MapTypeId.ROADMAP
		    };
		    this.ui.map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
		    this.googleMarkerInit();
		    this.addMarkers();
		},
		googleMarkerInit: function() {
			this.ui.marker.image = new google.maps.MarkerImage('/assets/images/ptmflag.png',
				      // This marker is 20 pixels wide by 32 pixels tall.
				      new google.maps.Size(10, 16),
				      // The origin for this image is 0,0.
				      new google.maps.Point(0,0),
				      // The anchor for this image is the base of the flagpole at 0,32.
				      new google.maps.Point(0, 16)
			);
			this.ui.marker.shadow = new google.maps.MarkerImage('/assets/images/ptmflag_shadow.png',
			      // The shadow image is larger in the horizontal dimension
			      // while the position and offset are the same as for the main image.
			      new google.maps.Size(19, 16),
			      new google.maps.Point(0,0),
			      new google.maps.Point(0, 16)
			);
			      // Shapes define the clickable region of the icon.
			      // The type defines an HTML <area> element 'poly' which
			      // traces out a polygon as a series of X,Y points. The final
			      // coordinate closes the poly by connecting to the first
			      // coordinate.
			this.ui.marker.shape = {
			      coord: [1, 1, 1, 10, 9, 10, 9 , 1],
			      type: 'poly'
			};
		},
		addMarkers: function() {
			var location = {};
			var total = 0;
			total = this.recent_trips.length;
			if(total){
				for(var i=0;i<total;++i){
					location = {};
					location.address = this.recent_trips[i].location;
					location.lng_lat = this.explode(',',this.recent_trips[i].latlng);
					if(location.lng_lat.length){
						this.setMarker(location);
					}
				}
			}
			total = this.upcoming_trips.length;
			if(total){
				for(var i=0;i<total;++i){
					location = {};
					location.address = this.upcoming_trips[i].location;
					location.lng_lat = this.explode(',',this.upcoming_trips[i].latlng);
					if(location.lng_lat.length){
						this.setMarker(location);
					}
				}
			}
		},
		setMarker: function(location) {
		    var myLatLng = new google.maps.LatLng(location.lng_lat[1],location.lng_lat[0]);
		    this.ui.markers[location.agent_trip_id] = new google.maps.Marker({
		        position: myLatLng,
		        map: this.ui.map,
		        shadow: this.ui.marker.shadow,
		        icon: this.ui.marker.image,
		        shape: this.ui.marker.shape,
		        title: location.address
		    });
		}
	});