Newsletter: Add custom link to media/post

inc/email.php

@@ -30,7 +30,6 @@ class Email extends PhpObject {
 		$this->sTemplateName = $sTemplateName;
 		$this->oTemplate = new Mask($this->sTemplateName);
 		$this->oTemplate->setTag('local_server', $this->sServName);
-		$this->oTemplate->setTag('live_server', Settings::LIVE_SERVER);
 		$this->oTemplate->setTag('geo_server', Settings::GEO_SERVER);
 	}
 	

inc/spot.php

@@ -194,7 +194,12 @@ class Spot extends Main
 			foreach($asNews as $asPost) {
 				if($asPost['type'] != 'message') {
 					$oEmail->oTemplate->newInstance('news');
-					$oEmail->oTemplate->setInstanceTag('news', 'local_server', $this->asContext['serv_name']);
+					$oEmail->oTemplate->setInstanceTags('news', array(
+						'local_server'	=> $this->asContext['serv_name'],
+						'project'		=> $this->oProject->getProjectCodeName(),
+						'type'			=> $asPost['type'],
+						'id'			=> $asPost['id_'.$asPost['type']])
+					);
 					$oEmail->oTemplate->addInstance($asPost['type'], $asPost);
 					$oEmail->oTemplate->setInstanceTag($asPost['type'], 'local_server', $this->asContext['serv_name']);
 					$iPostCount++;
@@ -391,9 +396,11 @@ class Spot extends Main
 				$sPriority = $asFeedTypeInfo['priority'];
 				if($bHistoMode) $sPriority = count($asFeedTypes) - 1 - $asFeedTypeInfo['priority'];
 				
-				$iId = ($asFeed['unix_time'] * -1).'.'.$sPriority.$asFeed[Db::getId($asFeedTypeInfo['table'])];
+				$iTableId = $asFeed[Db::getId($asFeedTypeInfo['table'])];
+				$iId = ($asFeed['unix_time'] * -1).'.'.$sPriority.$iTableId;
 				$asFeeds[$iId] = $asFeed;
 				$asFeeds[$iId]['type'] = $sFeedType;
+				$asFeeds[$iId]['id'] = $iTableId;
 			}
 		}
 		
