updated app

node_modules/derby-examples/widgets/lib/app/ui/connectionAlert/index.html

@@ -0,0 +1,15 @@
+<connectionAlert:>
+  <div class="connection">
+    {#unless connected}
+      <p class="alert">
+        {#if canConnect}
+          Offline 
+          {#unless :self.hideReconnect}
+            &ndash; <a x-bind="click:connect">Reconnect</a>
+          {/}
+        {else}
+          Unable to reconnect &ndash; <a x-bind="click:reload">Reload</a>
+        {/}
+      </p>
+    {/}
+  </div>

node_modules/derby-examples/widgets/lib/app/ui/connectionAlert/index.js

@@ -0,0 +1,15 @@
+exports.create = function(model, self) {
+
+  exports.connect = function() {
+    // Hide the reconnect link for a second after clicking it
+    self.set('hideReconnect', true)
+    setTimeout(function() {
+      self.set('hideReconnect', false)
+    }, 1000)
+    model.socket.socket.connect()
+  }
+
+  exports.reload = function() {
+    window.location.reload()
+  }
+}