Merge pull request #3068 from quay/browser-notifications
Browser notifications setting
This commit is contained in:
commit
bd1f3e6bb8
4 changed files with 104 additions and 4 deletions
|
@ -10,7 +10,7 @@
|
|||
})
|
||||
}]);
|
||||
|
||||
function UserViewCtrl($scope, $routeParams, $timeout, ApiService, UserService, UIService, AvatarService, Config, ExternalLoginService) {
|
||||
function UserViewCtrl($scope, $routeParams, $timeout, ApiService, UserService, UIService, AvatarService, Config, ExternalLoginService, CookieService) {
|
||||
var username = $routeParams.username;
|
||||
|
||||
$scope.Config = Config;
|
||||
|
@ -184,5 +184,53 @@
|
|||
$scope.showBilling = function() {
|
||||
$scope.showBillingCounter++;
|
||||
};
|
||||
|
||||
|
||||
$scope.notificationsPermissionsEnabled = window['Notification']
|
||||
&& Notification.permission === 'granted'
|
||||
&& CookieService.get('quay.enabledDesktopNotifications') === 'on';
|
||||
|
||||
$scope.desktopNotificationsPermissionIsDisabled = () => window['Notification'] && Notification.permission === 'denied';
|
||||
|
||||
$scope.toggleDesktopNotifications = () => {
|
||||
if (!window['Notification']) { // unsupported in IE & some older browsers, we'll just tell the user it's not available
|
||||
bootbox.dialog({
|
||||
"message": 'Desktop Notifications unsupported in this browser',
|
||||
"title": 'Unsupported Option',
|
||||
"buttons": {
|
||||
"close": {
|
||||
"label": "Close",
|
||||
"className": "btn-primary"
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (CookieService.get('quay.enabledDesktopNotifications') === 'on') {
|
||||
CookieService.putPermanent('quay.enabledDesktopNotifications', 'off');
|
||||
CookieService.clear('quay.notifications.mostRecentTimestamp');
|
||||
$scope.notificationsPermissionsEnabled = false;
|
||||
} else {
|
||||
if (Notification.permission === 'default') {
|
||||
Notification.requestPermission()
|
||||
.then((newPermission) => {
|
||||
if (newPermission === 'granted') {
|
||||
CookieService.putPermanent('quay.enabledDesktopNotifications', 'on');
|
||||
CookieService.putPermanent('quay.notifications.mostRecentTimestamp', new Date().getTime().toString());
|
||||
$scope.notificationsPermissionsEnabled = true;
|
||||
} else {
|
||||
$scope.notificationsPermissionsEnabled = false;
|
||||
}
|
||||
});
|
||||
} else if (Notification.permission === 'granted') {
|
||||
CookieService.putPermanent('quay.enabledDesktopNotifications', 'on');
|
||||
CookieService.putPermanent('quay.notifications.mostRecentTimestamp', new Date().getTime().toString());
|
||||
$scope.notificationsPermissionsEnabled = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
})();
|
|
@ -71,8 +71,12 @@ angular.module('quay').factory('Config', ['Features', function(Features) {
|
|||
return value;
|
||||
};
|
||||
|
||||
config.getEnterpriseLogo = function() {
|
||||
config.getEnterpriseLogo = function(opt_defaultValue) {
|
||||
if (!config.ENTERPRISE_LOGO_URL) {
|
||||
if (opt_defaultValue) {
|
||||
return opt_defaultValue;
|
||||
}
|
||||
|
||||
if (Features.BILLING) {
|
||||
return '/static/img/quay-horizontal-color.svg';
|
||||
} else {
|
||||
|
|
|
@ -3,9 +3,9 @@
|
|||
* in the sidebar) and provides helper methods for working with them.
|
||||
*/
|
||||
angular.module('quay').factory('NotificationService',
|
||||
['$rootScope', '$interval', 'UserService', 'ApiService', 'StringBuilderService', 'PlanService', 'UserService', 'Features', 'Config', '$location', 'VulnerabilityService',
|
||||
['$rootScope', '$interval', 'UserService', 'ApiService', 'StringBuilderService', 'PlanService', 'CookieService', 'Features', 'Config', '$location', 'VulnerabilityService',
|
||||
|
||||
function($rootScope, $interval, UserService, ApiService, StringBuilderService, PlanService, UserService, Features, Config, $location, VulnerabilityService) {
|
||||
function($rootScope, $interval, UserService, ApiService, StringBuilderService, PlanService, CookieService, Features, Config, $location, VulnerabilityService) {
|
||||
var notificationService = {
|
||||
'user': null,
|
||||
'notifications': [],
|
||||
|
@ -266,6 +266,10 @@ function($rootScope, $interval, UserService, ApiService, StringBuilderService, P
|
|||
notificationService.notifications = resp['notifications'];
|
||||
notificationService.additionalNotifications = resp['additional'];
|
||||
notificationService.notificationClasses = notificationService.getClasses(notificationService.notifications);
|
||||
|
||||
if (notificationService.notifications.length > 0 && CookieService.get('quay.enabledDesktopNotifications') === 'on') {
|
||||
notificationService.sendBrowserNotifications();
|
||||
}
|
||||
});
|
||||
|
||||
if (Features.APP_SPECIFIC_TOKENS) {
|
||||
|
@ -277,6 +281,33 @@ function($rootScope, $interval, UserService, ApiService, StringBuilderService, P
|
|||
});
|
||||
}
|
||||
};
|
||||
|
||||
notificationService.sendBrowserNotifications = () => {
|
||||
let mostRecentTimestamp = parseInt(CookieService.get('quay.notifications.mostRecentTimestamp'), 10);
|
||||
if (!mostRecentTimestamp) {
|
||||
mostRecentTimestamp = new Date(notificationService.notifications[0].created).getTime();
|
||||
}
|
||||
|
||||
const newNotifications = notificationService.notifications
|
||||
.filter(obj => new Date(obj.created).getTime() > mostRecentTimestamp);
|
||||
|
||||
if (newNotifications.length > 0) {
|
||||
let message = 'You have unread notifications';
|
||||
if (newNotifications.length === 1) {
|
||||
message = notificationService.getMessage(newNotifications[0]);
|
||||
}
|
||||
|
||||
new Notification(message, {
|
||||
// Chrome doesn't display SVGs for notifications, so we'll use a default if we don't have an enterprise logo
|
||||
icon: window.location.origin + Config.getEnterpriseLogo('/static/img/quay-logo.png'),
|
||||
image: window.location.origin + Config.getEnterpriseLogo('/static/img/quay-logo.png'),
|
||||
});
|
||||
|
||||
const newTimestamp = new Date(newNotifications[0].created).getTime();
|
||||
CookieService.putPermanent('quay.notifications.mostRecentTimestamp', newTimestamp.toString());
|
||||
}
|
||||
};
|
||||
|
||||
notificationService.reset = function() {
|
||||
$interval.cancel(pollTimerHandle);
|
||||
pollTimerHandle = $interval(notificationService.update, 5 * 60 * 1000 /* five minutes */);
|
||||
|
|
|
@ -170,6 +170,23 @@
|
|||
<a class="co-modify-link" ng-click="showChangeAccount()">Individual account</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Desktop Notifications:</td>
|
||||
<td>
|
||||
<span>Enable Desktop Notifications:
|
||||
<button class="btn btn-default"
|
||||
ng-disabled="desktopNotificationsPermissionIsDisabled()"
|
||||
ng-click="toggleDesktopNotifications()"
|
||||
ng-model="notificationsPermissionsEnabled"
|
||||
>{{ notificationsPermissionsEnabled ? 'enabled' : 'disabled' }}
|
||||
</button>
|
||||
</span>
|
||||
<span class="help-text"
|
||||
ng-if="desktopNotificationsPermissionIsDisabled()"
|
||||
>Note: Desktop notifications have been disabled, or are unavailable, in your browser.
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
|
Reference in a new issue