function TFMap(divId, opt) {
	var me = this;

	var defaults = {map: {height:290, theme:'tf1', appendHd:true, actOMS:true, trafficLyr:false, resize:{cb:null}, shwPlcsAlwys:false}, pkgView:null};
	this.opts = $jQ.extend(true, {}, defaults, opt || {});
	this.currentMapProps = null;
	this.mapC = {}; this.isMax = false; this.directionsService = null;

	var hoverState = {timer:0, delay:500, box:null, boxId:null, moutFn:null, moutFnParam:null};

	this.FOCUSED_PLACE = null;
	this.PLACES_DATA = []; this.HOTELS_DATA = [];
	this.markersMap = {}; this.polylineMap = {};

	this.initialize = function(afterInitCallback) {
		me.afterInitCallback = afterInitCallback;
		me.mapC.parent = divId ? $jQ(divId): $jQ('<div>');
		me.mapC.mapH = $jQ('<div class="map">').css("height", me.opts.map.height ? me.opts.map.height + "px": "100%");
		me.mapC.mapH.append('<div class="u_alignC u_vsmallF waiting2 paWait"><b>Loading ...</b></div>');
		me.mapC.parent.append(me.mapC.mapH);

		this.loadMapScripts(this.initializeMap);
	}
	this.loadMapScripts = function(cb) {
		window._gmapLoaded = function() {
			initTFMarker();
			me.directionsService = new google.maps.DirectionsService();
			// load map utils
			$jQ.ajax({url:'/static/js/gmap/map_utils-v1.7.js',
				dataType:'script', cache:true, success: function() {
					cb();
				}});
		};
		if (window.google !== undefined && window.google.maps !== undefined) {
			if (window.MAP_UTIL !== undefined) {cb(); return;}
			_gmapLoaded(); return;
		}
		var s = document.createElement("script");
		s.type = "text/javascript"; s.src  = "//maps.googleapis.com/maps/api/js?key=AIzaSyB9pT2IxXZwk-jt2l7OdDaSwPQALOlM9zo&v=3&libraries=places,geometry,drawing&callback=_gmapLoaded";
		$jQ('head').append(s);
	}

	this.initializeMap = function() {
		me.mapTypeControlOptions = {
			style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
			position: google.maps.ControlPosition.TOP_LEFT
		};

		me.zoomControlOptions = {
			style: google.maps.ZoomControlStyle.DEFAULT,
			position: google.maps.ControlPosition.RIGHT_BOTTOM
		};

		var myOptions = {
			    zoom: MAP_UTIL.initialZoomLevel, scrollwheel:false,
			    center: new google.maps.LatLng(0, 0),
			    mapTypeId: google.maps.MapTypeId.ROADMAP, mapTypeControl:false, streetViewControl:false,
		    	// mapTypeControlOptions: me.mapTypeControlOptions,
			    zoomControlOptions: me.zoomControlOptions
			};

		me.gmap = new google.maps.Map(me.mapC.mapH.get(0), myOptions);
		if (MAP_UTIL.mapStyles[me.opts.map.theme]) {
			me.gmap.setOptions({styles: MAP_UTIL.mapStyles[me.opts.map.theme]});
		}
		if (me.opts.map.trafficLyr) {
			me.setTrafficLayer(true);
		}

		me.geocoder = new google.maps.Geocoder();
		me.overlay = new google.maps.OverlayView();
		me.overlay.draw = function() {};
		me.overlay.setMap(me.gmap);
		if (me.opts.actOMS) {me.oms = MAP_UTIL.createOms(me.gmap);}
		if (me.afterInitCallback) {me.afterInitCallback();}
	}
	this.setupEditableLocationMarker = function(opts) {
	    opts = $jQ.extend({}, {lat:null, lng:null}, opts || {});
		me.isEditMode = true;
		me.clearEditableMarker();
		if (opts.lat) {
			var point = new google.maps.LatLng(opts.lat, opts.lng);
			me.gmap.setCenter(point);
			me.gmap.setZoom(16);
			me.createEditableMarker(point);
		}
	}
	this.getParentCtr = function() {
		return me.mapC.parent;
	}
	this.searchOnMap = function(str, opts) {
	    opts = $jQ.extend({}, {clbk:null, zoom:16}, opts || {});
	    if (!str) return;
		me.geocoder.geocode({'address':str}, function(results, status) {
			if (status == google.maps.GeocoderStatus.OK) {
				me.gmap.setCenter(results[0].geometry.location);
				MAP_UTIL.smoothZoom(me.gmap, opts.zoom, me.gmap.getZoom());
				if (me.isEditMode) {
					me.clearEditableMarker();
					me.createEditableMarker(results[0].geometry.location);
					$jQ(document).trigger('mrkrposupdate', [{lat:results[0].geometry.location.lat(), lng:results[0].geometry.location.lng()}, me]);
				}
				me.gmap.panTo(results[0].geometry.location);
				if (opts.clbk) opts.clbk(results[0]);
			} else {
				console.log('Error: search not successful: ' + status);
			}
		});
	}
	this.clearEditableMarker = function() {
		if (!me.editMarker) return;
		me.editMarker.setMap(null);
		me.editMarker = null;
	}
	this.createEditableMarker = function(latLng) {
		me.editMarker = new google.maps.Marker({map:me.gmap, position:latLng, icon:getMapMarkerIcon(cityMarkerIcon())});
		me.editMarker.setDraggable(true);

		google.maps.event.addListener(me.editMarker, 'click', function(event) {
			var point = me.editMarker.getPosition();
			if (point) $jQ(document).trigger('mrkrposupdate', [{lat:point.lat(), lng:point.lng()}, me]);
		});
		google.maps.event.addListener(me.editMarker, 'dragend', function(event) {
			var point = me.editMarker.getPosition();
			if (point) $jQ(document).trigger('mrkrposupdate', [{lat:point.lat(), lng:point.lng()}, me]);
		});
		return me.editMarker;
	}
	this.getProjection = function() {
		return me.overlay.getProjection();
	}
	this.setTrafficLayer = function(on) {
		if (on) {
			if (!me.trafficLayer) me.trafficLayer = new google.maps.TrafficLayer();
			me.trafficLayer.setMap(me.gmap);
		} else if (!me.trafficLayer) {
			me.trafficLayer.setMap(null);
		}
	}
	this.setResizeOpts = function(opts) {
		me.opts.map.resize = $jQ.extend({}, me.opts.map.resize, opts || {});
	}
	this.triggerResize = function() {
		var center = me.gmap.getCenter(); 
		google.maps.event.trigger(me.gmap, 'resize');
		me.gmap.setCenter(center);
	}
	this.adjustMapSize = function() {
		if (me.gmap) {
			var mapCenter = me.gmap.getCenter();
			google.maps.event.trigger(me.gmap, 'resize');
			me.gmap.setCenter(mapCenter);
		}
	}
	this.resizeMap = function(isMx) {
		isMx = (isMx == undefined) ? !me.isMax: isMx; me.isMax = isMx;
		JS_UTIL.toggleFullScr(me.mapC.parent, isMx);
		var mapClsJ = $jQ('.mapCls', me.mapC.parent);
		if (mapClsJ.length == 0) {
			mapClsJ = $jQ('<div class="mapCls">&#x2715;</div>').appendTo(me.mapC.parent);
			mapClsJ.click(function() {
				me.resizeMap(false);
				return false;
			});
		}
		mapClsJ.toggle(isMx);
		var offset = 0;
		if (me.isMax) me.mapC.mapH.css("height", 'auto');
		else me.mapC.mapH.css("height", me.opts.map.height ? me.opts.map.height + "px": "100%");
		me.adjustMapSize();
		if (me.opts.map.resize.cb) me.opts.map.resize.cb(me.isMax);
	}
	this.addControlDiv = function(htmlDiv, add) {
		if (add) {
			me.gmap.controls[MAP_UTIL.ctrlBxPos].clear();
			me.gmap.controls[MAP_UTIL.ctrlBxPos].push(htmlDiv);
		} else {
			me.gmap.controls[MAP_UTIL.ctrlBxPos].clear();
		}
	}
	this.addControlElement = function(id, ctrlJ, prntCls, add) {
		var eJ = $jQ(id, me.mapC.parent);
		if (add) {
			if (eJ.length == 0) me.mapC.parent.append(ctrlJ);
			if (prntCls) me.mapC.parent.addClass(prntCls);
		} else if (eJ.length > 0) {
			eJ.remove();
			if (prntCls) me.mapC.parent.removeClass(prntCls);
		}
		me.adjustMapSize();
	}
	this.setCurrentMapProps = function(mapProps) {
		me.currentMapProps = mapProps;
	}
	this.moveToMapViewProps = function(props) {
		if (props && props.lt && props.ln && props.zoom) {
			var centerLatLngDummy = new google.maps.LatLng(props.lt-0.00001, props.ln-0.00001);
			var centerLatLng = new google.maps.LatLng(props.lt, props.ln);
			me.gmap.setCenter(centerLatLngDummy);
			me.gmap.setCenter(centerLatLng);

			var currentZoom = me.gmap.getZoom();
			MAP_UTIL.smoothZoom(me.gmap, props.zoom, currentZoom);
			return true;
		}
		return false;
	}
	this.isCurrentViewportMatchesMapProps = function(mapProps) {
		if (!mapProps || !mapProps.lt) return true;
		var mapBounds = me.gmap.getBounds();
		if (!mapBounds) return true;
		var ltLng = new google.maps.LatLng(mapProps.lt, mapProps.ln);
		if (!mapBounds.contains(ltLng) || me.gmap.getZoom() != mapProps.zoom) {
			return false;
		}
		return true;
	}
	this.checkMarkersOnMapAndFarApart = function(markers) {
		if (!markers) return true;
		var mapBounds = me.gmap.getBounds();
		if (!mapBounds) return true;
		var overlay = new google.maps.OverlayView();
		overlay.draw = function() {};
		overlay.setMap(me.gmap);
		var nePt = overlay.getProjection().fromLatLngToDivPixel(mapBounds.getNorthEast());
		var swPt = overlay.getProjection().fromLatLngToDivPixel(mapBounds.getSouthWest());
		var mnPt = new google.maps.Point(-1000, -1000), mxPt = new google.maps.Point(0, 0);
		for (var i = 0; i < markers.length; i++ ) {
			var isInMap = mapBounds.contains(markers[i].getPosition());
			if (!isInMap) return false;
			var pt = overlay.getProjection().fromLatLngToDivPixel(markers[i].getPosition());
			if (mnPt.x == -1000 || pt.x < mnPt.x) {mnPt.x = pt.x;}
			if (mnPt.y == -1000 || pt.y < mnPt.y) {mnPt.y = pt.y;}
			if (pt.x > mxPt.x) {mxPt.x = pt.x;}
			if (pt.y > mxPt.y) {mxPt.y = pt.y;}
		}
		overlay.setMap(null);
		if ((nePt.x - swPt.x) * 0.10 > (mxPt.x - mnPt.x) && (swPt.y - nePt.y) * 0.10 > (mxPt.y - mnPt.y)) {return false;}
		return true;
	}
	// Call back when the current event has started
	this.cbEvent = function (callBackMethodStart, callBackMethodEnd) {
		// console.log('*********** CALL BACK Events Setter callBackMethodStart and callBackMethodEnd');
		// console.log('*********** CALL BACK Events Setter: ' + callBackMethodStart + ', ' + callBackMethodEnd);
		me.eventStartCBMethod = callBackMethodStart;
		me.eventStopCBMethod = callBackMethodEnd;
	}
	function logEvent(caller) {
		// var now = new Date();		
		// console.log('*********** CALL BACK Event LOG by: ' + caller + ' at time: ' + ' - ' + now.getTime());
		// console.log('*********** CALL BACK Event LOG by: ' + caller + ' - (' + me.eventStartCBMethod + ', ' + me.eventStopCBMethod + ') at time: ' + ' - ' + now.getTime());
	}
	function startEvent() {
		var now = new Date();
		var cbMethod = me.eventStartCBMethod;		
		me.eventStartCBMethod = null;
		if (cbMethod) {
			// console.log('>>>>>>>>>>>>>>> CALL BACK Event START called back cbMethod at time: ' + now.getTime());
			// console.log('>>>>>>>>>>>>>>> CALL BACK Event START called back: ' + cbMethod + ' at time: ' + ' - ' + now.getTime());
			cbMethod();
		}
	}
	function endEvent() {
		var now = new Date();		
		var cbMethod = me.eventStopCBMethod;		
		me.eventStopCBMethod = null;
		if (cbMethod) {
			// console.log('>>>>>>>>>>>>>>> CALL BACK Event STOP called back cbMethod at time: ' + ' - ' + now.getTime());
			// console.log('>>>>>>>>>>>>>>> CALL BACK Event STOP called back: ' + cbMethod + ' at time: ' + ' - ' + now.getTime());
			cbMethod();
		}
	}
	var autoZoomLatLng = function(latLngArr, dfZoom) {
		if (latLngArr && latLngArr.length > 1) {
			var latlngbounds = new google.maps.LatLngBounds();
			for (var i = 0; i < latLngArr.length; i++ ) {
				if (latLngArr[i].lat() && latLngArr[i].lng()) {
					latlngbounds.extend(latLngArr[i]);
				}
			}
			me.gmap.fitBounds(latlngbounds);
			//util.increaseZoom(me.gmap, -1);
		} else if (latLngArr && latLngArr.length == 1 && latLngArr[0].lat() && latLngArr[0].lng()){
			if (dfZoom) me.gmap.setZoom(dfZoom);
			me.gmap.panTo(latLngArr[0]);
		}
	}
	var autoZoomMarkers = function(markers, dfZoom) {
		var latLngArr = [];
		if (markers) {
			for (var i = 0; i < markers.length; i++ ) {
				var marker = markers[i];
				if(marker && marker.getMap()) {
					latLngArr.push(marker.getPosition());
				}
			}
		}
		autoZoomLatLng(latLngArr, dfZoom);
	}
	this.autoZoomVisibleMarkers = function(dfZoom) {
		var latLngArr = [];
		for (var k in me.markersMap) {
			var mrkr = me.markersMap[k];
			if (mrkr && mrkr.getMap() && mrkr.getVisible()) {
				latLngArr.push(mrkr.getPosition());
			}
		}
		autoZoomLatLng(latLngArr, dfZoom);
	}

	this.setHotelsData = function(htlA, opts) {
		me.HOTELS_DATA = htlA;
		repaintHotels(opts);
	}
	this.setPlacesData = function(plcA, opts) {
		me.PLACES_DATA = plcA;
		repaintPlaces(opts);
	}
	var repaintPlaces = function(opts) {
	    opts = $jQ.extend({}, {hide:false, isAddStaticLabel:false}, opts || {});
		clearMarkersWithType('PLACE');
		for (var i = 0; i <  me.PLACES_DATA.length; i++) {
			var pO = me.PLACES_DATA[i];
			var marker = me.getMarkerById('PLACE', pO.id);
			// Ignore those markers whose lat lng is not set.
			if (pO.lt == 0  || pO.ln == 0 || pO.lt <= -200  || pO.ln <= -200){
				continue;
			}

			if (marker && marker.getMap()) {
				marker.setVisible(false);
			} else {
				if (opts.isAddStaticLabel) {
					pO.staticLabel = pO.nm;
				}
				// Create the marker (hidden)
				marker = me.createPlaceMarker(pO.id, pO, '', opts);
			}

			// show the marker
			marker.setVisible(!opts.hide);
		}
	}
	var repaintHotels = function(opts) {
	    opts = $jQ.extend({}, {hide:false, isAddStaticLabel:false}, opts || {});
		clearMarkersWithType('HOTEL');
		for (var i = 0; i <  me.HOTELS_DATA.length; i++) {
			var hO = me.HOTELS_DATA[i];
			var marker = me.getMarkerById('HOTEL', hO.id);
			// Ignore those markers whose lat lng is not set.
			if (hO.lt == 0  || hO.ln == 0 || hO.lt <= -200  || hO.ln <= -200){
				continue;
			}

			if (marker && marker.getMap()) {
				marker.setVisible(false);
			} else {
				if (opts.isAddStaticLabel) {
					hO.staticLabel = hO.nm;
				}
				// Create the marker (hidden)
				marker = me.createHotelMarker(hO.id, hO, hO.st, opts);
			}

			// show the marker
			if (marker) marker.setVisible(!opts.hide);
		}
	}
	var createCityDetailHTM = function(cO, isLbl) {
		if (isLbl) {
			var cJ = $jQ('<div class="prdMpMOLbl plcMpMOLbl">');
			cJ.append('<div class="ttl">'+cO.nm+'</div>');
			return cJ;
		} else {
			var cJ = $jQ('<div class="prdMpBox plcMpBox u_block">');
			if (cO.img) cJ.append('<div class="imgBlk"><img src="'+cO.img+'"></div>');
			var iJ = $jQ('<div class="dscBlk">').appendTo(cJ);
			iJ.append('<div class="ttl"><a href="#">'+cO.nm+'</a></div>');
			if (cO.abt) iJ.append('<div class="desc">'+MAP_UTIL.trimToLength(cO.abt, 140)+'</div>');
			return cJ;
		}
	}
	var createPlaceDetailHTM = function(pO, isLbl) {
		if (isLbl) {
			var pJ = $jQ('<div class="prdMpMOLbl plcMpMOLbl">');
			pJ.append('<div class="ttl">'+pO.nm+'</div>');
			if (pO.typNm) {pJ.append('<div class="subTxt">'+pO.typNm+'</div>');}
			return pJ;
		} else {
			var pJ = $jQ('<div class="prdMpBox plcMpBox u_block">');
			if (pO.img) pJ.append('<div class="imgBlk"><img src="'+pO.img+'"></div>');
			var iJ = $jQ('<div class="dscBlk">').appendTo(pJ);
			iJ.append('<div class="ttl"><a href="'+pO.vwURL+'" target="_blank">'+pO.nm+'</a></div>');
			if (pO.typNm) {iJ.append('<div class="subTxt">'+pO.typNm+'</div>');}
			if (pO.abt) iJ.append('<div class="desc">'+MAP_UTIL.trimToLength(pO.abt, 140)+'</div>');
			return pJ;
		}
	}
	var createHotelDetailHTM = function(hO, isLbl) {
		if (isLbl) {
			var pJ = $jQ('<div class="prdMpMOLbl htlMpMOLbl">');
			pJ.append('<div class="ttl">'+hO.nm+'</div>');
			if (hO.st) pJ.append('<div><div class="srating rt'+hO.st+'"></div></div>');
			return pJ;
		} else {
			var pJ = $jQ('<div class="prdMpBox htlMpBox">');
			if (hO.img) pJ.append('<div class="imgBlk"><img src="'+hO.img+'"></div>');
			var iJ = $jQ('<div class="dscBlk">').appendTo(pJ);
			iJ.append('<div class="ttl">'+(hO.vwURL?'<a href="'+hO.vwURL+'" target="_blank">'+hO.nm+'</a>':hO.nm)+'</div>');
			if (hO.st) iJ.append('<div><div class="srating rt'+hO.st+'"></div></div>');
			if (hO.desc) iJ.append('<div class="desc">'+MAP_UTIL.trimToLength(hO.desc, 140)+'</div>');
			return pJ;
		}
	}
	this.renderPackage = function(pO, dtO, opts) {
		if (!pO || !dtO) return;
	    opts = $jQ.extend(true, {}, {incItnDays:true, showRouteInfo:false, hideMrkrs:false, rmvMrkr:false, clrOthrMrkrs:false, lineOpts:{quadratic:true}}, opts || {});
	    if (opts.clrOthrMrkrs) {
	    	me.clearMarkersWithType('HOTEL'); me.clearMarkersWithType('PLACE');
	    	me.closeInfoBox(false);
	    }
		if (pO.cCnt == 1) {
			for (var i=0;i<pO.cKys.length;i++) {
				var htlA = pO.hts ? pO.hts[pO.cKys[i]]: null, hO = htlA && dtO.hotels ? dtO.hotels[htlA[0].hId]: null;
				var cfg = pO.ctCfg[pO.cKys[i]], ctO = dtO.cities[cfg.id];
				if (opts.hideMrkrs) {me.showHideMarker(me.getMarkerById('HOTEL', hO.id), false);}
				else if (opts.rmvMrkr) {me.removeMarker(me.getMarkerById('HOTEL', hO.id));}
				else if (hO) {var mrkr = me.createHotelMarker(hO.id, hO, hO.st, {});}
				else if (ctO) {
					ctO.staticLabel = ctO.nm + (opts.incItnDays ? '<br>'+cfg.itnDys: '');
					var mrkr = me.createCityMarker(ctO.id, ctO, '', {showOnMO:false});
					if (opts.ctyClbk) {
						$jQ('.ttl a', mrkr.m_contentJ).click(function() {
							opts.ctyClbk(cky, ctO); return false;
						});
					}
				}

				// also create a hidden city marker
				if (opts.hideMrkrs) {me.showHideMarker(me.getMarkerById('CITY', ctO.id), false);}
				else if (opts.rmvMrkr) {me.removeMarker(me.getMarkerById('CITY', ctO.id));}
				else {var mrkr = me.getMarkerById('CITY', ctO.id);}
			}
			if (!opts.hideMrkrs && !opts.rmvMrkr) me.autoZoomVisibleMarkers(11);
		} else {
			var lastCity = null;
			$jQ.each(pO.cKys, function(i, cky) {
				var cfg = pO.ctCfg[cky], ctO = dtO.cities[cfg.id];
				var mrkr = me.getMarkerById('CITY', ctO.id);

				if (opts.hideMrkrs) {me.showHideMarker(mrkr, false);}
				else if (opts.rmvMrkr) {me.removeMarker(mrkr);}
				else {
					ctO.staticLabel = ctO.nm + (opts.incItnDays ? '<br>'+cfg.itnDys: '');
					mrkr = me.createCityMarker(ctO.id, ctO, '', {showOnMO:false});
					if (opts.ctyClbk) {
						$jQ('.ttl a', mrkr.m_contentJ).click(function() {
							opts.ctyClbk(cky, ctO); return false;
						});
					}
				}
				if (lastCity) {
					var lnId = lastCity.id+'-'+ctO.id, rtO = opts.showRouteInfo && dtO.rts ? dtO.rts[lnId]:null;
					var lnLbl = rtO ? rtO.dD+'<br>'+rtO.tmD: null;
					if (opts.hideMrkrs || opts.rmvMrkr) {me.clearPolylines(lnId);}
					else {me.createCustomPolyline(lnId, null, [lastCity, ctO], $jQ.extend({}, {label:lnLbl}, opts.lineOpts));}
				}
				lastCity = ctO;
			});
			if (!opts.hideMrkrs && !opts.rmvMrkr) me.autoZoomVisibleMarkers(11);
		}
	}
	this.createCityMarker = function(id, cO, singleLetterRep, opts) {
		if (!cO.lt  || !cO.ln || cO.lt <= -200  || cO.ln <= -200) return null;
	    cO.latLng = new google.maps.LatLng(cO.lt, cO.ln);

	    opts = $jQ.extend({}, {hide:false, showFIcon:true, showOnMO:true, showLblOnMO:true}, opts || {});
		MAP_UTIL.highestZIndexCities++;
		cO.zIndexVal = MAP_UTIL.highestZIndexCities; cO.zoomLevel = MAP_UTIL.cityClickZoomLevel;
		var iconUrl = cityHlMarkerIcon(singleLetterRep);
		var dIconUrl = cityMarkerIcon(singleLetterRep);
		var iconObj = getMapMarkerIcon(iconUrl);
		var dIconObj = getMapMarkerIcon(dIconUrl);

		var mrkr = createMarker('CITY', id, cO.nm, cO.nm, cO, iconObj, dIconObj, null, opts);
		mrkr.m_contentJ = opts.contentJ ? opts.contentJ: (cO.m_contentJ ?cO.m_contentJ: createCityDetailHTM(cO, false));
		mrkr.m_labelJ = opts.labelJ ? opts.labelJ: createCityDetailHTM(cO, true);

		return mrkr;
	}
	this.createPlaceMarker = function(id, pO, singleLetterRep, opts) {
		if (!pO.lt  || !pO.ln || pO.lt <= -200  || pO.ln <= -200) return null;
	    pO.latLng = new google.maps.LatLng(pO.lt, pO.ln);

	    opts = $jQ.extend({}, {hide:false, showFIcon:true, showOnMO:true, showLblOnMO:true}, opts || {});
		MAP_UTIL.highestZIndexPlaces++;
		pO.zIndexVal = MAP_UTIL.highestZIndexPlaces; pO.zoomLevel = MAP_UTIL.placeClickZoomLevel;
		var iconUrl = placeHlMarkerIcon(singleLetterRep, pO);
		var dIconUrl = placeMarkerIcon(singleLetterRep);
		var iconObj = getMapMarkerIcon(iconUrl);
		var dIconObj = getMapMarkerIcon(dIconUrl);
		var miniIconObj = getMapMarkerIcon(placeMiniMarkerIcon(singleLetterRep, pO));

		var mrkr = createMarker('PLACE', id, pO.nm, pO.nm, pO, iconObj, dIconObj, miniIconObj, opts);
		mrkr.m_contentJ = opts.contentJ ? opts.contentJ: createPlaceDetailHTM(pO, false);
		mrkr.m_labelJ = opts.labelJ ? opts.labelJ: createPlaceDetailHTM(pO, true);

		return mrkr;
	}
	this.createHotelMarker = function(id, hO, singleLetterRep, opts) {
		if (!hO.lt  || !hO.ln || hO.lt <= -200  || hO.ln <= -200) return null;
	    hO.latLng = new google.maps.LatLng(hO.lt, hO.ln);

	    opts = $jQ.extend({}, {hide:false, showFIcon:true, showOnMO:true, showLblOnMO:true}, opts || {});
		MAP_UTIL.highestZIndexHotels++;
		hO.zIndexVal = MAP_UTIL.highestZIndexHotels; hO.zoomLevel = MAP_UTIL.hotelClickZoomLevel;
		var iconUrl = hotelHlMarkerIcon(singleLetterRep, hO);
		var dIconUrl = hotelMarkerIcon(singleLetterRep);
		var iconObj = getMapMarkerIcon(iconUrl);
		var dIconObj = getMapMarkerIcon(dIconUrl);
		var miniIconObj = getMapMarkerIcon(hotelMiniMarkerIcon(singleLetterRep, hO));

		var mrkr = createMarker('HOTEL', id, hO.nm, hO.nm, hO, iconObj, dIconObj, miniIconObj, opts);
		mrkr.m_contentJ = opts.contentJ ? opts.contentJ: createHotelDetailHTM(hO, false);
		mrkr.m_labelJ = opts.labelJ ? opts.labelJ: createHotelDetailHTM(hO, true);
  		if (me.oms) {me.oms.addMarker(mrkr);}

		return mrkr;
	}
	this.createCustomMarker = function(id, obj, singleLetterRep, opts) {
		if (!obj.lt  || !obj.ln || obj.lt <= -200  || obj.ln <= -200) return null;
		obj.latLng = new google.maps.LatLng(obj.lt, obj.ln);

		opts = $jQ.extend({}, {plTyp:'CUSTOM', hide:false, showFIcon:true, showOnMO:true, showLblOnMO:true, clkClbk:null}, opts || {});
		MAP_UTIL.highestZIndexPlaces++;
		obj.zIndexVal = MAP_UTIL.highestZIndexPlaces; obj.zoomLevel = MAP_UTIL.placeClickZoomLevel;
		var iconUrl = placeHlMarkerIcon(singleLetterRep, obj);
		var dIconUrl = placeMarkerIcon(singleLetterRep);
		var iconObj = getMapMarkerIcon(iconUrl, obj);
		var dIconObj = getMapMarkerIcon(dIconUrl, obj);
		var miniIconObj = getMapMarkerIcon(placeMiniMarkerIcon(singleLetterRep, obj));

		var mrkr = createMarker(opts.plTyp, id, obj.nm, obj.nm, obj, iconObj, dIconObj, miniIconObj, opts);
		mrkr.m_contentJ = obj.content;
		mrkr.m_labelJ = obj.label;
		return mrkr;
	}
	var createMarker = function(plType, id, name, labelText, obj, iconObj, dIconObj, miniIconObj, opts) {
		opts = $jQ.extend({}, {hide:false, showFIcon:true, staticLblCls:'', clkClbk:null}, opts || {});
		var mrkr = me.getMarkerById(plType, id);
		if (mrkr) me.removeMarker(mrkr);
		if (opts.isHTML) {
			mrkr = new TFMarker(obj.latLng, me.gmap, opts);
		} else {
			mrkr = new google.maps.Marker({map: me.gmap, position: obj.latLng, zIndex: obj.zIndexVal});
			mrkr.setIcon(opts.showFIcon ? iconObj: dIconObj);
		}
		if (opts.hide) mrkr.setVisible(false);

		mrkr.isHTML = !!opts.isHTML;
		mrkr.m_plType = plType;
		mrkr.m_id = id;
		mrkr.m_nm = name;
		mrkr.m_obj = obj; mrkr.m_latLng = obj.latLng;
		mrkr.m_label = labelText;
		mrkr.m_icon = iconObj; mrkr.m_dIcon = dIconObj; mrkr.m_miniIcon = miniIconObj;
		mrkr.opts = opts;

		me.markersMap[plType + id] = mrkr;
		if (opts.showOnMO) {
			var markerMOver = function() {
				callMoMarker(mrkr, true, false, opts.showLblOnMO, true);
			}
			var markerMOut = function() {
				callMoMarker(mrkr, false, false, opts.showLblOnMO, true);
			}
			attachMouseListenersToMarker(mrkr, markerMOver, markerMOut);
		}

		mrkr.m_clickListener = function(event) {
			markerClickListener(mrkr, false, mrkr.opts);
			if (opts.isHTML) {cancelEvent(event);}
			if (opts.clkClbk) {
				opts.clkClbk(obj, mrkr);
			} 
		}; 
		google.maps.event.addListener(mrkr, 'click', mrkr.m_clickListener);

		if (obj.staticLabel) {
			mrkr.m_labelInfoBox = createBasicInfoBoxLabel(obj.latLng, obj.staticLabel, mrkr.m_clickListener, {clazz:opts.staticLblCls, zIndex:obj.zIndexVal, open:!opts.hide});
		}
		return mrkr;
	}
	this.setMarkerStaticLabel = function(mrkr, txt, cls) {
		if (!mrkr) return;
		if (!mrkr.m_labelInfoBox) {
			mrkr.m_labelInfoBox = createBasicInfoBoxLabel(mrkr.m_latLng, txt, mrkr.m_clickListener, {clazz:cls?cls:'', zIndex:mrkr.m_obj.zIndexVal});
		} else {
			mrkr.m_labelInfoBox.setContent(txt);
			if (cls) {mrkr.m_labelInfoBox.setOptions({boxClass:'mapMSLbl ' + cls});}
		}
	}
	this.getMarkerById = function(plTyp, id) {
		if (plTyp) {return me.markersMap[plTyp+id];}
		var mrkr = me.markersMap['PLACE'+id]; if (mrkr) return mrkr;
		mrkr = me.markersMap['HOTEL'+id]; if (mrkr) return mrkr;
		return null;
	}
	this.getMarkerDetailHTM = function(plTyp, id) {
		var mrkr = me.getMarkerById(plTyp, id);
		if (!mrkr || !mrkr.m_contentJ) return null;
		return mrkr.m_contentJ.clone();
	}
	this.setCenterOnMarkerAndZoom = function(mrkr) {
		if (!mrkr) return;
		me.gmap.setCenter(mrkr.m_latLng);
		MAP_UTIL.smoothZoom(me.gmap, mrkr.m_plType == 'HOTEL' ? MAP_UTIL.hotelClickZoomLevel: MAP_UTIL.placeClickZoomLevel, me.gmap.getZoom());
	}
	this.setMarkerIcon = function(mrkr, showFIcon) {
		if (!mrkr) return;
		mrkr.opts.showFIcon = showFIcon;
		mrkr.setIcon(showFIcon ? mrkr.m_icon: mrkr.m_dIcon);
	}
	this.removeMarker = function(mrkr) {
		if (!mrkr) return;
		if (me.oms) {me.oms.removeMarker(mrkr);}
		mrkr.setMap(null);
		if(mrkr.m_labelInfoBox) {
			mrkr.m_labelInfoBox.close();
		}
		delete me.markersMap[mrkr.m_plType+mrkr.m_id];
	}
	this.showHideMarkers = function(shw, type, mrkrs) {
		if (!me.markersMap) return;
		$jQ.each(me.markersMap, function(key, mrkr) {
			if (!mrkr) return;
			if (type && type != mrkr.m_plType) return;
			if (mrkrs && mrkrs.length > 0 && $jQ.inArray(mrkr, mrkrs) == -1) return;

			mrkr.setVisible(shw);
			if (mrkr.m_labelInfoBox) mrkr.m_labelInfoBox.setVisible(shw);
		});
	}
	this.showHideMarker = function(mrkr, shw) {
		if (!mrkr) return;
		mrkr.setVisible(shw);
		if (mrkr.m_labelInfoBox) mrkr.m_labelInfoBox.setVisible(shw);
	}
	this.clearMarkersWithType = function(type) {
		clearMarkersWithType(type);
	}
	var clearMarkersWithType = function(plType) {
		if (me.markersMap) {
			$jQ.each(me.markersMap, function(key, marker){
				if(marker) {
					if (!plType || (marker.m_plType && marker.m_plType == plType)) {
						if (me.oms) {me.oms.removeMarker(marker);}
						marker.setMap(null);
						if(marker.m_labelInfoBox) {
							marker.m_labelInfoBox.close();
						}
						marker = null;
						delete me.markersMap[key];
					}
				}
			});
		}
	}
	var attachMouseListenersToMarker = function(marker, markerMOver, markerMOut){
		marker.m_markerMoutDisabled = false;
		// This will be set as true later by the infobox to disable the mouseout on the markerOrClusterer

		var markerMoListener = function(event) {
			if (markerSingleBoxMouseover(marker.m_id, markerMOut)) {
				markerMOver();
			}
		}; 
		google.maps.event.addListener(marker, 'mouseover', markerMoListener);
		marker.m_markerMoListener = markerMoListener;

		var markerMoutListener = function(event) {
			if (marker.isHTML) markerMOut();
			else markerSingleBoxMouseout(marker, markerMOut);
		}; 
		google.maps.event.addListener(marker, 'mouseout', markerMoutListener);
		marker.m_markerMoutListener = markerMoutListener;
	}
	var createBasicInfoBoxLabel = function(latLng, content, clickListener, opts) {
		opts = $jQ.extend({}, {width:70, ofsWd:null, ofsHt:null, clazz:'', open:true, zIndex:1, pane:"overlayLayer"}, opts || {});
		var contentJQ = $jQ('<div>').append(content);
		if (clickListener) contentJQ.click(clickListener);
		var pixelOffset = new google.maps.Size(opts.ofsWd ? opts.ofsWd: (-1 * opts.width / 2), opts.ofsHt ? opts.ofsHt: 1);

		var myOptions = {content: contentJQ,
				boxClass:'mapMSLbl ' + opts.clazz, boxStyle:{width:opts.width+"px"}, zIndex:opts.zIndex,
				disableAutoPan:true, pixelOffset:pixelOffset, position:latLng, closeBoxURL: "",
				isHidden:false, pane:opts.pane, enableEventPropagation:true
		};

		var ibLabel = new InfoBox(myOptions);
		ibLabel.m_positionFixed = true;
		if (opts.open) ibLabel.open(me.gmap);
		return ibLabel;
	}
	var createMoCustomInfoBoxLabel = function(latLng, content, id, markerOrClusterer, cluster, opts) {
		opts = $jQ.extend({}, {width:220, isLbl:false, isOnClk:false, allowMOOnCnt:false}, opts || {});
		var contentJQ = $jQ('<div class=\'boxPopout\'>').append(content) ;

		if (opts.allowMOOnCnt) {
			contentJQ.mouseover(function() {
				// Disable mouse out on the marker now.
				markerOrClusterer.m_markerMoutDisabled = true;
				markerOrClusterer.m_markerMoListener(cluster);
			});
			contentJQ.mouseout(function() {
				// Enable mouse out on the marker now.
				markerOrClusterer.m_markerMoutDisabled = false;
				markerOrClusterer.m_markerMoutListener(cluster);
			});
		}

		var myOptions = {content: contentJQ,
				boxClass: opts.isLbl ? 'mapInfoBoxLbl': 'mapInfoBox', disableAutoPan:opts.isLbl,
				zIndex: google.maps.Marker.MAX_ZINDEX + 1, alignBottom:!opts.isLbl, infoBoxClearance:opts.isLbl?null:new google.maps.Size(15,50),
				pixelOffset:opts.isLbl?new google.maps.Size(-68, 10): new google.maps.Size(-140, -45), position: latLng, closeBoxURL:"",
				pane:"floatPane", enableEventPropagation:true, maxWidth:opts.width
		};
		var ibLabel = new InfoBox(myOptions);
		ibLabel.m_positionFixed = false;
		ibLabel.m_id = '' + id;
		return ibLabel;
	}
	this.createCustomPolyline = function(lineId, path, objA, opts) {
		me.clearPolylines(lineId);
		if (objA && objA.length > 0) {
			path = [];
			for (var i=0;i<objA.length; i++) {
				var obj = objA[i];
				if (!obj.lt  || !obj.ln || obj.lt <= -200  || obj.ln <= -200) continue;
				path.push(new google.maps.LatLng(obj.lt, obj.ln));
			}
		}
		opts = $jQ.extend(true, {}, {strokeColor:"blue", strokeOpacity:0.35, strokeWeight:2, geodesic:true, quadratic:false, path:path, label:null, labelOpts:{clazz:'mapLnLbl', zIndex:null, width:50, ofsHt:-16, pane:"floatPane"}}, opts || {});
		if (opts.quadratic && path.length == 2) {
			opts.path = getGeodesicLinePoints(path[0], path[1], 24, 8);
		}
		var pLn = new google.maps.Polyline(opts);
		if (lineId) {me.polylineMap[lineId] = pLn;}
		if (opts.label) {
			var lblLatLng = null;
			if (opts.path.length > 2) {lblLatLng = opts.path[Math.floor(opts.path.length/2)];}
			else {lblLatLng = google.maps.geometry.spherical.interpolate(path[0], path[1], 0.5);}
			pLn.label = createBasicInfoBoxLabel(lblLatLng, opts.label, null, opts.labelOpts);
		}
		pLn.setMap(me.gmap);
		return pLn;
	}
	this.clearPolylines = function(id) {
		if (!me.polylineMap) return;
		if (id && !me.polylineMap[id]) return;
		$jQ.each(me.polylineMap, function(key, line){
			if (!line) return;
			if (!id || key == id) {
				if (line.label) {line.label.close();}
				line.setMap(null); line = null;
				delete me.polylineMap[key];
			}
		});
	}
	this.getPolylineById = function(id) {
		return me.polylineMap[id];
	}
	function getGeodesicLinePoints(lineStart, lineEnd, n, factor) {
		if (!n) n = 32;
		var locs = [], startLat = lineStart.lat(), startLong = lineStart.lng(), endLat = lineEnd.lat(), endLong = lineEnd.lng();
	    if (!factor) factor = 5;
	    for (var k = 0; k <= n; k++) {
	        var percent = k / n, zeroOffset = (endLong - startLong) / factor, peakOffset = zeroOffset / 2, dist = zeroOffset * percent - zeroOffset;
	        var latitude = (endLat - startLat) * percent + startLat, longitude = (endLong - startLong) * percent + startLong;
	        var latitudeDifference = -Math.pow(dist + peakOffset, 2) + Math.pow(peakOffset, 2);
	        latitude = latitudeDifference + latitude;
	        zeroOffset = (endLat - startLat) / factor; peakOffset = zeroOffset / 2;
	        dist = zeroOffset * percent - zeroOffset;
	        var longitudeDifference = -Math.pow(dist + peakOffset, 2) + Math.pow(peakOffset, 2);
	        if (startLong < endLong) longitude = longitudeDifference + longitude;
	        else longitude = longitude - longitudeDifference;
	        locs.push(new google.maps.LatLng(latitude, longitude))
	    }
	    return locs
	}
	this.getDistanceBtwPoints = function(lt1, ln1, lt2, ln2) {
		return google.maps.geometry.spherical.computeDistanceBetween(new google.maps.LatLng(lt1, ln1), new google.maps.LatLng(lt2, ln2));
	}
	var plotFromToDrivingDirections = function(lineId, sLatLng, dLatLngArr, opts) {
		opts = $jQ.extend({}, {strokeColor:"blue", strokeOpacity:0.35, strokeWeight:4, roadPath:true, animate:false}, opts || {});

		var from = sLatLng, len = dLatLngArr.length, to = dLatLngArr[len-1], comment = null;
		var waypointsArr = [];	
		if (len > 1) {
			for (var i = 0; i < len-1; i++) {
				waypointsArr.push({location:dLatLngArr[i], stopover:false});
			}
		}

		var roadPathRequest = {origin:from, destination:to, provideRouteAlternatives:false, travelMode:google.maps.TravelMode.DRIVING, unitSystem:google.maps.UnitSystem.METRIC};
		if (waypointsArr.length > 0) {roadPathRequest.waypoints = waypointsArr;}

		me.directionsService.route(roadPathRequest, function(result, status) {
			if (status == google.maps.DirectionsStatus.OK) {
				if (opts.animate) {
					// Needs to be handled manually.	
					var mpLn = new google.maps.Polyline(opts);
					if (lineId) {
						me.polylineMap[lineId] = mpLn; 
					}
					mpLn.setMap(me.gmap);
					// First Route. First leg
					var myRoute = result.routes[0].legs[0];
					var overAllArr = [], polylineHead = null;
					if (myRoute.steps && myRoute.steps.length > 0) {
						var latLngArr = myRoute.steps[0].path;
						if (latLngArr && latLngArr.length > 1) {
							// We need to pick the start point of the first step.
							mpLn.getPath().push(latLngArr[0]);
							polylineHead = new google.maps.Marker({map:me.gmap, position:latLngArr[0], icon:getPolylineHeadMarkerIcon(polylineHeadMarkerIcon())});
						}

						for (var stepsIndex = 0; stepsIndex < myRoute.steps.length; stepsIndex++){
							var latLngArr = myRoute.steps[stepsIndex].path;
							for(var i = 0; i < latLngArr.length - 1; i++){
								overAllArr.push(latLngArr[i]);
							}
						}

						// Algorithm 2
						// We need to render each [jumpSize]th point.
						// jumpSize = Minimum 1, Maximum 100
						var jumpSize = 1;
						if (overAllArr.length > 100) {
							jumpSize = Math.floor(overAllArr.length / 100) ;
						} 
						if (jumpSize < 1) {jumpSize = 1;}

						var pawStepSize = overAllArr.length / 10;
						if(pawStepSize == 0) {pawStepSize = 1;}
						var currentPawStep = pawStepSize;
						// Total 3 sec?
						var delay =  (3000 * jumpSize) / overAllArr.length ;
						updatePolyline2(mpLn, polylineHead, overAllArr, comment, 0, jumpSize, currentPawStep, pawStepSize, delay);
					}
				} else {
					// Let the DirectionRenderer Handle this.	
					clearPkgDrivingDirections();
					me.pkgDrivingDirections = new google.maps.DirectionsRenderer();
					me.pkgDrivingDirections.suppressMarkers = true;
					me.pkgDrivingDirections.polylineOptions = opts;
					me.pkgDrivingDirections.setMap(me.gmap);
					me.pkgDrivingDirections.setDirections(result);
				}
			} else {
				plotFlightPath(lineId, from, dLatLngArr[0], opts);
				for (var index = 0; index < dLatLngArr.length - 1 ; index++){
					plotFlightPath(lineId + index, dLatLngArr[index], dLatLngArr[index+1], opts);
				}
			}
		});
	}
	function plotFlightPath(lineId, from, to, opts) {
		opts = $jQ.extend({}, {strokeColor:"blue", strokeOpacity:0.35, strokeWeight:4, geodesic:true, quadratic:true, animate:false}, opts || {});
		if (opts.animate) {
			var mpLn = new google.maps.Polyline(opts);
			if (lineId) {
				me.polylineMap[lineId] = mpLn; 
			}
			mpLn.setMap(me.gmap);
			mpLn.getPath().push(from);
			var polylineHead = new google.maps.Marker({map:me.gmap, position:from, icon:getPolylineHeadMarkerIcon(polylineHeadMarkerIcon())});

			var pathArr = getGeodesicLinePoints(from, to, 24, 8);
			var jumpSize = 1;
			if (pathArr.length > 100) {
				jumpSize = Math.floor(pathArr.length / 100) ;
			} 
			if (jumpSize < 1) {jumpSize = 1;}

			var pawStepSize = pathArr.length / 10;
			if(pawStepSize == 0) {pawStepSize = 1;}
			var currentPawStep = pawStepSize;
			// Total 3 sec?
			var delay =  (3000 * jumpSize) / pathArr.length ;
			updatePolyline2(mpLn, polylineHead, pathArr, null, 0, jumpSize, currentPawStep, pawStepSize, delay);
		} else {
			me.createCustomPolyline(lineId, [from, to], null, opts);
		}
	}
	// Algorithm 2
	// Used for large latLong numbers
	function updatePolyline2(pLn, pLnHd, latLngArr, labelText, index, jumpSize, currentPawStep, pawStepSize, delay) {
		if (index >= latLngArr.length) {
			setTimeout(function() {
				google.maps.event.trigger(me.gmap, 'plotComplete');
				pLnHd.setMap(null);
			}, 1000);
			return;
		} else {
			var delayThisTime = delay;
			var latLng = latLngArr[index];
			if (latLng) {
				pLnHd.setPosition(latLngArr[index]);
				pLn.getPath().push(latLngArr[index]);
			}

			if (labelText && index >= (latLngArr.length / 2) && !polyline.m_labelInfoBox) {
				var backgroundColor = "#FBD263", fontColor = "#444";
				pLn.m_labelInfoBox = createCityLabel(labelText, latLng.lat(), latLng.lng(), backgroundColor, fontColor, 150, new google.maps.Size(10, 10), null);
				delayThisTime = 3000;
			}

			index = index + jumpSize;
			setTimeout(function(){updatePolyline2(pLn, pLnHd, latLngArr, labelText, index, jumpSize, currentPawStep, pawStepSize, delay);}, delayThisTime);
			return;
		}
	}
	this.placeAtoB = function(cityId, aId, bId, show) {
		var fireEvents = true;
		var ctMrkr = me.getMarkerById('CITY', cityId);
		var aMrkr = me.getMarkerById(null, aId), bMrkr = me.getMarkerById(null, bId), aMrkrReal = true, bMrkrReal = true;
		if (!aMrkr) {aMrkrReal = false, aMrkr = ctMrkr;}
		if (!bMrkr) {bMrkrReal = false, bMrkr = ctMrkr;}

		var polylineId = aId + '_' + bId;
		if (aMrkr && bMrkr && aMrkr.m_latLng.lat() != bMrkr.m_latLng.lat() && aMrkr.m_latLng.lng() != bMrkr.m_latLng.lng()) {
			if (aMrkrReal) {
				aMrkr.keepVisible = true; highlightSingleMarker(aMrkr, true, true);
			}
			if (bMrkrReal) {
				bMrkr.keepVisible = true; highlightSingleMarker(bMrkr, true, true);
			}

			if (show) {
				var markersArr = [aMrkr, bMrkr];
				if (true) { // (!me.checkMarkersOnMapAndFarApart(markersArr)) {
					if (me.isCurrentViewportMatchesMapProps(me.currentMapProps)) {
						autoZoomMarkers(markersArr);
					} else {
						me.moveToMapViewProps(me.currentMapProps);
					}
				}

				google.maps.event.addListenerOnce(me.gmap, 'idle', function(event) {
					if (fireEvents) {startEvent();}
					try {
						var destLatLngArr = [bMrkr.m_latLng];
						plotFromToDrivingDirections(polylineId, aMrkr.m_latLng, destLatLngArr, {animate:true});
					} finally {
						google.maps.event.addListenerOnce(me.gmap, 'plotComplete', function(event) {
							if (fireEvents) {
								if (aMrkrReal) {highlightSingleMarker(aMrkr, false, false);}
								if (bMrkrReal) {highlightSingleMarker(bMrkr, false, false);}
								endEvent();
							}
						});
					}
				});

				setTimeout(function() {
					google.maps.event.trigger(me.gmap, 'idle');
				}, 4000);
			} else {
				clearPolyline(polylineId);
			}
		} else {
			if (fireEvents) {
				try {startEvent();} finally {endEvent();}
			}
		}
	}
	this.travelAtoB = function(cityIdA, cityIdB, opts) {
		opts = $jQ.extend({}, {isFlight:false}, opts || {});
		var fireEvents = true;
		var cityAMrkr = me.getMarkerById('CITY', cityIdA), cityBMrkr = me.getMarkerById('CITY', cityIdB);

		if (cityAMrkr && cityBMrkr) {
			me.showHideMarker(cityAMrkr, true); me.showHideMarker(cityBMrkr, true);
			// 1. Dont zoom out.Just Pan to both Cities
			var markersArr = [cityAMrkr, cityBMrkr];
			autoZoomMarkers(markersArr);

			google.maps.event.addListenerOnce(me.gmap, 'idle', function(event) {
				if (fireEvents) {startEvent();}
				try {
					// Plot the directions
					var destCitiesLatLng = [cityBMrkr.m_latLng], lineId = cityIdA + '_' + cityIdB;
					if (opts.isFlight) {
						plotFlightPath(lineId, cityAMrkr.m_latLng, cityBMrkr.m_latLng, {animate:true});
					} else {
						plotFromToDrivingDirections(lineId, cityAMrkr.m_latLng, destCitiesLatLng, {animate:true});
					}
				} finally {
					google.maps.event.addListenerOnce(me.gmap, 'plotComplete', function(event) {
						markerClickListener(cityBMrkr);
						if (fireEvents) {endEvent();}
					});
				}
			});	
		}
	}

	this.clkMarker = function(mrkr) {
		if (!mrkr) return;
		callMoMarker(mrkr, true, true, false);
	}
	this.moMarker = function(mrkr, isMo) {
		if (!mrkr) return;
		callMoMarker(mrkr, isMo, false, mrkr.opts.showLblOnMO);
	}
	function callMoMarker(marker, isMo, isClk, isShwLbl, isEvCall) {
		if (isMo) {
			if (marker && marker.m_contentJ) {
				if (isHoverBoxOpenOnClick() && !isClk) return;
				var divHtml = isShwLbl ? marker.m_labelJ: (!isClk && marker.m_labelJ ? marker.m_labelJ: marker.m_contentJ);
				if (isClk || (!isClk && marker.m_labelJ)) {
					marker.infoBoxMo = createMoCustomInfoBoxLabel(marker.m_latLng, createAutoflowYJQDiv(divHtml), marker.m_id, marker, null, {width:350, isLbl:!!isShwLbl, isOnClk:!!isClk});
					openHoverBox(marker.infoBoxMo, marker, isClk);
				}
				highlightSingleMarker(marker, true, true);
				return marker.infoBoxMo; 
			}
		} else {
			if (isHoverBoxOpenOnClick() && !isClk) return;
			if (marker.infoBoxMo) clearHoverBox(marker.infoBoxMo);
			marker.infoBoxMo = null;
			if (isEvCall && marker.keepVisible) return;
			highlightSingleMarker(marker, false, true);
		}
		return null; 
	}
	var cancelEvent = function(e) {
		if (!e) return;
		e.cancelBubble = true; 
		if (e.stopPropagation) e.stopPropagation();
	}

	this.clickPlace = function(pId) {
		if (pId) {
			var mrkr = me.getMarkerById('PLACE', pId);
			if (mrkr) {markerClickListener(mrkr, true, {zoomMrkr:true});}
		} else {
			markerUnClickListener();
		}
	}
	this.clickHotel = function(htl) {
		if (htl) {
			var mrkr = null;
			if ($jQ.isNumeric(htl)) {
				mrkr = me.getMarkerById('HOTEL', htl);
			} else {
				mrkr = me.createHotelMarker(htl.id, htl, htl.st, {});
			}
			if (mrkr) {markerClickListener(mrkr, true, {zoomMrkr:true});}
		} else {
			markerUnClickListener();
		}
	}
	this.clickCity = function(cId) {
		if (cId) {
			var mrkr = me.getMarkerById('CITY', cId);
			if (mrkr) {markerClickListener(mrkr, true, {zoomMrkr:true});}
		} else {
			markerUnClickListener();
		}
	}
	this.clickCustomMrkr = function(cId) {
		if (cId) {
			var mrkr = me.getMarkerById('CUSTOM', cId);
			if (mrkr) {markerClickListener(mrkr, true, {zoomMrkr:true});}
		} else {
			markerUnClickListener();
		}
	}
	this.panToMarker = function(mrkr) {
		if (!mrkr) return;
		var centerLatLngDummy = new google.maps.LatLng(mrkr.m_latLng.lat()-0.00001, mrkr.m_latLng.lng()-0.00001);
		me.gmap.panTo(centerLatLngDummy);
		me.gmap.panTo(mrkr.m_latLng);
	}
	this.moveMarker = function(mrkr, lt, ln, opts) {
		if (!mrkr) return;
		opts = $jQ.extend({}, {animate:true, delay:1000, isPan:true}, opts || {});
		var fPos = new google.maps.LatLng(lt, ln), cPos = mrkr.getPosition();
		if (!opts.animate || (cPos.lat() == lt && cPos.lng() == ln)) {
			mrkr.setPosition(fPos); mrkr.m_latLng = fPos;
			if (opts.isPan) me.panToMarker(mrkr);
			return;
		}
		var numStps = opts.delay/10, dLt = (lt - cPos.lat())/numStps, dLn = (ln - cPos.lng())/numStps;
		var stpCnt = 0;
		var changeMrkrPos = function() {
			mrkr.setPosition(new google.maps.LatLng(cPos.lat()+dLt, cPos.lng()+dLn));
			cPos = mrkr.getPosition(); mrkr.m_latLng = cPos;
			if (opts.isPan) me.panToMarker(mrkr);
			if (stpCnt < numStps) {
				stpCnt++; setTimeout(changeMrkrPos, 10);
			}
		};
		changeMrkrPos();
	}
	this.updateMarkerCanvasProp = function(mrkr, props) {
		if (!mrkr) return;
		var icon = mrkr.m_icon, iconUrl = mrkr.m_icon.url, width = Math.max(icon.width, icon.height);
		mrkr.setOptions({icon:{url:CanvasIcon.makeIcon({url:iconUrl, width:width, height:width}).setCanvasProps(props).getUrl(), anchor:new google.maps.Point(width/2, width/2)}});
	}

	var markerClickListener = function(marker, fireEvents, opts) {
		opts = $jQ.extend({}, {zoomMrkr:false}, opts || {});
		if (opts.zoomMrkr) {
			try {
				me.panToMarker(marker);
				var currentZoom = me.gmap.getZoom();
				if (marker.m_obj.zoomLevel != currentZoom){
			  		MAP_UTIL.smoothZoom(me.gmap, marker.m_obj.zoomLevel, currentZoom);
				} else {
					MAP_UTIL.setZoom(me.gmap, marker.m_obj.zoomLevel);
				}
			} finally {
			}
		}

		if (fireEvents) {logEvent('markerClickListener');}
		try {
			if (fireEvents) {startEvent();}
			// call once the map stabilizes
			callMoMarker(marker, true, true, false);
		} finally {
			if (fireEvents) {endEvent();}
		}
	}
	var markerUnClickListener = function() {
		clearHoverBox();
	}

	var markerSingleBoxMouseover = function(boxId, newMoutFn, newMoutFnParam) {
		if (hoverState.timer > 0) {clearTimeout(hoverState.timer);hoverState.timer = 0;}
		if (hoverState.boxId) {
			if (hoverState.boxId != boxId) {
				if (hoverState.moutFn && hoverState.moutFnParam) {hoverState.moutFn(hoverState.moutFnParam);}
			} else {
				return false;
			}
		}
		hoverState.moutFn = newMoutFn;
		hoverState.moutFnParam = newMoutFnParam;
		return true;
	}
	var markerSingleBoxMouseout = function(marker, moutFn, moutFnParam) {
		if (!marker.m_markerMoutDisabled) {
			hoverState.timer = setTimeout(function() {moutFn(moutFnParam);}, hoverState.delay);
		}
	}
	function highlightSingleMarker(marker, yes, showLabel) {
		// showLabel = false;
		if (!marker) {return;}
		if (yes) {
		   // First de-hightlight the marker itself.
		   if (!marker.keepVisible) {highlightSingleMarker(marker, false, showLabel);}
		   if (!marker.m_orgVisibility || marker.m_orgVisibility == 'INVISIBLE'){
			   if (marker.getMap() && !marker.getVisible()) {
				   marker.setVisible(true);
				   marker.m_orgVisibility = 'INVISIBLE';
			   }
		   }

		   // If the marker is not spiderfiered
		   if (!marker._omsData) {
			   if (marker.isHTML) {if (marker.opts.hoverText) marker.setText(marker.opts.hoverText);}
			   else {
				   marker.setIcon(marker.m_icon);
			   }
		   }
		   //marker.setAnimation(google.maps.Animation.BOUNCE);
		   //setTimeout(function(){marker.setAnimation(null);}, 760);
		   marker.setZIndex(google.maps.Marker.MAX_ZINDEX - 1);
		   if (marker.m_labelInfoBox && showLabel) {marker.m_labelInfoBox.open(me.gmap);}
		} else {
			if (marker.m_orgVisibility && marker.m_orgVisibility == 'INVISIBLE') {marker.setVisible(false);}
			marker.m_orgVisibility = null;

			if (!marker._omsData) {
			   if (marker.isHTML) {if (marker.opts.text) marker.setText(marker.opts.text);}
			   else {
					marker.setIcon(marker.opts.showFIcon ? marker.m_icon: marker.m_dIcon);
			   }
			}
			//marker.setAnimation(null);
			marker.setZIndex(marker.m_obj.zIndexVal);
			if (marker.m_labelInfoBox && !showLabel) {marker.m_labelInfoBox.close();}
		}
	}
	function openHoverBox(infoBox, marker, isOnClk) {
		if (hoverState.box) {
			if (isOnClk && hoverState.boxMarker) {highlightSingleMarker(hoverState.boxMarker, false, true);}
			clearHoverBox(hoverState.box);
		}
		hoverState.box = infoBox; hoverState.onClk = isOnClk;
		hoverState.boxId = marker._id; hoverState.boxMarker = marker;
		if (hoverState.box) {
			hoverState.box.open(me.gmap);
			if (isOnClk) {
				google.maps.event.addListener(me.gmap, "click", function() {
					highlightSingleMarker(marker, false, true);
					clearHoverBox(infoBox);
				});
			}
		}
	}
	this.closeInfoBox = function(onClk) {
		if (!hoverState.box || (onClk && !hoverState.onClk)) return;
		if (hoverState.boxMarker) highlightSingleMarker(hoverState.boxMarker, false, true);
		clearHoverBox(hoverState.box);
	}
	function clearHoverBox(infoBoxCurrent) {
		if (infoBoxCurrent) infoBoxCurrent.close();
		if (hoverState.box) hoverState.box.close();
		hoverState.box = null; hoverState.boxId = null; hoverState.boxMarker = null;
	}
	function isHoverBoxOpenOnClick() {
		return (hoverState.box && hoverState.onClk);
	}
	function createAutoflowYJQDiv(divJQ) {
		return divJQ;
	}


	// ICONS
    this.markerIcon3Url = "//cdn.yourholiday.me/static/img/poccom/maps/icons3/";
    this.mapIconsUrl = "//cdn.yourholiday.me/static/img/mapicons/ver2/";
    this.cityRoundMarkerIconUrl = "//cdn.yourholiday.me/static/img/poccom/maps/utils/";

    this.invalidDotIcon = this.markerIcon3Url + 'maroon-dot-invalid.png'; 
    this.maroonDotIcon = this.markerIcon3Url + 'maroon-dot.png'; 
	this.blueBottomIcon = this.cityRoundMarkerIconUrl + "blue-bottom.png" ;

    var cityHlMarkerIcon = function(initial) {
		return me.mapIconsUrl + 'red-marker.png';
	}
	var cityMarkerIcon = function(initial) {
		return me.mapIconsUrl + 'red-marker.png';
	}
    var placeHlMarkerIcon = function(initial, pO) {
		return placeMarkerIcon(initial, pO);
	}
	var placeMarkerIcon = function(initial, pO) {
		// return me.maroonDotIcon;
		if (pO && pO.typ == 'GOLF_COURSE') {
			return me.markerIcon3Url + 'golf.png';
		}
		if (pO && pO.typ == 'CAR') {
			return '/static/img/icons/maps/car.png';
		}
		if (pO && pO.typ == 'USER') {
			return '/static/img/icons/maps/customer.png';
		}
		if (!initial || initial == '') {
			return me.mapIconsUrl + 'red-marker.png';
		} else {
			return me.markerIcon3Url + 'red-' +  initial + '.png';
		}
	}
	var placeMiniMarkerIcon = function(initial, pO) {
		//return me.redDotIcon;
		var url = me.invalidDotIcon;
		if (me.opts.map.shwPlcsAlwys) {
			if(pO && pO.typ == 'GOLF_COURSE') {
				url = me.markerIcon3Url + 'golf-dot.png';
			} else if(pO && (pO.typ == 'RESTAURANT' || pO.typ == 'PUB')) {
				url = me.mapIconsUrl + 'rest_big_dot.png';
			} else if(pO && (pO.typ == 'SHOPPING_PLACE')) {
				url = me.mapIconsUrl + 'shopping2_big_dot.png';
			} else if(pO && pO.typ == 'HOTEL') {
				url = me.mapIconsUrl + 'stay_big_dot.png';
			} else if(pO && pO.typ == 'THINGS_TO_DO') {
				url = me.mapIconsUrl + 'many_big_dot.png';
			} else {
				url = me.mapIconsUrl + 'see_big_dot.png';
			}
		}
		return url;
	}
	var hotelMarkerIcon = function(star) {
		return me.maroonDotIcon;
	}
	var hotelHlMarkerIcon = function(star){
		if (star == '3' || star == '4' || star == '5') {
			return me.mapIconsUrl + star + 'star.png';
		} else {
			return me.mapIconsUrl + 'bd.png';
		}
	}
	var hotelMiniMarkerIcon = function(star){
		return me.blueBottomIcon;
	}
	var polylineHeadMarkerIcon = function() {
		return me.blueBottomIcon;
	}
	function getMapMarkerIcon(iconUrl, pO) {
		var icon = {url:iconUrl, size:null, origin:null, anchor:null};
		if (pO && pO.typ == 'CAR') {
			icon.anchor = new google.maps.Point(16,28); icon.width = 33; icon.height = 55;
		}
		return icon;
	}
	function getPolylineHeadMarkerIcon(iconUrl) {
		return new google.maps.MarkerImage(iconUrl, new google.maps.Size(20, 18), null, new google.maps.Point(10, 9));
	}
}

