Fix isMobile trigger and add more details on media

lib/Spot.php

@@ -284,6 +284,7 @@ class Spot extends Main
 		}
 
 		//Get Geo-positioned Medias
+		//FIXME Make more efficient than requesting images twice from DB
 		$asMedias = $this->getMedias('taken_on', $asMediaIds);
 		$asGeoMedias = $this->getMedias('posted_on', $asMediaIds, true);
 		foreach($asGeoMedias as &$asGeoMedia) {
@@ -292,8 +293,6 @@ class Spot extends Main
 
 			$asGeoMedia['id'] = $iId;
 			$asGeoMedia['type'] = 'media';
-			$asGeoMedia['lat_dms'] = self::decToDms($asGeoMedia['latitude'], 'lat');
-			$asGeoMedia['lon_dms'] = self::decToDms($asGeoMedia['longitude'], 'lon');
 			$asGeoMedia['medias'] = array_values(array_filter($asMedias, function($asMedia) use ($iId) {
 				return $asMedia['id_media'] == $iId;
 			}));
@@ -428,6 +427,12 @@ class Spot extends Main
 			$this->addTimeStamp($asMedia, strtotime($asMedia[$sTimeRefField]), $asMedia['timezone']);
 			$this->addTimeStamp($asMedia, strtotime($asMedia['taken_on']), $asMedia['timezone'], 'taken_on');
 			$this->addTimeStamp($asMedia, strtotime($asMedia['posted_on']), $asMedia['timezone'], 'posted_on');
+			
+			if($asMedia['latitude'] != '' && $asMedia['longitude'] != '') {
+				$asMedia['lat_dms'] = self::decToDms($asMedia['latitude'], 'lat');
+				$asMedia['lon_dms'] = self::decToDms($asMedia['longitude'], 'lon');
+			}
+			
 			unset($asMedia['taken_on']);
 			unset($asMedia['posted_on']);
 		}

src/components/project.vue

@@ -336,6 +336,7 @@ export default {
 			this.popup.content
 				.provide('lang', this.lang)
 				.provide('consts', this.consts)
+				.provide('isMobile', this.isMobile)
 				.mount($Popup);
 		},
 		closePopup() {

src/components/projectMediaLink.vue

@@ -1,11 +1,13 @@
 <script>
 import spotIcon from '@components/spotIcon';
 import projectRelTime from '@components/projectRelTime';
+import projectMapLink from '@components/projectMapLink';
 
 export default {
 	components: {
 		spotIcon,
-		projectRelTime
+		projectRelTime,
+		projectMapLink
 	},
 	props: {
 		options: Object,
@@ -17,7 +19,7 @@ export default {
 			title:''
 		}
 	},
-	inject: ['lang'],
+	inject: ['lang', 'isMobile'],
 	mounted() {
 		this.title =
 			(this.$refs.comment?this.$refs.comment.outerHTML:'') +
@@ -54,12 +56,18 @@ export default {
 		/>
 		<span class="drill-icon"><spotIcon :icon="'drill-'+options.subtype" /></span>
 		<div v-if="options.comment && type == 'post'" class="comment">
-			<p>{{ options.comment }}</p>
+			<p>
+				<spotIcon icon="post" :text="options.comment" size="lg" />
+			</p>
+			<p v-if="!isMobile() && options.latitude && options.longitude">
+				<spotIcon icon="coords" margin="right" size="lg" />
+				<projectMapLink :options="options" />
+			</p>
 		</div>
 	</a>
 	<div style="display:none">
 		<span v-if="options.comment" ref="comment" class="lb-caption-line comment desktop">
-			<spotIcon :icon="'post'" width="fixed" size="lg" :text-classes="'comment-text'" :text="options.comment" />
+			<spotIcon icon="post" width="fixed" size="lg" text-classes="comment-text" :text="options.comment" />
 		</span>
 		<span ref="postedon" class="lb-caption-line">
 			<projectRelTime :icon="'upload'" :localTime="options.posted_on_formatted_time_local" :siteTime="options.posted_on_formatted_time" :offset="options.posted_on_day_offset" />

src/components/projectPopup.vue

@@ -15,7 +15,7 @@ export default {
 		options: Object,
 		project: Object
 	},
-	inject: ['lang', 'consts'],
+	inject: ['lang', 'consts', 'isMobile'],
 	computed: {
 		timeinfo() {
 			return (this.options.type == 'media')?
@@ -61,16 +61,16 @@ export default {
 			</div>
 		</div>
 		<div v-else>
-			<div class="section coordinates">
+			<div class="section time">
+				<projectRelTime :icon="timeinfo.icon" :localTime="localTime" :siteTime="timeinfo.site_time" :offset="timeinfo.offset" />
+			</div>
+			<div v-if="!isMobile()" class="section coordinates">
 				<spotIcon :icon="'coords'" width="fixed" size="lg" margin="right" />
 				<projectMapLink :options="options" />
 			</div>
 			<div v-if="options.altitude" class="section altitude">
 				<spotIcon :icon="'altitude'" width="fixed" size="lg" :text="options.altitude+'m'" />
 			</div>
-			<div class="section time">
-				<projectRelTime :icon="timeinfo.icon" :localTime="localTime" :siteTime="timeinfo.site_time" :offset="timeinfo.offset" />
-			</div>
 			<div class="section weather" v-if="options.weather_icon && options.weather_icon!='unknown'" :title="options.weather_cond==''?'':lang.get('weather.'+options.weather_icon)">
 				<spotIcon :icon="options.weather_icon" width="fixed" size="lg" :text="options.weather_temp+'°C'" />
 			</div>

src/components/projectPost.vue

@@ -193,11 +193,11 @@
 					<img class="staticmap clickable" :title="lang.get('media.click_zoom')" :src="options.static_img_url" />
 					<spotIconStack :mainClasses="'message drill-icon'" :iconMain="drillMainIcon" iconSub="footprint" :icon-sub-transform="'rotate-270'" />
 					<div class="comment">
-						<p>
+						<p v-if="!isMobile()">
 							<spotIcon :icon="'coords'" margin="right" size="lg" />
 							<projectMapLink :options="options" />
 						</p>
-						<p v-if="timeDiff">
+						<p>
 							<projectRelTime :icon="'time'" :localTime="absTimeLocal" :siteTime="options.formatted_time" :offset="options.day_offset" />
 						</p>
 					</div>

src/styles/_page.project.feed.scss

@@ -248,7 +248,7 @@
 				}
 
 				.body {
-					a {
+					a.media-link {
 						display: inline-block;
 						width: 100%;
 						margin: 0;