Merge branch 'dev' of https://github.com/redmatrix/hubzilla into xdev_merge

15 files changed, 234 insertions, 39 deletions

diff --git a/view/css/bootstrap-red.css b/view/css/bootstrap-red.css
index 18efd69e4..a0b7c5bba 100644
--- a/view/css/bootstrap-red.css
+++ b/view/css/bootstrap-red.css
@@ -11,7 +11,7 @@ nav .dropdown-menu {
 	min-width: 16rem;
 }
 
-@media screen and (min-width: 767px) {
+@media screen and (min-width: 992px) {
 	nav .badge {
 		top: 0px;
 		left: 0px;
@@ -19,7 +19,7 @@ nav .dropdown-menu {
 	}
 }
 
-@media screen and (max-width: 767px) {
+@media screen and (max-width: 992px) {
 	.navbar {
 		padding: .5rem 7px;
 	}
diff --git a/view/css/mod_hq.css b/view/css/mod_hq.css
new file mode 100644
index 000000000..dde242d4e
--- /dev/null
+++ b/view/css/mod_hq.css
@@ -0,0 +1,3 @@
+#jot-popup {
+	display: none;
+}
diff --git a/view/js/main.js b/view/js/main.js
index e231dac60..ddd876689 100644
--- a/view/js/main.js
+++ b/view/js/main.js
@@ -451,20 +451,20 @@ function NavUpdate() {
 			updateCountsOnly = false;
 
 			if(data.network || data.home || data.intros || data.register || data.mail || data.all_events || data.notify || data.files || data.pubs) {
-				$('#notifications-btn').css('opacity', 1);
+				$('.notifications-btn').css('opacity', 1);
 			}
 			else {
-				$('#notifications-btn').css('opacity', 0.5);
+				$('.notifications-btn').css('opacity', 0.5);
 				$('#navbar-collapse-1').removeClass('show');
 			}
 
 			if(data.home || data.intros || data.register || data.mail || data.notify || data.files) {
-				$('#notifications-btn-icon').removeClass('fa-exclamation-circle');
-				$('#notifications-btn-icon').addClass('fa-exclamation-triangle');
+				$('.notifications-btn-icon').removeClass('fa-exclamation-circle');
+				$('.notifications-btn-icon').addClass('fa-exclamation-triangle');
 			}
 			if(!data.home && !data.intros && !data.register && !data.mail && !data.notify && !data.files) {
-				$('#notifications-btn-icon').removeClass('fa-exclamation-triangle');
-				$('#notifications-btn-icon').addClass('fa-exclamation-circle');
+				$('.notifications-btn-icon').removeClass('fa-exclamation-triangle');
+				$('.notifications-btn-icon').addClass('fa-exclamation-circle');
 			}
 
 			$.each(data, function(index, item) {
@@ -959,9 +959,9 @@ function notify_popup_loader(notifyType) {
 		$("." + notifyType + "-update").html(data.notify.length);
 
 		$(data.notify).each(function() {
-			html = navbar_notifications_tpl.format(this.notify_link,this.photo,this.name,this.message,this.when,this.hclass,this.b64mid);
+			html = navbar_notifications_tpl.format(this.notify_link,this.photo,this.name,this.message,this.when,this.hclass,this.b64mid,this.notify_id);
 			$("#navbar-" + notifyType + "-menu").append(html);
-			html = notifications_tpl.format(this.notify_link,this.photo,this.name,this.message,this.when,this.hclass,this.b64mid);
+			html = notifications_tpl.format(this.notify_link,this.photo,this.name,this.message,this.when,this.hclass,this.b64mid,this.notify_id);
 			$("#nav-" + notifyType + "-menu").append(html);
 		});
 
diff --git a/view/js/mod_hq.js b/view/js/mod_hq.js
new file mode 100644
index 000000000..cf7ec941c
--- /dev/null
+++ b/view/js/mod_hq.js
@@ -0,0 +1,145 @@
+function hqLiveUpdate(notify_id, b64mid) {
+
+	if(typeof profile_uid === 'undefined') profile_uid = false; /* Should probably be unified with channelId defined in head.tpl */
+	if((src === null) || (stopped) || (! profile_uid)) { $('.like-rotator').hide(); return; }
+	if(($('.comment-edit-text.expanded').length) || (in_progress)) {
+		if(livetime) {
+			clearTimeout(livetime);
+		}
+		livetime = setTimeout(liveUpdate, 10000);
+		return;
+	}
+	if(livetime !== null)
+		livetime = null;
+
+	prev = 'live-' + src;
+
+	in_progress = true;
+
+	var update_url;
+	var update_mode;
+
+	if(scroll_next) {
+		bParam_page = next_page;
+		page_load = true;
+	}
+	else {
+		bParam_page = 1;
+	}
+
+	update_url = buildCmd();
+
+	if(page_load) {
+		$("#page-spinner").show();
+		if(bParam_page == 1)
+			update_mode = 'replace';
+		else
+			update_mode = 'append';
+	}
+	else {
+		update_mode = 'update';
+		var orgHeight = $("#region_2").height();
+	}
+
+	var dstart = new Date();
+	console.log('LOADING data...');
+	$.get(update_url, function(data) {
+
+		// on shared hosts occasionally the live update process will be killed
+		// leaving an incomplete HTML structure, which leads to conversations getting
+		// truncated and the page messed up if all the divs aren't closed. We will try 
+		// again and give up if we can't get a valid HTML response after 10 tries.
+
+		if((data.indexOf("<html>") != (-1)) && (data.indexOf("</html>") == (-1))) {
+			console.log('Incomplete data. Reloading');
+			in_progress = false;
+			liveRecurse ++;
+			if(liveRecurse < 10) {
+				liveUpdate();
+			}
+			else {
+				console.log('Incomplete data. Too many attempts. Giving up.');
+			}
+		}		
+
+		// else data was valid - reset the recursion counter
+		liveRecurse = 0;
+
+			if(notify_id !== 'undefined') {
+			$.post(
+				"hq",
+				{
+					"notify_id" : notify_id
+				},
+				function(data) {
+					if(timer) clearTimeout(timer);
+					timer = setTimeout(NavUpdate,10);
+				}
+			);
+		}
+
+		var dready = new Date();
+		console.log('DATA ready in: ' + (dready - dstart)/1000 + ' seconds.');
+
+		if(update_mode === 'update' || preloadImages) {
+			console.log('LOADING images...');
+
+			$('.wall-item-body, .wall-photo-item',data).imagesLoaded( function() {
+				var iready = new Date();
+				console.log('IMAGES ready in: ' + (iready - dready)/1000 + ' seconds.');
+
+				page_load = false;
+				scroll_next = false;
+				updateConvItems(update_mode,data);
+				$("#page-spinner").hide();
+				$("#profile-jot-text-loading").hide();
+
+				// adjust scroll position if new content was added above viewport
+				if(update_mode === 'update') {
+					$(window).scrollTop($(window).scrollTop() + $("#region_2").height() - orgHeight + contentHeightDiff);
+				}
+
+				in_progress = false;
+
+				// FIXME - the following lines were added so that almost
+				// immediately after we update the posts on the page, we
+				// re-check and update the notification counts.
+				// As it turns out this causes a bit of an inefficiency
+				// as we're pinging twice for every update, once before
+				// and once after. A btter way to do this is to rewrite
+				// NavUpdate and perhaps LiveUpdate so that we check for 
+				// post updates first and only call the notification ping 
+				// once. 
+
+				updateCountsOnly = true;
+				if(timer) clearTimeout(timer);
+				timer = setTimeout(NavUpdate,10);
+
+			});
+		}
+		else {
+			page_load = false;
+			scroll_next = false;
+			updateConvItems(update_mode,data);
+			$("#page-spinner").hide();
+			$("#profile-jot-text-loading").hide();
+
+			in_progress = false;
+
+			// FIXME - the following lines were added so that almost
+			// immediately after we update the posts on the page, we
+			// re-check and update the notification counts.
+			// As it turns out this causes a bit of an inefficiency
+			// as we're pinging twice for every update, once before
+			// and once after. A btter way to do this is to rewrite
+			// NavUpdate and perhaps LiveUpdate so that we check for 
+			// post updates first and only call the notification ping 
+			// once. 
+
+			updateCountsOnly = true;
+			if(timer) clearTimeout(timer);
+			timer = setTimeout(NavUpdate,10);
+
+		}
+	});
+}
diff --git a/view/pdl/mod_hq.pdl b/view/pdl/mod_hq.pdl
new file mode 100644
index 000000000..e657fa88b
--- /dev/null
+++ b/view/pdl/mod_hq.pdl
@@ -0,0 +1,3 @@
+[region=right_aside]
+[widget=notifications][/widget]
+[/region]
diff --git a/view/php/default.php b/view/php/default.php
index b180a6eb8..06cecc56f 100644
--- a/view/php/default.php
+++ b/view/php/default.php
@@ -8,7 +8,7 @@
 <body <?php if($page['direction']) echo 'dir="rtl"' ?> >
 	<?php if(x($page,'banner')) echo $page['banner']; ?>
 	<header><?php if(x($page,'header')) echo $page['header']; ?></header>
-	<nav class="navbar fixed-top navbar-expand-xl navbar-dark bg-dark"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
+	<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
 	<main>
 		<aside id="region_1"><div id="left_aside_spacer"><div id="left_aside_wrapper"><?php if(x($page,'aside')) echo $page['aside']; ?></div></div></aside>
 		<section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 6df5a060b..5f31004ff 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -1484,7 +1484,7 @@ blockquote {
 	color: $nav_active_icon_colour;
 }
 
-@media screen and (max-width: 767px) {
+@media screen and (max-width: 992px) {
 
 	aside#region_1 {
 		border-right: 1px solid $nav_bd;
@@ -1504,6 +1504,11 @@ blockquote {
 		flex-basis: 25%;
 	}
 
+	#navbar-collapse-2 .navbar-app i {
+		font-size: 1rem;
+		margin-right: 0.5rem;
+	}
+
 }
 
 .shareable_element_text {
diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js
index ed9ef02aa..41f5eb7ce 100644
--- a/view/theme/redbasic/js/redbasic.js
+++ b/view/theme/redbasic/js/redbasic.js
@@ -8,7 +8,7 @@ $(document).ready(function() {
 	$('body').append('<div id="css3-calc" style="width: 10px; width: calc(10px + 10px); display: none;"></div>');
 	if( $('#css3-calc').width() == 10) {
 		$(window).resize(function() {
-			if($(window).width() < 767) {
+			if($(window).width() < 992) {
 				$('main').css('width', $(window).width() + $('aside').outerWidth() );
 			} else {
 				$('main').css('width', '100%' );
@@ -17,7 +17,7 @@ $(document).ready(function() {
 	}
 	$('#css3-calc').remove(); // Remove the test element
 
-	if($(window).width() >= 767) {
+	if($(window).width() >= 992) {
 		$('#left_aside_wrapper').stick_in_parent({
 			offset_top: parseInt($('aside').css('padding-top')),
 			parent: 'main',
@@ -25,7 +25,7 @@ $(document).ready(function() {
 		});
 	}
 
-	if($(window).width() >= 1200) {
+	if($(window).width() >= 992) {
 		$('#right_aside_wrapper').stick_in_parent({
 			offset_top: parseInt($('aside').css('padding-top')),
 			parent: 'main',
@@ -77,7 +77,9 @@ $(document).ready(function() {
 		}
 	});
 
-	$('#notifications-btn').click(function() {
+	$('.notifications-btn').click(function(e) {
+		e.preventDefault();
+		e.stopPropagation();
 		if($('#navbar-collapse-2').hasClass('show')){
 			$('#navbar-collapse-2').removeClass('show');
 		}
diff --git a/view/tpl/app.tpl b/view/tpl/app.tpl
index ac5c18deb..7d2e46c59 100644
--- a/view/tpl/app.tpl
+++ b/view/tpl/app.tpl
@@ -12,13 +12,14 @@
 	</div>
 	{{/if}}
 	{{if $install || $update || $delete || $feature}}
-	<div class="app-tools">
+	<div class="text-center app-tools">
 		<form action="{{$hosturl}}appman" method="post">
 		<input type="hidden" name="papp" value="{{$app.papp}}" />
-		{{if $install}}<button type="submit" name="install" value="{{$install}}" class="btn btn-outline-secondary btn-sm" title="{{$install}}" ><i class="fa fa-arrow-circle-o-down" ></i></button>{{/if}}
-		{{if $edit}}<input type="hidden" name="appid" value="{{$app.guid}}" /><button type="submit" name="edit" value="{{$edit}}" class="btn btn-outline-secondary btn-sm" title="{{$edit}}" ><i class="fa fa-pencil" ></i></button>{{/if}}
-		{{if $delete}}<button type="submit" name="delete" value="{{if $deleted}}{{$undelete}}{{else}}{{$delete}}{{/if}}" class="btn btn-outline-secondary btn-sm" title="{{if $deleted}}{{$undelete}}{{else}}{{$delete}}{{/if}}" ><i class="fa fa-trash-o drop-icons"></i></button>{{/if}}
-		{{if $feature}}<button type="submit" name="feature" value="feature" class="btn btn-outline-secondary btn-sm" title="{{if $featured}}{{$remove}}{{else}}{{$add}}{{/if}}"><i class="fa fa-star"{{if $featured}} style="color: gold"{{/if}}></i></button>{{/if}}
+		{{if $install}}<button type="submit" name="install" value="{{$install}}" class="btn btn-outline-secondary btn-sm" title="{{$install}}" ><i class="fa fa-fw fa-arrow-circle-o-down" ></i></button>{{/if}}
+		{{if $edit}}<input type="hidden" name="appid" value="{{$app.guid}}" /><button type="submit" name="edit" value="{{$edit}}" class="btn btn-outline-secondary btn-sm" title="{{$edit}}" ><i class="fa fa-fw fa-pencil" ></i></button>{{/if}}
+		{{if $delete}}<button type="submit" name="delete" value="{{if $deleted}}{{$undelete}}{{else}}{{$delete}}{{/if}}" class="btn btn-outline-secondary btn-sm" title="{{if $deleted}}{{$undelete}}{{else}}{{$delete}}{{/if}}" ><i class="fa fa-fw fa-trash-o drop-icons"></i></button>{{/if}}
+		{{if $feature}}<button type="submit" name="feature" value="nav_featured_app" class="btn btn-outline-secondary btn-sm" title="{{if $featured}}{{$remove}}{{else}}{{$add}}{{/if}}"><i class="fa fa-fw fa-star{{if $featured}} text-warning{{/if}}"></i></button>{{/if}}
+		{{if $pin}}<button type="submit" name="pin" value="nav_pinned_app" class="btn btn-outline-secondary btn-sm" title="{{if $pinned}}{{$remove_nav}}{{else}}{{$add_nav}}{{/if}}"><i class="fa fa-fw fa-thumb-tack{{if $pinned}} text-success{{/if}}"></i></button>{{/if}}
 		</form>
 	</div>
 	{{/if}}
diff --git a/view/tpl/app_nav.tpl b/view/tpl/app_nav.tpl
index 046cd7237..817c74763 100644
--- a/view/tpl/app_nav.tpl
+++ b/view/tpl/app_nav.tpl
@@ -1 +1 @@
-<a class="navbar-app nav-link{{if $app.active}} active{{/if}}" href="{{$app.url}}" title="{{$app.name}}" >{{if $icon}}<i class="fa fa-fw fa-{{$icon}}"></i>{{else}}<img src="{{$app.photo}}" width="16" height="16" />{{/if}}</a>
+<a class="navbar-app nav-link{{if $app.active}} active{{/if}}" href="{{$app.url}}" title="{{$app.name}}" >{{if $icon}}<i class="fa fa-fw fa-{{$icon}}"></i>{{else}}<img src="{{$app.photo}}" width="16" height="16" />{{/if}}<span class="d-lg-none">{{$app.name}}</span></a>
diff --git a/view/tpl/apporder.tpl b/view/tpl/apporder.tpl
index fdb726131..8a247f11d 100644
--- a/view/tpl/apporder.tpl
+++ b/view/tpl/apporder.tpl
@@ -1,7 +1,15 @@
-<h2>{{$header}}</h2>
-
-<div class="descriptive-text">{{$desc}}</div>
-<br><br><br>
+{{if $navbar_apps}}
+<h2>{{$header.0}}</h2>
+<div class="descriptive-text">{{$desc.0}}</div>
+<br><br>
+{{foreach $navbar_apps as $navbar_app}}
+{{$navbar_app}}
+{{/foreach}}
+<br><br>
+{{/if}}
+<h2>{{$header.1}}</h2>
+<div class="descriptive-text">{{$desc.1}}</div>
+<br><br>
 {{foreach $nav_apps as $nav_app}}
 {{$nav_app}}
 {{/foreach}}
diff --git a/view/tpl/help.tpl b/view/tpl/help.tpl
index d36494123..c523c4115 100644
--- a/view/tpl/help.tpl
+++ b/view/tpl/help.tpl
@@ -9,6 +9,7 @@
 					<a class="dropdown-item lang-choice" href="/help">de</a>
 					<a class="dropdown-item lang-choice" href="/help">en</a>
 					<a class="dropdown-item lang-choice" href="/help">es</a>
+					<a class="dropdown-item lang-choice" href="/help">fr</a>
 				</div>
 			</div>
 		</div>
diff --git a/view/tpl/navbar_default.tpl b/view/tpl/navbar_default.tpl
index 426d32047..c4f5af1dc 100755
--- a/view/tpl/navbar_default.tpl
+++ b/view/tpl/navbar_default.tpl
@@ -1,5 +1,5 @@
 {{if $nav.login && !$userinfo}}
-<div class="d-xl-none pt-1 pb-1">
+<div class="d-lg-none pt-1 pb-1">
 	{{if $nav.loginmenu.1.4}}
 	<a class="btn btn-primary btn-sm text-white" href="#" title="{{$nav.loginmenu.1.3}}" id="{{$nav.loginmenu.1.4}}_collapse" data-toggle="modal" data-target="#nav-login">
 		{{$nav.loginmenu.1.1}}
@@ -76,12 +76,12 @@
 		<i class="fa fa-question-circle"></i>
 	</button>
 	{{/if}}
-	<button id="expand-aside" type="button" class="d-md-none navbar-toggler border-0" data-toggle="offcanvas" data-target="#region_1">
+	<button id="expand-aside" type="button" class="d-lg-none navbar-toggler border-0" data-toggle="offcanvas" data-target="#region_1">
 		<i class="fa fa-arrow-circle-right" id="expand-aside-icon"></i>
 	</button>
 	{{if $localuser || $nav.pubs}}
-	<button id="notifications-btn" type="button" class="navbar-toggler border-0 text-white">
-		<i id="notifications-btn-icon" class="fa fa-exclamation-circle"></i>
+	<button id="notifications-btn-1" type="button" class="navbar-toggler border-0 text-white notifications-btn">
+		<i id="notifications-btn-icon-1" class="fa fa-exclamation-circle notifications-btn-icon"></i>
 	</button>
 	{{/if}}
 	<button id="menu-btn" class="navbar-toggler border-0" type="button" data-toggle="collapse" data-target="#navbar-collapse-2">
@@ -134,6 +134,11 @@
 			<a class="nav-link {{$nav.help.2}}" target="hubzilla-help" href="{{$nav.help.0}}" title="{{$nav.help.3}}" id="{{$nav.help.4}}" onclick="contextualHelp(); return false;"><i class="fa fa-fw fa-question-circle"></i></a>
 		</li>
 		{{/if}}
+		{{if $localuser || $nav.pubs}}
+		<li id="notifications-btn" class="nav-item d-xl-none">
+			<a class="nav-link text-white notifications-btn" href="#"><i id="notifications-btn-icon" class="fa fa-exclamation-circle  notifications-btn-icon"></i></a>
+		</li>
+		{{/if}}
 		{{if $channel_menu && $channel_apps.0}}
 		<li class="nav-item dropdown" id="channel-menu">
 			<a class="nav-link" href="#" data-toggle="dropdown"><img src="{{$channel_thumb}}" style="height:14px; width:14px;position:relative; top:-2px;" /></a>
@@ -179,7 +184,7 @@
 		</li>
 	</ul>
 </div>
-<div class="collapse d-xl-none" id="navbar-collapse-2">
+<div class="collapse d-lg-none" id="navbar-collapse-2">
 	<div class="navbar-nav mr-auto">
 		{{if $channel_apps.0}}
 		{{foreach $channel_apps as $channel_app}}
@@ -190,6 +195,9 @@
 		</div>
 		<div id="sys-apps-collapsed" style="display:none;">
 		{{/if}}
+		{{foreach $navbar_apps as $navbar_app}}
+		{{$navbar_app}}
+		{{/foreach}}
 		{{foreach $nav_apps as $nav_app}}
 		{{$nav_app|replace:'dropdown-item':'nav-link'}}
 		{{/foreach}}
diff --git a/view/tpl/navbar_tucson.tpl b/view/tpl/navbar_tucson.tpl
index faf8b5b4a..4e045571f 100755
--- a/view/tpl/navbar_tucson.tpl
+++ b/view/tpl/navbar_tucson.tpl
@@ -1,5 +1,5 @@
 {{if $nav.login && !$userinfo}}
-<div class="d-xl-none pt-1 pb-1">
+<div class="d-lg-none pt-1 pb-1">
 	{{if $nav.loginmenu.1.4}}
 	<a class="btn btn-primary btn-sm text-white" href="#" title="{{$nav.loginmenu.1.3}}" id="{{$nav.loginmenu.1.4}}_collapse" data-toggle="modal" data-target="#nav-login">
 		{{$nav.loginmenu.1.1}}
@@ -87,8 +87,8 @@
 	</button>
 
 	{{if $localuser || $nav.pubs}}
-	<button id="notifications-btn" type="button" class="navbar-toggler border-0 text-white" data-toggle="collapse" data-target="#navbar-collapse-1">
-		<i id="notifications-btn-icon" class="fa fa-exclamation"></i>
+	<button id="notifications-btn-1" type="button" class="navbar-toggler border-0 text-white notifications-btn" data-toggle="collapse" data-target="#navbar-collapse-1">
+		<i id="notifications-btn-icon-1" class="fa fa-exclamation notifications-btn-icon"></i>
 	</button>
 	{{/if}}
 
@@ -231,6 +231,11 @@
 			<a class="nav-link {{$nav.help.2}}" target="hubzilla-help" href="{{$nav.help.0}}" title="{{$nav.help.3}}" id="{{$nav.help.4}}" onclick="contextualHelp(); return false;"><i class="fa fa-fw fa-question-circle"></i></a>
 		</li>
 		{{/if}}
+		{{if $localuser || $nav.pubs}}
+		<li id="notifications-btn" class="nav-item d-xl-none">
+			<a class="nav-link text-white notifications-btn" href="#"><i id="notifications-btn-icon" class="fa fa-exclamation-circle  notifications-btn-icon"></i></a>
+		</li>
+		{{/if}}
 		{{if $channel_apps.0}}
 		<li class="nav-item dropdown" id="channel-menu">
 			<a class="nav-link" href="#" data-toggle="dropdown"><img src="{{$channel_thumb}}" style="height:14px; width:14px;position:relative; top:-2px;" /></a>
@@ -258,7 +263,7 @@
 </div>
 
 
-<div class="collapse d-xl-none" id="navbar-collapse-2">
+<div class="collapse d-lg-none" id="navbar-collapse-2">
 	<div class="navbar-nav mr-auto">
 		{{if $channel_apps.0}}
 		{{foreach $channel_apps as $channel_app}}
diff --git a/view/tpl/notifications_widget.tpl b/view/tpl/notifications_widget.tpl
index 3ef7bff7d..8168866ad 100644
--- a/view/tpl/notifications_widget.tpl
+++ b/view/tpl/notifications_widget.tpl
@@ -2,7 +2,7 @@
 	var notifications_parent;
 	$(document).ready(function() {
 		notifications_parent = $('#notifications_wrapper')[0].parentElement.id;
-		$('#notifications-btn').click(function() {
+		$('.notifications-btn').click(function() {
 			if($('#notifications_wrapper').hasClass('fs'))
 				$('#notifications_wrapper').prependTo('#' + notifications_parent);
 			else
@@ -15,21 +15,35 @@
 		});
 	});
 
-	{{if $module == 'display'}}
+	{{if $module == 'display' || $module == 'hq'}}
 	$(document).on('click', '.notification', function(e) {
 		var b64mid = $(this).data('b64mid');
+		var notify_id = $(this).data('notify_id');
 		var path = $(this)[0].pathname.substr(1,7);
 
+		console.log(path);
+
+		{{if $module == 'hq'}}
+		if(b64mid !== 'undefined' && path !== 'pubstre') {
+		{{else}}
 		if(path === 'display' && b64mid) {
+		{{/if}}
 			e.preventDefault();
 			e.stopPropagation();
 
 			$('.thread-wrapper').remove();
-			$(this).fadeOut();
+
+			if(! page_load)
+				$(this).fadeOut();
+
 			bParam_mid = b64mid;
 			mode = 'replace';
 			page_load = true;
+			{{if $module == 'hq'}}
+			hqLiveUpdate(notify_id);
+			{{else}}
 			liveUpdate();
+			{{/if}}
 
 			if($('#notifications_wrapper').hasClass('fs'))
 				$('#notifications_wrapper').prependTo('#' + notifications_parent).removeClass('fs');
@@ -43,7 +57,7 @@
 <div id="notifications_wrapper">
 	<div id="notifications" class="navbar-nav" data-children=".nav-item">
 		<div id="nav-notifications-template" rel="template">
-			<a class="list-group-item clearfix notification {5}" href="{0}" title="{2} {3}" data-b64mid="{6}">
+			<a class="list-group-item clearfix notification {5}" href="{0}" title="{2} {3}" data-b64mid="{6}" data-notify_id="{7}">
 				<img class="menu-img-3" data-src="{1}">
 				<span class="contactname">{2}</span>
 				<span class="dropdown-sub-text">{3}<br>{4}</span>