@@ -415,11 +422,12 @@ class Spot extends Main
 	{
 		$asData = array(
 			Db::getId(Project::PROJ_TABLE)	=> $this->oProject->getProjectId(),
-			Db::getId(User::USER_TABLE)		=> $this->oUser->getUserId(),
 			'name'							=> mb_strtolower(trim($sName)), 
 			'content'						=> trim($sPost),
 			'site_time'						=> date(Db::TIMESTAMP_FORMAT) //site time (Settings::TIMEZONE)
 		);
+		if($this->oUser->getUserId() > 0) $asData[Db::getId(User::USER_TABLE)] = $this->oUser->getUserId();
+		
 		$iPostId = $this->oDb->insertRow(self::POST_TABLE, $asData);
 		
 		$this->oUser->updateNickname($sName);

masks/email_update.html

@@ -14,7 +14,7 @@
 			<tr>
 				<td colspan="2">
 					<div style="background-color:#6dff58;color:#326526;border-radius:3px;padding:1rem;margin-top:1rem;display:inline-block;box-shadow: 2px 2px 3px 0px rgba(0,0,0,.5);">
-						<a href="[#]local_server[#]" target="_blank"><img style="border-radius:3px;" src="[#]geo_server[#]?a=tile&amp;id=static.marker&amp;z=13&amp;x=[#]longitude[#]&amp;y=[#]latitude[#]&amp;marker=[#]live_server[#]/images/footprint_mapbox.png&amp;token=[#]token[#]" alt="position" /></a>
+						<a href="[#]local_server[#]" target="_blank"><img style="border-radius:3px;" src="[#]geo_server[#]?a=tile&amp;id=static.marker&amp;z=13&amp;x=[#]longitude[#]&amp;y=[#]latitude[#]&amp;marker=[#]local_server[#]images/footprint_mapbox.png&amp;token=[#]token[#]" alt="position" /></a>
 						<br />[#]lat_dms[#] [#]lon_dms[#]
 						<br />[#]date_time[#] ([#]timezone[#])
 					</div>
@@ -27,7 +27,7 @@
 						<!-- [PART] news [START] -->
 						<tr>
 							<td>
-								<a href="[#]local_server[#]" target="_blank" style="text-decoration:none;background-color:#EEE;color:#333;margin-bottom:1rem;border-radius:3px;padding:5%;display:inline-block;width:90%;box-shadow: 2px 2px 3px 0px rgba(0,0,0,.5);">
+								<a href="[#]local_server[#]#project-[#]project[#]-[#]type[#]-[#]id[#]" target="_blank" style="text-decoration:none;background-color:#EEE;color:#333;margin-bottom:1rem;border-radius:3px;padding:5%;display:inline-block;width:90%;box-shadow: 2px 2px 3px 0px rgba(0,0,0,.5);">
 									<!-- [PART] media [START] --><img src="[#]local_server[#][#]thumb_path[#]" style="max-height:200px;image-orientation:from-image;" /><br /><span>[#]comment[#]</span><!-- [PART] media [END] -->
 									<!-- [PART] post [START] --><span>[#]content[#]</span><br /><span style="margin-top:0.5em;float:right;">--[#]formatted_name[#]</span><!-- [PART] post [END] -->
 								</a>

masks/project.html

@@ -48,7 +48,7 @@
 <script type="text/javascript">
 oSpot.onSamePageMove = function(asHash) {
 	if(self.tmp('first_exec')) initPage(asHash);
-	else {
+	else if(asHash.items[0] != self.vars(['project', 'codename'])) {
 		self.tmp('map').remove();
 		self.tmp('$Map').empty();
 		self.tmp('map', null);
@@ -181,11 +181,12 @@ function initPage(asHash) {
 		initSettings();
 
 		//project Bootstrap
-		initProject(asHash.items[0]);
+		var oFocusPost = asHash.items[1]?{type: asHash.items[1], id: asHash.items[2]}:null;
+		initProject(asHash.items[0], oFocusPost);
 	}
 }
 
-function initProject(sProjectCodeName){
+function initProject(sProjectCodeName, oFocusPost){
 	self.tmp('first_exec', false);
 	self.vars('project', self.vars(['projects', sProjectCodeName]));
 	
@@ -220,9 +221,9 @@ function initProject(sProjectCodeName){
 	$('#poster').toggle(!bHistoMode);
 	
 	//Feed auto-update
+	updateFeed(true, false, function(){focusOnPost(oFocusPost);});
 	self.tmp('simple-bar').getScrollElement().scrollTop = 0;
 	if(!bHistoMode) onAutoUpdate(true);
-	else updateFeed(true);
 }
 
 function initPosts() {
@@ -320,10 +321,8 @@ function setUserInterface() {
 	}
 }
 
-function onAutoUpdate(bFirstExec) {
+function onAutoUpdate(bStart) {
-	bFirstExec = bFirstExec || false;
+	if(!bStart && self.tmp('simple-bar').getScrollElement().scrollTop == 0) updateFeed(true, true);
-	if(bFirstExec) updateFeed(true);
-	else if(self.tmp('simple-bar').getScrollElement().scrollTop == 0) updateFeed(true, true);
 	setFeedUpdateTimer(60, onAutoUpdate);
 }
 
@@ -381,7 +380,7 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
 	$.each(self.vars('projects'), function(sCodeName, asProject){
 		var asRadioAttrs = {'type': 'radio', 'class': 'leaflet-control-layers-selector', 'name':'project', 'value': sCodeName};
 		if(asProject.id == self.vars(['project', 'id'])) asRadioAttrs.checked = 'checked';
-		var $Radio =$('<input>', asRadioAttrs).change(function(){
+		var $Radio = $('<input>', asRadioAttrs).change(function(){
 			toggleSettingsPanel(false);
 			self.setHash(self.vars('page'), [$(this).val()]);
 		});
@@ -620,9 +619,10 @@ function onFeedScroll() {
 	if(($Box.scrollTop() + $(window).height()) / $BoxContent.height() >= 0.8) updateFeed();
 }
 
-function updateFeed(bFirstChunk, bDiscrete) {
+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) {
@@ -635,7 +635,9 @@ function updateFeed(bFirstChunk, bDiscrete) {
 				self.tmp('news_chunk', 0);
 			}
 			
-			self.get('feed', function(asData) {
+			self.get(
+				'feed',
+				function(asData) {
 					$('#loading').hide();
 					
 					$.each(asData, function(iKey, asPost){
@@ -648,16 +650,37 @@ function updateFeed(bFirstChunk, bDiscrete) {
 					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']),
 					'chunk': self.tmp('news_chunk')
-			});
+				}
+			);
 		}
 	}
 	else if(bFirstChunk) setFeedUpdateTimer(0.2);
 }
 
+function focusOnPost(oFocusPost) {
+	if(oFocusPost) {
+		var sElemId = '#'+oFocusPost.type+'-'+oFocusPost.id;
+		var $Post = oSpot.tmp('$PostList').find(sElemId);
+		var bGetToTop = (oSpot.tmp('$PostList').height() - (($Post.length > 0)?$Post.position().top:0) >= $(window).height());
+		if($Post.length > 0 && (bGetToTop || self.tmp('out-of-data'))) {
+			self.tmp('simple-bar').getScrollElement().scrollTop = $Post.position().top;
+			if(oFocusPost.type=='media' || oFocusPost.type=='message') $Post.find('a.drill').click();
+		}
+		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]]);
+	}
+}
+
 function setFeedUpdateTimer(iSeconds, fCallback) {
 	fCallback = fCallback || function(){updateFeed(true);};
 	if(typeof self.tmp('update_timer') != 'undefined') clearTimeout(self.tmp('update_timer'));
@@ -666,7 +689,10 @@ function setFeedUpdateTimer(iSeconds, fCallback) {
 
 function getPost(asPost) {
 	asPost.headerless = asPost.headerless || false;
+	
 	var $Post = $('<div>', {'class':'post '+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;

readme.md

@@ -16,4 +16,3 @@
 * Add mail frequency slider
 * Replace Project Time Zone with browser Time Zone when uploading media?
 * Use WMTS servers directly when not using Geo Caching Server
-* Newsletter: Add custom link to media/post

script/jquery.mods.js

@@ -15,3 +15,6 @@
 
 /* Mousewheel - v3.1.13 - https://github.com/jquery/jquery-mousewheel/blob/master/jquery.mousewheel.min.js - Copyright OpenJS Foundation and other contributors */
 !function(e){"function"==typeof define&&define.amd?define(["jquery"],e):"object"==typeof exports?module.exports=e:e(jQuery)}(function(u){var f,d,e=["wheel","mousewheel","DOMMouseScroll","MozMousePixelScroll"],t="onwheel"in window.document||9<=window.document.documentMode?["wheel"]:["mousewheel","DomMouseScroll","MozMousePixelScroll"],w=Array.prototype.slice;if(u.event.fixHooks)for(var i=e.length;i;)u.event.fixHooks[e[--i]]=u.event.mouseHooks;var c=u.event.special.mousewheel={version:"3.1.12",setup:function(){if(this.addEventListener)for(var e=t.length;e;)this.addEventListener(t[--e],n,!1);else this.onmousewheel=n;u.data(this,"mousewheel-line-height",c.getLineHeight(this)),u.data(this,"mousewheel-page-height",c.getPageHeight(this))},teardown:function(){if(this.removeEventListener)for(var e=t.length;e;)this.removeEventListener(t[--e],n,!1);else this.onmousewheel=null;u.removeData(this,"mousewheel-line-height"),u.removeData(this,"mousewheel-page-height")},getLineHeight:function(e){var t=u(e),i=t["offsetParent"in u.fn?"offsetParent":"parent"]();return i.length||(i=u("body")),parseInt(i.css("fontSize"),10)||parseInt(t.css("fontSize"),10)||16},getPageHeight:function(e){return u(e).height()},settings:{adjustOldDeltas:!0,normalizeOffset:!0}};function n(e){var t,i=e||window.event,n=w.call(arguments,1),o=0,l=0,s=0;if((e=u.event.fix(i)).type="mousewheel","detail"in i&&(s=-1*i.detail),"wheelDelta"in i&&(s=i.wheelDelta),"wheelDeltaY"in i&&(s=i.wheelDeltaY),"wheelDeltaX"in i&&(l=-1*i.wheelDeltaX),"axis"in i&&i.axis===i.HORIZONTAL_AXIS&&(l=-1*s,s=0),o=0===s?l:s,"deltaY"in i&&(o=s=-1*i.deltaY),"deltaX"in i&&(l=i.deltaX,0===s&&(o=-1*l)),0!==s||0!==l){if(1===i.deltaMode){var a=u.data(this,"mousewheel-line-height");o*=a,s*=a,l*=a}else if(2===i.deltaMode){var h=u.data(this,"mousewheel-page-height");o*=h,s*=h,l*=h}if(t=Math.max(Math.abs(s),Math.abs(l)),(!d||t<d)&&g(i,d=t)&&(d/=40),g(i,t)&&(o/=40,l/=40,s/=40),o=Math[1<=o?"floor":"ceil"](o/d),l=Math[1<=l?"floor":"ceil"](l/d),s=Math[1<=s?"floor":"ceil"](s/d),c.settings.normalizeOffset&&this.getBoundingClientRect){var r=this.getBoundingClientRect();e.offsetX=e.clientX-r.left,e.offsetY=e.clientY-r.top}return e.deltaX=l,e.deltaY=s,e.deltaFactor=d,e.deltaMode=0,n.unshift(e,o,l,s),f&&window.clearTimeout(f),f=window.setTimeout(m,200),(u.event.dispatch||u.event.handle).apply(this,n)}}function m(){d=null}function g(e,t){return c.settings.adjustOldDeltas&&"mousewheel"===e.type&&t%120==0}u.fn.extend({mousewheel:function(e){return e?this.on("mousewheel",e):this.trigger("mousewheel")},unmousewheel:function(e){return this.off("mousewheel",e)}})});
+
+/* waitForImages - v2.4.0 - https://github.com/alexanderdickson/waitForImages/blob/master/dist/jquery.waitforimages.min.js - MIT license */
+!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?module.exports=a(require("jquery")):a(jQuery)}(function(a){var b="waitForImages",c=function(a){return a.srcset&&a.sizes}(new Image);a.waitForImages={hasImageProperties:["backgroundImage","listStyleImage","borderImage","borderCornerImage","cursor"],hasImageAttributes:["srcset"]},a.expr.pseudos["has-src"]=function(b){return a(b).is('img[src][src!=""]')},a.expr.pseudos.uncached=function(b){return!!a(b).is(":has-src")&&!b.complete},a.fn.waitForImages=function(){var d,e,f,g=0,h=0,i=a.Deferred(),j=this,k=[],l=a.waitForImages.hasImageProperties||[],m=a.waitForImages.hasImageAttributes||[],n=/url\(\s*(['"]?)(.*?)\1\s*\)/g;if(a.isPlainObject(arguments[0])?(f=arguments[0].waitForAll,e=arguments[0].each,d=arguments[0].finished):1===arguments.length&&"boolean"===a.type(arguments[0])?f=arguments[0]:(d=arguments[0],e=arguments[1],f=arguments[2]),d=d||a.noop,e=e||a.noop,f=!!f,!a.isFunction(d)||!a.isFunction(e))throw new TypeError("An invalid callback was supplied.");return this.each(function(){var b=a(this);f?b.find("*").addBack().each(function(){var b=a(this);b.is("img:has-src")&&!b.is("[srcset]")&&k.push({src:b.attr("src"),element:b[0]}),a.each(l,function(a,c){var d,e=b.css(c);if(!e)return!0;for(;d=n.exec(e);)k.push({src:d[2],element:b[0]})}),a.each(m,function(a,c){var d=b.attr(c);return!d||void k.push({src:b.attr("src"),srcset:b.attr("srcset"),element:b[0]})})}):b.find("img:has-src").each(function(){k.push({src:this.src,element:this})})}),g=k.length,h=0,0===g&&(d.call(j),i.resolveWith(j)),a.each(k,function(f,k){var l=new Image,m="load."+b+" error."+b;a(l).one(m,function b(c){var f=[h,g,"load"==c.type];if(h++,e.apply(k.element,f),i.notifyWith(k.element,f),a(this).off(m,b),h==g)return d.call(j[0]),i.resolveWith(j[0]),!1}),c&&k.srcset&&(l.srcset=k.srcset,l.sizes=k.sizes),l.src=k.src}),i.promise()}});

settings-sample.php

@@ -4,7 +4,6 @@ class Settings
 {
 	const GEO_SERVER = 'http(s)://geo.server.tld';
 	const GEO_SERVER_TOKEN = '';
-	const LIVE_SERVER = 'http(s)://live.server.tld';
 	const DB_SERVER = 'localhost';
 	const DB_LOGIN = '';
 	const DB_PASS = '';

style/_mask_project.scss

@@ -283,6 +283,10 @@ $legend-color: $post-color;
 			right: 0;
 			width: 100%;
 			
+			#posts_list {
+				position: relative;
+			}
+			
 			#poster {
 				textarea#post {
 					margin-bottom: 1em;
@@ -326,14 +330,15 @@ $legend-color: $post-color;
 
 					span {
 						display: inline-block;
-						width: 50%;
 						cursor: default;
 					
 						&.index {
+							width: 25%;
 							font-style: normal;
 						}
 						
 						&.time {
+							width: 75%;
 							text-align: right;
 						}
 					}