1.2.2

README.md

@@ -40,7 +40,14 @@ Options:
 | `confirmationMessage` (optional) | Text to show to ask for agreement to continue | `Waiting for a facilitator to join the chat...` |
 | `exitMessage` (optional) | Text to show if the user rejects the Terms of Use. | `The chat is closed. You may close this window.` |
 | `anonymousDisplayName` (optional) | The display name for the chat user. | `Anonymous` |
-| `chatUnavailableMessage` (optional) | Text to show if no-one is available to respond  | `The chat service is not available right now. Please try again later.` |
+| `chatUnavailableMessage` (optional) | Text to show on error or if the service is otherwise unavailable  | `The chat service is not available right now. Please try again later.` |
+| `waitMessage` (optional) | Text to show if there is at least one facilitator online but they do not respond right away | `Please be patient, our online facilitators are currently responding to other support requests.` |
+| `chatOfflineMessage` (optional) | Text to show if there is no-one online respond | `All of the chat facilitators are currently offline.` |
+| `size` (optional) | The size of the start button. Can be 'small' or 'large' | `large` |
+| `position` (optional) | The position of the start button. Can be 'top left', 'top right', 'bottom left', 'bottom right'. | `bottom right` |
+| `maxWaitTime` (optional) | The maximum time (in ms) the chatbox will wait for someone to join before closing the chat and displaying the chat unavailable message | 600000 |
+| `waitInterval` (optional) | The interval (in ms) at which the bot sends the wait message | 120000 |
+
 
 ## Feature list
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "private-safesupport-chatbox",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "private-safesupport-chatbox",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "A secure and private embeddable chatbox that connects to Riot",
   "main": "dist/chatbox.js",
   "scripts": {

src/components/chatbox.jsx

@@ -232,12 +232,6 @@ class ChatBox extends React.Component {
     this.setState({ ready: false })
 
     const client = await this.createClientWithAccount()
-    this.setState({
-      client: client
-    })
-    client.setDisplayName(this.props.anonymousDisplayName)
-    this.setMatrixListeners(client)
-
     try {
       await client.initCrypto()
     } catch(err) {
@@ -245,7 +239,15 @@ class ChatBox extends React.Component {
     }
 
     await client.startClient()
-    await this.createRoom(client)
+
+    client.once('sync', async (state, prevState, data) => {
+      if (state === "PREPARED") {
+        this.setState({ client })
+        client.setDisplayName(this.props.anonymousDisplayName)
+        this.setMatrixListeners(client)
+        await this.createRoom(client)
+      }
+    })
   }
 
   restartWithoutCrypto = async () => {
@@ -277,35 +279,35 @@ class ChatBox extends React.Component {
 
     let client;
     client = matrix.createClient(opts)
-    this.setState({
-      client: client,
-    })
+    await client.startClient()
 
-    try {
-      this.setMatrixListeners(client)
-      client.setDisplayName(this.props.anonymousDisplayName)
-      await this.createRoom(client)
-      await client.startClient()
-      this.displayBotMessage({ body: UNENCRYPTION_NOTICE })
-    } catch(err) {
-      console.log("error", err)
-      this.handleInitError(err)
-    }
+    client.once('sync', async (state, prevState, data) => {
+      if (state === "PREPARED") {
+        try {
+          this.setState({ client })
+          client.setDisplayName(this.props.anonymousDisplayName)
+          this.setMatrixListeners(client)
+          await this.createRoom(client)
+          this.displayBotMessage({ body: UNENCRYPTION_NOTICE })
+        } catch(err) {
+          console.log("error", err)
+          this.handleInitError(err)
+        }
+      }
+    })
   }
 
 
   initializeUnencryptedChat = async () => {
     this.setState({ ready: false })
-
     const client = await this.createClientWithAccount()
-    this.setState({
-      client: client
-    })
-    client.setDisplayName(this.props.anonymousDisplayName)
-    this.setMatrixListeners(client)
-
     await client.startClient()
-    await this.createRoom(client)
+
+    client.once('sync', async (state, prevState, data) => {
+      client.setDisplayName(this.props.anonymousDisplayName)
+      this.setMatrixListeners(client)
+      await this.createRoom(client)
+    })
   }
 
   handleInitError = (err) => {
@@ -504,6 +506,21 @@ class ChatBox extends React.Component {
   }
 
   setMatrixListeners = client => {
+    client.on("sync", (state, prevState, data) => {
+      switch (state) {
+        case "ERROR":
+          // update UI to say "Connection Lost"
+          break;
+        case "SYNCING":
+          // update UI to remove any "Connection Lost" message
+          break;
+        case "PREPARED":
+          // the client instance is ready to be queried.
+          this.setState({ client: client })
+          break;
+      }
+    });
+
     client.on("Room.timeline", (event, room) => {
       const eventType = event.getType()
       const content = event.getContent()