Adding Last Update

masks/project.html

@@ -5,7 +5,10 @@
 	<div id="map"></div>
 	<div id="settings">
 		<div id="settings-panel">
-			<div class="settings-header"><div class="logo"><img src="images/logo_black.png" /></div></div>
+			<div class="settings-header">
+					<div class="logo"><img src="images/logo_black.png" /></div>
+					<div id="last_update"><p><img src="images/spot-logo-only.svg" /><abbr></abbr></p></div>
+			</div>
 			<div class="settings-sections">
 				<div id="settings-sections-scrollbox">
 					<div class="settings-section">
@@ -66,7 +69,7 @@ oSpot.pageInit = function(asHash) {
 
 oSpot.onResize = function() {
 	self.tmp('map_offset', -1 * (isFeedPanelOpen()?self.tmp('$Feed').outerWidth(true):0) / $('body').outerWidth(true));
-	
+
 	if(typeof self.tmp('elev') != 'undefined') {
 		var bElevOpened = self.tmp('elev')._showState;
 		if(bElevOpened) self.tmp('elev')._expand();
@@ -95,7 +98,7 @@ function toggleFeedPanel(bShow, sMapAction) {
 	self.tmp('$Projects').toggleClass('with-feed', (typeof bShow === 'undefined')?null:bShow);
 	oSpot.onResize();
 	if(isMobile()) $('#settings-button').toggle(!isFeedPanelOpen());
-	
+
 	sMapAction = sMapAction || 'panTo';
 	switch(sMapAction) {
 		case 'none': break;
@@ -113,7 +116,7 @@ function toggleSettingsPanel(bShow) {
 	self.tmp('$Projects').toggleClass('with-settings', (typeof bShow === 'undefined')?null:bShow);
 	oSpot.onResize();
 	if(isMobile()) $('#post-button').toggle(!isSettingsPanelOpen());
-	
+
 	oSpot.tmp('map').panBy([(isSettingsPanelOpen()?-1:1)*self.tmp('$Settings').outerWidth(true)/2, 0], {duration: 0.5});
 }
 
@@ -121,6 +124,13 @@ function isSettingsPanelOpen() {
 	return self.tmp('$Projects').hasClass('with-settings');
 }
 
+function updateSettingsPanel(asLastUpdate) {
+	var $LastUpdate = self.tmp('$Settings').find('#last_update').toggle(self.vars(['project', 'mode']) == self.consts.modes.blog);
+	$LastUpdate.find('abbr')
+		.attr('title', asLastUpdate.formatted_time)
+		.text(oSpot.lang('last_update')+' '+asLastUpdate.relative_time);
+}
+
 function isMobile() {
 	return $('#mobile').is(':visible');
 }
@@ -139,9 +149,9 @@ function initPage(asHash) {
 		self.tmp('markers', 'object');
 		self.tmp('trail-markers', 'object');
 		self.tmp('marker_size', {width: 32, height: 32});
-		
+
 		if(!isMobile()) toggleFeedPanel(true, 'none');
-		
+
 		//Lightbox options
 		lightbox.option({
 			alwaysShowNavOnTouchDevices: true,
@@ -152,7 +162,7 @@ function initPage(asHash) {
 			resizeDuration: 600,
 			hasVideo: true
 		});
-		
+
 		//Assign Track Type Colors
 		self.tmp('track-type-styles', 'object');
 		$('#legend').find('.line').each(function(iKey, oLegend){
@@ -160,7 +170,7 @@ function initPage(asHash) {
 			var sTrackType = $Legend.attr('class').replace('line', '').trim();
 			self.tmp(['track-type-styles', sTrackType], {weight: parseInt($Legend.css('height')), color: $Legend.css('background-color'), opacity: 1});
 		});
-		
+
 		//Post Panel one-off init (see initPosts for project related init)
 		//Scrollbar
 		self.tmp('simple-bar', new SimpleBar($('#posts')[0]));
@@ -173,10 +183,10 @@ function initPage(asHash) {
 		$("#feed").onSwipe(function(aiDelta){
 			if(aiDelta.x > self.tmp('$Feed').outerWidth(true)/3 && aiDelta.x > Math.abs(aiDelta.y)) toggleFeedPanel(false);
 		});
-		
+
 		//Feed Panel
 		initPosts();
-		
+
 		//Settings Panel
 		initSettings();
 
@@ -189,19 +199,23 @@ function initPage(asHash) {
 function initProject(sProjectCodeName, oFocusPost){
 	self.tmp('first_exec', false);
 	self.vars('project', self.vars(['projects', sProjectCodeName]));
-	
+
 	//Page Title
 	self.setPageTitle(oSpot.vars(['project', 'name']));
-	
+
 	//Timezone difference notice
-	var bSameTime = ((new Date()).toLocaleString([], {timeZone: oSpot.consts.timezone}) == (new Date()).toLocaleString([], {timeZone: oSpot.vars(['project', 'timezone'])}));
+	var bSameTime = (
+		(new Date()).toLocaleString([], {timeZone: oSpot.consts.timezone}) ==
+		(new Date()).toLocaleString([], {timeZone: oSpot.vars(['project', 'timezone'])})
+	);
 	self.tmp('site_tz_notice', bSameTime?'':getTimeZoneDesc(oSpot.consts.timezone));
 	self.tmp('proj_tz_notice', bSameTime?'':getTimeZoneDesc(self.vars(['project', 'timezone'])));
-	
+
+	//Load Track & Markers
 	$.when(
 		//Markers: Spot Messages & Medias
 		self.get(
-			'markers', 
+			'markers',
 			function(){},
 			{project_id: self.vars(['project', 'id'])},
 			function(e){console.log(e);}
@@ -213,13 +227,14 @@ function initProject(sProjectCodeName, oFocusPost){
 			mimeType: 'application/json'
 		})
 	).done(function(aoMessages, aoTracks) {
-		initSpotMessages(aoMessages[0]['data'] || [], aoTracks[0], aoMessages[0]['desc']=='No Data');
+		initSpotMessages(aoMessages[0]['data']['messages'] || [], aoTracks[0], aoMessages[0]['desc']=='No Data');
+		updateSettingsPanel(aoMessages[0]['data']['last_update']);
 	});
-	
+
 	//Show/Hide Poster Panel
 	var bHistoMode = (self.vars(['project', 'mode']) == self.consts.modes.histo);
 	$('#poster').toggle(!bHistoMode);
-	
+
 	//Feed auto-update
 	updateFeed(true, false, function(){focusOnPost(oFocusPost);});
 	self.tmp('simple-bar').getScrollElement().scrollTop = 0;
@@ -237,7 +252,7 @@ function initPosts() {
 
 	//Auto-adjust text area height
 	autosize($('#post'));
-	
+
 	//Add post Event handling
 	$('#submit').click(function(){
 		if($('#poster').checkForm())
@@ -262,7 +277,7 @@ function initPosts() {
 function initSettings(){
 	//Scrollbar
 	new SimpleBar($('#settings-sections-scrollbox')[0]);
-	
+
 	//Feedback display function
 	var settingsFeedback = function(sType, sMsg){
 		$('<p>', {'class': sType})
@@ -273,7 +288,7 @@ function initSettings(){
 			.delay(5000)
 			.slideUp('fast', function(){$(this).remove();});
 	};
-	
+
 	//Newsletter Subscription
 	$('#nl_btn').click(function(){
 		var sAction = $(this).prop('name');
@@ -282,7 +297,7 @@ function initSettings(){
 		if(!regexEmail.test(sEmail)) settingsFeedback('error', oSpot.lang('nl_invalid_email'));
 		else {
 			oSpot.get(
-				sAction, 
+				sAction,
 				function(asData, sDesc) {
 					settingsFeedback('success', sDesc);
 					oSpot.vars('user', asData);
@@ -299,7 +314,7 @@ function initSettings(){
 			);
 		}
 	});
-	
+
 	//Twink interface with user data
 	setUserInterface();
 }
@@ -310,7 +325,7 @@ function setUserInterface() {
 		$('#email').val(asUserInfo.email).prop('disabled', true);
 		$('#nl_btn').attr({name: 'unsubscribe', title: oSpot.lang('nl_unsubscribe'), 'class':'unsubscribe'});
 		$('#nl_desc').text(oSpot.lang('nl_subscribed_desc'));
-		
+
 		//Populate nickname
 		if(asUserInfo.name) $('#name').val(asUserInfo.name);
 	}
@@ -333,12 +348,12 @@ function getElevWidth() {
 		iSettingsPanelWidth = isSettingsPanelOpen()?self.tmp('$Settings').outerWidth(true):0,
 		iLegendWidth = $('.leaflet-bottom.leaflet-left > .leaflet-control-layers').outerWidth(true),
 		oElevRightMarging = parseInt($('.leaflet-bottom.leaflet-right > .leaflet-control-scale').css('margin-right').slice(0, -2));
-	
+
 	return iPageWidth - iFeedPanelWidth - iSettingsPanelWidth - iLegendWidth - oElevRightMarging;
 }
 
 function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
-	
+
 	//Tile layers
 	aoLayers = {};
 	aoLayers[oSpot.lang('map_satellite')]	= L.tileLayer(self.tmp('tile_api'), {id: 'mapbox.satellite-streets', minZoom: 0, maxZoom: 19});
@@ -347,7 +362,8 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 	aoLayers[oSpot.lang('map_ign_spain')]	= L.tileLayer(self.tmp('tile_api'), {id: 'ign.es', minZoom: 1, maxZoom: 20});
 	aoLayers[oSpot.lang('map_linz')]		= L.tileLayer(self.tmp('tile_api'), {id: 'linz', maxZoom: 17, continuousWorld: true, attribution: 'Sourced from LINZ. CC BY 4.0'});
 	aoLayers[oSpot.lang('map_usgs')]		= L.tileLayer(self.tmp('tile_api'), {id: 'usgs', minZoom: 1, maxZoom: 16});
-	
+	//aoLayers[oSpot.lang('map_natgeo')]		= L.tileLayer(self.tmp('tile_api'), {id: 'natgeo.pct', minZoom: 5, maxZoom: 14});
+
 	//Map
 	var oMap = L.map(self.tmp('$Map')[0], {
 		layers: [aoLayers[oSpot.lang('map_satellite')]],
@@ -355,26 +371,26 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 		zoomControl: false
 	});
 	self.tmp('map', oMap);
-	
+
 	//Controls: Settings Panel
 	var oSettingsPanel = L.control({position: 'topleft'});
 	var $SettingsButton = $('#settings-button').clone();
 	$SettingsButton.click(toggleSettingsPanel);
 	oSettingsPanel.onAdd = function(oMap) {return $SettingsButton[0];};
 	oSettingsPanel.addTo(oMap);
-	
+
 	//Controls: Feed Panel
 	var oFeedPanel = L.control({position: 'topright'});
 	var $PostButton = $('#post-button').clone();
 	$PostButton.click(toggleFeedPanel);
 	oFeedPanel.onAdd = function(oMap) {return $PostButton[0];};
 	oFeedPanel.addTo(oMap);
-	
+
 	//Controls: Legend
 	var oLegend = L.control({position: 'bottomleft'});
 	oLegend.onAdd = function(oMap) {return $('#legend').clone()[0];};
 	oLegend.addTo(oMap);
-	
+
 	//Controls: Projects
 	var $Labels = $('<div>', {'class': 'leaflet-control-layers-base'});
 	$.each(self.vars('projects'), function(sCodeName, asProject){
@@ -384,7 +400,7 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 			toggleSettingsPanel(false);
 			self.setHash(self.vars('page'), [$(this).val()]);
 		});
-		
+
 		var $Label = $('<label>').append($('<div>')
 			.append($Radio)
 			.append($('<span>').text(' '+asProject.name))
@@ -393,10 +409,10 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 		$Labels.append($Label);
 	});
 	$('#settings-projects').empty().append($Labels);
-		
+
 	//Controls: Scale
 	oScale = L.control.scale({imperial: false, 'position':'bottomright'}).addTo(oMap);
-	
+
 	//Controls: Elevation
 	if(!isMobile()) {
 		var aoElevTracks = {type: 'FeatureCollection', features:[], properties: {summary: 'Elevation'}};
@@ -408,7 +424,7 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 				var sType = aoTracks.features[i].properties.type;
 				oTrack.properties.attributeType = sType;
 				aoElevTracks.features.push(oTrack);
-				
+
 				//Legend
 				aoLegend.Elevation[sType] = {text: oSpot.lang('track_'+sType), color: self.tmp(['track-type-styles', sType, 'color'])};
 			}
@@ -446,18 +462,18 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 		self.tmp('elev', oElev);
 		self.tmp('elev-data', [aoElevTracks]);
 	}
-	
+
 	//Controls: Tiles (layers): Add & Move to Settings Panel
 	L.control.layers(aoLayers, null, {position: 'topleft'}).addTo(oMap);
 	$('#layers').empty().append($('.leaflet-control-layers-list .leaflet-control-layers-base'));
-	
+
 	//Actual Tracks: Track with corresponding colors
 	var oActualTracks = L.geoJson(aoTracks, {
 		style: function(oTrack) {
 			return self.tmp(['track-type-styles', oTrack.properties.type]);
 		}
 	}).addTo(oMap);
-	
+
 	//"Hover" Tracks: Wider track (thus hover area) to avoid flickering popups
 	self.tmp('track', L.geoJson(aoTracks, {
 		style: {weight: 20, opacity: 0},
@@ -466,22 +482,22 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 			var $Tooltip = $('<div>', {'class':'track_tooltip'});
 			$('<p>', {'class':'name'}).addIcon('fa-track-'+asProperties.type, true).append(asProperties.name).appendTo($Tooltip);
 			if(asProperties.Name != asProperties.description) $('<p>', {'class':'description'}).text(asProperties.description).appendTo($Tooltip);
-			
+
 			var aiCoords = feature.geometry.coordinates;
 			if(aiCoords && asProperties.type != 'hitchhiking') {
 				var iDistance = 0, iElevDrop = 0, iElevGain = 0, iTime = 0;
-				
+
 				//Track duration (in hours)
 				for (var i = 1; i < aiCoords.length; i++) {
 					var oCurrPoint = new L.LatLng(aiCoords[i][1], aiCoords[i][0]);
 					var oPrevPoint = new L.LatLng(aiCoords[i - 1][1], aiCoords[i - 1][0]);
 					var iElevDelta = aiCoords[i][2] - aiCoords[i - 1][2];
 					var iSegDistance = oCurrPoint.distanceTo(oPrevPoint);
-					
+
 					iDistance += iSegDistance;
 					iElevDrop += Math.min(iElevDelta, 0);
 					iElevGain += Math.max(iElevDelta, 0);
-					
+
 					var iSpeedCorrecRatio = 0;
 					var iAngle = iElevDelta / iSegDistance;
 					if(iAngle < -1)			iSpeedCorrecRatio = 0.5;
@@ -493,7 +509,7 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 					else					iSpeedCorrecRatio = 0.25;
 					iTime += iSegDistance / 1000 * iSpeedCorrecRatio / 3.5 ; //default speed: 3.5km/h
 				}
-				
+
 				//Conversion of hours into natural language
 				var iTimeMinutes = 0, iTimeHours = 0, iTimeDays = Math.floor(iTime/8); //8 hours a day
 				if(iTimeDays > 1) iTimeDays = Math.round(iTimeDays * 2) / 2; //Round down to the closest half day
@@ -501,14 +517,14 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 					iTimeDays = 0;
 					iTimeHours = Math.floor(iTime);
 					iTime -= iTimeHours;
-					
+
 					iTimeMinutes = Math.floor(iTime * 4) * 15; //Round down to the closest 15 minutes
 				}
 				var sDuration = '~ '
 					+(iTimeDays>0?(iTimeDays+(iTimeDays%2==0?'':'½')+' '+oSpot.lang(iTimeDays>1?'unit_days':'unit_day')):'')//Days
 					+((iTimeHours>0 || iTimeDays==0)?iTimeHours+oSpot.lang('unit_hour'):'')									//Hours
 					+((iTimeDays>0 || iTimeMinutes==0)?'':iTimeMinutes)														//Minutes
-				
+
 				//Tooltip info
 				$('<p>', {'class':'detail'}).addIcon('fa-distance fa-fw', true).append(Math.round(iDistance/1000)+'km').appendTo($Tooltip);
 				$('<p>', {'class':'detail'}).addIcon('fa-time fa-fw', true).append(sDuration).appendTo($Tooltip);
@@ -520,24 +536,24 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 					'start'	: L.marker(new L.latLng(aiCoords[0][1], aiCoords[0][0]), {icon: getDivIcon('track-start')}),
 					'end'	: L.marker(new L.latLng(aiCoords[aiCoords.length - 1][1], aiCoords[aiCoords.length - 1][0]), {icon: getDivIcon('track-end')})
 				});
-				
+
 				oLayer
 					.bindPopup($Tooltip[0])
 					.on('mouseover click', function(e) {
 						var oLatLng = L.GeometryUtil.closest(self.tmp('map'), e.sourceTarget, e.latlng);
 						e.target.getPopup().setLatLng(oLatLng).openOn(self.tmp('map'));
-						
+
 						var asTrailMarkers = self.tmp(['trail-markers', e.target.feature.properties.name]);
 						var oPointStart = self.tmp('map').latLngToLayerPoint(asTrailMarkers.start.getLatLng());
 						var oPointEnd = self.tmp('map').latLngToLayerPoint(asTrailMarkers.end.getLatLng());
 						if(oPointStart.distanceTo(oPointEnd) > 200) {
 							asTrailMarkers.start.addTo(self.tmp('map'));
-							asTrailMarkers.end.addTo(self.tmp('map'));	
+							asTrailMarkers.end.addTo(self.tmp('map'));
 						}
 					})
 					.on('mouseout', function(e) {
-						e.target.closePopup();	
-						
+						e.target.closePopup();
+
 						var asTrailMarkers = self.tmp(['trail-markers', e.target.feature.properties.name]);
 						asTrailMarkers.start.remove();
 						asTrailMarkers.end.remove();
@@ -545,7 +561,7 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 			}
 		}
 	}).addTo(oMap));
-	
+
 	//Centering map
 	var bWithFeedPanel = (!bNoFeed && !isMobile());
 	if(self.vars(['project', 'mode'])==self.consts.modes.blog && aoMessages.length > 0)
@@ -556,17 +572,17 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 		oMap.panBy([(bWithFeedPanel?1:0)*self.tmp('$Feed').outerWidth(true)/2, 0]);
 	}
 	else oMap.fitBounds(self.tmp('track').getBounds(), {paddingTopLeft: L.point(5, self.tmp('marker_size').height + 5), paddingBottomRight: L.point(5 + parseInt(bWithFeedPanel?self.tmp('$Feed').outerWidth(true):0), 5)});
-	
+
 	//Spot Messages
 	$.each(aoMessages, function(iKey, oMsg){
-		
+
 		//Marker
 		var oMarker = L.marker(L.latLng(oMsg.latitude, oMsg.longitude), {
 			id: oMsg.id_message,
 			riseOnHover: true,
 			icon: getDivIcon('message-in fa-rotate-270')
 		}).addTo(oMap);
-		
+
 		//Tooltip
 		$Tooltip = $('<div>', {'class':'info-window'})
 			.append($('<h1>')
@@ -578,14 +594,14 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 			.append($('<p>', {'class':'time'})
 				.addIcon('fa-time fa-fw fa-lg')
 				.append(oMsg.formatted_time+(self.vars(['project', 'mode'])==self.consts.modes.blog?' ('+oMsg.relative_time+')':'')));
-		
+
 		//Tooltip: Time Zone
 		if(self.tmp('site_tz_notice')!='') {
 			$Tooltip.append($('<p>', {'class':'timezone'})
 				.addIcon('fa-timezone fa-fw fa-lg')
 				.append(self.tmp('site_tz_notice')));
 		}
-		
+
 		//Tooltip: Medias
 		if(oMsg.medias) {
 			var $Medias = $('<div>', {'class':'medias'});
@@ -596,28 +612,71 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 				.append($('<p>').addIcon('fa-media fa-fw fa-lg').append(oSpot.lang('pics')))
 				.append($Medias);
 		}
-		
+
 		oMarker.bindPopup($Tooltip[0], {
 			maxWidth: self.tmp('$Projects').width(),
 			autoPan: false,
 			closeOnClick: true,
 			offset: new L.Point(0, -30)
 		});
-		
+
 		//Open tooltip on latest message in mobile mode
 		if(iKey === (aoMessages.length - 1) && self.vars(['project', 'mode']) == self.consts.modes.blog && (!oMsg.medias || oMsg.medias.length < 3) && isMobile()) oMarker.openPopup();
-		
+
 		oSpot.tmp(['markers', oMsg.id_message], oMarker);
 	});
+
+	/*
+	oSpot.tmp('tracks', aoTracks);
+	next(24, 0, 0, 5);
+	*/
 }
 
+/*
+function next(iCurrTrack, iCurrIndex, iCurrOffset, iCurrZoom) {
+	var aoTracks = oSpot.tmp('tracks');
+	var aoOffset = {0:[0,0], 1:[-1,0], 2:[-1,1], 3:[0,1], 4:[1,1], 5:[1,0], 6:[1,-1], 7:[0,-1], 8:[-1,-1]};
+
+	console.log('Getting Track '+iCurrTrack+'/'+(aoTracks.features.length - 1)+', '+
+				'Point '+iCurrIndex+'/'+(aoTracks.features[iCurrTrack].geometry.coordinates.length - 1)+', '+
+				'Zoom '+iCurrZoom+'/14, '+
+				'Offset ['+aoOffset[iCurrOffset][0]+','+aoOffset[iCurrOffset][1]+']');
+
+	//Position map
+	var iLat = aoTracks.features[iCurrTrack].geometry.coordinates[iCurrIndex][1] + aoOffset[iCurrOffset][1] * 0.0347910214271;
+	var iLng = aoTracks.features[iCurrTrack].geometry.coordinates[iCurrIndex][0] + aoOffset[iCurrOffset][0] * 0.1016235351560;
+	oSpot.tmp('map').setView(L.latLng(iLat, iLng), iCurrZoom);
+
+	//Go to next
+	iCurrOffset++;
+	if(iCurrZoom < 13 || iCurrOffset > 8) {
+		iCurrOffset = 0;
+		iCurrZoom++;
+		if(iCurrZoom > 14) {
+			iCurrZoom = 5;
+			iCurrIndex += 100;
+			if(!(iCurrIndex in aoTracks.features[iCurrTrack].geometry.coordinates)) {
+				iCurrIndex = 0;
+				iCurrTrack++;
+				if(!(iCurrTrack in aoTracks.features)) return true;
+			}
+		}
+	}
+
+	timer = setTimeout(function(){next(iCurrTrack, iCurrIndex, iCurrOffset, iCurrZoom);}, 1000);
+}
+function stop() {
+	clearTimeout(timer);
+}
+*/
+
 function getDivIcon(sIcon) {
 	return L.divIcon({
 		className: '',
 		html: '<span class="fa-stack"><i class="fa fa-message fa-stack-2x"></i><i class="fa fa-'+sIcon+' fa-stack-1x"></i></span>',
 		iconSize: [self.tmp('marker_size').width, self.tmp('marker_size').height],
 		iconAnchor: [self.tmp('marker_size').width / 2, self.tmp('marker_size').height] //position from icon's top left corner (iconAnchor = marker's position)
-	});	
+	});
 }
 
 function onFeedScroll() {
@@ -630,35 +689,35 @@ function updateFeed(bFirstChunk, bDiscrete, fCallback) {
 	bFirstChunk = bFirstChunk || false;
 	bDiscrete = bDiscrete || false;
 	fCallback = fCallback || function(){};
-	
+
 	if(self.tmp('updatable')) {
 		if(!self.tmp('out-of-data') || bFirstChunk) {
 			self.tmp('updatable', false);
 			if(!bDiscrete) $('#loading').show();
-			
+
 			var $Posts = $('<div>');
-			
+
 			if(bFirstChunk===true) {
 				self.tmp('news_chunk', 0);
 			}
-			
+
 			self.get(
 				'feed',
 				function(asData) {
 					$('#loading').hide();
-					
+
 					$.each(asData, function(iKey, asPost){
 						$Posts.append(getPost(asPost));
 					});
-					
+
 					self.tmp('news_chunk', self.tmp('news_chunk') + 1);
 					self.tmp('out-of-data', Object.keys(asData).length != self.vars('chunk_size'));
-					
+
 					if(bFirstChunk===true) self.tmp('$PostList').empty();
 					self.tmp('$PostList').append($Posts.children());
-					
+
 					self.tmp('$PostList').find('img').waitForImages(true).done(fCallback);
-					
+
 					self.tmp('updatable', true);
 				}, {
 					'project_id': self.vars(['project', 'id']),
@@ -681,7 +740,7 @@ function focusOnPost(oFocusPost) {
 		}
 		else if(!self.tmp('out-of-data')) updateFeed(false, false, function() {focusOnPost(oFocusPost);});
 		else console.log('Missing element ID '+sElemId);
-		
+
 		//Reset Hash
 		var asHash = self.getHash();
 		self.setHash(asHash.page, [asHash.items[0]]);
@@ -696,15 +755,15 @@ function setFeedUpdateTimer(iSeconds, fCallback) {
 
 function getPost(asPost) {
 	asPost.headerless = asPost.headerless || false;
-	
+
 	var $Post = $('<div>', {'class':'post-item '+asPost.type+(asPost.headerless?' headerless':'')});
 	if(asPost.id) $Post.prop('id', asPost.type+'-'+asPost.id);
-	
+
 	var sRelTime = (asPost.relative_time!='')?((self.vars('project') && self.vars(['project', 'mode'])==self.consts.modes.histo)?asPost.formatted_time.substr(0, 10):asPost.relative_time):'';
 	var sAbsTime = asPost.formatted_time;
 	var sType = asPost.subtype || asPost.type;
 	var $Body = {};
-	
+
 	switch(asPost.type) {
 		case 'message':
 			$Body = $('<div>', {'class':'body-box'})
@@ -729,7 +788,7 @@ function getPost(asPost) {
 							var iRatio = -1 * iOffset / $('body').outerWidth(true);
 							self.tmp('map').setOffsetView(iRatio, oMarker.getLatLng(), 15);
 						}
-						
+
 						if(!oMarker.isPopupOpen()) oMarker.openPopup();
 					})
 				)
@@ -763,15 +822,15 @@ function getPost(asPost) {
 			$Body = $('<p>', {'class':'flicker'}).addIcon('fa-post');
 			break;
 	}
-	
+
 	$Post
 		.append($('<div>', {'class':'header'})
 			.append($('<span>', {'class':'index'}).addIcon('fa-'+sType))
 			.append($('<span>', {'class':'time'}).hoverSwap(sRelTime, sAbsTime+((self.tmp('site_tz_notice')!='')?' ('+self.tmp('site_tz_notice')+')':''))))
 		.append($('<div>', {'class':'body'}).append($Body));
-	
+
 	if(asPost.displayed_id) $Post.find('.index').append(' '+oSpot.lang('counter', asPost.displayed_id));
-	
+
 	return $Post;
 }
 
@@ -781,24 +840,24 @@ function getWmtsApiUrl(sMapId, iLat, iLng, iZoom) {
 
 function getMediaLink(asData, sType) {
 	var bVideo = (asData.subtype == 'video');
-	
-	var $PostedOn = 
+
+	var $PostedOn =
 		$('<span>', {'class': 'lb-caption-line', title: oSpot.lang(bVideo?'video':'pic')+' '+oSpot.lang('add_on', asData.posted_on_formatted)})
 			.addIcon('fa-upload fa-lg fa-fw', true)
 			.append(asData.posted_on_formatted);
-	
+
 	var $TakenOn = (asData.taken_on == '0000-00-00 00:00:00')?'':
 		$('<span>', {'class': 'lb-caption-line', title: oSpot.lang(bVideo?'video':'pic')+' '+oSpot.lang(bVideo?'video_taken':'pic_taken', asData.taken_on_formatted)})
 			.addIcon('fa-'+asData.subtype+'-shot fa-lg fa-fw', true)
 			.append(asData.taken_on_formatted);
-	
+
 	var $Timezone = (self.tmp('site_tz_notice') == '')?'':
 		$('<span>', {'class': 'lb-caption-line'})
 			.addIcon('fa-timezone fa-lg fa-fw', true)
 			.append(self.tmp('site_tz_notice'));
 
 	var $Title = $('<div>').append(sType=='marker'?$TakenOn:$PostedOn).append(sType=='marker'?$PostedOn:$TakenOn).append($Timezone);
-	var $Link = 
+	var $Link =
 		$('<a>', {
 			'class': 'drill',
 			'href': asData.media_path,
@@ -809,7 +868,7 @@ function getMediaLink(asData, sType) {
 		})
 		.append($('<img>', {'src': asData.thumb_path, title: oSpot.lang(bVideo?'click_watch':'click_zoom')}))
 		.append($('<span>', {'class': 'drill-icon'}).addIcon('fa-drill-'+(bVideo?'video':'picture')));
-	
+
 	return $Link;
 }
 
@@ -821,4 +880,4 @@ function getGoogleMapsLink(asInfo) {
 		rel: 'noreferrer'
 	}).text(asInfo.lat_dms+' '+asInfo.lon_dms);
 }
-</script>
+</script>