diff --git a/CockpitSpace/AssetBalances.js b/CockpitSpace/AssetBalances.js
new file mode 100644
index 000000000..5b7db2c35
--- /dev/null
+++ b/CockpitSpace/AssetBalances.js
@@ -0,0 +1,122 @@
+
+function newAssetBalances () {
+  const MODULE_NAME = 'Asset Balances'
+
+  let thisObject = {
+    visible: true,
+    container: undefined,
+    paramsArray: undefined,
+    setParamsArray: setParamsArray,
+    physics: physics,
+    draw: draw,
+    speedometers: [],
+    getContainer: getContainer,
+    initialize: initialize,
+    finalize: finalize
+  }
+
+  thisObject.container = newContainer()
+  thisObject.container.initialize(MODULE_NAME)
+
+  thisObject.container.isDraggeable = false
+  thisObject.container.isWheelable = false
+
+  return thisObject
+
+  function finalize () {
+    for (let i = 0; i < thisObject.speedometers.length; i++) {
+      let speedometer = thisObject.speedometers[i]
+      speedometer.finalize()
+    }
+    thisObject.container.finalize()
+    thisObject.container = undefined
+    thisObject.paramsArray = undefined
+  }
+
+  function initialize () {
+    for (let i = 0; i < 2; i++) {
+      let speedometer = newSpeedometer()
+
+      speedometer.container.frame.position.x = thisObject.container.frame.width / 2 - speedometer.container.frame.width / 2
+      speedometer.container.frame.position.y = thisObject.container.frame.height / 2 - speedometer.container.frame.height / 2
+
+      speedometer.initialize()
+      thisObject.speedometers.push(speedometer)
+    }
+  }
+
+  function getContainer (point, purpose) {
+    if (thisObject.visible !== true) { return }
+
+    let container
+    for (let i = 0; i < thisObject.speedometers.length; i++) {
+      container = thisObject.speedometers[i].getContainer(point, purpose)
+      if (container !== undefined) {
+        if (container.isForThisPurpose(purpose)) {
+          if (thisObject.container.frame.isThisPointHere(point, true) === true) {
+            return container
+          }
+        }
+      }
+    }
+
+    if (thisObject.container.frame.isThisPointHere(point, true) === true) {
+      return thisObject.container
+    } else {
+      return undefined
+    }
+  }
+
+  function setParamsArray (paramsArray) {
+    thisObject.paramsArray = paramsArray
+    for (let i = 0; i < thisObject.speedometers.length; i++) {
+      let speedometer = thisObject.speedometers[i]
+      speedometer.params = paramsArray[i]
+    }
+  }
+
+  function physics () {
+
+  }
+
+  function draw () {
+    if (thisObject.visible !== true) { return }
+
+    for (let i = 0; i < thisObject.speedometers.length; i++) {
+      let speedometer = thisObject.speedometers[i]
+      speedometer.draw()
+    }
+
+    drawAssetBalances()
+  }
+
+  function drawAssetBalances () {
+    if (thisObject.paramsArray === undefined) { return }
+
+    let fontSize
+    let label
+    let xOffset
+    let yOffset
+
+    const OPACITY = 1
+
+      /* We put the params.VALUE in the middle */
+
+    fontSize = 15
+
+    browserCanvasContext.font = 'bold  ' + fontSize + 'px ' + UI_FONT.PRIMARY
+
+    label = 'ASSET BALANCES'
+
+    xOffset = label.length / 2 * fontSize * FONT_ASPECT_RATIO
+    yOffset = -45
+
+    labelPoint = {
+      x: 0 - xOffset + (thisObject.paramsArray[1].LEFT_OFFSET - thisObject.paramsArray[0].LEFT_OFFSET) / 2 + thisObject.paramsArray[0].LEFT_OFFSET - 20,
+      y: COCKPIT_SPACE_POSITION - COCKPIT_SPACE_HEIGHT / 2 - yOffset
+    }
+
+    browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
+    browserCanvasContext.fillText(label, labelPoint.x, labelPoint.y)
+  }
+}
diff --git a/CockpitSpace/Speedometer.js b/CockpitSpace/Speedometer.js
new file mode 100644
index 000000000..afa2b1204
--- /dev/null
+++ b/CockpitSpace/Speedometer.js
@@ -0,0 +1,236 @@
+
+function newSpeedometer () {
+  const MODULE_NAME = 'Speedometer'
+
+  let thisObject = {
+    visible: true,
+    container: undefined,
+    params: undefined,
+    physics: physics,
+    draw: draw,
+    getContainer: getContainer,
+    initialize: initialize,
+    finalize: finalize
+  }
+
+  thisObject.container = newContainer()
+  thisObject.container.initialize(MODULE_NAME)
+
+  thisObject.container.isDraggeable = false
+  thisObject.container.isWheelable = false
+
+  return thisObject
+
+  function finalize () {
+    thisObject.container.finalize()
+    thisObject.container = undefined
+    thisObject.params = undefined
+  }
+
+  function initialize () {
+
+  }
+
+  function getContainer (point, purpose) {
+    if (thisObject.visible !== true) { return }
+
+    if (thisObject.container.frame.isThisPointHere(point, true) === true) {
+      return thisObject.container
+    } else {
+      return undefined
+    }
+  }
+
+  function physics () {
+
+  }
+
+  function draw () {
+    if (thisObject.params === undefined) { return }
+    drawAssetCircle()
+  }
+
+  function drawAssetCircle () {
+    const RED_LINE_HIGHT = 5
+    const RADIOUS = 50
+    const OPACITY = 1
+
+    let centerPoint = {
+      x: thisObject.params.LEFT_OFFSET,
+      y: COCKPIT_SPACE_POSITION - COCKPIT_SPACE_HEIGHT / 2
+    }
+
+    browserCanvasContext.beginPath()
+    browserCanvasContext.arc(centerPoint.x, centerPoint.y, RADIOUS + RED_LINE_HIGHT, 0.85 * Math.PI, 2.15 * Math.PI)
+    browserCanvasContext.closePath()
+
+    browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.RUSTED_RED + ', ' + OPACITY + ')'
+    browserCanvasContext.fill()
+
+    browserCanvasContext.beginPath()
+    browserCanvasContext.arc(centerPoint.x, centerPoint.y, RADIOUS, 0.0 * Math.PI, 2.0 * Math.PI)
+    browserCanvasContext.closePath()
+
+    browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.DARK + ', ' + OPACITY + ')'
+    browserCanvasContext.fill()
+
+    /* We draw the circle bar */
+
+    const DEFAULT_THICKNESS = 2
+    const VALUE_THICKNESS = 8
+    const VALUE_BG_THICKNESS = 1
+    const BAR_RADIOUS = RADIOUS * 0.85
+
+    let BAR_START_ANGLE = 0.85 * Math.PI
+    let BAR_END_ANGLE = 2.15 * Math.PI
+    let CURRENT_VALUE_ANGLE = thisObject.params.VALUE * (BAR_END_ANGLE - BAR_START_ANGLE) / thisObject.params.MAX_VALUE + BAR_START_ANGLE
+    let MIN_VALUE_ANGLE = thisObject.params.MIN_VALUE * (BAR_END_ANGLE - BAR_START_ANGLE) / thisObject.params.MAX_VALUE + BAR_START_ANGLE
+    let INIT_VALUE_ANGLE = thisObject.params.INIT_VALUE * (BAR_END_ANGLE - BAR_START_ANGLE) / thisObject.params.MAX_VALUE + BAR_START_ANGLE
+    let PROFIT_VALUE_ANGLE = CURRENT_VALUE_ANGLE
+
+    if (CURRENT_VALUE_ANGLE > INIT_VALUE_ANGLE) { CURRENT_VALUE_ANGLE = INIT_VALUE_ANGLE }
+
+    if (thisObject.params.VALUE > 0) {
+      browserCanvasContext.setLineDash([0, 0])
+
+      browserCanvasContext.beginPath()
+      browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, BAR_START_ANGLE, MIN_VALUE_ANGLE)
+
+      browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.TITANIUM_YELLOW + ', ' + OPACITY + ')'
+      browserCanvasContext.lineWidth = VALUE_BG_THICKNESS
+      browserCanvasContext.stroke()
+      browserCanvasContext.closePath()
+
+      browserCanvasContext.beginPath()
+      browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, MIN_VALUE_ANGLE, CURRENT_VALUE_ANGLE)
+
+      browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
+      browserCanvasContext.lineWidth = VALUE_BG_THICKNESS
+      browserCanvasContext.stroke()
+      browserCanvasContext.closePath()
+
+      browserCanvasContext.beginPath()
+      browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, CURRENT_VALUE_ANGLE, INIT_VALUE_ANGLE)
+
+      browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.RED + ', ' + OPACITY + ')'
+      browserCanvasContext.lineWidth = VALUE_BG_THICKNESS
+      browserCanvasContext.stroke()
+      browserCanvasContext.closePath()
+
+      if (PROFIT_VALUE_ANGLE > INIT_VALUE_ANGLE) {
+        browserCanvasContext.beginPath()
+        browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, INIT_VALUE_ANGLE, PROFIT_VALUE_ANGLE)
+
+        browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.GREEN + ', ' + OPACITY + ')'
+        browserCanvasContext.lineWidth = VALUE_BG_THICKNESS
+        browserCanvasContext.stroke()
+        browserCanvasContext.closePath()
+      }
+
+      browserCanvasContext.setLineDash([2, 3])
+
+      browserCanvasContext.beginPath()
+      browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, BAR_START_ANGLE, MIN_VALUE_ANGLE)
+
+      browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.TITANIUM_YELLOW + ', ' + OPACITY + ')'
+      browserCanvasContext.lineWidth = VALUE_THICKNESS
+      browserCanvasContext.stroke()
+      browserCanvasContext.closePath()
+
+      browserCanvasContext.beginPath()
+      browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, MIN_VALUE_ANGLE, CURRENT_VALUE_ANGLE)
+
+      browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
+      browserCanvasContext.lineWidth = VALUE_THICKNESS
+      browserCanvasContext.stroke()
+      browserCanvasContext.closePath()
+
+      browserCanvasContext.beginPath()
+      browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, CURRENT_VALUE_ANGLE, INIT_VALUE_ANGLE)
+
+      browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.RED + ', ' + OPACITY + ')'
+      browserCanvasContext.lineWidth = VALUE_THICKNESS
+      browserCanvasContext.stroke()
+      browserCanvasContext.closePath()
+
+      if (PROFIT_VALUE_ANGLE > INIT_VALUE_ANGLE) {
+        browserCanvasContext.beginPath()
+        browserCanvasContext.arc(centerPoint.x, centerPoint.y, BAR_RADIOUS, INIT_VALUE_ANGLE, PROFIT_VALUE_ANGLE)
+
+        browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.GREEN + ', ' + OPACITY + ')'
+        browserCanvasContext.lineWidth = VALUE_THICKNESS
+        browserCanvasContext.stroke()
+        browserCanvasContext.closePath()
+      }
+    }
+
+    /* Common Variables */
+
+    let fontSize
+    let label
+    let xOffset
+    let yOffset
+
+    /* We put the thisObject.params.VALUE in the middle */
+
+    fontSize = 22
+
+    browserCanvasContext.font = 'bold  ' + fontSize + 'px ' + UI_FONT.PRIMARY
+
+    label = thisObject.params.VALUE
+    if (isNaN(label) === false) {
+      label = Number(label)
+      if (label === 0) { label = label.toFixed(2) } else { label = label.toLocaleString() }
+    }
+
+    label = label.substring(0, 5)
+
+    xOffset = label.length / 2 * fontSize * FONT_ASPECT_RATIO + 7
+
+    labelPoint = {
+      x: centerPoint.x - xOffset,
+      y: centerPoint.y
+    }
+
+    browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
+    browserCanvasContext.fillText(label, labelPoint.x, labelPoint.y)
+
+    /* We put the top label */
+
+    fontSize = 12
+
+    browserCanvasContext.font = 'bold  ' + fontSize + 'px ' + UI_FONT.PRIMARY
+
+    label = thisObject.params.ASSET_LABEL
+
+    xOffset = label.length / 2 * fontSize * FONT_ASPECT_RATIO + 3
+    yOffset = 22
+
+    labelPoint = {
+      x: centerPoint.x - xOffset,
+      y: centerPoint.y - yOffset
+    }
+
+    browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
+    browserCanvasContext.fillText(label, labelPoint.x, labelPoint.y)
+
+    /* We put the bottom label */
+
+    fontSize = 12
+
+    browserCanvasContext.font = 'bold  ' + fontSize + 'px ' + UI_FONT.PRIMARY
+
+    label = thisObject.params.ASSET_NAME
+
+    xOffset = label.length / 2 * fontSize * FONT_ASPECT_RATIO + 3
+    yOffset = -15
+
+    labelPoint = {
+      x: centerPoint.x - xOffset,
+      y: centerPoint.y - yOffset
+    }
+
+    browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
+    browserCanvasContext.fillText(label, labelPoint.x, labelPoint.y)
+  }
+}
diff --git a/CockpitSpace/UIControl.js b/CockpitSpace/UIControl.js
deleted file mode 100644
index 515640b31..000000000
--- a/CockpitSpace/UIControl.js
+++ /dev/null
@@ -1,55 +0,0 @@
-function newUIControl () {
-  let thisObject = {
-    drawFunction: undefined,
-    paramsArray: undefined,
-    container: undefined,
-    draw: draw,
-    parentContainer: undefined,
-    getContainer: getContainer,     // returns the inner most container that holds the point received by parameter.
-    initialize: initialize
-  }
-
-  let isInitialized = false
-   /* Cointainer stuff */
-
-  let container = newContainer()
-
-  container.name = 'UI Control'
-  container.initialize()
-
-  container.isClickeable = true
-
-  thisObject.container = container
-  thisObject.container.frame.containerName = 'Panel Tab Button'
-
-  return thisObject
-
-  function initialize () {
-    isInitialized = true
-  }
-
-  function draw () {
-    if (isInitialized === false) { return }
-
-    if (thisObject.drawFunction !== undefined && thisObject.paramsArray !== undefined) {
-      thisObject.drawFunction(thisObject.paramsArray)
-    }
-  }
-
-  function getContainer (point) {
-    let container
-
-       /* First we check if thisObject point is inside thisObject space. */
-
-    if (thisObject.container.frame.isThisPointHere(point, true) === true) {
-           /* Now we see which is the inner most container that has it */
-
-      return thisObject.container
-    } else {
-           /* This point does not belong to thisObject space. */
-
-      return undefined
-    }
-  }
-}
-
diff --git a/Spaces/CockpitSpace.js b/Spaces/CockpitSpace.js
index c84447c60..a6b7b8fae 100644
--- a/Spaces/CockpitSpace.js
+++ b/Spaces/CockpitSpace.js
@@ -1,17 +1,14 @@
 
  function newCockpitSpace () {
    const MODULE_NAME = 'CockpitSpace'
-   const ERROR_LOG = true
 
    let thisObject = {
      container: undefined,
      status: 'BOTTOM',
+     assetBalances: undefined,
      draw: draw,
      physics: physics,
-     getContainer: getContainer,     // returns the inner most container that holds the point received by parameter.
-     createNewControl: createNewControl,
-     destroyControl: destroyControl,
-     getControl: getControl,
+     getContainer: getContainer,
      finalize: finalize,
      initialize: initialize
    }
@@ -36,15 +33,19 @@
 
      thisObject.container.finalize()
      thisObject.container = undefined
+     thisObject.assetBalances = undefined
    }
 
    function initialize () {
      canvasBrowserResizedEventSubscriptionId = window.canvasApp.eventHandler.listenToEvent('Browser Resized', resize)
      selfMouseClickEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseClick', onMouseClick)
+
+     thisObject.assetBalances = newAssetBalances()
+     thisObject.assetBalances.initialize()
    }
 
    function onMouseClick (event) {
-     // canvas.strategySpace.tradingSystemWorkspace.showUp()
+
    }
 
    function resize () {
@@ -87,71 +88,12 @@
      viewPort.resize()
    }
 
