toolbar and pwa

web/manifest.json

@@ -0,0 +1,22 @@
+{
+  "name": "PoliticTalk",
+  "short_name": "PoliticTalk",
+  "description": "Join a PoliticTalk session by Parallel Globe.",
+  "start_url": "/",
+  "scope": "/",
+  "display": "browser",
+  "background_color": "#101820",
+  "theme_color": "#63477a",
+  "icons": [
+    {
+      "src": "/images/politictalk/pg_globe.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/images/politictalk/pg_globe.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}

web/plugin.head.html

@@ -474,7 +474,6 @@
         html:not(.politictalk-direct-access-blocked) .toolbox-content-wrapper {
             opacity: 1 !important;
             pointer-events: auto !important;
-            transform: translateY(0) !important;
             transition: none !important;
             visibility: visible !important;
             z-index: 1000 !important;
@@ -482,11 +481,16 @@
 
         html:not(.politictalk-direct-access-blocked) #new-toolbox,
         html:not(.politictalk-direct-access-blocked) .toolbox {
+            align-items: center !important;
             bottom: calc(env(safe-area-inset-bottom, 0px) + 10px) !important;
+            display: flex !important;
+            justify-content: center !important;
             left: 0 !important;
             position: fixed !important;
             right: 0 !important;
             top: auto !important;
+            transform: none !important;
+            width: 100% !important;
         }
 
         html:not(.politictalk-direct-access-blocked) .toolbox-content,
@@ -495,6 +499,18 @@
             max-width: calc(100vw - 20px) !important;
         }
 
+        html:not(.politictalk-direct-access-blocked) .toolbox-content-wrapper {
+            left: 50% !important;
+            right: auto !important;
+            transform: translateX(-50%) !important;
+        }
+
+        html:not(.politictalk-direct-access-blocked) .toolbox-content {
+            margin-left: auto !important;
+            margin-right: auto !important;
+            transform: none !important;
+        }
+
         .politictalk-direct-access {
             align-items: flex-start;
             padding: 150px 18px 18px;
@@ -513,6 +529,9 @@
 <script>
     (function() {
         var PARALLEL_GLOBE_URL = 'https://parallelglobe.io';
+
+        disablePoliticTalkPwaInstallPrompt();
+
         var restoredMeetingToken = restoreMeetingTokenFromSession();
 
         if (restoredMeetingToken) {
@@ -532,6 +551,50 @@
             return window.location.pathname.replace(/\/+$/, '');
         }
 
+        function disablePoliticTalkPwaInstallPrompt() {
+            window.addEventListener('beforeinstallprompt', function(event) {
+                event.preventDefault();
+            });
+
+            rewritePoliticTalkManifestLinks();
+
+            if (document.readyState === 'loading') {
+                document.addEventListener('DOMContentLoaded', rewritePoliticTalkManifestLinks);
+            }
+
+            if ('serviceWorker' in window.navigator) {
+                window.navigator.serviceWorker.getRegistrations()
+                    .then(function(registrations) {
+                        registrations.forEach(function(registration) {
+                            registration.unregister();
+                        });
+                    })
+                    .catch(function() {
+                        // The meeting does not depend on the PWA worker.
+                    });
+            }
+        }
+
+        function rewritePoliticTalkManifestLinks() {
+            if (!document.head) {
+                return;
+            }
+
+            var links = document.querySelectorAll('link[rel~="manifest"]');
+
+            if (!links.length) {
+                var link = document.createElement('link');
+                link.rel = 'manifest';
+                link.href = '/manifest.json';
+                document.head.appendChild(link);
+                return;
+            }
+
+            links.forEach(function(link) {
+                link.href = '/manifest.json';
+            });
+        }
+
         function isIgnoredJitsiPath(path) {
             return /^\/(?:static|images|libs|css|sounds|fonts|transcripts)\//.test(path);
         }

web/title.html

@@ -3,7 +3,11 @@
 <meta property="og:image" content="/images/politictalk/pgLogo.svg" />
 <meta property="og:description" content="Join a PoliticTalk session by ParallelGlobe" />
 <meta name="description" content="Join a PoliticTalk session by ParallelGlobe" />
+<meta name="application-name" content="PoliticTalk" />
+<meta name="apple-mobile-web-app-title" content="PoliticTalk" />
+<meta name="theme-color" content="#63477a" />
 <meta itemprop="name" content="PoliticTalk" />
 <meta itemprop="description" content="Join a PoliticTalk session by ParallelGlobe" />
 <meta itemprop="image" content="/images/politictalk/pgLogo.svg" />
 <link rel="icon" href="/images/politictalk/favicon.ico" />
+<link rel="manifest" href="/manifest.json" />