From c5e6d55fc0380d4efd5e79d23e13e8969d238910 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Mon, 13 May 2019 18:08:35 +0200 Subject: [PATCH] Pinning implementation complete --- FloatingSpace/CircularMenu.js | 1 + FloatingSpace/CircularMenuItem.js | 40 ++++-- FloatingSpace/FloatingObject.js | 3 +- FloatingSpace/StrategyPartConstructor.js | 160 ++++++++++++++++++++--- 4 files changed, 172 insertions(+), 32 deletions(-) diff --git a/FloatingSpace/CircularMenu.js b/FloatingSpace/CircularMenu.js index 1de5f77b1..f2181a6b5 100644 --- a/FloatingSpace/CircularMenu.js +++ b/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' diff --git a/FloatingSpace/CircularMenuItem.js b/FloatingSpace/CircularMenuItem.js index 9140f1f4b..53803a756 100644 --- a/FloatingSpace/CircularMenuItem.js +++ b/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 () { } } } - diff --git a/FloatingSpace/FloatingObject.js b/FloatingSpace/FloatingObject.js index fdaa69dbe..818d734da 100644 --- a/FloatingSpace/FloatingObject.js +++ b/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 () { diff --git a/FloatingSpace/StrategyPartConstructor.js b/FloatingSpace/StrategyPartConstructor.js index d85905835..758c2892c 100644 --- a/FloatingSpace/StrategyPartConstructor.js +++ b/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,