From 8c62c8d7bf233c838287488189d9b8235b3d5ff8 Mon Sep 17 00:00:00 2001 From: Kane York Date: Thu, 30 Jul 2015 11:30:30 -0700 Subject: [PATCH] FEATURE: Add off button on preferences for popup notifications --- .../desktop-notification-config.js.es6 | 65 +++++++++++++++++++ .../lib/desktop-notifications.js.es6 | 1 + .../desktop-notification-config.hbs | 20 ++++++ .../discourse/templates/user/preferences.hbs | 6 ++ config/locales/client.en.yml | 11 ++++ 5 files changed, 103 insertions(+) create mode 100644 app/assets/javascripts/discourse/components/desktop-notification-config.js.es6 create mode 100644 app/assets/javascripts/discourse/templates/components/desktop-notification-config.hbs diff --git a/app/assets/javascripts/discourse/components/desktop-notification-config.js.es6 b/app/assets/javascripts/discourse/components/desktop-notification-config.js.es6 new file mode 100644 index 000000000..5a362280c --- /dev/null +++ b/app/assets/javascripts/discourse/components/desktop-notification-config.js.es6 @@ -0,0 +1,65 @@ +export default Ember.Component.extend({ + classNames: ['controls'], + + notificationsPermission: function() { + if (this.get('isNotSupported')) return ''; + + return Notification.permission; + }.property(), + + notificationsDisabled: function(_, value) { + if (arguments.length > 1) { + localStorage.setItem('notifications-disabled', value); + } + return localStorage.getItem('notifications-disabled'); + }.property(), + + + isNotSupported: function() { + return !window['Notification']; + }.property(), + + isDefaultPermission: function() { + if (this.get('isNotSupported')) return false; + + return Notification.permission === "default"; + }.property('isNotSupported', 'notificationsPermission'), + + isDeniedPermission: function() { + if (this.get('isNotSupported')) return false; + + return Notification.permission === "denied"; + }.property('isNotSupported', 'notificationsPermission'), + + isGrantedPermission: function() { + if (this.get('isNotSupported')) return false; + + return Notification.permission === "granted"; + }.property('isNotSupported', 'notificationsPermission'), + + isEnabled: function() { + if (!this.get('isGrantedPermission')) return false; + + return !this.get('notificationsDisabled'); + }.property('isGrantedPermission', 'notificationsDisabled'), + + actions: { + requestPermission() { + const self = this; + Notification.requestPermission(function() { + self.propertyDidChange('notificationsPermission'); + }); + }, + recheckPermission() { + this.propertyDidChange('notificationsPermission'); + }, + turnoff() { + this.set('notificationsDisabled', 'disabled'); + this.propertyDidChange('notificationsPermission'); + }, + turnon() { + this.set('notificationsDisabled', ''); + this.propertyDidChange('notificationsPermission'); + } + } +}); diff --git a/app/assets/javascripts/discourse/lib/desktop-notifications.js.es6 b/app/assets/javascripts/discourse/lib/desktop-notifications.js.es6 index 5d7b18db0..ce67ff9df 100644 --- a/app/assets/javascripts/discourse/lib/desktop-notifications.js.es6 +++ b/app/assets/javascripts/discourse/lib/desktop-notifications.js.es6 @@ -94,6 +94,7 @@ function onNotification(data) { if (!liveEnabled) { return; } if (!primaryTab) { return; } if (!isIdle()) { return; } + if (localStorage.getItem('notifications-disabled')) { return; } const notificationTitle = I18n.t(i18nKey(data.notification_type), { site_title: Discourse.SiteSettings.title, diff --git a/app/assets/javascripts/discourse/templates/components/desktop-notification-config.hbs b/app/assets/javascripts/discourse/templates/components/desktop-notification-config.hbs new file mode 100644 index 000000000..3bc0db1c5 --- /dev/null +++ b/app/assets/javascripts/discourse/templates/components/desktop-notification-config.hbs @@ -0,0 +1,20 @@ + +{{#if isNotSupported}} + {{d-button icon="bell-slash" label="user.desktop_notifications.not_supported" disabled="true"}} +{{/if}} +{{#if isDefaultPermission}} + {{d-button icon="bell-slash" label="user.desktop_notifications.perm_default" action="requestPermission"}} +{{/if}} +{{#if isDeniedPermission}} + {{d-button icon="bell-slash" label="user.desktop_notifications.perm_denied_btn" action="recheckPermission"}} + {{i18n "user.desktop_notifications.perm_denied_expl"}} +{{/if}} +{{#if isGrantedPermission}} + {{#if isEnabled}} + {{d-button icon="bell-slash-o" label="user.desktop_notifications.disable" action="turnoff"}} + {{i18n "user.desktop_notifications.currently_enabled"}} + {{else}} + {{d-button icon="bell-o" label="user.desktop_notifications.enable" action="turnon"}} + {{i18n "user.desktop_notifications.currently_disabled"}} + {{/if}} +{{/if}} diff --git a/app/assets/javascripts/discourse/templates/user/preferences.hbs b/app/assets/javascripts/discourse/templates/user/preferences.hbs index 775f93bd9..278cd554b 100644 --- a/app/assets/javascripts/discourse/templates/user/preferences.hbs +++ b/app/assets/javascripts/discourse/templates/user/preferences.hbs @@ -189,6 +189,12 @@ +
+ + {{desktop-notification-config}} +
{{i18n 'user.desktop_notifications.each_browser_note'}}
+
+
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index e1c4b3c9e..f6034fac9 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -413,6 +413,17 @@ en: invited_by: "Invited By" trust_level: "Trust Level" notifications: "Notifications" + desktop_notifications: + label: "Desktop Notifications" + not_supported: "Notifications are not supported on this browser. Sorry." + perm_default: "Turn On Notifications" + perm_denied_btn: "Permission Denied" + perm_denied_expl: "You have denied permission for notifications. Use your browser to enable notifications, then click the button when done. (Desktop: The leftmost icon in the address bar. Mobile: 'Site Info'.)" + disable: "Disable Notifications" + currently_enabled: "(currently enabled)" + enable: "Enable Notifications" + currently_disabled: "(currently disabled)" + each_browser_note: "Note: You have to change this setting on every browser you use." dismiss_notifications: "Mark all as Read" dismiss_notifications_tooltip: "Mark all unread notifications as read" disable_jump_reply: "Don't jump to my post after I reply"