fez5587/Superalgos
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #48 from AAMasters/develop

Browse Source 
Improvements on dealing with images
This commit is contained in:
benme authored and GitHub committed 2019-05-14 16:18:33 -03:00
2 parents b14a118c4e 4b812349af
commit 6b39d35ac7
21 files changed
+571 -362
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

BottomSpace/UIControl.js
-55
View File
@@ -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
}
}
}
Canvas.js
+16 -49
View File
@@ -36,6 +36,7 @@ function newCanvas () {
chartSpace: undefined,
floatingSpace: undefined,
panelsSpace: undefined,
cockpitSpace: undefined,
bottomSpace: undefined,
strategySpace: undefined,
animation: undefined,
@@ -49,41 +50,6 @@ function newCanvas () {
let lastContainerMouseOver
return thisObject
/*
The canvas object represents a layer on top of the browser canvas object.
Graphically, thiscanvas object has 5 spaces:
1. The "Top Space": It is where Team and User information is displayed.
2. The "Chart Space": It is where the charts are plotted.
3. The "Floating Space": It is where floating elements live. There is a physics engine for this layer that allows these elements to flow.
4. The "Panels Space": It is where panels live. --> This space has yet to be develop, currently pannels are somehow at the Chart Space.
5. The "Bottom Space": Includes UIControls that other panels can add there.
6. The "Strategy Spece": Functionality to manage Strategies
All these spaces are child objects of the Canvas object.
Canvas
|
|
---> topSpace
|
|
---> chartSpace
|
|
---> flaotingSpace
|
|
---> panelsSpace
|
|
---> bottomSpace
|
|
---> strategySpace
*/
function finalize () {
try {
if (INFO_LOG === true) { logger.write('[INFO] finalize -> Entering function.') }
@@ -128,8 +94,8 @@ function newCanvas () {
thisObject.strategySpace = newStrategySpace()
await thisObject.strategySpace.initialize()
thisObject.bottomSpace = newBottomSpace()
thisObject.bottomSpace.initialize()
thisObject.cockpitSpace = newCockpitSpace()
thisObject.cockpitSpace.initialize()
thisObject.panelsSpace = newPanelsSpace()
thisObject.panelsSpace.initialize()
@@ -140,6 +106,8 @@ function newCanvas () {
thisObject.chartSpace = newChartSpace()
thisObject.chartSpace.initialize(onCharSpaceInitialized)
thisObject.bottomSpace = thisObject.cockpitSpace
function onCharSpaceInitialized (err) {
try {
if (INFO_LOG === true) { logger.write('[INFO] initialize -> onCharSpaceInitialized -> Entering function.') }
@@ -174,8 +142,8 @@ function newCanvas () {
animation.addCallBackFunction('Chart Space Physics', thisObject.chartSpace.physics, onFunctionAdded)
animation.addCallBackFunction('Panels Space', thisObject.panelsSpace.draw, onFunctionAdded)
animation.addCallBackFunction('ViewPort Animate', viewPort.animate, onFunctionAdded)
animation.addCallBackFunction('Bottom Space Draw', thisObject.bottomSpace.draw, onFunctionAdded)
animation.addCallBackFunction('Bottom Space Physics', thisObject.bottomSpace.physics, onFunctionAdded)
animation.addCallBackFunction('CockpitSpace Draw', thisObject.cockpitSpace.draw, onFunctionAdded)
animation.addCallBackFunction('CockpitSpace Physics', thisObject.cockpitSpace.physics, onFunctionAdded)
animation.addCallBackFunction('Top Space Draw', thisObject.topSpace.draw, onFunctionAdded)
animation.addCallBackFunction('Strategy Space Draw', thisObject.strategySpace.draw, onFunctionAdded)
animation.addCallBackFunction('Splash Screen Draw', splashScreen.draw, onFunctionAdded)
@@ -334,9 +302,9 @@ function newCanvas () {
return
}
/* We check if the mouse is over an element of the Bottom Space / */
/* We check if the mouse is over an element of the CockpitSpace / */
container = thisObject.bottomSpace.getContainer(point)
container = thisObject.cockpitSpace.getContainer(point)
if (container !== undefined && container.isDraggeable === true) {
containerBeingDragged = container
@@ -425,9 +393,9 @@ function newCanvas () {
return
}
/* We check if the mouse is over an element of the Bottom Space / */
/* We check if the mouse is over an element of the CockpitSpace / */
container = thisObject.bottomSpace.getContainer(point)
container = thisObject.cockpitSpace.getContainer(point)
if (container !== undefined && container.isClickeable === true) {
container.eventHandler.raiseEvent('onMouseClick', point)
@@ -583,10 +551,10 @@ function newCanvas () {
}
}
/* We check if the mouse is over an element of the Bottom Space / */
/* We check if the mouse is over an element of the CockpitSpace / */
if (thisObject.bottomSpace !== undefined) {
container = thisObject.bottomSpace.getContainer(point)
if (thisObject.cockpitSpace !== undefined) {
container = thisObject.cockpitSpace.getContainer(point)
if (container !== undefined && container.detectMouseOver === true) {
containerFound()
@@ -665,9 +633,9 @@ function newCanvas () {
return false // This instructs the browser not to take the event and scroll the page.
}
/* We try the Bottom Space. */
/* We try the CockpitSpace. */
container = canvas.bottomSpace.getContainer({ x: point.x, y: point.y })
container = canvas.cockpitSpace.getContainer({ x: point.x, y: point.y })
if (container !== undefined && container.isWheelable === true) {
container.eventHandler.raiseEvent('onMouseWheel', event)
@@ -760,4 +728,3 @@ function newCanvas () {
}
}
}
ChartsSpace/ViewPort.js
+2 -2
View File
@@ -12,7 +12,7 @@ function newViewPort () {
let ANIMATION_INCREMENT = 0.25
let TOP_MARGIN = 15 + TOP_SPACE_HEIGHT
let BOTTOM_MARGIN = 20 + BOTTOM_SPACE_HEIGHT
let BOTTOM_MARGIN = 20 + COCKPIT_SPACE_HEIGHT
let LEFT_MARGIN = 50
let RIGHT_MARGIN = 50
let MARGINS = {
@@ -84,7 +84,7 @@ function newViewPort () {
function resize () {
TOP_MARGIN = 15 + TOP_SPACE_HEIGHT
BOTTOM_MARGIN = 20 + browserCanvas.height - BOTTOM_SPACE_POSITION
BOTTOM_MARGIN = 20 + browserCanvas.height - COCKPIT_SPACE_POSITION
LEFT_MARGIN = 50
RIGHT_MARGIN = 50
MARGINS = {
CockpitSpace/AssetBalances.js
+122
View File
@@ -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)
}
}
CockpitSpace/Speedometer.js
+237
View File
@@ -0,0 +1,237 @@
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_TURQUOISE + ', ' + 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)
}
}
FloatingSpace/CircularMenu.js
+3 -2
View File
@@ -57,13 +57,14 @@ function newCircularMenu () {
menuItem.workDoneLabel = menuItemInitialValue.workDoneLabel
menuItem.workFailedLabel = menuItemInitialValue.workFailedLabel
menuItem.visible = menuItemInitialValue.visible
menuItem.imagePathOn = menuItemInitialValue.imagePathOn
menuItem.imagePathOff = menuItemInitialValue.imagePathOff
menuItem.iconPathOn = menuItemInitialValue.iconPathOn
menuItem.iconPathOff = menuItemInitialValue.iconPathOff
menuItem.rawRadius = menuItemInitialValue.rawRadius
menuItem.targetRadius = menuItemInitialValue.label
menuItem.currentRadius = menuItemInitialValue.currentRadius
menuItem.angle = menuItemInitialValue.angle
menuItem.currentStatus = menuItemInitialValue.currentStatus
menuItem.relatedStrategyPart = menuItemInitialValue.relatedStrategyPart
if (menuItem.label === undefined) {
menuItem.type = 'Icon Only'
FloatingSpace/CircularMenuItem.js
+17 -25
View File
@@ -15,14 +15,15 @@ function newCircularMenuItem () {
workDoneLabel: undefined,
workFailedLabel: undefined,
visible: false,
imagePathOn: undefined,
imagePathOff: undefined,
iconPathOn: undefined,
iconPathOff: undefined,
rawRadius: undefined,
targetRadius: undefined,
currentRadius: undefined,
angle: undefined,
container: undefined,
payload: undefined,
relatedStrategyPart: undefined,
physics: physics,
drawBackground: drawBackground,
drawForeground: drawForeground,
@@ -72,29 +73,8 @@ function newCircularMenuItem () {
function initialize (pPayload) {
thisObject.payload = pPayload
/* Load Menu Images */
thisObject.iconOn = new Image()
thisObject.iconOn.onload = onOnImageLoad
function onOnImageLoad () {
if (thisObject.imagePathOff !== undefined) {
thisObject.iconOff = new Image()
thisObject.iconOff.onload = onOffImageLoad
function onOffImageLoad () {
thisObject.canDrawIcon = true
}
thisObject.iconOff.src = window.canvasApp.urlPrefix + thisObject.imagePathOff
}
}
thisObject.iconOn.src = window.canvasApp.urlPrefix + thisObject.imagePathOn
if (thisObject.currentStatus === true) {
thisObject.icon = thisObject.iconOn
} else {
thisObject.icon = thisObject.iconOff
}
iconPhysics()
selfMouseOverEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseOver', onMouseOver)
selfMouseClickEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseClick', onMouseClick)
@@ -143,6 +123,18 @@ function newCircularMenuItem () {
backgroundColorToUse = defaultBackgroudColor
}
iconPhysics()
}
function iconPhysics () {
if (thisObject.relatedStrategyPart !== undefined) {
thisObject.iconOn = canvas.strategySpace.iconByPartType.get(thisObject.relatedStrategyPart)
thisObject.iconOff = canvas.strategySpace.iconByPartType.get(thisObject.relatedStrategyPart)
} else {
thisObject.iconOn = canvas.strategySpace.iconCollection.get(thisObject.iconPathOn)
thisObject.iconOff = canvas.strategySpace.iconCollection.get(thisObject.iconPathOff)
}
/* Current Status sets the icon to be used */
if (thisObject.currentStatus === true) {
@@ -230,7 +222,7 @@ function newCircularMenuItem () {
iconSize = thisObject.currentRadius
}
if (thisObject.canDrawIcon === true && thisObject.currentRadius > 1 && thisObject.isDeployed === true) {
if (thisObject.icon.canDrawIcon === true && thisObject.currentRadius > 1 && thisObject.isDeployed === true) {
browserCanvasContext.drawImage(thisObject.icon, menuPosition.x - iconSize, menuPosition.y - iconSize, iconSize * 2, iconSize * 2)
/* Menu Label */
FloatingSpace/ProfileBall.js
+10 -10
View File
@@ -24,8 +24,8 @@ function newProfileBall () {
let ballStringMenu = [
{
visible: false,
imagePathOn: 'Images/menu.icon.on.1.gif',
imagePathOff: 'Images/menu.icon.off.1.gif',
iconPathOn: 'Images/menu.icon.on.1.gif',
iconPathOff: 'Images/menu.icon.off.1.gif',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -33,8 +33,8 @@ function newProfileBall () {
}/*,
{
visible: false,
imagePathOn: "Images/menu.icon.on.2.gif",
imagePathOff: "Images/menu.icon.off.2.gif",
iconPathOn: "Images/menu.icon.on.2.gif",
iconPathOff: "Images/menu.icon.off.2.gif",
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -42,8 +42,8 @@ function newProfileBall () {
},
{
visible: false,
imagePathOn: "Images/menu.icon.on.3.gif",
imagePathOff: "Images/menu.icon.off.3.gif",
iconPathOn: "Images/menu.icon.on.3.gif",
iconPathOff: "Images/menu.icon.off.3.gif",
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -51,8 +51,8 @@ function newProfileBall () {
},
{
visible: false,
imagePathOn: "Images/menu.icon.on.4.gif",
imagePathOff: "Images/menu.icon.off.4.gif",
iconPathOn: "Images/menu.icon.on.4.gif",
iconPathOff: "Images/menu.icon.off.4.gif",
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -73,9 +73,9 @@ function newProfileBall () {
function onImageLoad () {
menuItem.canDrawIcon = true
}
menuItem.iconOff.src = window.canvasApp.urlPrefix + menuItem.imagePathOff
menuItem.iconOff.src = window.canvasApp.urlPrefix + menuItem.iconPathOff
}
menuItem.iconOn.src = window.canvasApp.urlPrefix + menuItem.imagePathOn
menuItem.iconOn.src = window.canvasApp.urlPrefix + menuItem.iconPathOn
menuItem.icon = menuItem.iconOn // The default value is ON.
}
FloatingSpace/StrategyPart.js
+13 -17
View File
@@ -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
}
iconPhysics()
selfFocusEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onFocus', onFocus)
selfNotFocuskEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onNotFocus', onNotFocus)
@@ -136,6 +126,12 @@ function newStrategyPart () {
thisObject.payload.targetPosition.x = thisObject.payload.chainParent.payload.position.x
thisObject.payload.targetPosition.y = thisObject.payload.chainParent.payload.position.y
}
iconPhysics()
}
function iconPhysics () {
icon = canvas.strategySpace.iconByPartType.get(thisObject.payload.node.type)
}
function onFocus () {
@@ -268,7 +264,7 @@ function newStrategyPart () {
}
labelPoint = {
x: position.x - label.length / 2 * fontSize * FONT_ASPECT_RATIO,
x: position.x - label.length / 2 * fontSize * FONT_ASPECT_RATIO - 5,
y: position.y + radius * 2 / 3 + fontSize * FONT_ASPECT_RATIO + 15
}
@@ -360,10 +356,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
+64 -66
View File
@@ -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',
@@ -65,8 +64,8 @@ function newStrategyPartConstructor () {
currentStatus: true,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -77,8 +76,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Reload',
visible: false,
imagePathOn: 'Images/Icons/style-01/vector.png',
imagePathOff: 'Images/Icons/style-01/vector.png',
iconPathOn: 'vector',
iconPathOff: 'vector',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -92,8 +91,8 @@ function newStrategyPartConstructor () {
workDoneLabel: 'Saved',
workFailedLabel: 'Not Saved',
visible: false,
imagePathOn: 'Images/Icons/style-01/upload.png',
imagePathOff: 'Images/Icons/style-01/upload.png',
iconPathOn: 'upload',
iconPathOff: 'upload',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -104,8 +103,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'New Strategy',
visible: false,
imagePathOn: 'Images/Icons/style-01/quality.png',
imagePathOff: 'Images/Icons/style-01/quality.png',
iconPathOn: 'quality',
iconPathOff: 'quality',
relatedStrategyPart: 'Strategy',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -116,8 +116,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Settings',
visible: false,
imagePathOn: 'Images/Icons/style-01/tools.png',
imagePathOff: 'Images/Icons/style-01/tools.png',
iconPathOn: 'tools',
iconPathOff: 'tools',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -126,7 +126,6 @@ function newStrategyPartConstructor () {
break
}
case 'Strategy': {
strategyPart.imagePath = 'Images/Icons/style-01/quality.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -134,8 +133,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -146,8 +145,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Delete This Strategy',
visible: false,
imagePathOn: 'Images/Icons/style-01/trash.png',
imagePathOff: 'Images/Icons/style-01/trash.png',
iconPathOn: 'trash',
iconPathOff: 'trash',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -158,8 +157,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Settings',
visible: false,
imagePathOn: 'Images/Icons/style-01/tools.png',
imagePathOff: 'Images/Icons/style-01/tools.png',
iconPathOn: 'tools',
iconPathOff: 'tools',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -168,7 +167,6 @@ function newStrategyPartConstructor () {
break
}
case 'Strategy Entry Event': {
strategyPart.imagePath = 'Images/Icons/style-01/startup.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -176,8 +174,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -188,8 +186,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Situation',
visible: false,
imagePathOn: 'Images/Icons/style-01/attractive.png',
imagePathOff: 'Images/Icons/style-01/attractive.png',
iconPathOn: 'attractive',
iconPathOff: 'attractive',
relatedStrategyPart: 'Situation',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -198,7 +197,6 @@ function newStrategyPartConstructor () {
break
}
case 'Strategy Exit Event': {
strategyPart.imagePath = 'Images/Icons/style-01/support.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -206,8 +204,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -218,8 +216,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Situation',
visible: false,
imagePathOn: 'Images/Icons/style-01/attractive.png',
imagePathOff: 'Images/Icons/style-01/attractive.png',
iconPathOn: 'attractive',
iconPathOff: 'attractive',
relatedStrategyPart: 'Situation',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -228,7 +227,6 @@ function newStrategyPartConstructor () {
break
}
case 'Trade Entry Event': {
strategyPart.imagePath = 'Images/Icons/style-01/compass.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -236,8 +234,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -248,8 +246,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Situation',
visible: false,
imagePathOn: 'Images/Icons/style-01/attractive.png',
imagePathOff: 'Images/Icons/style-01/attractive.png',
iconPathOn: 'attractive',
iconPathOff: 'attractive',
relatedStrategyPart: 'Situation',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -258,7 +257,6 @@ function newStrategyPartConstructor () {
break
}
case 'Stop': {
strategyPart.imagePath = 'Images/Icons/style-01/pixel.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -266,8 +264,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -278,8 +276,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Phase',
visible: false,
imagePathOn: 'Images/Icons/style-01/placeholder.png',
imagePathOff: 'Images/Icons/style-01/placeholder.png',
iconPathOn: 'placeholder',
iconPathOff: 'placeholder',
relatedStrategyPart: 'Phase',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -288,7 +287,6 @@ function newStrategyPartConstructor () {
break
}
case 'Take Profit': {
strategyPart.imagePath = 'Images/Icons/style-01/competition.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -296,8 +294,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -308,8 +306,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Phase',
visible: false,
imagePathOn: 'Images/Icons/style-01/placeholder.png',
imagePathOff: 'Images/Icons/style-01/placeholder.png',
iconPathOn: 'placeholder',
iconPathOff: 'placeholder',
relatedStrategyPart: 'Phase',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -318,7 +317,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()
@@ -331,8 +329,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -343,8 +341,8 @@ function newStrategyPartConstructor () {
actionFunction: strategyPart.codeEditor.activate,
label: 'Edit Code',
visible: false,
imagePathOn: 'Images/Icons/style-01/html.png',
imagePathOff: 'Images/Icons/style-01/html.png',
iconPathOn: 'html',
iconPathOff: 'html',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -355,8 +353,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Situation',
visible: false,
imagePathOn: 'Images/Icons/style-01/attractive.png',
imagePathOff: 'Images/Icons/style-01/attractive.png',
iconPathOn: 'attractive',
iconPathOff: 'attractive',
relatedStrategyPart: 'Situation',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -367,8 +366,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Delete This Phase',
visible: false,
imagePathOn: 'Images/Icons/style-01/trash.png',
imagePathOff: 'Images/Icons/style-01/trash.png',
iconPathOn: 'trash',
iconPathOff: 'trash',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -377,7 +376,6 @@ function newStrategyPartConstructor () {
break
}
case 'Situation': {
strategyPart.imagePath = 'Images/Icons/style-01/attractive.png'
menuItemsInitialValues = [
{
action: 'Pin / Unpin',
@@ -385,8 +383,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -397,8 +395,9 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Add Condition',
visible: false,
imagePathOn: 'Images/Icons/style-01/testing.png',
imagePathOff: 'Images/Icons/style-01/testing.png',
iconPathOn: 'testing',
iconPathOff: 'testing',
relatedStrategyPart: 'Condition',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -409,8 +408,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Delete This Situation',
visible: false,
imagePathOn: 'Images/Icons/style-01/trash.png',
imagePathOff: 'Images/Icons/style-01/trash.png',
iconPathOn: 'trash',
iconPathOff: 'trash',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -419,7 +418,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()
@@ -432,8 +430,8 @@ function newStrategyPartConstructor () {
currentStatus: false,
label: undefined,
visible: false,
imagePathOn: 'Images/Icons/style-01/target.png',
imagePathOff: 'Images/Icons/style-01/security.png',
iconPathOn: 'target',
iconPathOff: 'security',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -444,8 +442,8 @@ function newStrategyPartConstructor () {
actionFunction: strategyPart.codeEditor.activate,
label: 'Edit Code',
visible: false,
imagePathOn: 'Images/Icons/style-01/html.png',
imagePathOff: 'Images/Icons/style-01/html.png',
iconPathOn: 'html',
iconPathOff: 'html',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
@@ -456,8 +454,8 @@ function newStrategyPartConstructor () {
actionFunction: payload.onMenuItemClick,
label: 'Delete This Condition',
visible: false,
imagePathOn: 'Images/Icons/style-01/trash.png',
imagePathOff: 'Images/Icons/style-01/trash.png',
iconPathOn: 'trash',
iconPathOff: 'trash',
rawRadius: 8,
targetRadius: 0,
currentRadius: 0,
Globals.js
+7 -5
View File
@@ -28,7 +28,9 @@ UI_COLOR = {
RED: "223, 70, 60",
PATINATED_TURQUOISE: "27,153,139",
TITANIUM_YELLOW: "244,228,9",
MANGANESE_PURPLE: "91,80,122"
MANGANESE_PURPLE: "91,80,122",
TURQUOISE: "74,207,217",
DARK_TURQUOISE: "2,149,170"
};
/* User Interface Fonts */
@@ -121,8 +123,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.
@@ -163,10 +165,10 @@ const MIN_PLOTABLE_DATE = new Date(2015, 0, 1, 0, 0, 0);
const MAX_PLOTABLE_DATE = maxDate;
const TOP_SPACE_HEIGHT = 5;
const BOTTOM_SPACE_HEIGHT = 40;
const COCKPIT_SPACE_HEIGHT = 40;
const BREAKPOINT_HEIGHT = 15;
const SIDE_PANEL_WIDTH = 450
let BOTTOM_SPACE_POSITION = browserCanvas.height - BOTTOM_SPACE_HEIGHT
let COCKPIT_SPACE_POSITION = browserCanvas.height - COCKPIT_SPACE_HEIGHT
const PRODUCT_CARD_STATUS = {
ON: 'on',
Project.njsproj
+5 -5
View File
@@ -32,13 +32,13 @@
</PropertyGroup>
<ItemGroup>
<Compile Include="Animation.js" />
<Compile Include="BottomSpace\DeleteTradingHistory.js">
<Compile Include="CockpitSpace\DeleteTradingHistory.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="BreakpointsBar.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="BottomSpace\ChartAspectRatio.js">
<Compile Include="CockpitSpace\ChartAspectRatio.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="CloudVM\CloudRequire.js">
@@ -85,7 +85,7 @@
<Compile Include="ImageButton.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="Spaces\BottomSpace.js">
<Compile Include="Spaces\CockpitSpace.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="Spaces\TopSpace.js">
@@ -112,7 +112,7 @@
<Compile Include="TopSpace\EndUser.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="BottomSpace\PlayStopButton.js">
<Compile Include="CockpitSpace\PlayStopButton.js">
<SubType>Code</SubType>
</Compile>
<Compile Include="WebDebugLog.js">
@@ -177,7 +177,7 @@
<Folder Include="Exchange\" />
<Folder Include="Files\" />
<Folder Include="FloatingSpace\" />
<Folder Include="BottomSpace\" />
<Folder Include="CockpitSpace\" />
<Folder Include="Scales\" />
<Folder Include="TopSpace\" />
<Folder Include="Spaces\" />
Scales/TimePeriodScale.js
+1 -1
View File
@@ -187,7 +187,7 @@ to be visible at the top of the viewPort. */
/* Lets start the drawing. */
let displacement = viewPort.margins.BOTTOM - BOTTOM_SPACE_HEIGHT
let displacement = viewPort.margins.BOTTOM - COCKPIT_SPACE_HEIGHT
/*
browserCanvasContext.beginPath()
Spaces/ChartSpace.js
+5 -6
View File
@@ -117,8 +117,8 @@ function newChartSpace () {
returnPoint.x = 0
}
if (point.y > BOTTOM_SPACE_POSITION + BOTTOM_SPACE_HEIGHT / 2) {
returnPoint.y = BOTTOM_SPACE_POSITION + BOTTOM_SPACE_HEIGHT / 2
if (point.y > COCKPIT_SPACE_POSITION + COCKPIT_SPACE_HEIGHT / 2) {
returnPoint.y = COCKPIT_SPACE_POSITION + COCKPIT_SPACE_HEIGHT / 2
}
if (point.y < 0) {
@@ -137,7 +137,7 @@ function newChartSpace () {
return false
}
if (point.y > BOTTOM_SPACE_POSITION + BOTTOM_SPACE_HEIGHT / 2) {
if (point.y > COCKPIT_SPACE_POSITION + COCKPIT_SPACE_HEIGHT / 2) {
return false
}
@@ -149,7 +149,7 @@ function newChartSpace () {
}
function physics () {
thisObject.container.frame.height = BOTTOM_SPACE_POSITION
thisObject.container.frame.height = COCKPIT_SPACE_POSITION
if (thisObject.container.frame.height <= 0 / 100) {
thisObject.visible = false
@@ -180,7 +180,7 @@ function newChartSpace () {
let toPoint = {
x: browserCanvas.width,
y: BOTTOM_SPACE_POSITION
y: COCKPIT_SPACE_POSITION
}
browserCanvasContext.beginPath()
@@ -199,4 +199,3 @@ function newChartSpace () {
}
}
}
Spaces/BottomSpace.js → Spaces/CockpitSpace.js
+16 -93
View File
@@ -1,17 +1,14 @@
function newBottomSpace () {
const MODULE_NAME = 'Bottom Space'
const ERROR_LOG = true
function newCockpitSpace () {
const MODULE_NAME = 'CockpitSpace'
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,23 +33,27 @@
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 () {
thisObject.container.frame.position.x = 0
thisObject.container.frame.position.y = browserCanvas.height - BOTTOM_SPACE_HEIGHT
thisObject.container.frame.position.y = browserCanvas.height - COCKPIT_SPACE_HEIGHT
thisObject.container.frame.width = browserCanvas.width
thisObject.container.frame.height = BOTTOM_SPACE_HEIGHT
thisObject.container.frame.height = COCKPIT_SPACE_HEIGHT
}
function physics () {
@@ -67,8 +68,8 @@
thisObject.container.isDraggeable = false
}
if (thisObject.container.frame.position.y > browserCanvas.height * 99.5 / 100 - BOTTOM_SPACE_HEIGHT) {
thisObject.container.frame.position.y = browserCanvas.height - BOTTOM_SPACE_HEIGHT
if (thisObject.container.frame.position.y > browserCanvas.height * 99.5 / 100 - COCKPIT_SPACE_HEIGHT) {
thisObject.container.frame.position.y = browserCanvas.height - COCKPIT_SPACE_HEIGHT
thisObject.status = 'BOTTOM'
canvas.strategySpace.makeInvisible()
} else {
@@ -83,74 +84,10 @@
canvas.panelsSpace.visible = true
}
BOTTOM_SPACE_POSITION = thisObject.container.frame.position.y
COCKPIT_SPACE_POSITION = thisObject.container.frame.position.y
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) {
if (thisObject.container.frame.isThisPointHere(point, true) === true) {
return thisObject.container
@@ -164,21 +101,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 () {
@@ -195,7 +118,7 @@
browserCanvasContext.beginPath()
browserCanvasContext.rect(zeroPoint.x, zeroPoint.y, thisObject.container.frame.width, thisObject.container.frame.height)
browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.DARK + ', ' + opacity + ')'
browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.DARK_TURQUOISE + ', ' + opacity + ')'
browserCanvasContext.closePath()
browserCanvasContext.fill()
Spaces/FloatingSpace.js
+3 -3
View File
@@ -79,8 +79,8 @@ function newFloatingSpace () {
returnPoint.x = 0
}
if (point.y < BOTTOM_SPACE_POSITION + BOTTOM_SPACE_HEIGHT) {
returnPoint.y = BOTTOM_SPACE_POSITION + BOTTOM_SPACE_HEIGHT
if (point.y < COCKPIT_SPACE_POSITION + COCKPIT_SPACE_HEIGHT) {
returnPoint.y = COCKPIT_SPACE_POSITION + COCKPIT_SPACE_HEIGHT
}
if (point.y > browserCanvas.height) {
@@ -99,7 +99,7 @@ function newFloatingSpace () {
return false
}
if (point.y < BOTTOM_SPACE_POSITION + BOTTOM_SPACE_HEIGHT) {
if (point.y < COCKPIT_SPACE_POSITION + COCKPIT_SPACE_HEIGHT) {
return false
}
Spaces/StrategySpace.js
+47 -5
View File
@@ -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 () {
TopSpace/CurrentEvent.js
+1 -1
View File
@@ -70,7 +70,7 @@ function newCurrentEvent () {
thisObject.container = container
thisObject.container.frame.width = 150
thisObject.container.frame.height = BOTTOM_SPACE_HEIGHT
thisObject.container.frame.height = COCKPIT_SPACE_HEIGHT
resize()
TopSpace/EndUser.js
+1 -1
View File
@@ -12,7 +12,7 @@ function newEndUser () {
thisObject.container = container
thisObject.container.frame.width = 200
thisObject.container.frame.height = BOTTOM_SPACE_HEIGHT
thisObject.container.frame.height = COCKPIT_SPACE_HEIGHT
container.frame.position.x = viewPort.visibleArea.topRight.x - thisObject.container.frame.width * 5
container.frame.position.y = viewPort.visibleArea.bottomLeft.y + BREAKPOINT_HEIGHT
TopSpace/Login.js
+1 -1
View File
@@ -19,7 +19,7 @@ function newLogin () {
thisObject.container = container
thisObject.container.frame.width = 200
thisObject.container.frame.height = BOTTOM_SPACE_HEIGHT
thisObject.container.frame.height = COCKPIT_SPACE_HEIGHT
container.frame.position.x = viewPort.visibleArea.topRight.x - thisObject.container.frame.width * 1
container.frame.position.y = viewPort.visibleArea.bottomLeft.y + BREAKPOINT_HEIGHT
Utilities.js
-15
View File
@@ -154,21 +154,6 @@ function removeTime (datetime) {
return dateOnly
}
function loadEmoji (pPath) {
let newImage
newImage = new Image()
newImage.onload = onImageLoaded
function onImageLoaded () {
newImage.isLoaded = true
}
newImage.src = window.canvasApp.urlPrefix + 'Images/Emoji/' + pPath
return newImage
}
function printLabel (labelToPrint, x, y, opacity, fontSize) {
let labelPoint