function TFMarker(latlng, map, opts) {
	var defaults = {};
	this.opts = $jQ.extend(true, {}, defaults, opts || {});
	this.latlng_ = latlng; this.map_ = map; this.visible_ = true;
	this.xOffset = 0; this.yOffset = 0;
	// Once the LatLng and text are set, add the overlay to the map.  This will
	// trigger a call to panes_changed which should in turn call draw.
	this.setMap(map);

	this.getMarkerHTM = function($div) {
		$div.addClass('mapTFM1');
		$div.append('<div class="tfm-top"><div class="tfm-left"><div class="tfm-right"><div class="tfm-text"></div></div></div></div>');
		$div.append('<div class="tfm-bottom"><div class="tfm-arr"></div></div>');
	}
}
function initTFMarker() {
	TFMarker.prototype = new google.maps.OverlayView();
	TFMarker.prototype.draw = function() {
		var me = this;
		var div = this.div_;
		if (!div) {
			div = this.div_ = document.createElement('DIV');
			var $div = $jQ(div).addClass('mapTFMrkr');
			if (me.opts.content) {$div.html(me.opts.content);}
			else {
				me.getMarkerHTM($div); $jQ('.tfm-text', $div).html(me.opts.text);
				me.xOffset = 20; me.yOffset = 32;
			}
			if (me.opts.clazz) {$div.addClass(me.opts.clazz);}
	
			google.maps.event.addDomListener(div, "click", function(event) {
				google.maps.event.trigger(me, "click", event);
			});
			google.maps.event.addDomListener(div, "mouseover", function(event) {
				google.maps.event.trigger(me, "mouseover", event);
			});
			google.maps.event.addDomListener(div, "mouseout", function(event) {
				google.maps.event.trigger(me, "mouseout", event);
			});
	
			var panes = this.getPanes();
			panes.overlayImage.appendChild(div);
		}
	
		var point = this.getProjection().fromLatLngToDivPixel(this.latlng_);
		if (point) {
			div.style.left = (point.x-me.xOffset) + 'px'; div.style.top = (point.y-me.yOffset) + 'px';
		}
	}
	TFMarker.prototype.remove = function() {
		if (this.div_) {
			this.div_.parentNode.removeChild(this.div_); this.div_ = null;
		}
	}
	TFMarker.prototype.getPosition = function(shw) {
		return this.latlng_;
	}
	TFMarker.prototype.setVisible = function(shw) {
		this.visible_ = shw;
		if (this.div_) $jQ(this.div_).toggle(shw); 
	}
	TFMarker.prototype.getVisible = function() {
		return this.visible_; 
	}
	TFMarker.prototype.setZIndex = function(zI) {
		if (this.div_) $jQ(this.div_).css('zIndex', zI);
	}
	TFMarker.prototype.setText = function(txt) {
		if (this.div_) $jQ(this.div_).find('.tfm-text').html(txt);
	}
}

