diff --git a/app/coffee/modules/events.coffee b/app/coffee/modules/events.coffee index 349ce85f..307bf27c 100644 --- a/app/coffee/modules/events.coffee +++ b/app/coffee/modules/events.coffee @@ -113,6 +113,16 @@ class EventsService if (permission == "granted") subscribe() + webNotifications: -> + if not @.auth.userData? + return + userId = @.auth.userData.get('id') + + routingKey = "web_notifications.#{userId}" + randomTimeout = taiga.randomInt(700, 1000) + @.subscribe null, routingKey, (data) => + @rootScope.$broadcast "notifications:updated" + ########################################### # Heartbeat (Ping - Pong) ########################################### @@ -243,6 +253,7 @@ class EventsService @.startHeartBeatMessages() @.notifications() @.liveNotifications() + @.webNotifications() onMessage: (event) -> @.log.debug "WebSocket message received: #{event.data}" diff --git a/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.directive.coffee b/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.directive.coffee index b6094c65..808a1381 100644 --- a/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.directive.coffee +++ b/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.directive.coffee @@ -22,7 +22,7 @@ timeout = @.taiga.timeout DropdownNotificationsDirective = ($rootScope, notificationsService, currentUserService) -> link = ($scope, $el, $attrs, $ctrl) -> $scope.notificationsList = [] - $scope.loading = true + $scope.loading = false $scope.$on "notifications:loaded", (event, total) -> $scope.loading = false diff --git a/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.jade b/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.jade index e391182e..f372e56a 100644 --- a/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.jade +++ b/app/modules/navigation-bar/dropdown-notifications/dropdown-notifications.jade @@ -12,8 +12,8 @@ div.navbar-dropdown-notifications( ) .header span.notifications-title {{ 'EVENTS.MY_EVENTS' | translate }} - a(href="", ng-click="setAllAsRead()") {{ 'EVENTS.DISMISS_ALL' | translate }} - a(tg-nav="notifications") {{ 'EVENTS.VIEW_ALL' | translate }} + a.action(href="", ng-class="{'disabled': !total}", ng-click="!total||setAllAsRead()") {{ 'EVENTS.DISMISS_ALL' | translate }} + a.action(tg-nav="notifications") {{ 'EVENTS.VIEW_ALL' | translate }} .notifications-wrapper .empty(ng-if="!total && !loading") diff --git a/app/modules/navigation-bar/navigation-bar.scss b/app/modules/navigation-bar/navigation-bar.scss index a2e3938b..a2bedba1 100644 --- a/app/modules/navigation-bar/navigation-bar.scss +++ b/app/modules/navigation-bar/navigation-bar.scss @@ -240,7 +240,8 @@ $dropdown-width: 350px; .empty { color: $gray-light; - padding: 2.5em 0; + font-size: .9em; + padding: 1.5em 0; text-align: center; width: 100%; } @@ -250,23 +251,29 @@ $dropdown-width: 350px; color: $gray; display: flex; flex-direction: row; - padding: .6rem 0 .5rem .7rem; + padding: .6rem .75rem; .notifications-title { flex-grow: 1; text-transform: uppercase; } - a { - color: $gray-light; - font-size: .9rem; - padding: 0 .7rem 0 0; - text-align: right; + } + .action { + font-size: .9rem; + padding-left: 1.2rem; + text-align: right; + &.disabled { + color: $gray-lighter; + cursor: default; } - a:hover { + &:not(.disabled) { color: $primary; } + &:not(.disabled):hover { + color: $primary-light; + } } .notifications-wrapper { - min-height: 100px; + min-height: 70px; } .notifications-list { max-height: 400px; diff --git a/app/modules/notifications/notifications.controller.coffee b/app/modules/notifications/notifications.controller.coffee index 1dd520f5..bcc63d66 100644 --- a/app/modules/notifications/notifications.controller.coffee +++ b/app/modules/notifications/notifications.controller.coffee @@ -39,7 +39,6 @@ class NotificationsController extends mixOf(taiga.Controller, taiga.PageMixin, t @.user = @currentUserService.getUser() @.scrollDisabled = false @.initList() - @.initializeSubscription() @.loadNotifications() @rootScope.$on "notifications:updated", (event) => @@ -89,13 +88,5 @@ class NotificationsController extends mixOf(taiga.Controller, taiga.PageMixin, t @notificationsService.setNotificationsAsRead().then => @rootScope.$emit("notifications:updated") - initializeSubscription: -> - routingKey = "web_notifications.#{@.user.get("id")}" - randomTimeout = taiga.randomInt(700, 1000) - @events.subscribe( - @scope, - routingKey, - debounceLeading(randomTimeout, (message) => @rootScope.$broadcast "notifications:updated") - ) angular.module("taigaNotifications").controller("Notifications", NotificationsController) diff --git a/app/modules/notifications/notifications.scss b/app/modules/notifications/notifications.scss index 87f0b8fc..097fb93a 100644 --- a/app/modules/notifications/notifications.scss +++ b/app/modules/notifications/notifications.scss @@ -60,13 +60,15 @@ .notifications-list { .entry { - border-bottom: 1px solid $whitish; color: $blackish; display: flex; font-size: .9rem; margin: 0 .8rem; padding: .8rem 0; position: relative; + &:not(:last-child) { + border-bottom: 1px solid $whitish; + } p { line-height: 1.25em; margin-bottom: 0;