diff --git a/newIDE/app/src/InstancesEditor/InstancesEditorContainer.js b/newIDE/app/src/InstancesEditor/InstancesEditorContainer.js index 439d91a967..575851f2bc 100644 --- a/newIDE/app/src/InstancesEditor/InstancesEditorContainer.js +++ b/newIDE/app/src/InstancesEditor/InstancesEditorContainer.js @@ -215,26 +215,14 @@ export default class InstancesEditorContainer extends Component { _onEndSelectionRectangle = () => { const instancesSelected = this.selectionRectangle.endSelectionRectangle(); - instancesSelected.forEach( - instance => this.props.instancesSelection.selectInstance(instance) + this.props.instancesSelection.selectInstances( + instancesSelected, + this.keyboardShortcuts.shouldMultiSelect() ); this.props.onInstancesSelected(instancesSelected); }; - _onInstanceClicked = instance => { - if (!this.keyboardShortcuts.shouldMultiSelect()) - this.props.instancesSelection.clearSelection(); - this.props.instancesSelection.selectInstance( - instance, - !this.keyboardShortcuts.shouldMultiSelect() - ); - - if (this.props.onInstancesSelected) { - this.props.onInstancesSelected( - this.props.instancesSelection.getSelectedInstances() - ); - } - }; + _onInstanceClicked = instance => {}; _onOverInstance = instance => { this.highlightedInstance.setInstance(instance); @@ -247,6 +235,17 @@ export default class InstancesEditorContainer extends Component { const instance = selectedInstances[i]; this.props.initialInstances.insertInitialInstance(instance); } + } else { + this.props.instancesSelection.selectInstance( + instance, + this.keyboardShortcuts.shouldMultiSelect() + ); + + if (this.props.onInstancesSelected) { + this.props.onInstancesSelected( + this.props.instancesSelection.getSelectedInstances() + ); + } } }; @@ -264,7 +263,12 @@ export default class InstancesEditorContainer extends Component { } const selectedInstances = this.props.instancesSelection.getSelectedInstances(); - this.instancesMover.moveBy(selectedInstances, sceneDeltaX, sceneDeltaY); + this.instancesMover.moveBy( + selectedInstances, + sceneDeltaX, + sceneDeltaY, + this.keyboardShortcuts.shouldFollowAxis() + ); }; _onMoveInstanceEnd = () => { @@ -287,7 +291,12 @@ export default class InstancesEditorContainer extends Component { const sceneDeltaY = deltaY / this.viewPosition.getZoomFactor(); const selectedInstances = this.props.instancesSelection.getSelectedInstances(); - this.instancesResizer.resizeBy(selectedInstances, sceneDeltaX, sceneDeltaY); + this.instancesResizer.resizeBy( + selectedInstances, + sceneDeltaX, + sceneDeltaY, + this.keyboardShortcuts.shouldResizeProportionally() + ); }; _onResizeEnd = () => { diff --git a/newIDE/app/src/InstancesEditor/InstancesMover.js b/newIDE/app/src/InstancesEditor/InstancesMover.js index 887eeca710..3a369496a1 100644 --- a/newIDE/app/src/InstancesEditor/InstancesMover.js +++ b/newIDE/app/src/InstancesEditor/InstancesMover.js @@ -23,7 +23,21 @@ export default class InstancesResizer { return Math.round(y / this.options.gridHeight) * this.options.gridHeight; } - moveBy(instances, deltaX, deltaY) { + _getMoveDeltaX(followAxis) { + if (followAxis && Math.abs(this.totalDeltaX) < Math.abs(this.totalDeltaY)) + return 0; + + return this.totalDeltaX; + } + + _getMoveDeltaY(followAxis) { + if (followAxis && Math.abs(this.totalDeltaY) < Math.abs(this.totalDeltaX)) + return 0; + + return this.totalDeltaY; + } + + moveBy(instances, deltaX, deltaY, followAxis) { this.totalDeltaX += deltaX; this.totalDeltaY += deltaY; @@ -39,10 +53,14 @@ export default class InstancesResizer { } selectedInstance.setX( - this._roundXPosition(initialPosition.x + this.totalDeltaX) + this._roundXPosition( + initialPosition.x + this._getMoveDeltaX(followAxis) + ) ); selectedInstance.setY( - this._roundYPosition(initialPosition.y + this.totalDeltaY) + this._roundYPosition( + initialPosition.y + this._getMoveDeltaY(followAxis) + ) ); } } diff --git a/newIDE/app/src/InstancesEditor/InstancesResizer.js b/newIDE/app/src/InstancesEditor/InstancesResizer.js index 6b963aa2f5..4d2436f326 100644 --- a/newIDE/app/src/InstancesEditor/InstancesResizer.js +++ b/newIDE/app/src/InstancesEditor/InstancesResizer.js @@ -24,7 +24,21 @@ export default class InstancesResizer { this.options.gridHeight; } - resizeBy(instances, deltaX, deltaY) { + _getSizeDeltaX(proportional, initialSize) { + if (proportional && Math.abs(this.totalDeltaX) < Math.abs(this.totalDeltaY)) + return initialSize.width / initialSize.height * this.totalDeltaY; + + return this.totalDeltaX; + } + + _getSizeDeltaY(proportional, initialSize) { + if (proportional && Math.abs(this.totalDeltaY) < Math.abs(this.totalDeltaX)) + return initialSize.height / initialSize.width * this.totalDeltaX; + + return this.totalDeltaY; + } + + resizeBy(instances, deltaX, deltaY, proportional) { this.totalDeltaX += deltaX; this.totalDeltaY += deltaY; @@ -50,10 +64,10 @@ export default class InstancesResizer { selectedInstance.setHasCustomSize(true); selectedInstance.setCustomWidth( - this._roundWidth(initialSize.width + this.totalDeltaX) + this._roundWidth(initialSize.width + this._getSizeDeltaX(proportional, initialSize)) ); selectedInstance.setCustomHeight( - this._roundHeight(initialSize.height + this.totalDeltaY) + this._roundHeight(initialSize.height + this._getSizeDeltaY(proportional, initialSize)) ); } } diff --git a/newIDE/app/src/InstancesEditor/KeyboardShortcuts.js b/newIDE/app/src/InstancesEditor/KeyboardShortcuts.js index fe42cfa337..4c2ab9382c 100644 --- a/newIDE/app/src/InstancesEditor/KeyboardShortcuts.js +++ b/newIDE/app/src/InstancesEditor/KeyboardShortcuts.js @@ -24,6 +24,14 @@ export default class KeyboardShortcuts { return this.shiftPressed; } + shouldFollowAxis() { + return this.shiftPressed; + } + + shouldResizeProportionally() { + return this.shiftPressed; + } + shouldScrollHorizontally() { return this.altPressed; } diff --git a/newIDE/app/src/SceneEditor/InstancesFullEditor/InstancesSelection.js b/newIDE/app/src/SceneEditor/InstancesFullEditor/InstancesSelection.js index 35f31fa357..05442d8c87 100644 --- a/newIDE/app/src/SceneEditor/InstancesFullEditor/InstancesSelection.js +++ b/newIDE/app/src/SceneEditor/InstancesFullEditor/InstancesSelection.js @@ -21,10 +21,21 @@ export default class InstancesSelection { this.selection.length = 0; } - selectInstance(instance) { - if (!this.isInstanceSelected(instance)) { - this.selection.push(instance); + selectInstance(instance, multiselect) { + if (this.isInstanceSelected(instance)) { + if (multiselect) this.unselectInstance(instance); + + return; } + + if (!multiselect) this.clearSelection(); + this.selection.push(instance); + } + + selectInstances(instances, multiselect) { + if (!multiselect) this.clearSelection(); + + instances.forEach(instance => this.selectInstance(instance, true)); } unselectInstance(instance) {