From 6476fd642884adb07a9cb2b3eb7d7c5415e0aafd Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Sun, 5 May 2019 13:44:57 +0200 Subject: [PATCH] Ready for capturing events at menu items --- FloatingSpace/CircularMenu.js | 2 +- FloatingSpace/CircularMenuItem.js | 10 ++++++--- FloatingSpace/FloatingObject.js | 23 ++++++++++---------- FloatingSpace/StrategyPart.js | 35 ++++++++++++++++--------------- 4 files changed, 38 insertions(+), 32 deletions(-) diff --git a/FloatingSpace/CircularMenu.js b/FloatingSpace/CircularMenu.js index 0abe8e308..22c55c56d 100644 --- a/FloatingSpace/CircularMenu.js +++ b/FloatingSpace/CircularMenu.js @@ -79,7 +79,7 @@ function newCircularMenu () { function onMouseNotOver () { for (let i = 0; i < menuItems.length; i++) { let menutItem = menuItems[i] - menutItem.targetRadius = menutItem.rawRadius * 1 - i * 5 + menutItem.targetRadius = menutItem.rawRadius * 0 - i * 5 } isMouseOver = false } diff --git a/FloatingSpace/CircularMenuItem.js b/FloatingSpace/CircularMenuItem.js index 442ab6cb7..7b3091237 100644 --- a/FloatingSpace/CircularMenuItem.js +++ b/FloatingSpace/CircularMenuItem.js @@ -61,7 +61,7 @@ function newCircularMenuItem () { function getContainer (point) { let container - if (thisObject.container.frame.isThisPointHere(point, true) === true) { + if (thisObject.container.frame.isThisPointHere(point, true, true) === true) { return thisObject.container } else { return undefined @@ -115,15 +115,18 @@ function newCircularMenuItem () { y: 0 } + thisObject.container.frame.position.x = 0 + thisObject.container.frame.position.y = 0 position = thisObject.container.frame.frameThisPoint(position) /* Menu Item */ if (thisObject.canDrawIcon === true && thisObject.currentRadius > 1) { let menuPosition = { - x: position.x + thisObject.container.frame.radius * 3 / 4 * Math.cos(toRadians(thisObject.angle)), - y: position.y - thisObject.container.frame.radius * 3 / 4 * Math.sin(toRadians(thisObject.angle)) } + x: position.x + thisObject.container.frame.radius * 4 / 7 * Math.cos(toRadians(thisObject.angle)), + y: position.y - thisObject.container.frame.radius * 4 / 7 * Math.sin(toRadians(thisObject.angle)) } + thisObject.container.frame.position = menuPosition browserCanvasContext.drawImage(thisObject.icon, menuPosition.x - thisObject.currentRadius, menuPosition.y - thisObject.currentRadius, thisObject.currentRadius * 2, thisObject.currentRadius * 2) /* Menu Label */ @@ -146,3 +149,4 @@ function newCircularMenuItem () { } } } + diff --git a/FloatingSpace/FloatingObject.js b/FloatingSpace/FloatingObject.js index 471ec4acb..4ae674585 100644 --- a/FloatingSpace/FloatingObject.js +++ b/FloatingSpace/FloatingObject.js @@ -1,4 +1,4 @@ -  + function newFloatingObject () { const MODULE_NAME = 'Floating Object' const INFO_LOG = false @@ -130,28 +130,28 @@ function newFloatingObject () { } function thisObjectPhysics () { - // The radius also have a target. + // The radius also have a target. if (Math.abs(thisObject.container.frame.radius - thisObject.targetRadius) >= 1) { if (thisObject.container.frame.radius < thisObject.targetRadius) { - thisObject.container.frame.radius = thisObject.container.frame.radius + 0.5 + thisObject.container.frame.radius = thisObject.container.frame.radius + 2 } else { - thisObject.container.frame.radius = thisObject.container.frame.radius - 0.5 + thisObject.container.frame.radius = thisObject.container.frame.radius - 2 } thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) } - // The imageSize also have a target. + // The imageSize also have a target. if (Math.abs(thisObject.currentImageSize - thisObject.targetImageSize) >= 1) { if (thisObject.currentImageSize < thisObject.targetImageSize) { - thisObject.currentImageSize = thisObject.currentImageSize + 1 + thisObject.currentImageSize = thisObject.currentImageSize + 2 } else { - thisObject.currentImageSize = thisObject.currentImageSize - 1 + thisObject.currentImageSize = thisObject.currentImageSize - 2 } } - // The fontSize also have a target. + // The fontSize also have a target. if (Math.abs(thisObject.currentFontSize - thisObject.targetFontSize) >= 0.2) { if (thisObject.currentFontSize < thisObject.targetFontSize) { @@ -163,7 +163,7 @@ function newFloatingObject () { } function onMouseOver () { - thisObject.targetRadius = thisObject.rawRadius * 2.5 + thisObject.targetRadius = thisObject.rawRadius * 4.0 thisObject.targetImageSize = thisObject.rawImageSize * 2.0 thisObject.targetFontSize = thisObject.rawFontSize * 2.0 @@ -275,13 +275,14 @@ function newFloatingObject () { function updateMass () { - // thisObject.currentMass = thisObject.rawMass + thisObject.rawMass * thisObject.container.zoom.incrementM * thisObject.container.zoom.levelM; + // thisObject.currentMass = thisObject.rawMass + thisObject.rawMass * thisObject.container.zoom.incrementM * thisObject.container.zoom.levelM; } function updateRadius () { - // thisObject.targetRadius = thisObject.rawRadius + thisObject.rawRadius * thisObject.container.zoom.incrementR * thisObject.container.zoom.levelR; + // thisObject.targetRadius = thisObject.rawRadius + thisObject.rawRadius * thisObject.container.zoom.incrementR * thisObject.container.zoom.levelR; } } + diff --git a/FloatingSpace/StrategyPart.js b/FloatingSpace/StrategyPart.js index 7aabdcbd6..5192aa977 100644 --- a/FloatingSpace/StrategyPart.js +++ b/FloatingSpace/StrategyPart.js @@ -44,7 +44,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 20 }, { label: 'Delete This Strategy', @@ -54,7 +54,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 20 * 1 + angle: -20 }] break } @@ -69,7 +69,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 0 }] break } @@ -84,7 +84,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 0 }] break } @@ -99,7 +99,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 0 }] break } @@ -114,7 +114,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 0 }] break } @@ -129,7 +129,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 0 }] break } @@ -144,7 +144,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 0 }] break } @@ -159,7 +159,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 40 }, { label: 'Add Situation', @@ -169,7 +169,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 20 * 1 + angle: 0 }, { label: 'Delete This Phase', @@ -179,7 +179,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: -20 + angle: -40 }] break } @@ -194,7 +194,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 20 }, { label: 'Delete This Situation', @@ -204,7 +204,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 20 * 1 + angle: -20 }] break } @@ -219,7 +219,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 60 + angle: 20 }, { label: 'Delete This Condition', @@ -229,7 +229,7 @@ function newStrategyPart () { rawRadius: 8, targetRadius: 0, currentRadius: 0, - angle: 20 * 1 + angle: -20 }] break } @@ -397,7 +397,7 @@ function newStrategyPart () { if (label !== undefined) { labelPoint = { x: position.x - label.length / 2 * fontSize * FONT_ASPECT_RATIO, - y: position.y - radius - fontSize * FONT_ASPECT_RATIO - 10 + y: position.y - radius / 2 - fontSize * FONT_ASPECT_RATIO - 10 } browserCanvasContext.font = fontSize + 'px ' + UI_FONT.PRIMARY @@ -410,7 +410,7 @@ function newStrategyPart () { if (label !== undefined && isMouseOver === true) { labelPoint = { x: position.x - label.length / 2 * fontSize * FONT_ASPECT_RATIO, - y: position.y + radius + fontSize * FONT_ASPECT_RATIO + 15 + y: position.y + radius / 2 + fontSize * FONT_ASPECT_RATIO + 15 } browserCanvasContext.font = fontSize + 'px ' + UI_FONT.PRIMARY @@ -420,3 +420,4 @@ function newStrategyPart () { } } } +