Pinning implementation complete

FloatingSpace/CircularMenu.js

@@ -63,6 +63,7 @@ function newCircularMenu () {
       menuItem.targetRadius = menuItemInitialValue.label
       menuItem.currentRadius = menuItemInitialValue.currentRadius
       menuItem.angle = menuItemInitialValue.angle
+      menuItem.currentStatus = menuItemInitialValue.currentStatus
 
       if (menuItem.label === undefined) {
         menuItem.type = 'Icon Only'

FloatingSpace/CircularMenuItem.js

@@ -7,6 +7,7 @@ function newCircularMenuItem () {
     isDeployed: undefined,
     iconOn: undefined,
     iconOff: undefined,
+    currentIcon: undefined,
     action: undefined,
     actionFunction: undefined,
     label: undefined,
@@ -64,6 +65,7 @@ function newCircularMenuItem () {
     thisObject.container = undefined
     thisObject.iconOn = undefined
     thisObject.iconOff = undefined
+    thisObject.currentIcon = undefined
     thisObject.payload = undefined
     thisObject.actionFunction = undefined
   }
@@ -73,19 +75,26 @@ function newCircularMenuItem () {
     /* Load Menu Images */
 
     thisObject.iconOn = new Image()
-    thisObject.iconOn.onload = onImageLoad
+    thisObject.iconOn.onload = onOnImageLoad
 
-    function onImageLoad () {
-      thisObject.iconOff = new Image()
-      thisObject.iconOff.onload = onImageLoad
+    function onOnImageLoad () {
+      if (thisObject.imagePathOff !== undefined) {
+        thisObject.iconOff = new Image()
+        thisObject.iconOff.onload = onOffImageLoad
 
-      function onImageLoad () {
-        thisObject.canDrawIcon = true
+        function onOffImageLoad () {
+          thisObject.canDrawIcon = true
+        }
+        thisObject.iconOff.src = window.canvasApp.urlPrefix + thisObject.imagePathOff
       }
-      thisObject.iconOff.src = window.canvasApp.urlPrefix + thisObject.imagePathOff
     }
     thisObject.iconOn.src = window.canvasApp.urlPrefix + thisObject.imagePathOn
-    thisObject.icon = thisObject.iconOn // The default value is ON.
+
+    if (thisObject.currentStatus === true) {
+      thisObject.icon = thisObject.iconOn
+    } else {
+      thisObject.icon = thisObject.iconOff
+    }
 
     selfMouseOverEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseOver', onMouseOver)
     selfMouseClickEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseClick', onMouseClick)
@@ -123,6 +132,8 @@ function newCircularMenuItem () {
     thisObject.container.frame.position.x = thisObject.container.frame.radius * 3 / 7 * Math.cos(toRadians(thisObject.angle)) - thisObject.currentRadius * 1.5
     thisObject.container.frame.position.y = thisObject.container.frame.radius * 3 / 7 * Math.sin(toRadians(thisObject.angle)) - thisObject.container.frame.height / 2
 
+    /* Temporary Status impacts on the label to use and the background of that label */
+
     temporaryStatus--
     if (temporaryStatus < 0) {
       temporaryStatus = 0
@@ -131,6 +142,14 @@ function newCircularMenuItem () {
       labelToPrint = thisObject.label
       backgroundColorToUse = defaultBackgroudColor
     }
+
+    /* Current Status sets the icon to be used */
+
+    if (thisObject.currentStatus === true) {
+      thisObject.icon = thisObject.iconOn
+    } else {
+      thisObject.icon = thisObject.iconOff
+    }
   }
 
   function onMouseOver (point) {
@@ -151,9 +170,9 @@ function newCircularMenuItem () {
         setTemporaryStatus(thisObject.workingLabel, UI_COLOR.GREY, 500)
       }
 
-      let result = await thisObject.actionFunction(thisObject.payload, thisObject.action)
+      thisObject.currentStatus = await thisObject.actionFunction(thisObject.payload, thisObject.action)
 
-      if (result === true) {
+      if (thisObject.currentStatus === true) {
         if (thisObject.workDoneLabel !== undefined) {
           setTemporaryStatus(thisObject.workDoneLabel, UI_COLOR.PATINATED_TURQUOISE, 250)
         }
@@ -236,4 +255,3 @@ function newCircularMenuItem () {
     }
   }
 }
-

FloatingSpace/FloatingObject.js

@@ -19,7 +19,7 @@ function newFloatingObject () {
     rawMass: 0,                             // This is the mass value without zoom.
     rawRadius: 0,                           // This is the radius of this floating object without zoom.
     targetRadius: 0,                        // This is the target radius of the floating object with zoom applied. It should be animated until reaching this value.
-    isPinned: undefined,
+    isPinned: false,
     pinToggle: pinToggle,
     physics: physics,
     initializeMass: initializeMass,
@@ -104,6 +104,7 @@ function newFloatingObject () {
     } else {
       thisObject.isPinned = false
     }
+    return thisObject.isPinned
   }
 
   function physics () {

FloatingSpace/StrategyPartConstructor.js

@@ -55,19 +55,22 @@ function newStrategyPartConstructor () {
     let menuItemsInitialValues = []
     switch (payload.node.type) {
       case 'Trading System': {
+        floatingObject.isPinned = true
+        floatingObject.positionLocked = true
         strategyPart.imagePath = 'Images/icons/style-01/analysis.png'
         menuItemsInitialValues = [
           {
             action: 'Pin / Unpin',
             actionFunction: floatingObject.pinToggle,
+            currentStatus: true,
             label: undefined,
             visible: false,
             imagePathOn: 'Images/icons/style-01/target.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
-            angle: -120
+            angle: -135
           },
           {
             action: 'Reload Trading System',
@@ -75,7 +78,7 @@ function newStrategyPartConstructor () {
             label: 'Reload',
             visible: false,
             imagePathOn: 'Images/icons/style-01/vector.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/vector.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -90,7 +93,7 @@ function newStrategyPartConstructor () {
             workFailedLabel: 'Not Saved',
             visible: false,
             imagePathOn: 'Images/icons/style-01/upload.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/upload.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -102,7 +105,7 @@ function newStrategyPartConstructor () {
             label: 'New Strategy',
             visible: false,
             imagePathOn: 'Images/icons/style-01/quality.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/quality.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -114,7 +117,7 @@ function newStrategyPartConstructor () {
             label: 'Settings',
             visible: false,
             imagePathOn: 'Images/icons/style-01/tools.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/tools.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -125,13 +128,26 @@ function newStrategyPartConstructor () {
       case 'Strategy': {
         strategyPart.imagePath = 'Images/icons/style-01/quality.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Delete Strategy',
             actionFunction: payload.onMenuItemClick,
             label: 'Delete This Strategy',
             visible: false,
             imagePathOn: 'Images/icons/style-01/trash.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/trash.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -143,7 +159,7 @@ function newStrategyPartConstructor () {
             label: 'Settings',
             visible: false,
             imagePathOn: 'Images/icons/style-01/tools.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/tools.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -154,13 +170,26 @@ function newStrategyPartConstructor () {
       case 'Strategy Entry Event': {
         strategyPart.imagePath = 'Images/icons/style-01/startup.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Add Situation',
             actionFunction: payload.onMenuItemClick,
             label: 'Add Situation',
             visible: false,
             imagePathOn: 'Images/icons/style-01/attractive.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/attractive.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -171,13 +200,26 @@ function newStrategyPartConstructor () {
       case 'Strategy Exit Event': {
         strategyPart.imagePath = 'Images/icons/style-01/support.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Add Situation',
             actionFunction: payload.onMenuItemClick,
             label: 'Add Situation',
             visible: false,
             imagePathOn: 'Images/icons/style-01/attractive.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/attractive.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -188,13 +230,26 @@ function newStrategyPartConstructor () {
       case 'Trade Entry Event': {
         strategyPart.imagePath = 'Images/icons/style-01/compass.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Add Situation',
             actionFunction: payload.onMenuItemClick,
             label: 'Add Situation',
             visible: false,
             imagePathOn: 'Images/icons/style-01/attractive.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/attractive.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -205,13 +260,26 @@ function newStrategyPartConstructor () {
       case 'Stop': {
         strategyPart.imagePath = 'Images/icons/style-01/pixel.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Add Phase',
             actionFunction: payload.onMenuItemClick,
             label: 'Add Phase',
             visible: false,
             imagePathOn: 'Images/icons/style-01/placeholder.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/placeholder.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -222,13 +290,26 @@ function newStrategyPartConstructor () {
       case 'Take Profit': {
         strategyPart.imagePath = 'Images/icons/style-01/competition.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Add Phase',
             actionFunction: payload.onMenuItemClick,
             label: 'Add Phase',
             visible: false,
             imagePathOn: 'Images/icons/style-01/placeholder.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/placeholder.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -244,13 +325,26 @@ function newStrategyPartConstructor () {
         strategyPart.codeEditor.container.connectToParent(strategyPart.container, false, false, true, true, false, false, false, false)
 
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Edit Code',
             actionFunction: strategyPart.codeEditor.activate,
             label: 'Edit Code',
             visible: false,
             imagePathOn: 'Images/icons/style-01/html.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/html.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -262,7 +356,7 @@ function newStrategyPartConstructor () {
             label: 'Add Situation',
             visible: false,
             imagePathOn: 'Images/icons/style-01/attractive.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/attractive.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -274,7 +368,7 @@ function newStrategyPartConstructor () {
             label: 'Delete This Phase',
             visible: false,
             imagePathOn: 'Images/icons/style-01/trash.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/trash.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -285,13 +379,26 @@ function newStrategyPartConstructor () {
       case 'Situation': {
         strategyPart.imagePath = 'Images/icons/style-01/attractive.png'
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Add Condition',
             actionFunction: payload.onMenuItemClick,
             label: 'Add Condition',
             visible: false,
             imagePathOn: 'Images/icons/style-01/testing.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/testing.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -303,7 +410,7 @@ function newStrategyPartConstructor () {
             label: 'Delete This Situation',
             visible: false,
             imagePathOn: 'Images/icons/style-01/trash.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/trash.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -319,13 +426,26 @@ function newStrategyPartConstructor () {
         strategyPart.codeEditor.container.connectToParent(strategyPart.container, false, false, true, true, false, false, false, false)
 
         menuItemsInitialValues = [
+          {
+            action: 'Pin / Unpin',
+            actionFunction: floatingObject.pinToggle,
+            currentStatus: false,
+            label: undefined,
+            visible: false,
+            imagePathOn: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/security.png',
+            rawRadius: 8,
+            targetRadius: 0,
+            currentRadius: 0,
+            angle: -135
+          },
           {
             action: 'Edit Code',
             actionFunction: strategyPart.codeEditor.activate,
             label: 'Edit Code',
             visible: false,
             imagePathOn: 'Images/icons/style-01/html.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/html.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,
@@ -337,7 +457,7 @@ function newStrategyPartConstructor () {
             label: 'Delete This Condition',
             visible: false,
             imagePathOn: 'Images/icons/style-01/trash.png',
-            imagePathOff: 'Images/icons/style-01/target.png',
+            imagePathOff: 'Images/icons/style-01/trash.png',
             rawRadius: 8,
             targetRadius: 0,
             currentRadius: 0,