From 8c0bf4af80d41422f0f96d370772b10f4c18e17f Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Wed, 7 Oct 2020 11:17:36 +0200 Subject: [PATCH] Settings --- FloatingSpace/CircularMenuItem.js | 36 +++++++++++-------- FloatingSpace/FloatingLayer.js | 2 ++ FloatingSpace/FloatingObject.js | 10 +++--- Spaces/FloatingSpace.js | 58 ++++++++++++++++++++++++++++++- 4 files changed, 87 insertions(+), 19 deletions(-) diff --git a/FloatingSpace/CircularMenuItem.js b/FloatingSpace/CircularMenuItem.js index 4bc3b5eee..e62c7961c 100644 --- a/FloatingSpace/CircularMenuItem.js +++ b/FloatingSpace/CircularMenuItem.js @@ -73,8 +73,6 @@ function newCircularMenuItem() { let temporaryStatus = 0 let temporaryStatusCounter = 0 - const EXTRA_MOUSE_OVER_ICON_SIZE = 6 - const STATUS_NO_ACTION_TAKEN_YET = 0 const STATUS_PRIMARY_ACTION_WORKING = -1 const STATUS_SECONDARY_ACTION_WORKING = -2 @@ -113,11 +111,7 @@ function newCircularMenuItem() { selfMouseClickEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseClick', onMouseClick) selfMouseNotOverEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseNotOver', onMouseNotOver) - if (thisObject.type === 'Icon & Text') { - thisObject.container.frame.width = 220 - } else { - thisObject.container.frame.width = 50 - } + containerPhysics() thisObject.nextAction = thisObject.action } @@ -155,7 +149,15 @@ function newCircularMenuItem() { function physics() { if (thisObject.dontShowAtFullscreen === true && AT_FULL_SCREEN_MODE === true) { return } + positionPhysics() + temporaryStatusPhysics() + disablePhysics() + iconPhysics() + backgroundColorPhysics() + containerPhysics() + } + function positionPhysics() { let INCREASE_STEP = 2 if (Math.abs(thisObject.currentRadius - thisObject.targetRadius) >= INCREASE_STEP) { @@ -201,9 +203,9 @@ function newCircularMenuItem() { radiusGrowthFactor / 7 * Math.sin(toRadians(thisObject.angle)) - thisObject.container.frame.height / 2 + } - temporaryStatusPhysics() - + function disablePhysics() { /* Here we will check if we need to monitor a property that influences the status of the Menu Item. */ if (thisObject.disableIfPropertyIsDefined === true) { if (thisObject.payload.node[thisObject.propertyToCheckFor] === undefined) { @@ -214,11 +216,17 @@ function newCircularMenuItem() { thisObject.isEnabled = false } } - iconPhysics() - backgroundColorPhysics() } - function backgroundColorPhysics(){ + function containerPhysics() { + if (thisObject.type === 'Icon & Text') { + thisObject.container.frame.width = 220 * canvas.floatingSpace.settings.node.menuItem.widthPercentage / 100 + } else { + thisObject.container.frame.width = 50 + } + } + + function backgroundColorPhysics() { defaultBackgroudColor = canvas.floatingSpace.style.node.menuItem.backgroundColor } @@ -443,9 +451,9 @@ function newCircularMenuItem() { /* Menu Item */ let iconSize if (isMouseOver === true) { - iconSize = thisObject.currentRadius + EXTRA_MOUSE_OVER_ICON_SIZE + iconSize = canvas.floatingSpace.style.node.menuItem.imageSize * 150 / 100 } else { - iconSize = thisObject.currentRadius + iconSize = canvas.floatingSpace.style.node.menuItem.imageSize } if (thisObject.icon === undefined) { return } diff --git a/FloatingSpace/FloatingLayer.js b/FloatingSpace/FloatingLayer.js index e5a2a52a1..eabf34b1b 100644 --- a/FloatingSpace/FloatingLayer.js +++ b/FloatingSpace/FloatingLayer.js @@ -290,6 +290,8 @@ function newFloatingLayer() { DEBUG.variable1 = 'Invisible Floating Objets: ' + invisibleFloatingObjects.length DEBUG.variable2 = 'Visible Floating Objets: ' + visibleFloatingObjects.length + if (canvas.floatingSpace.settings.physics !== true) {return} + for (let i = 0; i < visibleFloatingObjects.length; i++) { let floatingObject = visibleFloatingObjects[i] if (floatingObject.isFrozen === true) { continue } diff --git a/FloatingSpace/FloatingObject.js b/FloatingSpace/FloatingObject.js index 92c98df33..8304222a5 100644 --- a/FloatingSpace/FloatingObject.js +++ b/FloatingSpace/FloatingObject.js @@ -340,7 +340,7 @@ function newFloatingObject() { function positionContraintsPhysics() { const MAX_DISTANCE_TO_PARENT = 5000 const MIN_DISTANCE_TO_PARENT = 100 - const DEFAULT_NODE_TO_NODE_DISTANCE = 500 + const DEFAULT_NODE_TO_NODE_DISTANCE = 500 * canvas.floatingSpace.settings.node.distancePercentage / 100 if (thisObject.angleToParent !== ANGLE_TO_PARENT.NOT_FIXED && thisObject.isOnFocus !== true) { let parent = thisObject.payload.chainParent @@ -615,7 +615,8 @@ function newFloatingObject() { } function setFocus(point) { - thisObject.targetRadius = thisObject.rawRadius * 6.0 + thisObject.targetRadius = thisObject.rawRadius * 6.0 * canvas.floatingSpace.settings.node.radiusPercentage / 100 + thisObject.currentMass = thisObject.rawMass * canvas.floatingSpace.settings.node.massPercentage / 100 thisObject.targetImageSize = thisObject.rawImageSize * 2.0 thisObject.targetFontSize = thisObject.rawFontSize * 2.0 thisObject.targetHierarchyRing = thisObject.rawHierarchyRing * 8.0 @@ -634,7 +635,8 @@ function newFloatingObject() { } if (thisObject.payload === undefined) { return } if (thisObject.isOnFocus === true) { - thisObject.targetRadius = thisObject.rawRadius * 1 + thisObject.targetRadius = thisObject.rawRadius * 1 * canvas.floatingSpace.settings.node.radiusPercentage / 100 + thisObject.currentMass = thisObject.rawMass * canvas.floatingSpace.settings.node.massPercentage / 100 thisObject.targetImageSize = thisObject.rawImageSize * 1 thisObject.targetFontSize = thisObject.rawFontSize * 1 thisObject.targetHierarchyRing = thisObject.rawHierarchyRing * 1 @@ -719,7 +721,7 @@ function newFloatingObject() { } thisObject.rawRadius = radius - thisObject.targetRadius = radius + thisObject.targetRadius = radius * canvas.floatingSpace.settings.node.radiusPercentage / 100 thisObject.container.frame.radius = radius thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) diff --git a/Spaces/FloatingSpace.js b/Spaces/FloatingSpace.js index b6502af55..95efcc787 100644 --- a/Spaces/FloatingSpace.js +++ b/Spaces/FloatingSpace.js @@ -15,6 +15,7 @@ function newFloatingSpace() { drawReferenceLines: false, drawChainLines: true, style: undefined, + settings: undefined, toggleDrawChainLines: toggleDrawChainLines, toggleDrawReferenceLines: toggleDrawReferenceLines, toggleMapMode: toggleMapMode, @@ -79,11 +80,25 @@ function newFloatingSpace() { menuItem: { backgroundColor: UI_COLOR.BLACK, fontColor: UI_COLOR.WHITE, - fontSize: 15 + fontSize: 15, + imageSize: 50 } } } + /* Default Settings */ + thisObject.settings = { + node: { + distancePercentage: 100, + radiusPercentage: 100, + massPercentage: 100, + menuItem: { + widthPercentage: 100 + } + }, + physics: true + } + return thisObject function finalize() { @@ -407,6 +422,7 @@ function newFloatingSpace() { function physics() { if (visible === false) { return } syncStylePhysics() + syncSettingsPhysics() browserZoomPhysics() positionContraintsPhysics() thisObject.floatingLayer.physics() @@ -418,6 +434,7 @@ function newFloatingSpace() { let designSpaceNode = canvas.designSpace.workspace.getHierarchyHeadsByType('Design Space') if (designSpaceNode === undefined) { return } if (designSpaceNode.spaceStyle === undefined) { return } + let configStyle try { configStyle = JSON.parse(designSpaceNode.spaceStyle.config) } catch (err) { @@ -456,9 +473,48 @@ function newFloatingSpace() { if (configStyle.node.menuItem.fontSize !== undefined) { thisObject.style.node.menuItem.fontSize = configStyle.node.menuItem.fontSize } + if (configStyle.node.menuItem.imageSize !== undefined) { + thisObject.style.node.menuItem.imageSize = configStyle.node.menuItem.imageSize + } + } + } + } + + function syncSettingsPhysics() { + if (canvas.designSpace === undefined) { return } + if (canvas.designSpace.workspace === undefined) { return } + let designSpaceNode = canvas.designSpace.workspace.getHierarchyHeadsByType('Design Space') + if (designSpaceNode === undefined) { return } + if (designSpaceNode.spaceSettings === undefined) { return } + let configSettings + try { + configSettings = JSON.parse(designSpaceNode.spaceSettings.config) + } catch (err) { + if (thisObject.payload !== undefined) { + thisObject.payload.uiObject.setErrorMessage(err.message) + } + return + } + if (configSettings.node !== undefined) { + if (configSettings.node.distancePercentage !== undefined) { + thisObject.settings.node.distancePercentage = configSettings.node.distancePercentage + } + if (configSettings.node.radiusPercentage !== undefined) { + thisObject.settings.node.radiusPercentage = configSettings.node.radiusPercentage + } + if (configSettings.node.massPercentage !== undefined) { + thisObject.settings.node.massPercentage = configSettings.node.massPercentage + } + if (configSettings.node.menuItem !== undefined) { + if (configSettings.node.menuItem.widthPercentage !== undefined) { + thisObject.settings.node.menuItem.widthPercentage = configSettings.node.menuItem.widthPercentage + } } } + if (configSettings.physics !== undefined) { + thisObject.settings.physics = configSettings.physics + } } function positionContraintsPhysics() {