PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Merge pull request #827 from t3chguy/develop

Browse source 
Failed to enable HTML5 Notifications Error Dialogs
This commit is contained in:
Matthew Hodgson 2017-04-30 13:40:27 +01:00 committed by GitHub
commit 4f72450847
1 changed files with 38 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
src/Notifier.js
View file

@ -15,11 +15,13 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
var MatrixClientPeg = require("./MatrixClientPeg"); import MatrixClientPeg from './MatrixClientPeg';
var PlatformPeg = require("./PlatformPeg"); import PlatformPeg from './PlatformPeg';
var TextForEvent = require('./TextForEvent'); import TextForEvent from './TextForEvent';
var Avatar = require('./Avatar'); import Avatar from './Avatar';
var dis = require("./dispatcher"); import dis from './dispatcher';
import sdk from './index';
import Modal from './Modal';
/* /*
* Dispatches: * Dispatches:
@ -29,7 +31,7 @@ var dis = require("./dispatcher");
* } * }
*/ */
var Notifier = { const Notifier = {
notifsByRoom: {}, notifsByRoom: {},
notificationMessageForEvent: function(ev) { notificationMessageForEvent: function(ev) {
@ -48,16 +50,16 @@ var Notifier = {
return; return;
} }
var msg = this.notificationMessageForEvent(ev); let msg = this.notificationMessageForEvent(ev);
if (!msg) return; if (!msg) return;
var title; let title;
if (!ev.sender || room.name == ev.sender.name) { if (!ev.sender || room.name === ev.sender.name) {
title = room.name; title = room.name;
// notificationMessageForEvent includes sender, // notificationMessageForEvent includes sender,
// but we already have the sender here // but we already have the sender here
if (ev.getContent().body) msg = ev.getContent().body; if (ev.getContent().body) msg = ev.getContent().body;
} else if (ev.getType() == 'm.room.member') { } else if (ev.getType() === 'm.room.member') {
// context is all in the message here, we don't need // context is all in the message here, we don't need
// to display sender info // to display sender info
title = room.name; title = room.name;
@ -68,7 +70,7 @@ var Notifier = {
if (ev.getContent().body) msg = ev.getContent().body; if (ev.getContent().body) msg = ev.getContent().body;
} }
var avatarUrl = ev.sender ? Avatar.avatarUrlForMember( const avatarUrl = ev.sender ? Avatar.avatarUrlForMember(
ev.sender, 40, 40, 'crop' ev.sender, 40, 40, 'crop'
) : null; ) : null;
@ -83,7 +85,7 @@ var Notifier = {
}, },
_playAudioNotification: function(ev, room) { _playAudioNotification: function(ev, room) {
var e = document.getElementById("messageAudio"); const e = document.getElementById("messageAudio");
if (e) { if (e) {
e.load(); e.load();
e.play(); e.play();
@ -95,7 +97,7 @@ var Notifier = {
this.boundOnSyncStateChange = this.onSyncStateChange.bind(this); this.boundOnSyncStateChange = this.onSyncStateChange.bind(this);
this.boundOnRoomReceipt = this.onRoomReceipt.bind(this); this.boundOnRoomReceipt = this.onRoomReceipt.bind(this);
MatrixClientPeg.get().on('Room.timeline', this.boundOnRoomTimeline); MatrixClientPeg.get().on('Room.timeline', this.boundOnRoomTimeline);
MatrixClientPeg.get().on("Room.receipt", this.boundOnRoomReceipt); MatrixClientPeg.get().on('Room.receipt', this.boundOnRoomReceipt);
MatrixClientPeg.get().on("sync", this.boundOnSyncStateChange); MatrixClientPeg.get().on("sync", this.boundOnSyncStateChange);
this.toolbarHidden = false; this.toolbarHidden = false;
this.isSyncing = false; this.isSyncing = false;
@ -104,7 +106,7 @@ var Notifier = {
stop: function() { stop: function() {
if (MatrixClientPeg.get() && this.boundOnRoomTimeline) { if (MatrixClientPeg.get() && this.boundOnRoomTimeline) {
MatrixClientPeg.get().removeListener('Room.timeline', this.boundOnRoomTimeline); MatrixClientPeg.get().removeListener('Room.timeline', this.boundOnRoomTimeline);
MatrixClientPeg.get().removeListener("Room.receipt", this.boundOnRoomReceipt); MatrixClientPeg.get().removeListener('Room.receipt', this.boundOnRoomReceipt);
MatrixClientPeg.get().removeListener('sync', this.boundOnSyncStateChange); MatrixClientPeg.get().removeListener('sync', this.boundOnSyncStateChange);
} }
this.isSyncing = false; this.isSyncing = false;
@ -121,7 +123,7 @@ var Notifier = {
// make sure that we persist the current setting audio_enabled setting // make sure that we persist the current setting audio_enabled setting
// before changing anything // before changing anything
if (global.localStorage) { if (global.localStorage) {
if(global.localStorage.getItem('audio_notifications_enabled') == null) { if (global.localStorage.getItem('audio_notifications_enabled') === null) {
this.setAudioEnabled(this.isEnabled()); this.setAudioEnabled(this.isEnabled());
} }
} }
@ -131,6 +133,16 @@ var Notifier = {
plaf.requestNotificationPermission().done((result) => { plaf.requestNotificationPermission().done((result) => {
if (result !== 'granted') { if (result !== 'granted') {
// The permission request was dismissed or denied // The permission request was dismissed or denied
const description = result === 'denied'
? 'Riot does not have permission to send you notifications'
+ ' - please check your browser settings'
: 'Riot was not given permission to send notifications'
+ ' - please try again';
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
Modal.createDialog(ErrorDialog, {
title: 'Unable to enable Notifications',
description,
});
return; return;
} }
@ -141,7 +153,7 @@ var Notifier = {
if (callback) callback(); if (callback) callback();
dis.dispatch({ dis.dispatch({
action: "notifier_enabled", action: "notifier_enabled",
value: true value: true,
}); });
}); });
// clear the notifications_hidden flag, so that if notifications are // clear the notifications_hidden flag, so that if notifications are
@ -152,7 +164,7 @@ var Notifier = {
global.localStorage.setItem('notifications_enabled', 'false'); global.localStorage.setItem('notifications_enabled', 'false');
dis.dispatch({ dis.dispatch({
action: "notifier_enabled", action: "notifier_enabled",
value: false value: false,
}); });
} }
}, },
@ -165,7 +177,7 @@ var Notifier = {
if (!global.localStorage) return true; if (!global.localStorage) return true;
var enabled = global.localStorage.getItem('notifications_enabled'); const enabled = global.localStorage.getItem('notifications_enabled');
if (enabled === null) return true; if (enabled === null) return true;
return enabled === 'true'; return enabled === 'true';
}, },
@ -173,12 +185,12 @@ var Notifier = {
setAudioEnabled: function(enable) { setAudioEnabled: function(enable) {
if (!global.localStorage) return; if (!global.localStorage) return;
global.localStorage.setItem('audio_notifications_enabled', global.localStorage.setItem('audio_notifications_enabled',
enable ? 'true' : 'false'); enable ? 'true' : 'false');
}, },
isAudioEnabled: function(enable) { isAudioEnabled: function(enable) {
if (!global.localStorage) return true; if (!global.localStorage) return true;
var enabled = global.localStorage.getItem( const enabled = global.localStorage.getItem(
'audio_notifications_enabled'); 'audio_notifications_enabled');
// default to true if the popups are enabled // default to true if the popups are enabled
if (enabled === null) return this.isEnabled(); if (enabled === null) return this.isEnabled();
@ -192,7 +204,7 @@ var Notifier = {
// this is nothing to do with notifier_enabled // this is nothing to do with notifier_enabled
dis.dispatch({ dis.dispatch({
action: "notifier_enabled", action: "notifier_enabled",
value: this.isEnabled() value: this.isEnabled(),
}); });
// update the info to localStorage for persistent settings // update the info to localStorage for persistent settings
@ -215,8 +227,7 @@ var Notifier = {
onSyncStateChange: function(state) { onSyncStateChange: function(state) {
if (state === "SYNCING") { if (state === "SYNCING") {
this.isSyncing = true; this.isSyncing = true;
} } else if (state === "STOPPED" || state === "ERROR") {
else if (state === "STOPPED" || state === "ERROR") {
this.isSyncing = false; this.isSyncing = false;
} }
}, },
@ -225,10 +236,10 @@ var Notifier = {
if (toStartOfTimeline) return; if (toStartOfTimeline) return;
if (!room) return; if (!room) return;
if (!this.isSyncing) return; // don't alert for any messages initially if (!this.isSyncing) return; // don't alert for any messages initially
if (ev.sender && ev.sender.userId == MatrixClientPeg.get().credentials.userId) return; if (ev.sender && ev.sender.userId === MatrixClientPeg.get().credentials.userId) return;
if (data.timeline.getTimelineSet() !== room.getUnfilteredTimelineSet()) return; if (data.timeline.getTimelineSet() !== room.getUnfilteredTimelineSet()) return;
var actions = MatrixClientPeg.get().getPushActionsForEvent(ev); const actions = MatrixClientPeg.get().getPushActionsForEvent(ev);
if (actions && actions.notify) { if (actions && actions.notify) {
if (this.isEnabled()) { if (this.isEnabled()) {
this._displayPopupNotification(ev, room); this._displayPopupNotification(ev, room);
@ -240,7 +251,7 @@ var Notifier = {
}, },
onRoomReceipt: function(ev, room) { onRoomReceipt: function(ev, room) {
if (room.getUnreadNotificationCount() == 0) { if (room.getUnreadNotificationCount() === 0) {
// ideally we would clear each notification when it was read, // ideally we would clear each notification when it was read,
// but we have no way, given a read receipt, to know whether // but we have no way, given a read receipt, to know whether
// the receipt comes before or after an event, so we can't // the receipt comes before or after an event, so we can't
@ -255,7 +266,7 @@ var Notifier = {
} }
delete this.notifsByRoom[room.roomId]; delete this.notifsByRoom[room.roomId];
} }
} },
}; };
if (!global.mxNotifier) { if (!global.mxNotifier) {