Notfication API on android

client/scripts/network.js

@@ -9,7 +9,8 @@ class ServerConnection {
     }
 
     _connect() {
-        if (this._isConnected()) return;
+        clearTimeout(this._reconnectTimer);
+        if (this._isConnected() || this._isConnecting()) return;
         const ws = new WebSocket(this._endpoint());
         ws.binaryType = 'arraybuffer';
         ws.onopen = e => console.log('WS: server connected');
@@ -17,13 +18,16 @@ class ServerConnection {
         ws.onclose = e => this._onDisconnect();
         ws.onerror = e => console.error(e);
         this._socket = ws;
-        clearTimeout(this._reconnectTimer);
     }
 
     _isConnected() {
         return this._socket && this._socket.readyState === this._socket.OPEN;
     }
 
+    _isConnecting() {
+        return this._socket && this._socket.readyState === this._socket.CONNECTING;
+    }
+
     _onMessage(msg) {
         msg = JSON.parse(msg);
         console.log('WS:', msg);

client/scripts/ui.js

@@ -361,7 +361,8 @@ class Notifications {
         const config = {
             body: body,
             icon: '/images/logo_transparent_128x128.png',
-            vibrate: [200, 100, 200, 100, 200, 100, 400],
+            // 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

client/styles.css

@@ -301,6 +301,7 @@ x-dialog x-background {
     background: rgba(0, 0, 0, 0.61);
     z-index: 10;
     transition: opacity 300ms;
+    will-change: opacity;
     padding: 16px;
 }
 
@@ -313,6 +314,7 @@ x-dialog x-paper {
     max-width: 400px;
     box-sizing: border-box;
     transition: transform 300ms;
+    will-change: transform;
 }
 
 x-dialog:not([show]) {