function PlayTour(steps, pkgO, tfMap, opt) {
	var defaults = {beforeStart:null, afterStop:null};
	this.opts = $jQ.extend(true, {}, defaults, opt || {});

	var me = this; this.tfMap = tfMap; this.pkgO = pkgO; this.steps = steps; this.stepsA = steps.stpA; this.daysO = steps.daysO; this.pSteps = [];
	this.playOpt = {auto:true, tTime:0, sTimer:null, crntPrgsJ:null, prgsWd:0, play:true, tStartTime:null, stpTm:0, tmRemain:0};
	this.currentStp = {no:0, pStp:null, stpJ:null};
	this.tmFired = false; this.evntFired = true;

	this.init = function() {
		me.tourCtr = $jQ('<div class="pTourCtr">');
		me.playCtr = $jQ('<div class="playCtr u_block">').appendTo(me.tourCtr);
		me.stepCtr = $jQ('<div class="stpsCtr">').appendTo(me.tourCtr);

		me.tfMap.setPlacesData(steps.plcA, {hide:true, isAddStaticLabel:true});
		me.tfMap.setHotelsData(steps.htlA, {hide:true, isAddStaticLabel:true});
		var prevDay = null;
		for (var i=0;i<me.stepsA.length;i++) {
			var day = me.stepsA[i].day;
			var pStep = new PlayTourStep(me, i, me.stepsA[i], !!(day && (!prevDay || prevDay != day)));
			me.pSteps.push(pStep);
			me.playOpt.tTime += pStep.getTotalExecTime()*1000;
			if (day) prevDay = day;
		}
	}
	this.attchPlyrCtrls = function() {
		var ctrlsCtr = $jQ('<div class="ctrlCtr">');
		$jQ('<a href="#" class="plyrIc rstIc" title="Restart"></a>').click(function() {
			if (me.playOpt.sTimer) {clearTimeout(me.playOpt.sTimer);}
			me.playOpt.sTimer = null; me.playOpt.play = true; me.playOpt.tStartTime = null; me.playOpt.tmRemain = 0;
			me.currentStp = {no:0, pStp:null, stpJ:null};
			me.playOpt.crntPrgsJ.stop(true, false).width(0);
			me.step(me.currentStp.no);
			return false;
		}).appendTo(ctrlsCtr);
		$jQ('<a href="#" class="plyrPlyAct plyrIc pausIc" title="Play/Pause"></a>').click(function(e, isP, isPS) {
			$jQ(this).toggleClass("pausIc", !me.playOpt.play).toggleClass("playIc", me.playOpt.play);
			isP = (isP == undefined) ? !me.playOpt.play: isP;
			isPS = (isPS == undefined) ? true: isPS;
			if (!isP) {
				if (me.playOpt.sTimer) {
					clearTimeout(me.playOpt.sTimer);
					me.playOpt.tmRemain = me.playOpt.stpTm - ((new Date()).getTime() - me.playOpt.tStartTime);
				}
				me.playOpt.crntPrgsJ.stop(true, false);
				me.playOpt.play = false;
			} else {
				me.playOpt.play = true;
				if (isPS) {me.step(me.currentStp.no);}
				else {me.autoNext();}
			}
			return false;
		}).appendTo(ctrlsCtr);
		$jQ('<a href="#" class="plyrIc fwdIc" title="Forward"></a>').click(function() {
			if (me.playOpt.sTimer) {clearTimeout(me.playOpt.sTimer);}
			setCurrentPrgsBar(true);
			me.currentStp.stpJ.find(".stpNext").click();
			return false;
		}).appendTo(ctrlsCtr);

		var prgsCtr = $jQ('<div class="prgsCtr">');
		me.playOpt.crntPrgsJ = $jQ('<div class="crntPrgs">').appendTo($jQ('<div class="prgs">').appendTo(prgsCtr));
		me.playCtr.append(ctrlsCtr).append(prgsCtr);
		me.playOpt.prgsWd = 170;//prgsCtr.css("width");
	}
	this.start = function() {
		if (me.opts.beforeStart) me.opts.beforeStart();
		me.attchPlyrCtrls();
		me.tfMap.addControlElement('.pTourCtr', me.tourCtr, 'tfMapTour', true);
		me.step(me.currentStp.no);
	}
	this.stop = function() {
		if (me.playOpt.sTimer) {clearTimeout(me.playOpt.sTimer);}
		me.tfMap.addControlElement('.pTourCtr', me.tourCtr, 'tfMapTour', false);
		me.tfMap.clearPolylines();
		if (me.pkgO) me.tfMap.renderPackage(me.pkgO.pkgs[0], me.pkgO, {clrOthrMrkrs:true});
		if (me.opts.afterStop) me.opts.afterStop();
	}
	this.step = function(i) {
		var pStp = me.pSteps[i];
		if (!pStp) {me.stop(); return;}
		var stpJ = pStp.getSNode().clone(true);
		me.currentStp.stpJ = stpJ; me.currentStp.pStp = pStp;
		var currentStpJ = me.stepCtr.find(".pTStp");
		currentStpJ.removeClass('highlight');
		me.stepCtr.append(stpJ);
		setTimeout(function() {
			currentStpJ.remove();
			stpJ.addClass('highlight');
			me.autoNext();
			pStp.execute(stpJ);
		}, 350);
	}
	this.autoNext = function() {
		if (me.playOpt.auto && me.playOpt.play) {
			me.tmFired = false;
			var stpTm = me.currentStp.pStp.getStepTime()*1000;
			var prgsWd = (getLastChkPtTime() + stpTm) * (me.playOpt.prgsWd/me.playOpt.tTime);
			me.playOpt.crntPrgsJ.animate({width:''+prgsWd}, stpTm);

			if (me.playOpt.tmRemain > 0) {
				stpTm = me.playOpt.tmRemain;
				me.playOpt.tmRemain = 0;
			}
			me.playOpt.tStartTime = (new Date()).getTime();
			me.playOpt.stpTm = stpTm;
			me.playOpt.sTimer = setTimeout(function() {
				me.tmFired = true;
				me.clickNext();
			}, stpTm);
			console.log('------- Set timer for next after ' + stpTm);
		} else {
			setCurrentPrgsBar(false);
		}
	}
	this.clickNext = function() {
		console.log('------- Trying to click next: ' + me.tmFired + '::' + me.evntFired);
		if (me.tmFired && me.evntFired) {
			me.currentStp.stpJ.find(".stpNext").click();
		}
	}
	this.showAllSteps = function() {
		var currentStpJ = me.stepCtr.find(".pTStp");
		if (currentStpJ.length > 0) {
			currentStpJ.remove();
		}
		for (var i=0; i<me.pSteps.length; i++) {
			var pStp = me.pSteps[i]; if (!pStp) continue;
			if (pStp.stpO.typ == 'START' || pStp.stpO.typ == 'END') continue;
			var stpJ = pStp.getSNode().clone(true);
			me.stepCtr.append(stpJ);
			stpJ.css('transition-delay', (i*0.2)+'s');
		}
		setTimeout(function() {
			me.stepCtr.find(".pTStp").addClass('highlight');
		}, 100);
	}
	this.incStep = function(inc) {
		me.currentStp.no += inc;
		me.step(me.currentStp.no);
	}
	function setCurrentPrgsBar(isIncCS) {
		var stpTm = isIncCS ? me.currentStp.pStp.getStepTime()*1000: 0;
		var prgsWd = (getLastChkPtTime() + stpTm) * (me.playOpt.prgsWd/me.playOpt.tTime);
		me.playOpt.crntPrgsJ.stop(true, false).width(prgsWd);
	}
	function getLastChkPtTime() {
		var tm = 0;
		for (var i=0;i<me.currentStp.no;i++) {
			tm += me.pSteps[i].getTotalExecTime();
		}
		tm += me.currentStp.pStp.getCurrentExecTime(me.currentStp.stpJ);
		return tm*1000;
	}
	this.togglePlay = function(isP, isPS) {
		console.log('------- Toggle play called ' + isP + ':' + isPS);
		if (isP == undefined) {isP = !me.playOpt.play}
		me.playCtr.find(".plyrPlyAct").trigger("click", [isP, isPS]);
	}
	this.showMessage = function(msg) {
		
	}
}

