Image by part type implemented

FloatingSpace/StrategyPart.js

@@ -34,8 +34,7 @@ function newStrategyPart () {
   thisObject.container.frame.position.x = 0
   thisObject.container.frame.position.y = 0
 
-  let image
-  let imagePath
+  let icon
 
   let selfFocusEventSubscriptionId
   let selfNotFocuskEventSubscriptionId
@@ -63,8 +62,7 @@ function newStrategyPart () {
       thisObject.codeEditor = undefined
     }
 
-    image = undefined
-    imagePath = undefined
+    icon = undefined
   }
 
   function initialize (payload, menuItemsInitialValues) {
@@ -85,15 +83,7 @@ function newStrategyPart () {
 
 /* Load Part Image */
 
-    if (thisObject.imagePath !== undefined) {
-      image = new Image()
-      image.onload = onImageLoad
-
-      function onImageLoad () {
-        image.canDrawIcon = true
-      }
-      image.src = window.canvasApp.urlPrefix + thisObject.imagePath
-    }
+    icon = canvas.strategySpace.iconByPartType.get(payload.node.type)
 
     selfFocusEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onFocus', onFocus)
     selfNotFocuskEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onNotFocus', onNotFocus)
@@ -360,10 +350,10 @@ function newStrategyPart () {
 
         /* Image */
 
-    if (image !== undefined) {
-      if (image.canDrawIcon === true) {
+    if (icon !== undefined) {
+      if (icon.canDrawIcon === true) {
         browserCanvasContext.drawImage(
-          image, position.x - thisObject.payload.floatingObject.currentImageSize / 2,
+          icon, position.x - thisObject.payload.floatingObject.currentImageSize / 2,
           position.y - thisObject.payload.floatingObject.currentImageSize / 2,
           thisObject.payload.floatingObject.currentImageSize,
           thisObject.payload.floatingObject.currentImageSize)

FloatingSpace/StrategyPartConstructor.js

@@ -57,7 +57,6 @@ function newStrategyPartConstructor () {
       case 'Trading System': {
         floatingObject.isPinned = true
         floatingObject.positionLocked = true
-        strategyPart.imagePath = 'Images/Icons/style-01/analysis.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -126,7 +125,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Strategy': {
-        strategyPart.imagePath = 'Images/Icons/style-01/quality.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -168,7 +166,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Strategy Entry Event': {
-        strategyPart.imagePath = 'Images/Icons/style-01/startup.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -198,7 +195,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Strategy Exit Event': {
-        strategyPart.imagePath = 'Images/Icons/style-01/support.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -228,7 +224,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Trade Entry Event': {
-        strategyPart.imagePath = 'Images/Icons/style-01/compass.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -258,7 +253,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Stop': {
-        strategyPart.imagePath = 'Images/Icons/style-01/pixel.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -288,7 +282,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Take Profit': {
-        strategyPart.imagePath = 'Images/Icons/style-01/competition.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -318,7 +311,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Phase': {
-        strategyPart.imagePath = 'Images/Icons/style-01/placeholder.png'
         strategyPart.codeEditor = newCodeEditor()
         strategyPart.codeEditor.isVisibleFunction = strategyPart.isVisibleFunction
         strategyPart.codeEditor.initialize()
@@ -377,7 +369,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Situation': {
-        strategyPart.imagePath = 'Images/Icons/style-01/attractive.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
@@ -419,7 +410,6 @@ function newStrategyPartConstructor () {
         break
       }
       case 'Condition': {
-        strategyPart.imagePath = 'Images/Icons/style-01/testing.png'
         strategyPart.codeEditor = newCodeEditor()
         strategyPart.codeEditor.isVisibleFunction = strategyPart.isVisibleFunction
         strategyPart.codeEditor.initialize()

Globals.js

@@ -121,8 +121,8 @@ function convertTimePeriodToName(pTimePeriod) {
 window.AT_BREAKPOINT = false;
 
 
-const LOGGED_IN_USER_LOCAL_STORAGE = "user"
-const LOGGED_IN_ACCESS_TOKEN_LOCAL_STORAGE =  "access_token"
+const LOGGED_IN_USER_LOCAL_STORAGE = "xuser"
+const LOGGED_IN_ACCESS_TOKEN_LOCAL_STORAGE =  "xaccess_token"
 
 const USDT_BTC_HTH = 19900; // This is needed to know the scale of the market time line.
 

Spaces/StrategySpace.js

@@ -5,6 +5,8 @@ function newStrategySpace () {
     sidePanel: undefined,
     workplace: undefined,
     container: undefined,
+    iconCollection: undefined,
+    iconByPartType: undefined,
     draw: draw,
     getContainer: getContainer,
     makeVisible: makeVisible,
@@ -18,18 +20,40 @@ function newStrategySpace () {
 
   container.isDraggeable = false
 
+  thisObject.iconCollection = new Map()
+  thisObject.iconByPartType = new Map()
+
   return thisObject
 
   async function initialize () {
-    // thisObject.sidePanel = newSidePanel()
-    // thisObject.sidePanel.initialize()
-
     thisObject.workplace = newWorkspace()
-    // thisObject.workplace.container.connectToParent(thisObject.sidePanel.container, true, true)
+
     thisObject.workplace.initialize()
     await thisObject.workplace.loadFromStrategyzer()
 
-    // thisObject.sidePanel.areas.push(thisObject.workplace)
+    loadIconCollection()
+    buildIconByPartTypeMap()
+  }
+
+  function buildIconByPartTypeMap () {
+    const relationshipArray = [
+      ['Trading System', 'analysis'],
+      ['Strategy', 'quality'],
+      ['Strategy Entry Event', 'startup'],
+      ['Strategy Exit Event', 'support'],
+      ['Trade Entry Event', 'compass'],
+      ['Stop', 'pixel'],
+      ['Take Profit', 'competition'],
+      ['Phase', 'placeholder'],
+      ['Situation', 'attractive'],
+      ['Condition', 'testing']
+    ]
+
+    for (let i = 0; i < relationshipArray.length; i++) {
+      let record = relationshipArray[i]
+      let icon = thisObject.iconCollection.get(record[1])
+      thisObject.iconByPartType.set(record[0], icon)
+    }
   }
 
   function loadIconCollection () {
@@ -86,6 +110,24 @@ function newStrategySpace () {
       'vector',
       'video-player'
     ]
+
+    for (let i = 0; i < iconsNames.length; i++) {
+      let name = iconsNames[i]
+      loadImage(name)
+    }
+
+    function loadImage (name) {
+      const PATH = 'Images/Icons/style-01/'
+      let image = new Image()
+      image.onload = onImageLoad
+      image.fileName = name
+
+      function onImageLoad () {
+        image.canDrawIcon = true
+      }
+      image.src = window.canvasApp.urlPrefix + PATH + name + '.png'
+      thisObject.iconCollection.set(name, image)
+    }
   }
 
   function makeVisible () {