aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorMario Vavti <mario@mariovavti.com>2017-12-11 16:50:25 +0100
committerMario Vavti <mario@mariovavti.com>2017-12-11 16:50:25 +0100
commit5b1ef760a06dd892a6decf6a621e710b5ae4e7bd (patch)
treebcb1a055ec081f533f122fa7172782d65edee2d2
parent4859e6e11a725c345de24749f8600a20ea0a4c2f (diff)
downloadvolse-hubzilla-5b1ef760a06dd892a6decf6a621e710b5ae4e7bd.tar.gz
volse-hubzilla-5b1ef760a06dd892a6decf6a621e710b5ae4e7bd.tar.bz2
volse-hubzilla-5b1ef760a06dd892a6decf6a621e710b5ae4e7bd.zip
notification: slight animation for loading... and do not remove public stream items on click (we can not mark them read)
-rw-r--r--Zotlabs/Widget/Notifications.php2
-rw-r--r--include/nav.php2
-rw-r--r--view/theme/redbasic/css/style.css43
-rwxr-xr-xview/tpl/navbar_tucson.tpl12
-rw-r--r--view/tpl/notifications_widget.tpl6
5 files changed, 55 insertions, 10 deletions
diff --git a/Zotlabs/Widget/Notifications.php b/Zotlabs/Widget/Notifications.php
index 450d3565e..a677d84c9 100644
--- a/Zotlabs/Widget/Notifications.php
+++ b/Zotlabs/Widget/Notifications.php
@@ -144,7 +144,7 @@ class Notifications {
$o = replace_macros(get_markup_template('notifications_widget.tpl'), array(
'$module' => \App::$module,
'$notifications' => $notifications,
- '$loading' => t('Loading...')
+ '$loading' => t('Loading')
));
return $o;
diff --git a/include/nav.php b/include/nav.php
index 66c4c1556..2366fe7f1 100644
--- a/include/nav.php
+++ b/include/nav.php
@@ -313,7 +313,7 @@ EOT;
'$sitelocation' => $sitelocation,
'$nav' => $x['nav'],
'$banner' => $banner,
- '$emptynotifications' => t('Loading...'),
+ '$emptynotifications' => t('Loading'),
'$userinfo' => $x['usermenu'],
'$localuser' => local_channel(),
'$is_owner' => $is_owner,
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 5728d7948..e46d31ef8 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -306,6 +306,49 @@ nav {
/* spinner end */
+/* jumping dots */
+.jumping-dots span {
+ position: relative;
+ bottom: 0px;
+ transition-timing-function: ease-in-out;
+ -webkit-animation: jump 1s infinite;
+ animation: jump 1s infinite;
+}
+
+.jumping-dots .dot-1 {
+ -webkit-animation-delay: 200ms;
+ animation-delay: 200ms;
+}
+
+.jumping-dots .dot-2 {
+ -webkit-animation-delay: 400ms;
+ animation-delay: 400ms;
+}
+
+.jumping-dots .dot-3 {
+ -webkit-animation-delay: 600ms;
+ animation-delay: 600ms;
+}
+
+@-webkit-keyframes jump {
+ 0% {
+ bottom: 0px;
+ }
+ 20% {
+ bottom: 3px;
+ }
+ 40% {
+ bottom: 0px;
+ }
+}
+
+@keyframes jump {
+ 0% {bottom: 0px;}
+ 20% {bottom: 3px;}
+ 40% {bottom: 0px;}
+}
+/* jumping dots end */
+
/* footer */
footer {
diff --git a/view/tpl/navbar_tucson.tpl b/view/tpl/navbar_tucson.tpl
index 4e045571f..08fc40656 100755
--- a/view/tpl/navbar_tucson.tpl
+++ b/view/tpl/navbar_tucson.tpl
@@ -113,7 +113,7 @@
<div id="navbar-network-menu" class="dropdown-menu" rel="network">
<a class="dropdown-item" id="nav-network-see-all" href="{{$nav.network.all.0}}">{{$nav.network.all.1}}</a>
<a class="dropdown-item" id="nav-network-mark-all" href="#" onclick="markRead('network'); return false;">{{$nav.network.mark.1}}</a>
- {{$emptynotifications}}
+ {{$emptynotifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</li>
{{/if}}
@@ -126,7 +126,7 @@
<div id="navbar-home-menu" class="dropdown-menu" rel="home">
<a class="dropdown-item" id="nav-home-see-all" href="{{$nav.home.all.0}}">{{$nav.home.all.1}}</a>
<a class="dropdown-item" id="nav-home-mark-all" href="#" onclick="markRead('home'); return false;">{{$nav.home.mark.1}}</a>
- {{$emptynotifications}}
+ {{$emptynotifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</li>
{{/if}}
@@ -139,7 +139,7 @@
<div id="navbar-mail-menu" class="dropdown-menu" rel="messages">
<a class="dropdown-item" id="nav-messages-see-all" href="{{$nav.messages.all.0}}">{{$nav.messages.all.1}}</a>
<a class="dropdown-item" id="nav-messages-mark-all" href="#" onclick="markRead('messages'); return false;">{{$nav.messages.mark.1}}</a>
- {{$emptynotifications}}
+ {{$emptynotifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</li>
{{/if}}
@@ -152,7 +152,7 @@
<div id="navbar-all_events-menu" class="dropdown-menu" rel="all_events">
<a class="dropdown-item" id="nav-all_events-see-all" href="{{$nav.all_events.all.0}}">{{$nav.all_events.all.1}}</a>
<a class="dropdown-item" id="nav-all_events-mark-all" href="#" onclick="markRead('all_events'); return false;">{{$nav.all_events.mark.1}}</a>
- {{$emptynotifications}}
+ {{$emptynotifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</li>
{{/if}}
@@ -164,7 +164,7 @@
</a>
<div id="navbar-intros-menu" class="dropdown-menu" rel="intros">
<a class="dropdown-item" id="nav-intros-see-all" href="{{$nav.intros.all.0}}">{{$nav.intros.all.1}}</a>
- {{$emptynotifications}}
+ {{$emptynotifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</li>
{{/if}}
@@ -177,7 +177,7 @@
<div id="navbar-notify-menu" class="dropdown-menu" rel="notify">
<a class="dropdown-item" id="nav-notify-see-all" href="{{$nav.notifications.all.0}}">{{$nav.notifications.all.1}}</a>
<a class="dropdown-item" id="nav-notify-mark-all" href="#" onclick="markRead('notify'); return false;">{{$nav.notifications.mark.1}}</a>
- {{$emptynotifications}}
+ {{$emptynotifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</li>
{{/if}}
diff --git a/view/tpl/notifications_widget.tpl b/view/tpl/notifications_widget.tpl
index 9751f2e75..0974045fe 100644
--- a/view/tpl/notifications_widget.tpl
+++ b/view/tpl/notifications_widget.tpl
@@ -43,7 +43,9 @@
e.preventDefault();
if(! page_load) {
- $(this).fadeOut();
+ if($(this).parent().attr('id') !== 'nav-pubs-menu')
+ $(this).fadeOut();
+
getData(b64mid, notify_id);
}
@@ -110,7 +112,7 @@
<i class="fa fa-fw fa-filter"></i> {{$notification.filter.label}}
</div>
{{/if}}
- {{$loading}}
+ {{$loading}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
</div>
{{/foreach}}