From 44bd3edd7b664b97b5356a89a9bd3e19a158b019 Mon Sep 17 00:00:00 2001 From: RobinLinus Date: Fri, 21 Sep 2018 23:23:07 +0200 Subject: [PATCH] Notifications Android & Desktop --- client/scripts/ui.js | 54 ++++++++++++++++++++++++++++---------------- 1 file changed, 35 insertions(+), 19 deletions(-) diff --git a/client/scripts/ui.js b/client/scripts/ui.js index 1b90a8f..42ca141 100644 --- a/client/scripts/ui.js +++ b/client/scripts/ui.js @@ -1,8 +1,8 @@ const $ = query => document.getElementById(query); const $$ = query => document.body.querySelector(query); const isURL = text => /^((https?:\/\/|www)[^\s]+)/g.test(text.toLowerCase()); -const isDownloadSupported = (typeof document.createElement('a').download !== 'undefined'); -const isProductionEnvironment = !window.location.host.startsWith('localhost'); +window.isDownloadSupported = (typeof document.createElement('a').download !== 'undefined'); +window.isProductionEnvironment = !window.location.host.startsWith('localhost'); class PeersUI { @@ -236,10 +236,8 @@ class ReceiveDialog extends Dialog { this.$el.querySelector('#fileSize').textContent = this._formatFileSize(file.size); this.show(); - if (!isDownloadSupported) return; - // $a.target = "_blank"; // fallback - $a.target = "_system"; // fallback - $a.href = 'external:' + $a.href; + if (window.isDownloadSupported) return; + $a.target = "_blank"; // fallback } _formatFileSize(bytes) { @@ -335,7 +333,7 @@ class Notifications { constructor() { // Check if the browser supports notifications if (!('Notification' in window)) return; - + // Check whether notification permissions have already been granted if (Notification.permission !== 'granted') { this.$button = $('notification'); @@ -361,35 +359,53 @@ class Notifications { const config = { body: body, icon: '/images/logo_transparent_128x128.png', - // vibrate: [200, 100, 200, 100, 200, 100, 400], - // requireInteraction: true } - if (serviceWorker && serviceWorker.showNotification) { - // android doesn't support "new Notification" if service worker is installed - return serviceWorker.showNotification(message, config); - } else { + try { return new Notification(message, config); + } catch (e) { + // android doesn't support "new Notification" if service worker is installed + if (!serviceWorker || !serviceWorker.showNotification) return; + return serviceWorker.showNotification(message, config); } + } _messageNotification(message) { if (isURL(message)) { const notification = this._notify(message, 'Click to open link'); - notification.onclick = e => window.open(message, '_blank', null, true); + this._bind(notification, e => window.open(message, '_blank', null, true)); } else { const notification = this._notify(message, 'Click to copy text'); - notification.onclick = e => document.copy(message); + this._bind(notification, e => this._copyText(message, notification)); } } _downloadNotification(message) { const notification = this._notify(message, 'Click to download'); - if (window.isDownloadSupported) return; - notification.onclick = e => { - document.querySelector('x-dialog [download]').click(); - }; + if (!window.isDownloadSupported) return; + this._bind(notification, e => this._download(notification)); } + _download(notification) { + document.querySelector('x-dialog [download]').click(); + notification.close(); + } + + _copyText(message, notification) { + document.copy(message); + notification.close(); + this._notify('Copied text to clipboard'); + } + + _bind(notification, handler) { + if (notification.then) { + notification.then(e => serviceWorker.getNotifications().then(notifications => { + serviceWorker.addEventListener('notificationclick', handler); + })); + } else { + notification.onclick = handler; + } + } } class Snapdrop {