mirror of
https://github.com/scratchfoundation/scratch-paint.git
synced 2024-12-22 21:42:30 -05:00
prune unused function and lint
This commit is contained in:
DD
parent
25478a87fb
commit
67ac013edf
10 changed files with 43 additions and 186 deletions
|
|
@ -9,7 +9,7 @@ import {setHoveredItem, clearHoveredItem} from '../reducers/hover';
|
|||
|
||||
import {getHoveredItem} from '../helper/hover';
|
||||
import {rectSelect} from '../helper/guides';
|
||||
import {clearSelection, selectRootItem, processRectangularSelection} from '../helper/selection';
|
||||
import {selectRootItem, processRectangularSelection} from '../helper/selection';
|
||||
|
||||
import SelectModeComponent from '../components/select-mode.jsx';
|
||||
import BoundingBoxTool from '../helper/bounding-box/bounding-box-tool';
|
||||
|
|
@ -66,12 +66,18 @@ class SelectMode extends React.Component {
|
|||
this.boundingBoxTool.setSelectionBounds();
|
||||
this.tool = new paper.Tool();
|
||||
|
||||
// Define these to sate linter
|
||||
const selectMode = this;
|
||||
const hoveredItemProp = this.props.hoveredItem;
|
||||
const setHoveredItemProp = this.props.setHoveredItem;
|
||||
const onUpdateSvgProp = this.props.onUpdateSvg;
|
||||
|
||||
this.tool.onMouseDown = function (event) {
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
|
||||
selectMode.props.clearHoveredItem();
|
||||
if (!selectMode.boundingBoxTool.onMouseDown(
|
||||
if (!selectMode.boundingBoxTool
|
||||
.onMouseDown(
|
||||
event,
|
||||
event.modifiers.alt,
|
||||
event.modifiers.shift,
|
||||
|
|
@ -82,20 +88,19 @@ class SelectMode extends React.Component {
|
|||
|
||||
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
|
||||
if (oldHoveredItem) {
|
||||
oldHoveredItem.remove();
|
||||
if ((!hoveredItem && hoveredItemProp) || // There is no longer a hovered item
|
||||
(hoveredItem && !hoveredItemProp) || // There is now a hovered item
|
||||
(hoveredItem && hoveredItemProp && hoveredItem.id !== hoveredItemProp.id)) { // hovered item changed
|
||||
if (hoveredItemProp) {
|
||||
hoveredItemProp.remove();
|
||||
}
|
||||
selectMode.props.setHoveredItem(hoveredItem);
|
||||
setHoveredItemProp(hoveredItem);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
this.tool.onMouseDrag = function (event) {
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
|
||||
if (selectMode.selectionBoxMode) {
|
||||
selectMode.selectionRect = rectSelect(event);
|
||||
|
|
@ -107,17 +112,17 @@ class SelectMode extends React.Component {
|
|||
};
|
||||
|
||||
this.tool.onMouseUp = function (event) {
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
|
||||
if (selectMode.selectionBoxMode) {
|
||||
if (selectMode.selectionRect) {
|
||||
processRectangularSelection(event, selectMode.selectionRect);
|
||||
processRectangularSelection(event, selectMode.selectionRect, Modes.SELECT);
|
||||
selectMode.selectionRect.remove();
|
||||
}
|
||||
selectMode.boundingBoxTool.setSelectionBounds();
|
||||
} else {
|
||||
selectMode.boundingBoxTool.onMouseUp(event);
|
||||
selectMode.props.onUpdateSvg();
|
||||
onUpdateSvgProp();
|
||||
}
|
||||
selectMode.selectionBoxMode = false;
|
||||
selectMode.selectionRect = null;
|
||||
|
|
|
|||
|
|
@ -10,7 +10,12 @@ import RotateTool from './rotate-tool';
|
|||
import MoveTool from './move-tool';
|
||||
|
||||
/** SVG for the rotation icon on the bounding box */
|
||||
const ARROW_PATH = 'M19.28,1.09C19.28.28,19,0,18.2,0c-1.67,0-3.34,0-5,0-.34,0-.88.24-1,.47a1.4,1.4,0,0,0,.36,1.08,15.27,15.27,0,0,0,1.46,1.36A6.4,6.4,0,0,1,6.52,4,5.85,5.85,0,0,1,5.24,3,15.27,15.27,0,0,0,6.7,1.61,1.4,1.4,0,0,0,7.06.54C7,.3,6.44.07,6.1.06c-1.67,0-3.34,0-5,0C.28,0,0,.31,0,1.12c0,1.67,0,3.34,0,5a1.23,1.23,0,0,0,.49,1,1.22,1.22,0,0,0,1-.31A14.38,14.38,0,0,0,2.84,5.26l.73.62a9.45,9.45,0,0,0,7.34,2,9.45,9.45,0,0,0,4.82-2.05l.73-.62a14.38,14.38,0,0,0,1.29,1.51,1.22,1.22,0,0,0,1,.31,1.23,1.23,0,0,0,.49-1C19.31,4.43,19.29,2.76,19.28,1.09Z';
|
||||
const ARROW_PATH = 'M19.28,1.09C19.28.28,19,0,18.2,0c-1.67,0-3.34,0-5,0-.34,0-.88.24-1,.47a1.4,1.4,' +
|
||||
'0,0,0,.36,1.08,15.27,15.27,0,0,0,1.46,1.36A6.4,6.4,0,0,1,6.52,4,5.85,5.85,0,0,1,5.24,3,15.27,15.27,' +
|
||||
'0,0,0,6.7,1.61,1.4,1.4,0,0,0,7.06.54C7,.3,6.44.07,6.1.06c-1.67,0-3.34,0-5,0C.28,0,0,.31,0,1.12c0,1.67,' +
|
||||
'0,3.34,0,5a1.23,1.23,0,0,0,.49,1,1.22,1.22,0,0,0,1-.31A14.38,14.38,0,0,0,2.84,5.26l.73.62a9.45,9.45,' +
|
||||
'0,0,0,7.34,2,9.45,9.45,0,0,0,4.82-2.05l.73-.62a14.38,14.38,0,0,0,1.29,1.51,1.22,1.22,' +
|
||||
'0,0,0,1,.31,1.23,1.23,0,0,0,.49-1C19.31,4.43,19.29,2.76,19.28,1.09Z';
|
||||
/** Modes of the bounding box tool, which can do many things depending on how it's used. */
|
||||
const Modes = keyMirror({
|
||||
SCALE: null,
|
||||
|
|
|
|||
|
|
@ -19,6 +19,8 @@ class ScaleTool {
|
|||
/**
|
||||
* @param {!paper.HitResult} hitResult Data about the location of the mouse click
|
||||
* @param {!object} boundsPath Where the boundaries of the hit item are
|
||||
* @param {!object} boundsScaleHandles Bounding box scale handles
|
||||
* @param {!object} boundsRotHandles Bounding box rotation handle
|
||||
* @param {!Array.<paper.Item>} selectedItems Set of selected paper.Items
|
||||
* @param {boolean} clone Whether to clone on mouse down (e.g. alt key held)
|
||||
* @param {boolean} multiselect Whether to multiselect on mouse down (e.g. shift key held)
|
||||
|
|
|
|||
|
|
@ -20,59 +20,8 @@ const getItemsCompoundPath = function (item) {
|
|||
|
||||
};
|
||||
|
||||
|
||||
// const createFromSelection = function () {
|
||||
// const items = getSelectedPaths();
|
||||
// if (items.length < 2) return;
|
||||
|
||||
// const path = new paper.CompoundPath({fillRule: 'evenodd'});
|
||||
|
||||
// for (let i = 0; i < items.length; i++) {
|
||||
// path.addChild(items[i]);
|
||||
// items[i].selected = false;
|
||||
// }
|
||||
|
||||
// path = pg.stylebar.applyActiveToolbarStyle(path);
|
||||
|
||||
// pg.selection.setItemSelection(path, true);
|
||||
// pg.undo.snapshot('createCompoundPathFromSelection');
|
||||
// };
|
||||
|
||||
|
||||
// const releaseSelection = function () {
|
||||
// const items = pg.selection.getSelectedItems();
|
||||
|
||||
// const cPathsToDelete = [];
|
||||
// for (const i=0; i<items.length; i++) {
|
||||
// const item = items[i];
|
||||
|
||||
// if (isCompoundPath(item)) {
|
||||
|
||||
// for (const j=0; j<item.children.length; j++) {
|
||||
// const path = item.children[j];
|
||||
// path.parent = item.layer;
|
||||
// pg.selection.setItemSelection(path, true);
|
||||
// j--;
|
||||
// }
|
||||
// cPathsToDelete.push(item);
|
||||
// pg.selection.setItemSelection(item, false);
|
||||
|
||||
// } else {
|
||||
// items[i].parent = item.layer;
|
||||
// }
|
||||
// }
|
||||
|
||||
// for (const j=0; j<cPathsToDelete.length; j++) {
|
||||
// cPathsToDelete[j].remove();
|
||||
// }
|
||||
// pg.undo.snapshot('releaseCompoundPath');
|
||||
// };
|
||||
|
||||
|
||||
export {
|
||||
isCompoundPath,
|
||||
isCompoundPathChild,
|
||||
getItemsCompoundPath
|
||||
// createFromSelection,
|
||||
// releaseSelection
|
||||
};
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ const groupSelection = function () {
|
|||
for (let i = 0; i < group.children.length; i++) {
|
||||
group.children[i].selected = true;
|
||||
}
|
||||
// jQuery(document).trigger('Grouped');
|
||||
// @todo: Set selection bounds; enable/disable grouping icons
|
||||
// @todo add back undo
|
||||
// pg.undo.snapshot('groupSelection');
|
||||
return group;
|
||||
|
|
@ -65,7 +65,7 @@ const ungroupItems = function (items) {
|
|||
for (let j = 0; j < emptyGroups.length; j++) {
|
||||
emptyGroups[j].remove();
|
||||
}
|
||||
// jQuery(document).trigger('Ungrouped');
|
||||
// @todo: Set selection bounds; enable/disable grouping icons
|
||||
// @todo add back undo
|
||||
// pg.undo.snapshot('ungroupItems');
|
||||
};
|
||||
|
|
@ -73,15 +73,13 @@ const ungroupItems = function (items) {
|
|||
const ungroupSelection = function () {
|
||||
const items = getSelectedItems();
|
||||
ungroupItems(items);
|
||||
|
||||
// pg.statusbar.update();
|
||||
};
|
||||
|
||||
|
||||
const groupItems = function (items) {
|
||||
if (items.length > 0) {
|
||||
const group = new paper.Group(items);
|
||||
// jQuery(document).trigger('Grouped');
|
||||
// @todo: Set selection bounds; enable/disable grouping icons
|
||||
// @todo add back undo
|
||||
// pg.undo.snapshot('groupItems');
|
||||
return group;
|
||||
|
|
|
|||
|
|
@ -57,54 +57,6 @@ const rectSelect = function (event, color) {
|
|||
return rect;
|
||||
};
|
||||
|
||||
const line = function (from, to, color) {
|
||||
const theLine = new paper.Path.Line(from, to);
|
||||
const zoom = 1 / paper.view.zoom;
|
||||
setDefaultGuideStyle(theLine);
|
||||
if (!color) color = GUIDE_GREY;
|
||||
theLine.parent = getGuideLayer();
|
||||
theLine.strokeColor = color;
|
||||
theLine.strokeColor = color;
|
||||
theLine.dashArray = [5 * zoom, 5 * zoom];
|
||||
theLine.data.isHelperItem = true;
|
||||
return theLine;
|
||||
};
|
||||
|
||||
const crossPivot = function (center, color) {
|
||||
const zoom = 1 / paper.view.zoom;
|
||||
const star = new paper.Path.Star(center, 4, 4 * zoom, 0.5 * zoom);
|
||||
setDefaultGuideStyle(star);
|
||||
if (!color) color = GUIDE_BLUE;
|
||||
star.parent = getGuideLayer();
|
||||
star.fillColor = color;
|
||||
star.strokeColor = color;
|
||||
star.strokeWidth = 0.5 * zoom;
|
||||
star.data.isHelperItem = true;
|
||||
star.rotate(45);
|
||||
|
||||
return star;
|
||||
};
|
||||
|
||||
const rotPivot = function (center, color) {
|
||||
const zoom = 1 / paper.view.zoom;
|
||||
const path = new paper.Path.Circle(center, 3 * zoom);
|
||||
setDefaultGuideStyle(path);
|
||||
if (!color) color = GUIDE_BLUE;
|
||||
path.parent = getGuideLayer();
|
||||
path.fillColor = color;
|
||||
path.data.isHelperItem = true;
|
||||
|
||||
return path;
|
||||
};
|
||||
|
||||
const label = function (pos, content, color) {
|
||||
const text = new paper.PointText(pos);
|
||||
if (!color) color = GUIDE_GREY;
|
||||
text.parent = getGuideLayer();
|
||||
text.fillColor = color;
|
||||
text.content = content;
|
||||
};
|
||||
|
||||
const getGuideColor = function (colorName) {
|
||||
if (colorName === 'blue') {
|
||||
return GUIDE_BLUE;
|
||||
|
|
@ -113,60 +65,20 @@ const getGuideColor = function (colorName) {
|
|||
}
|
||||
};
|
||||
|
||||
const getAllGuides = function () {
|
||||
const allItems = [];
|
||||
for (let i = 0; i < paper.project.layers.length; i++) {
|
||||
const layer = paper.project.layers[i];
|
||||
for (let j = 0; j < layer.children.length; j++) {
|
||||
const child = layer.children[j];
|
||||
// only give guides
|
||||
if (!child.guide) {
|
||||
continue;
|
||||
}
|
||||
allItems.push(child);
|
||||
}
|
||||
}
|
||||
return allItems;
|
||||
};
|
||||
|
||||
const getExportRectGuide = function () {
|
||||
const guides = getAllGuides();
|
||||
for (let i = 0; i < guides.length; i++){
|
||||
if (guides[i].data && guides[i].data.isExportRect) {
|
||||
return guides[i];
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const removeHelperItems = function () {
|
||||
removePaperItemsByDataTags(['isHelperItem']);
|
||||
};
|
||||
|
||||
|
||||
const removeAllGuides = function () {
|
||||
removePaperItemsByTags(['guide']);
|
||||
};
|
||||
|
||||
|
||||
const removeExportRectGuide = function () {
|
||||
removePaperItemsByDataTags(['isExportRect']);
|
||||
};
|
||||
|
||||
|
||||
export {
|
||||
hoverItem,
|
||||
hoverBounds,
|
||||
rectSelect,
|
||||
line,
|
||||
crossPivot,
|
||||
rotPivot,
|
||||
label,
|
||||
removeAllGuides,
|
||||
removeHelperItems,
|
||||
removeExportRectGuide,
|
||||
getAllGuides,
|
||||
getExportRectGuide,
|
||||
getGuideColor,
|
||||
setDefaultGuideStyle
|
||||
};
|
||||
|
|
|
|||
|
|
@ -28,7 +28,6 @@ const getPaperItemsByTags = function (tags) {
|
|||
return foundItems;
|
||||
};
|
||||
|
||||
|
||||
const removePaperItemsByDataTags = function (tags) {
|
||||
const allItems = getAllPaperItems(true);
|
||||
for (const item of allItems) {
|
||||
|
|
@ -40,7 +39,6 @@ const removePaperItemsByDataTags = function (tags) {
|
|||
}
|
||||
};
|
||||
|
||||
|
||||
const removePaperItemsByTags = function (tags) {
|
||||
const allItems = getAllPaperItems(true);
|
||||
for (const item of allItems) {
|
||||
|
|
@ -52,7 +50,6 @@ const removePaperItemsByTags = function (tags) {
|
|||
}
|
||||
};
|
||||
|
||||
|
||||
export {
|
||||
getAllPaperItems,
|
||||
getPaperItemsByTags,
|
||||
|
|
|
|||
|
|
@ -27,7 +27,6 @@ const snapDeltaToAngle = function (delta, snapAngle) {
|
|||
return new paper.Point(dirx * d, diry * d);
|
||||
};
|
||||
|
||||
|
||||
export {
|
||||
checkPointsClose,
|
||||
getRandomInt,
|
||||
|
|
|
|||
|
|
@ -58,21 +58,15 @@ const setItemSelection = function (item, state) {
|
|||
if (parentGroup) {
|
||||
// do it recursive
|
||||
setItemSelection(parentGroup, state);
|
||||
|
||||
} else if (itemsCompoundPath) {
|
||||
setItemSelection(itemsCompoundPath, state);
|
||||
|
||||
} else {
|
||||
if (item.data && item.data.noSelect) {
|
||||
return;
|
||||
}
|
||||
setGroupSelection(item, state);
|
||||
}
|
||||
// pg.statusbar.update();
|
||||
// pg.stylebar.updateFromSelection();
|
||||
// pg.stylebar.blurInputs();
|
||||
|
||||
// jQuery(document).trigger('SelectionChanged');
|
||||
// @todo: Update toolbar state on change
|
||||
|
||||
};
|
||||
|
||||
|
|
@ -94,13 +88,10 @@ const selectAllSegments = function () {
|
|||
|
||||
const clearSelection = function () {
|
||||
paper.project.deselectAll();
|
||||
|
||||
// pg.statusbar.update();
|
||||
// pg.stylebar.blurInputs();
|
||||
// jQuery(document).trigger('SelectionChanged');
|
||||
// @todo: Update toolbar state on change
|
||||
};
|
||||
|
||||
// this gets all selected non-grouped items and groups
|
||||
// This gets all selected non-grouped items and groups
|
||||
// (alternative to paper.project.selectedItems, which includes
|
||||
// group children in addition to the group)
|
||||
// Returns in increasing Z order
|
||||
|
|
@ -137,8 +128,7 @@ const deleteItemSelection = function () {
|
|||
items[i].remove();
|
||||
}
|
||||
|
||||
// jQuery(document).trigger('DeleteItems');
|
||||
// jQuery(document).trigger('SelectionChanged');
|
||||
// @todo: Update toolbar state on change
|
||||
paper.project.view.update();
|
||||
// @todo add back undo
|
||||
// pg.undo.snapshot('deleteItemSelection');
|
||||
|
|
@ -290,8 +280,7 @@ const deleteSegmentSelection = function () {
|
|||
deleteSegments(items[i]);
|
||||
}
|
||||
|
||||
// jQuery(document).trigger('DeleteSegments');
|
||||
// jQuery(document).trigger('SelectionChanged');
|
||||
// @todo: Update toolbar state on change
|
||||
paper.project.view.update();
|
||||
// @todo add back undo
|
||||
// pg.undo.snapshot('deleteSegmentSelection');
|
||||
|
|
@ -308,7 +297,7 @@ const cloneSelection = function () {
|
|||
// pg.undo.snapshot('cloneSelection');
|
||||
};
|
||||
|
||||
// only returns paths, no compound paths, groups or any other stuff
|
||||
// Only returns paths, no compound paths, groups or any other stuff
|
||||
const getSelectedPaths = function () {
|
||||
const allPaths = getSelectedItems();
|
||||
const paths = [];
|
||||
|
|
@ -359,7 +348,7 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) {
|
|||
for (let j = 0; j < item.segments.length; j++) {
|
||||
const seg = item.segments[j];
|
||||
if (rect.contains(seg.point)) {
|
||||
if (mode === 'detail') {
|
||||
if (mode === Modes.RESHAPE) {
|
||||
if (event.modifiers.shift && seg.selected) {
|
||||
seg.selected = false;
|
||||
} else {
|
||||
|
|
@ -384,7 +373,7 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) {
|
|||
if (intersections.length > 0 && !segmentMode) {
|
||||
// if in detail select mode, select the curves that intersect
|
||||
// with the selectionRect
|
||||
if (mode === 'detail') {
|
||||
if (mode === Modes.RESHAPE) {
|
||||
for (let k = 0; k < intersections.length; k++) {
|
||||
const curve = intersections[k].curve;
|
||||
// intersections contains every curve twice because
|
||||
|
|
@ -411,7 +400,7 @@ const handleRectangularSelectionItems = function (item, event, rect, mode) {
|
|||
return false;
|
||||
}
|
||||
}
|
||||
// pg.statusbar.update();
|
||||
// @todo: Update toolbar state on change
|
||||
|
||||
} else if (isBoundsItem(item)) {
|
||||
if (checkBoundsItem(rect, item, event)) {
|
||||
|
|
@ -442,7 +431,7 @@ const processRectangularSelection = function (event, rect, mode) {
|
|||
itemLoop:
|
||||
for (let i = 0; i < allItems.length; i++) {
|
||||
const item = allItems[i];
|
||||
if (mode === 'detail' && isPGTextItem(getRootItem(item))) {
|
||||
if (mode === Modes.RESHAPE && isPGTextItem(getRootItem(item))) {
|
||||
continue itemLoop;
|
||||
}
|
||||
// check for item segment points inside selectionRect
|
||||
|
|
|
|||
|
|
@ -4,7 +4,8 @@ const Modes = keyMirror({
|
|||
BRUSH: null,
|
||||
ERASER: null,
|
||||
LINE: null,
|
||||
SELECT: null
|
||||
SELECT: null,
|
||||
RESHAPE: null
|
||||
});
|
||||
|
||||
export default Modes;
|
||||
|
|
|
|||
Loading…
Reference in a new issue