invite links.

client/src/components/connect.vue

@@ -6,9 +6,10 @@
         <span><b>n</b>.eko</span>
       </div>
       <form class="message" v-if="!connecting" @submit.stop.prevent="connect">
-        <span>{{ $t('connect.title') }}</span>
+        <span v-if="!autoPassword">{{ $t('connect.login_title') }}</span>
+        <span v-else>{{ $t('connect.invitation_title') }}</span>
         <input type="text" :placeholder="$t('connect.displayname')" v-model="displayname" />
-        <input type="password" :placeholder="$t('connect.password')" v-model="password" />
+        <input type="password" :placeholder="$t('connect.password')" v-model="password" v-if="!autoPassword" />
         <button type="submit" @click.stop.prevent="login">
           {{ $t('connect.connect') }}
         </button>
@@ -158,13 +159,29 @@
         this.$accessor.login({ displayname: this.$accessor.displayname, password: this.$accessor.password })
       }
     }
+    get autoPassword() {
+      return new URL(location.href).searchParams.get('pwd')
+    }
 
     get connecting() {
       return this.$accessor.connecting
     }
 
-    login() {
+    async login() {
-      this.$accessor.login({ displayname: this.displayname, password: this.password })
+      let password = this.password
+      if (this.autoPassword) {
+        password = this.autoPassword
+      }
+
+      try {
+        await this.$accessor.login({ displayname: this.displayname, password })
+      } catch (err) {
+        this.$swal({
+          title: this.$t('connect.error') as string,
+          text: err.message,
+          icon: 'error',
+        })
+      }
     }
   }
 </script>

client/src/locale/en-us.ts

@@ -10,10 +10,12 @@ export const side = {
 }
 
 export const connect = {
-  title: 'Please Login',
+  login_title: 'Please Login',
-  displayname: 'Display Name',
+  invitation_title: 'You have been invited to this room',
+  displayname: 'Enter your display name',
   password: 'Password',
   connect: 'Connect',
+  error: 'Login error',
 }
 
 export const context = {

client/src/neko/base.ts

@@ -52,7 +52,7 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
     }
 
     if (displayname === '') {
-      throw new Error('Must add a displayname') // TODO: Better handling
+      throw new Error('Display Name cannot be empty.')
     }
 
     this._displayname = displayname