function PlayTourStep(pTour, stpNo, stpO, isDayChg) {
	var me = this; this.pTour = pTour; this.stpNo = stpNo; this.stpO = stpO; this.isDayChg = isDayChg;
	this.tfMap = this.pTour.tfMap; this.hasSubSteps = (!!me.stpO.plA);

	this.getSNode = function() {
		return me.sNode ? me.sNode: me.makeHTML();
	}
	this.makeHTML = function() {
		me.sNode = $jQ('<div class="pTStp u_block">');
		me.sNode.append('<div class="title">' + me.stpO.title + '</div>');
		if (me.stpO.txt) me.sNode.append('<div class="txt">' + me.stpO.txt + '</div>');
		if (me.hasSubSteps) {
			var plCtr = $jQ('<div class="tplCtr">');
			$jQ.each(me.stpO.plA, function(i, plO) {
				var plJ = me.tfMap.getMarkerDetailHTM('PLACE', plO.id)
				$jQ(plJ).click(function() {
					var liJ = $jQ(this);
					liJ.siblings().removeClass("sel");
					liJ.addClass("sel"); liJ.parents('.stpsCtr').scrollTop(liJ.position().top);
					if (plO.desc) {setTimeout(function() {me.pTour.showMessage(plO.desc);}, 2000);}
					me.tfMap.clickPlace(null);
					if (i>1 && me.stpO.typ != 'ACTIVITY') {me.tfMap.placeAtoB(me.stpO.cityId, me.stpO.plA[i-2].id, me.stpO.plA[i-1].id, false);}
					me.pTour.togglePlay(false);
					me.tfMap.cbEvent(function() {
							me.pTour.evntFired = false;
							me.pTour.togglePlay(true, false);
						}, function() {
							me.pTour.evntFired = true;
							me.pTour.clickNext();
						});
					if (i>0) {
						me.tfMap.placeAtoB(me.stpO.cityId, me.stpO.plA[i-1].id, plO.id, true);
					} else {
						if (me.stpO.typ == 'ACTIVITY') {
							me.tfMap.placeAtoB(me.stpO.cityId, me.stpO.fromId ? me.stpO.fromId: me.stpO.hotelId, plO.id, true);
						} else {
							me.tfMap.clickPlace(plO.id);
						}
					}
					return false;
				});
				plCtr.append(plJ);
			});
			me.sNode.append(plCtr);
		} else {
			me.sNode.append(me.getPNode());
		}
		var stpAct = $jQ('<div class="stpAct u_block">');
		if (!me.isFirst()) {
			stpAct.append('<div class="u_floatL"><a href="#" class="search-button stpPrev">&laquo; Previous</a></div>');
			stpAct.find(".stpPrev").click(function() {
				if (me.hasSubSteps) {
					var subStepCtr = $jQ(this).closest(".pTStp").find(".tplCtr");
					var sIdx = $jQ(".plcMpBox.sel", subStepCtr).index();
					if (sIdx > 0) {
						$jQ(".plcMpBox", subStepCtr).eq(sIdx-1).click();
						return;
					}
				}
				me.pTour.incStep(-1);
			});
		}
		if (!me.isLast() || me.hasSubSteps) {
			stpAct.append('<div class="u_floatR"><a href="#" class="search-button stpNext">Next &raquo;</a></div>');
			stpAct.find(".stpNext").click(function() {
				if (me.hasSubSteps) {
					var subStepCtr = $jQ(this).closest(".pTStp").find(".tplCtr");
					var sIdx = $jQ(".plcMpBox.sel", subStepCtr).index();
					if (sIdx < (me.stpO.plA.length-1)) {
						$jQ(".plcMpBox", subStepCtr).eq(sIdx+1).click();
						if (sIdx != -1) {me.pTour.autoNext();}
						return;
					}
				}
				me.pTour.incStep(1);
			});
		}
		if (me.pTour.playOpt.auto) {stpAct.hide();}
		me.sNode.append(stpAct);
		return me.sNode;
	}
	this.getPNode = function() {
		if (me.pNode) return me.pNode;
		me.pNode = null;
		switch(me.stpO.typ) {
		case 'CITY':
		case 'TRANSFER':
			me.pNode = me.tfMap.getMarkerDetailHTM('CITY', me.stpO.cityId);
			break;
		case 'HOTEL':
			me.pNode = me.tfMap.getMarkerDetailHTM('HOTEL', me.stpO.hotelId);
			break;
		case 'ACTIVITY':
			me.pNode = me.tfMap.getMarkerDetailHTM('PLACE', me.stpO.placeId);
			break;
		}

		return me.pNode;
	}
	this.execute = function(stpJ) {
		// me.pkgMap.cbEventStarted();
		var dayO = me.pTour.daysO[stpO.day];
		me.tfMap.clearPolylines();
		if (dayO && me.isDayChg) {me.tfMap.setCurrentMapProps(dayO.mapProps); me.tfMap.moveToMapViewProps(dayO.mapProps);}
		me.pTour.showMessage(me.stpO.title);
		console.log('------ Executing play step: ' + stpO.typ + ':' + me.hasSubSteps);
		if (me.hasSubSteps) {stpJ.find(".stpNext").click(); return;}
		switch(stpO.typ) {
		case 'CITY':
			me.tfMap.renderPackage(me.pTour.pkgO.pkgs[0], me.pTour.pkgO, {hideMrkrs:true});
			me.tfMap.clickPlace(null);
			me.tfMap.clickHotel(null);
			me.pTour.togglePlay(false);
			me.tfMap.cbEvent(function() {
					console.log('------- Called event start:'+stpO.typ);
					me.pTour.evntFired = false;
					me.pTour.togglePlay(true, false);
				}, function() {
					console.log('------- Called event end:'+stpO.typ);
					me.pTour.evntFired = true;
					me.pTour.clickNext();
				});
			me.tfMap.clickCity(me.stpO.cityId);
			break;
		case 'HOTEL':
			me.tfMap.clickPlace(null);
			me.tfMap.clickHotel(null);
			me.pTour.togglePlay(false);
			me.tfMap.cbEvent(function() {
					console.log('------- Called event start:'+stpO.typ);
					me.pTour.evntFired = false;
				}, function() {
					console.log('------- Called event end:'+stpO.typ);
					if (me.stpO.arriveId) {
						me.tfMap.cbEvent(function() {
								console.log('------- Called event start:'+stpO.typ);
								me.pTour.evntFired = false;
								me.pTour.togglePlay(true, false);
							}, function() {
								console.log('------- Called event end:'+stpO.typ);
								me.pTour.evntFired = true;
								me.pTour.clickNext();
							});
						me.tfMap.placeAtoB(me.stpO.cityId, me.stpO.arriveId, me.stpO.hotelId, true);
					} else if (me.stpO.hotelId) {
						me.tfMap.cbEvent(function() {
								console.log('------- Called event start:'+stpO.typ);
								me.pTour.evntFired = false;
								me.pTour.togglePlay(true, false);
							}, function() {
								console.log('------- Called event end:'+stpO.typ);
								me.pTour.evntFired = true;
								me.pTour.clickNext();
							});
						me.tfMap.clickHotel(me.stpO.hotelId);
					}
				});
			me.tfMap.clickCity(me.stpO.cityId);
			break;
		case 'ACTIVITY':
			me.tfMap.showHideMarkers(false, 'CITY');
			me.tfMap.clickPlace(null);
			me.tfMap.clickHotel(null);
			me.tfMap.setCurrentMapProps(dayO ? dayO.mapProps: null);
			// me.pkgMap.clickCity(me.stpO.cityId);
			me.pTour.togglePlay(false);
			me.tfMap.cbEvent(function() {
					console.log('------- Called event start:'+stpO.typ);
					me.pTour.evntFired = false;
					me.pTour.togglePlay(true, false);
				}, function() {
					console.log('------- Called event end:'+stpO.typ);
					me.pTour.evntFired = true;
					me.pTour.clickNext();
				});
			me.tfMap.placeAtoB(me.stpO.cityId, me.stpO.fromId ? me.stpO.fromId: me.stpO.hotelId, me.stpO.placeId, true);
			// me.pkgMap.clickPlace(me.stpO.placeId);
			break;
		case 'TRANSFER':
			me.tfMap.showHideMarkers(false, 'CITY');
			me.tfMap.renderPackage(me.pTour.pkgO.pkgs[0], me.pTour.pkgO, {hideMrkrs:true});
			me.tfMap.clickCity(null);
			me.tfMap.clickPlace(null);
			me.tfMap.clickHotel(null);
			me.pTour.togglePlay(false);
			me.tfMap.cbEvent(function() {
					console.log('------- Called event start:'+stpO.typ);
					me.pTour.evntFired = false;
					me.pTour.togglePlay(true, false);
				}, function() {
					console.log('------- Called event end:'+stpO.typ);
					me.pTour.evntFired = true;
					me.pTour.clickNext();
				});
			me.tfMap.travelAtoB(me.stpO.sCityId, me.stpO.cityId, {isFlight:me.stpO.isFlight});
			break;
		case 'END':
			me.tfMap.clickCity(null);
			me.tfMap.clickPlace(null);
			me.tfMap.clickHotel(null);
			setTimeout(function() {
				me.pTour.showAllSteps();
			}, 3000);
		case 'START':
			if (me.pTour.pkgO) me.tfMap.renderPackage(me.pTour.pkgO.pkgs[0], me.pTour.pkgO, {clrOthrMrkrs:(stpO.typ != 'START')});
			break;
		}
	}
	this.isFirst = function() {
		return (me.stpNo == 0);
	}
	this.isLast = function() {
		return (me.stpNo == (me.pTour.pSteps.length-1));
	}
	this.getTotalExecTime = function() {
		return me.hasSubSteps ? me.getStepTime()*me.stpO.plA.length: me.getStepTime();
	}
	this.getStepTime = function() {
		return (me.stpO.typ=='TRANSFER'|| me.stpO.typ=='HOTEL'|| me.stpO.typ=='CITY_MUSTSEE' || (me.stpO.typ=='ACTIVITY' && me.hasSubSteps))?8:5;
	}
	this.getCurrentExecTime = function(stpJ) {
		if (!me.hasSubSteps) return 0;
		var sIdx = $jQ(".tplCtr .plcMpBox.sel", stpJ).index();
		return Math.max(0, sIdx*me.getStepTime());
	}
}