Merge pull request #31 from ajtack/connection-failure-visibility

Avoid a token error, make the problem visible in the UI

static/sync/index.js

@@ -15,6 +15,13 @@ $(function () {
   $.getJSON('/token', function (tokenResponse) {
     //Initialize the Sync client
     syncClient = new Twilio.Sync.Client(tokenResponse.token, { logLevel: 'info' });
+    syncClient.on('connectionStateChanged', function(state) {
+      if (state != 'connected') {
+        $message.html('Sync is not live (websocket connection <span style="color: red">' + state + '</span>)…');
+      } else {
+        $message.html('Sync is live!');
+      }
+    });
 
     //Let's pop a message on the screen to show that Sync is ready
     $message.html('Sync initialized!');