Integration with new icons

This commit is contained in:
Luis Fernando Molina committed 2019-05-16 19:15:04 +02:00
1 parent 975892ac4d
commit 8f89dc7892
3 files changed
+11 -242

No files matched your search

+2 -2
View File
@@ -130,7 +130,7 @@
})
for (let i = 1; i < 15; i++) {
let strategyImage = loadEmoji("Symbols/Emoji Symbols-" + (112 + i) + ".png");
let strategyImage = canvas.strategySpace.iconByPartType.get('Strategy');
strategyImages.push(strategyImage);
}
@@ -561,7 +561,7 @@
drawStick(recordPoint1, recordPoint3);
drawStick(recordPoint2, recordPoint4);
if (imageToDraw.isLoaded === true) {
if (imageToDraw.canDrawIcon === true) {
browserCanvasContext.drawImage(imageToDraw, recordPoint3.x - imageSize / 2, recordPoint3.y - imageSize / 2, imageSize, imageSize);
if (record.status === 1) {
browserCanvasContext.drawImage(imageToDraw, recordPoint4.x - imageSize / 2, recordPoint4.y - imageSize / 2, imageSize, imageSize);
+6 -5
View File
@@ -136,8 +136,8 @@
/* Loading a few icons */
imageStopLossPhase = loadEmoji("stop.png");
imageBuyOrderPhase = loadEmoji("Nature/Emoji Natur-67.png");
imageStopLossPhase = canvas.strategySpace.iconByPartType.get('Stop');
imageBuyOrderPhase = canvas.strategySpace.iconByPartType.get('Phase');
callBackFunction();
@@ -657,9 +657,9 @@
browserCanvasContext.stroke()
if (imageStopLossPhase.isLoaded === true && stopLossPhase > 0) {
if (imageStopLossPhase.canDrawIcon === true && stopLossPhase > 0) {
browserCanvasContext.drawImage(imageStopLossPhase, recordPoint5.x - imageSize, recordPoint5.y - imageSize * 1.25, imageSize, imageSize);
printLabel(stopLossPhase, recordPoint5.x - imageSize / 2, recordPoint5.y - imageSize * 1.5, '0.9', 8);
printLabel(stopLossPhase, recordPoint5.x - imageSize / 2 - 3, recordPoint5.y - imageSize * 1.5, '0.9', 8);
}
/* Next we are drawing the Buy Order */
@@ -685,7 +685,7 @@
browserCanvasContext.lineWidth = 5
browserCanvasContext.stroke()
if (imageBuyOrderPhase.isLoaded === true && buyOrderPhase > 0) {
if (imageBuyOrderPhase.canDrawIcon === true && buyOrderPhase > 0) {
browserCanvasContext.drawImage(imageBuyOrderPhase, recordPoint9.x - imageSize * 2 / 3, recordPoint9.y + imageSize / 4, imageSize, imageSize);
printLabel(buyOrderPhase, recordPoint9.x - imageSize * 1 / 3, recordPoint9.y + imageSize * 1.9, '0.9', 8);
}
@@ -764,5 +764,6 @@
+3 -235
View File
@@ -20,7 +20,7 @@ function newAAMastersPlottersTradingSimulationTradingSimulationTradingSimulation
let currentRecord;
let panelTabButton
let controlHandler
return thisObject;
@@ -38,15 +38,10 @@ function newAAMastersPlottersTradingSimulationTradingSimulationTradingSimulation
panelTabButton.fitFunction = thisObject.fitFunction
panelTabButton.initialize()
controlHandler = canvas.bottomSpace.createNewControl('Over The Line', drawAssetBalanceUI, 'Global')
}
function finalize() {
canvas.bottomSpace.destroyControl(controlHandler)
controlHandler = undefined
}
function getContainer(point) {
@@ -233,235 +228,7 @@ function newAAMastersPlottersTradingSimulationTradingSimulationTradingSimulation
paramsArray.push(params)
let control = canvas.bottomSpace.getControl(controlHandler, 'Global')
control.paramsArray = paramsArray
}
function drawAssetBalanceUI(paramsArray) {
drawAssetCircle(paramsArray[0])
drawAssetCircle(paramsArray[1])
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 = -40
labelPoint = {
x: 0 - xOffset + (paramsArray[1].LEFT_OFFSET - paramsArray[0].LEFT_OFFSET) / 2 + paramsArray[0].LEFT_OFFSET - 20,
y: BOTTOM_SPACE_POSITION - BOTTOM_SPACE_HEIGHT/ 2 - yOffset
};
browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')';
browserCanvasContext.fillText(label, labelPoint.x, labelPoint.y);
}
function drawAssetCircle(params) {
/* We draw the circle container */
const RED_LINE_HIGHT = 5;
const RADIOUS = 50;
const OPACITY = 1;
let centerPoint = {
x: params.LEFT_OFFSET,
y: BOTTOM_SPACE_POSITION - BOTTOM_SPACE_HEIGHT / 2
}
browserCanvasContext.beginPath();
browserCanvasContext.arc(centerPoint.x, centerPoint.y, RADIOUS + RED_LINE_HIGHT, 0.9 * Math.PI, 2.1 * 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.9 * Math.PI;
let BAR_END_ANGLE = 2.1 * Math.PI;
let CURRENT_VALUE_ANGLE = params.VALUE * (BAR_END_ANGLE - BAR_START_ANGLE) / params.MAX_VALUE + BAR_START_ANGLE
let MIN_VALUE_ANGLE = params.MIN_VALUE * (BAR_END_ANGLE - BAR_START_ANGLE) / params.MAX_VALUE + BAR_START_ANGLE
let INIT_VALUE_ANGLE = params.INIT_VALUE * (BAR_END_ANGLE - BAR_START_ANGLE) / 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 (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 params.VALUE in the middle */
fontSize = 22;
browserCanvasContext.font = "bold " + fontSize + 'px ' + UI_FONT.PRIMARY
label = 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 = 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 = 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);
canvas.cockpitSpace.assetBalances.setParamsArray(paramsArray)
}
}
@@ -481,3 +248,4 @@ function newAAMastersPlottersTradingSimulationTradingSimulationTradingSimulation