From 4bc4d924150f53139e4fdfa60924774900258115 Mon Sep 17 00:00:00 2001 From: DD Date: Thu, 21 Sep 2017 18:20:44 -0400 Subject: [PATCH] Move select tool out of select mode --- src/containers/paper-canvas.jsx | 8 ++ src/containers/reshape-mode.jsx | 14 +-- src/containers/select-mode.jsx | 110 ++--------------- .../selection-tools/bounding-box-tool.js | 21 ++-- src/helper/selection-tools/handle-tool.js | 7 +- src/helper/selection-tools/move-tool.js | 9 +- src/helper/selection-tools/point-tool.js | 9 +- src/helper/selection-tools/reshape-tool.js | 18 ++- src/helper/selection-tools/rotate-tool.js | 8 +- src/helper/selection-tools/scale-tool.js | 10 +- .../selection-tools/selection-box-tool.js | 4 +- src/helper/selection.js | 116 ++++++++---------- 12 files changed, 135 insertions(+), 199 deletions(-) diff --git a/src/containers/paper-canvas.jsx b/src/containers/paper-canvas.jsx index ab6dc3e2..ae4eda24 100644 --- a/src/containers/paper-canvas.jsx +++ b/src/containers/paper-canvas.jsx @@ -35,7 +35,15 @@ class PaperCanvas extends React.Component { onLoad: function (item) { // Remove viewbox if (item.clipped) { + let mask; + for (const child of item.children) { + if (child.isClipMask()) { + mask = child; + break; + } + } item.clipped = false; + mask.remove(); // Consider removing clip mask here? } while (item.reduce() !== item) { diff --git a/src/containers/reshape-mode.jsx b/src/containers/reshape-mode.jsx index 41e18cf6..9900f571 100644 --- a/src/containers/reshape-mode.jsx +++ b/src/containers/reshape-mode.jsx @@ -7,7 +7,6 @@ import Modes from '../modes/modes'; import {changeMode} from '../reducers/modes'; import {setHoveredItem, clearHoveredItem} from '../reducers/hover'; -import {selectSubItems} from '../helper/selection'; import ReshapeTool from '../helper/selection-tools/reshape-tool'; import ReshapeModeComponent from '../components/reshape-mode.jsx'; import paper from 'paper'; @@ -41,15 +40,12 @@ class ReshapeMode extends React.Component { return false; // Static component, for now } activateTool () { - selectSubItems(); - this.tool = new ReshapeTool(this.props.setHoveredItem, this.props.clearHoveredItem); + this.tool = new ReshapeTool(this.props.setHoveredItem, this.props.clearHoveredItem, this.props.onUpdateSvg); this.tool.setPrevHoveredItem(this.props.hoveredItem); this.tool.activate(); - paper.settings.handleSize = 8; } deactivateTool () { - paper.settings.handleSize = 0; - this.props.clearHoveredItem(); + this.tool.deactivateTool(); this.tool.remove(); this.tool = null; this.hitResult = null; @@ -64,10 +60,10 @@ class ReshapeMode extends React.Component { ReshapeMode.propTypes = { clearHoveredItem: PropTypes.func.isRequired, handleMouseDown: PropTypes.func.isRequired, - hoveredItem: PropTypes.instanceOf(paper.Item), // eslint-disable-line react/no-unused-prop-types + hoveredItem: PropTypes.instanceOf(paper.Item), isReshapeModeActive: PropTypes.bool.isRequired, - onUpdateSvg: PropTypes.func.isRequired, // eslint-disable-line react/no-unused-prop-types - setHoveredItem: PropTypes.func.isRequired // eslint-disable-line react/no-unused-prop-types + onUpdateSvg: PropTypes.func.isRequired, + setHoveredItem: PropTypes.func.isRequired }; const mapStateToProps = state => ({ diff --git a/src/containers/select-mode.jsx b/src/containers/select-mode.jsx index 1b3eaa4a..731ba0e6 100644 --- a/src/containers/select-mode.jsx +++ b/src/containers/select-mode.jsx @@ -7,36 +7,17 @@ import Modes from '../modes/modes'; import {changeMode} from '../reducers/modes'; import {setHoveredItem, clearHoveredItem} from '../reducers/hover'; -import {getHoveredItem} from '../helper/hover'; -import {rectSelect} from '../helper/guides'; -import {selectRootItem, processRectangularSelection} from '../helper/selection'; - +import SelectTool from '../helper/selection-tools/select-tool'; import SelectModeComponent from '../components/select-mode.jsx'; -import BoundingBoxTool from '../helper/selection-tools/bounding-box-tool'; -import SelectionBoxTool from '../helper/selection-tools/selection-box-tool'; import paper from 'paper'; class SelectMode extends React.Component { - static get TOLERANCE () { - return 6; - } constructor (props) { super(props); bindAll(this, [ 'activateTool', - 'deactivateTool', - 'getHitOptions' + 'deactivateTool' ]); - this._hitOptions = { - segments: true, - stroke: true, - curves: true, - fill: true, - guide: false - }; - this.boundingBoxTool = new BoundingBoxTool(); - this.selectionBoxTool = new SelectionBoxTool(); - this.selectionBoxMode = false; } componentDidMount () { if (this.props.isSelectModeActive) { @@ -44,6 +25,10 @@ class SelectMode extends React.Component { } } componentWillReceiveProps (nextProps) { + if (this.tool && nextProps.hoveredItem !== this.props.hoveredItem) { + this.tool.setPrevHoveredItem(nextProps.hoveredItem); + } + if (nextProps.isSelectModeActive && !this.props.isSelectModeActive) { this.activateTool(); } else if (!nextProps.isSelectModeActive && this.props.isSelectModeActive) { @@ -53,87 +38,14 @@ class SelectMode extends React.Component { shouldComponentUpdate () { return false; // Static component, for now } - getHitOptions (preselectedOnly) { - this._hitOptions.tolerance = SelectMode.TOLERANCE / paper.view.zoom; - if (preselectedOnly) { - this._hitOptions.selected = true; - } else { - delete this._hitOptions.selected; - } - return this._hitOptions; - } activateTool () { - debugger; - selectRootItem(); - this.boundingBoxTool.setSelectionBounds(); - this.tool = new paper.Tool(); - - // Define these to sate linter - const selectMode = this; - - this.tool.onMouseDown = event => { - if (event.event.button > 0) return; // only first mouse button - - this.props.clearHoveredItem(); - if (!this.boundingBoxTool - .onMouseDown( - event, - event.modifiers.alt, - event.modifiers.shift, - this.getHitOptions(false /* preseelectedOnly */))) { - this.selectionBoxMode = true; - this.selectionBoxTool.onMouseDown(event.modifiers.shift); - } - }; - - this.tool.onMouseMove = function (event) { - const hoveredItem = getHoveredItem(event, selectMode.getHitOptions()); - const oldHoveredItem = selectMode.props.hoveredItem; - if ((!hoveredItem && oldHoveredItem) || // There is no longer a hovered item - (hoveredItem && !oldHoveredItem) || // There is now a hovered item - (hoveredItem && oldHoveredItem && hoveredItem.id !== oldHoveredItem.id)) { // hovered item changed - selectMode.props.setHoveredItem(hoveredItem); - } - }; - - - this.tool.onMouseDrag = function (event) { - if (event.event.button > 0) return; // only first mouse button - - if (selectMode.selectionBoxMode) { - selectMode.selectionRect = rectSelect(event); - // Remove this rect on the next drag and up event - selectMode.selectionRect.removeOnDrag(); - } else { - selectMode.boundingBoxTool.onMouseDrag(event); - } - }; - - this.tool.onMouseUp = function (event) { - if (event.event.button > 0) return; // only first mouse button - - if (selectMode.selectionBoxMode) { - if (selectMode.selectionRect) { - processRectangularSelection(event, selectMode.selectionRect, Modes.SELECT); - selectMode.selectionRect.remove(); - } - selectMode.boundingBoxTool.setSelectionBounds(); - } else { - selectMode.boundingBoxTool.onMouseUp(event); - selectMode.props.onUpdateSvg(); - } - selectMode.selectionBoxMode = false; - selectMode.selectionRect = null; - }; + this.tool = new SelectTool(this.props.setHoveredItem, this.props.clearHoveredItem, this.props.onUpdateSvg); this.tool.activate(); } deactivateTool () { - debugger; - this.props.clearHoveredItem(); - this.boundingBoxTool.removeBoundsPath(); + this.tool.deactivateTool(); this.tool.remove(); this.tool = null; - this.hitResult = null; } render () { return ( @@ -145,10 +57,10 @@ class SelectMode extends React.Component { SelectMode.propTypes = { clearHoveredItem: PropTypes.func.isRequired, handleMouseDown: PropTypes.func.isRequired, - hoveredItem: PropTypes.instanceOf(paper.Item), // eslint-disable-line react/no-unused-prop-types + hoveredItem: PropTypes.instanceOf(paper.Item), isSelectModeActive: PropTypes.bool.isRequired, - onUpdateSvg: PropTypes.func.isRequired, // eslint-disable-line react/no-unused-prop-types - setHoveredItem: PropTypes.func.isRequired // eslint-disable-line react/no-unused-prop-types + onUpdateSvg: PropTypes.func.isRequired, + setHoveredItem: PropTypes.func.isRequired }; const mapStateToProps = state => ({ diff --git a/src/helper/selection-tools/bounding-box-tool.js b/src/helper/selection-tools/bounding-box-tool.js index 22cb8ade..c77a5dcd 100644 --- a/src/helper/selection-tools/bounding-box-tool.js +++ b/src/helper/selection-tools/bounding-box-tool.js @@ -28,17 +28,19 @@ const Modes = keyMirror({ * On mouse down, the type of function (move, scale, rotate) is determined based on what is clicked * (scale handle, rotate handle, the object itself). This determines the mode of the tool, which then * delegates actions to the MoveTool, RotateTool or ScaleTool accordingly. + * @param {!function} onUpdateSvg A callback to call when the image visibly changes */ class BoundingBoxTool { - constructor () { + constructor (onUpdateSvg) { + this.onUpdateSvg = onUpdateSvg; this.mode = null; this.boundsPath = null; this.boundsScaleHandles = []; this.boundsRotHandles = []; this._modeMap = {}; - this._modeMap[Modes.SCALE] = new ScaleTool(); - this._modeMap[Modes.ROTATE] = new RotateTool(); - this._modeMap[Modes.MOVE] = new MoveTool(); + this._modeMap[Modes.SCALE] = new ScaleTool(onUpdateSvg); + this._modeMap[Modes.ROTATE] = new RotateTool(onUpdateSvg); + this._modeMap[Modes.MOVE] = new MoveTool(onUpdateSvg); } /** @@ -75,8 +77,13 @@ class BoundingBoxTool { this.mode = Modes.MOVE; } + const hitProperties = { + hitResult: hitResult, + clone: event.modifiers.alt, + multiselect: event.modifiers.shift + }; if (this.mode === Modes.MOVE) { - this._modeMap[this.mode].onMouseDown(hitResult, clone, multiselect); + this._modeMap[this.mode].onMouseDown(hitProperties); } else if (this.mode === Modes.SCALE) { this._modeMap[this.mode].onMouseDown( hitResult, this.boundsPath, this.boundsScaleHandles, this.boundsRotHandles, getSelectedItems()); @@ -100,10 +107,9 @@ class BoundingBoxTool { this.setSelectionBounds(); } setSelectionBounds () { - debugger; this.removeBoundsPath(); - const items = getSelectedItems(); + const items = getSelectedItems(true /* recursive */); if (items.length <= 0) return; let rect = null; @@ -181,7 +187,6 @@ class BoundingBoxTool { } } removeBoundsPath () { - debugger; removeHelperItems(); this.boundsPath = null; this.boundsScaleHandles.length = 0; diff --git a/src/helper/selection-tools/handle-tool.js b/src/helper/selection-tools/handle-tool.js index b05c2e21..49757b83 100644 --- a/src/helper/selection-tools/handle-tool.js +++ b/src/helper/selection-tools/handle-tool.js @@ -1,8 +1,12 @@ import {clearSelection, getSelectedItems} from '../selection'; class HandleTool { - constructor () { + /** + * @param {!function} onUpdateSvg A callback to call when the image visibly changes + */ + constructor (onUpdateSvg) { this.hitType = null; + this.onUpdateSvg = onUpdateSvg; } /** * @param {!object} hitProperties Describes the mouse event @@ -58,6 +62,7 @@ class HandleTool { } onMouseUp () { // @todo add back undo + this.onUpdateSvg(); } } diff --git a/src/helper/selection-tools/move-tool.js b/src/helper/selection-tools/move-tool.js index 99fbb661..e6470a92 100644 --- a/src/helper/selection-tools/move-tool.js +++ b/src/helper/selection-tools/move-tool.js @@ -4,8 +4,12 @@ import {snapDeltaToAngle} from '../math'; import {clearSelection, cloneSelection, getSelectedItems, setItemSelection} from '../selection'; class MoveTool { - constructor () { + /** + * @param {!function} onUpdateSvg A callback to call when the image visibly changes + */ + constructor (onUpdateSvg) { this.selectedItems = null; + this.onUpdateSvg = onUpdateSvg; } /** @@ -41,7 +45,7 @@ class MoveTool { this._select(item, true, hitProperties.subselect); } if (hitProperties.clone) cloneSelection(hitProperties.subselect); - this.selectedItems = getSelectedItems(hitProperties.subselect); + this.selectedItems = getSelectedItems(true /* subselect */); } /** * Sets the selection state of an item. @@ -90,6 +94,7 @@ class MoveTool { // @todo add back undo // pg.undo.snapshot('moveSelection'); + this.onUpdateSvg(); } } diff --git a/src/helper/selection-tools/point-tool.js b/src/helper/selection-tools/point-tool.js index 2072dbb3..12aa53ae 100644 --- a/src/helper/selection-tools/point-tool.js +++ b/src/helper/selection-tools/point-tool.js @@ -4,7 +4,10 @@ import {clearSelection, getSelectedItems} from '../selection'; /** Subtool of ReshapeTool for moving control points. */ class PointTool { - constructor () { + /** + * @param {!function} onUpdateSvg A callback to call when the image visibly changes + */ + constructor (onUpdateSvg) { /** * Deselection often does not happen until mouse up. If the mouse is dragged before * mouse up, deselection is cancelled. This variable keeps track of which paper.Item to deselect. @@ -21,6 +24,7 @@ class PointTool { */ this.invertDeselect = false; this.selectedItems = null; + this.onUpdateSvg = onUpdateSvg; } /** @@ -185,9 +189,8 @@ class PointTool { } this.selectedItems = null; // @todo add back undo + this.onUpdateSvg(); } } export default PointTool; - -// - bounding box when switching between select and reshape diff --git a/src/helper/selection-tools/reshape-tool.js b/src/helper/selection-tools/reshape-tool.js index e5ab3cdb..77b86300 100644 --- a/src/helper/selection-tools/reshape-tool.js +++ b/src/helper/selection-tools/reshape-tool.js @@ -26,10 +26,11 @@ class ReshapeTool extends paper.Tool { static get DOUBLE_CLICK_MILLIS () { return 250; } - constructor (setHoveredItem, clearHoveredItem) { + constructor (setHoveredItem, clearHoveredItem, onUpdateSvg) { super(); this.setHoveredItem = setHoveredItem; this.clearHoveredItem = clearHoveredItem; + this.onUpdateSvg = onUpdateSvg; this.prevHoveredItem = null; this._hitOptionsSelected = { match: function (item) { @@ -72,10 +73,10 @@ class ReshapeTool extends paper.Tool { this.mode = ReshapeModes.SELECTION_BOX; this.selectionRect = null; this._modeMap = {}; - this._modeMap[ReshapeModes.FILL] = new MoveTool(); - this._modeMap[ReshapeModes.POINT] = new PointTool(); - this._modeMap[ReshapeModes.HANDLE] = new HandleTool(); - this._modeMap[ReshapeModes.SELECTION_BOX] = new SelectionBoxTool(); + this._modeMap[ReshapeModes.FILL] = new MoveTool(onUpdateSvg); + this._modeMap[ReshapeModes.POINT] = new PointTool(onUpdateSvg); + this._modeMap[ReshapeModes.HANDLE] = new HandleTool(onUpdateSvg); + this._modeMap[ReshapeModes.SELECTION_BOX] = new SelectionBoxTool(Modes.RESHAPE); // We have to set these functions instead of just declaring them because // paper.js tools hook up the listeners in the setter functions. @@ -84,6 +85,8 @@ class ReshapeTool extends paper.Tool { this.onMouseDrag = this.handleMouseDrag; this.onMouseUp = this.handleMouseUp; this.onKeyUp = this.handleKeyUp; + + paper.settings.handleSize = 8; } getHitOptions (preselectedOnly) { this._hitOptions.tolerance = ReshapeTool.TOLERANCE / paper.view.zoom; @@ -193,8 +196,13 @@ class ReshapeTool extends paper.Tool { // Backspace, delete if (event.key === 'delete' || event.key === 'backspace') { deleteSelection(Modes.RESHAPE); + this.onUpdateSvg(); } } + deactivateTool() { + paper.settings.handleSize = 0; + this.clearHoveredItem(); + } } export default ReshapeTool; diff --git a/src/helper/selection-tools/rotate-tool.js b/src/helper/selection-tools/rotate-tool.js index 64bf7b50..4893ede1 100644 --- a/src/helper/selection-tools/rotate-tool.js +++ b/src/helper/selection-tools/rotate-tool.js @@ -1,10 +1,14 @@ import paper from 'paper'; class RotateTool { - constructor () { + /** + * @param {!function} onUpdateSvg A callback to call when the image visibly changes + */ + constructor (onUpdateSvg) { this.rotItems = []; this.rotGroupPivot = null; this.prevRot = []; + this.onUpdateSvg = onUpdateSvg; } /** @@ -57,7 +61,7 @@ class RotateTool { this.prevRot = []; // @todo add back undo - // pg.undo.snapshot('rotateSelection'); + this.onUpdateSvg(); } } diff --git a/src/helper/selection-tools/scale-tool.js b/src/helper/selection-tools/scale-tool.js index 0b7c5b6f..085395d8 100644 --- a/src/helper/selection-tools/scale-tool.js +++ b/src/helper/selection-tools/scale-tool.js @@ -1,7 +1,10 @@ import paper from 'paper'; class ScaleTool { - constructor () { + /** + * @param {!function} onUpdateSvg A callback to call when the image visibly changes + */ + constructor (onUpdateSvg) { this.pivot = null; this.origPivot = null; this.corner = null; @@ -14,6 +17,7 @@ class ScaleTool { this.scaleItems = []; this.boundsScaleHandles = []; this.boundsRotHandles = []; + this.onUpdateSvg = onUpdateSvg; } /** @@ -113,7 +117,7 @@ class ScaleTool { } } } - onMouseUp (event) { + onMouseUp () { this.pivot = null; this.origPivot = null; this.corner = null; @@ -150,7 +154,7 @@ class ScaleTool { this.itemGroup.remove(); // @todo add back undo - // pg.undo.snapshot('scaleSelection'); + this.onUpdateSvg(); } getRectCornerNameByIndex (index) { switch (index) { diff --git a/src/helper/selection-tools/selection-box-tool.js b/src/helper/selection-tools/selection-box-tool.js index ab71165e..68f014a9 100644 --- a/src/helper/selection-tools/selection-box-tool.js +++ b/src/helper/selection-tools/selection-box-tool.js @@ -1,11 +1,11 @@ import Modes from '../../modes/modes'; import {rectSelect} from '../guides'; import {clearSelection, processRectangularSelection} from '../selection'; -import {getHoveredItem} from '../hover'; class SelectionBoxTool { - constructor () { + constructor (mode) { this.selectionRect = null; + this.mode = mode; } /** * @param {boolean} multiselect Whether to multiselect on mouse down (e.g. shift key held) diff --git a/src/helper/selection.js b/src/helper/selection.js index cd4e5bbe..c1996270 100644 --- a/src/helper/selection.js +++ b/src/helper/selection.js @@ -3,7 +3,7 @@ import Modes from '../modes/modes'; import {getAllPaperItems} from './helper'; import {getItemsGroup, isGroup} from './group'; -import {getRootItem, isGroupItem, isCompoundPathItem, isPathItem, isPGTextItem} from './item'; +import {getRootItem, isCompoundPathItem, isBoundsItem, isPathItem, isPGTextItem} from './item'; import {getItemsCompoundPath, isCompoundPath, isCompoundPathChild} from './compound-path'; const getAllSelectableItems = function () { @@ -34,37 +34,40 @@ const selectItemSegments = function (item, state) { } }; -const setGroupSelection = function (root, selected) { - // fully selected segments need to be unselected first - root.fullySelected = false; - // then the item can be normally selected +const setGroupSelection = function (root, selected, fullySelected) { + root.fullySelected = fullySelected; root.selected = selected; // select children of compound-path or group if (isCompoundPath(root) || isGroup(root)) { const children = root.children; if (children) { - for (let i = 0; i < children.length; i++) { - children[i].selected = selected; + for (const child of children) { + if (isGroup(child)) { + setGroupSelection(child, selected, fullySelected); + } else { + child.fullySelected = fullySelected; + child.selected = selected; + } } } } }; -const setItemSelection = function (item, state) { +const setItemSelection = function (item, state, fullySelected) { const parentGroup = getItemsGroup(item); const itemsCompoundPath = getItemsCompoundPath(item); // if selection is in a group, select group if (parentGroup) { // do it recursive - setItemSelection(parentGroup, state); + setItemSelection(parentGroup, state, fullySelected); } else if (itemsCompoundPath) { - setGroupSelection(itemsCompoundPath, state); + setGroupSelection(itemsCompoundPath, state, fullySelected); } else { if (item.data && item.data.noSelect) { return; } - setGroupSelection(item, state); + setGroupSelection(item, state, fullySelected); } // @todo: Update toolbar state on change @@ -311,34 +314,34 @@ const getSelectedPaths = function () { return paths; }; -// const checkBoundsItem = function (selectionRect, item, event) { -// const itemBounds = new paper.Path([ -// item.localToGlobal(item.internalBounds.topLeft), -// item.localToGlobal(item.internalBounds.topRight), -// item.localToGlobal(item.internalBounds.bottomRight), -// item.localToGlobal(item.internalBounds.bottomLeft) -// ]); -// itemBounds.closed = true; -// itemBounds.guide = true; +const checkBoundsItem = function (selectionRect, item, event) { + const itemBounds = new paper.Path([ + item.localToGlobal(item.internalBounds.topLeft), + item.localToGlobal(item.internalBounds.topRight), + item.localToGlobal(item.internalBounds.bottomRight), + item.localToGlobal(item.internalBounds.bottomLeft) + ]); + itemBounds.closed = true; + itemBounds.guide = true; -// for (let i = 0; i < itemBounds.segments.length; i++) { -// const seg = itemBounds.segments[i]; -// if (selectionRect.contains(seg.point) || -// (i === 0 && selectionRect.getIntersections(itemBounds).length > 0)) { -// if (event.modifiers.shift && item.selected) { -// setItemSelection(item, false); + for (let i = 0; i < itemBounds.segments.length; i++) { + const seg = itemBounds.segments[i]; + if (selectionRect.contains(seg.point) || + (i === 0 && selectionRect.getIntersections(itemBounds).length > 0)) { + if (event.modifiers.shift && item.selected) { + setItemSelection(item, false); -// } else { -// setItemSelection(item, true); -// } -// itemBounds.remove(); -// return true; + } else { + setItemSelection(item, true); + } + itemBounds.remove(); + return true; -// } -// } + } + } -// itemBounds.remove(); -// }; + itemBounds.remove(); +}; const handleRectangularSelectionItems = function (item, event, rect, mode) { if (isPathItem(item)) { @@ -355,11 +358,9 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) { seg.selected = true; } segmentMode = true; - } else { if (event.modifiers.shift && item.selected) { setItemSelection(item, false); - } else { setItemSelection(item, true); } @@ -371,7 +372,7 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) { // second round checks for path intersections const intersections = item.getIntersections(rect); if (intersections.length > 0 && !segmentMode) { - // if in detail select mode, select the curves that intersect + // if in reshape mode, select the curves that intersect // with the selectionRect if (mode === Modes.RESHAPE) { for (let k = 0; k < intersections.length; k++) { @@ -389,7 +390,6 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) { curve.selected = true; } } - } else { if (event.modifiers.shift && item.selected) { setItemSelection(item, false); @@ -402,10 +402,10 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) { } // @todo: Update toolbar state on change - // } else if (isBoundsItem(item)) { - // if (checkBoundsItem(rect, item, event)) { - // return false; - // } + } else if (isBoundsItem(item)) { + if (checkBoundsItem(rect, item, event)) { + return false; + } } return true; }; @@ -417,9 +417,8 @@ const rectangularSelectionGroupLoop = function (group, rect, root, event, mode) if (isGroup(child) || isCompoundPathItem(child)) { rectangularSelectionGroupLoop(child, rect, root, event, mode); - - } else if (!handleRectangularSelectionItems(child, event, rect, mode)) { - return false; + } else { + handleRectangularSelectionItems(child, event, rect, mode); } } return true; @@ -428,20 +427,16 @@ const rectangularSelectionGroupLoop = function (group, rect, root, event, mode) const processRectangularSelection = function (event, rect, mode) { const allItems = getAllSelectableItems(); - itemLoop: for (let i = 0; i < allItems.length; i++) { const item = allItems[i]; if (mode === Modes.RESHAPE && isPGTextItem(getRootItem(item))) { - continue itemLoop; + continue; } // check for item segment points inside selectionRect if (isGroup(item) || isCompoundPathItem(item)) { - if (!rectangularSelectionGroupLoop(item, rect, item, event, mode)) { - continue itemLoop; - } - - } else if (!handleRectangularSelectionItems(item, event, rect, mode)) { - continue itemLoop; + rectangularSelectionGroupLoop(item, rect, item, event, mode); + } else { + handleRectangularSelectionItems(item, event, rect, mode); } } }; @@ -455,23 +450,15 @@ const selectRootItem = function () { for (const item of items) { if (isCompoundPathChild(item)) { const cp = getItemsCompoundPath(item); - setItemSelection(cp, true); + setItemSelection(cp, true, true /* fullySelected */); } const rootItem = getRootItem(item); if (item !== rootItem) { - setItemSelection(item, false); - setItemSelection(rootItem, true); + setItemSelection(rootItem, true, true /* fullySelected */); } } }; -const selectSubItems = function () { - // when switching to the reshape tool while having a compound path or group - // selected, deselect the group and select the children instead. - // TODO -}; - - const shouldShowIfSelection = function () { return getSelectedItems().length > 0; }; @@ -500,7 +487,6 @@ export { removeSelectedSegments, processRectangularSelection, selectRootItem, - selectSubItems, shouldShowIfSelection, shouldShowIfSelectionRecursive, shouldShowSelectAll