Display a little message while trying to redirect

css/open.css

@@ -50,3 +50,23 @@ limitations under the License.
     border-bottom: 1px solid var(--grey);
     padding: 4px 0;
 }
+
+.OpeningClientView {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    margin: 0;
+}
+
+.OpeningClientView .defaultAvatar {
+    width: 64px;
+    height: 64px;
+    background-image: url('../images/chat-icon.svg');
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: 85%;
+}
+
+.OpeningClientView .spinner {
+    margin-top: 15px;
+}

src/open/OpenLinkView.js

@@ -22,10 +22,24 @@ import {ServerConsentView} from "./ServerConsentView.js";
 export class OpenLinkView extends TemplateView {
     render(t, vm) {
         return t.div({className: "OpenLinkView card"}, [
+            t.map(vm => vm.tryingLink, tryingLink => tryingLink ?
+                t.view(new TryingLinkView(vm)) :
                 t.mapView(vm => vm.previewViewModel, previewVM => previewVM ?
                     new ShowLinkView(vm) :
                     new ServerConsentView(vm.serverConsentViewModel)
                 ),
+            ),
+        ]);
+    }
+}
+
+class TryingLinkView extends TemplateView {
+    render (t, vm) {
+        return t.div({ className: "OpeningClientView" }, [
+            t.div({className: "defaultAvatar"}),
+            t.h1("Trying to open your default client..."),
+            t.span("If this doesn't work, you will be redirected shortly."),
+            t.div({className: "spinner"}),
         ]);
     }
 }

src/open/OpenLinkViewModel.js

@@ -48,7 +48,7 @@ export class OpenLinkViewModel extends ViewModel {
             setTimeout(() => {
                 this.tryingLink = false;
                 this.emitChange();
-            }, 5000);
+            }, 1000);
             this.openLink(matrixUrl);
         }
     }