-   function createNewControl (pType, pDrawFunction, pOwner) {
-     let control
-
-     switch (pType) {
-
-       case 'Over The Line':
-         {
-           control = newUIControl()
-           control.initialize()
-           control.drawFunction = pDrawFunction
-           break
-         }
-     }
-
-     let controlArray = controlsMap.get(pOwner)
-     if (controlArray === undefined) {
-       controlArray = []
-       controlsMap.set(pOwner, controlArray)
-     }
-
-     controlArray.push(control)
-
-     control.handle = Math.floor((Math.random() * 10000000) + 1)
-
-     return control.handle
-   }
-
-   function destroyControl (pControlHandle) {
-     thisObject.controls = controlsMap.get('Global')
-     if (thisObject.controls !== undefined) {
-       for (let i = 0; i < thisObject.controls.length; i++) {
-         let control = thisObject.controls[i]
-         if (control.handle === pControlHandle) {
-           thisObject.controls.splice(i, 1)  // Delete item from array.
-           return
-         }
-       }
-     }
-
-     thisObject.controls = controlsMap.get(window.CHART_ON_FOCUS)
-     if (thisObject.controls !== undefined) {
-       for (let i = 0; i < thisObject.controls.length; i++) {
-         let control = thisObject.controls[i]
-         if (control.handle === pControlHandle) {
-           thisObject.controls.splice(i, 1)  // Delete item from array.
-           return
-         }
-       }
-     }
-   }
-
-   function getControl (pControlHandle, pOwner) {
-     thisObject.controls = controlsMap.get(pOwner)
-     if (thisObject.controls != undefined) {
-       for (let i = 0; i < thisObject.controls.length; i++) {
-         let control = thisObject.controls[i]
-
-         if (control.handle === pControlHandle) {
-           return control
-         }
-       }
-     }
-   }
-
    function getContainer (point) {
+     let container = thisObject.assetBalances.getContainer(point)
+     if (container !== undefined) {
+       return container
+     }
+
      if (thisObject.container.frame.isThisPointHere(point, true) === true) {
        return thisObject.container
      } else {
@@ -164,21 +106,7 @@
 
      drawBackground()
 
-     thisObject.controls = controlsMap.get('Global')
-     if (thisObject.controls !== undefined) {
-       for (let i = 0; i < thisObject.controls.length; i++) {
-         let control = thisObject.controls[i]
-         control.draw()
-       }
-     }
-
-     thisObject.controls = controlsMap.get(window.CHART_ON_FOCUS)
-     if (thisObject.controls !== undefined) {
-       for (let i = 0; i < thisObject.controls.length; i++) {
-         let control = thisObject.controls[i]
-         control.draw()
-       }
-     }
+     thisObject.assetBalances.draw()
    }
 
    function drawBackground () {