From 3b0dd95a7bd9d109b49e8b5b85db43de1f280942 Mon Sep 17 00:00:00 2001
From: Luis Fernando Molina <Luis-Fernando-Molina@users.noreply.github.com>
Date: Fri, 27 Mar 2020 18:38:27 +0100
Subject: [PATCH] status bar implementation

---
 Spaces/CockpitSpace.js | 21 +++++++++++++++++++--
 SystemEventHandler.js  |  9 +++++++++
 2 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/Spaces/CockpitSpace.js b/Spaces/CockpitSpace.js
index 3291428ec..a70fa8c73 100644
--- a/Spaces/CockpitSpace.js
+++ b/Spaces/CockpitSpace.js
@@ -195,9 +195,18 @@
 
      zeroPoint = thisObject.container.frame.frameThisPoint(zeroPoint)
 
+     let barColor
+     let statusText
+     if (systemEventHandler.isConnected()) {
+       barColor = UI_COLOR.DARK_TURQUOISE
+     } else {
+       barColor = UI_COLOR.RED
+       statusText = 'Lost connection with the local backend. Please check that all localhost servers are running.'
+     }
+
      browserCanvasContext.beginPath()
      browserCanvasContext.rect(zeroPoint.x, zeroPoint.y, thisObject.container.frame.width, thisObject.container.frame.height)
-     browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.DARK_TURQUOISE + ', ' + opacity + ')'
+     browserCanvasContext.fillStyle = 'rgba(' + barColor + ', ' + opacity + ')'
      browserCanvasContext.closePath()
      browserCanvasContext.fill()
 
@@ -213,7 +222,15 @@
      browserCanvasContext.closePath()
      browserCanvasContext.fill()
 
-     if (canvas.designSpace.workspace.enabled === true) {
+     if (statusText !== undefined) {
+       let position = {
+         x: thisObject.container.frame.width / 2,
+         y: thisObject.container.frame.height / 2 + 5
+       }
+       printLabel(statusText, position.x, position.y, 1, 15, UI_COLOR.TITANIUM_YELLOW, true, thisObject.container)
+     }
+
+     if (canvas.designSpace.workspace.enabled === true && statusText === undefined) {
        arrow()
      }
    }
diff --git a/SystemEventHandler.js b/SystemEventHandler.js
index b200cc1b2..e6fd960fc 100644
--- a/SystemEventHandler.js
+++ b/SystemEventHandler.js
@@ -12,6 +12,7 @@ function newSystemEventHandler () {
   let WEB_SOCKETS_CONNECTION
 
   let thisObject = {
+    isConnected: isConnected,
     initialize: initialize,
     physics: physics,
     createEventHandler: createEventHandler,
@@ -30,6 +31,14 @@ function newSystemEventHandler () {
     setuptWebSockets(callBackFunction)
   }
 
+  function isConnected () {
+    if (WEB_SOCKETS_CONNECTION.readyState === 1) {
+      return true
+    } else {
+      return false
+    }
+  }
+
   function sendCommand (command, responseCallBack, eventsCallBack) {
     if (command.action === 'listenToEvent') {
       let key