mirror of
https://github.com/scratchfoundation/scratch-paint.git
synced 2025-01-10 14:42:13 -05:00
Make the guide stay in the shape of the text when text is rotated
This commit is contained in:
parent
f0b570dc51
commit
240282f9d2
3 changed files with 17 additions and 18 deletions
|
@ -82,17 +82,17 @@ const sortItemsByZIndex = function (a, b) {
|
|||
return null;
|
||||
};
|
||||
|
||||
// Expand the size of the path by approx one pixel all around
|
||||
const expandByOne = function (path) {
|
||||
// Expand the size of the path by amount all around
|
||||
const expandBy = function (path, amount) {
|
||||
const center = path.position;
|
||||
let pathArea = path.area;
|
||||
for (const seg of path.segments) {
|
||||
const halfNorm = seg.point.subtract(center)
|
||||
const halfDelta = seg.point.subtract(center)
|
||||
.normalize()
|
||||
.divide(2);
|
||||
seg.point = seg.point.add(halfNorm);
|
||||
.multiply(amount);
|
||||
seg.point = seg.point.add(halfDelta);
|
||||
// If that made the path area smaller, go the other way.
|
||||
if (path.area < pathArea) seg.point = seg.point.subtract(halfNorm.multiply(2));
|
||||
if (path.area < pathArea) seg.point = seg.point.subtract(halfDelta.multiply(2));
|
||||
pathArea = path.area;
|
||||
}
|
||||
};
|
||||
|
@ -112,7 +112,7 @@ export {
|
|||
HANDLE_RATIO,
|
||||
checkPointsClose,
|
||||
ensureClockwise,
|
||||
expandByOne,
|
||||
expandBy,
|
||||
getRandomInt,
|
||||
getRandomBoolean,
|
||||
snapDeltaToAngle,
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import paper from '@scratch/paper';
|
||||
import {getHoveredItem} from '../hover';
|
||||
import {expandByOne} from '../math';
|
||||
import {expandBy} from '../math';
|
||||
|
||||
class FillTool extends paper.Tool {
|
||||
static get TOLERANCE () {
|
||||
|
@ -104,7 +104,7 @@ class FillTool extends paper.Tool {
|
|||
this.addedFillItem.data.origItem = hitItem;
|
||||
// This usually fixes it so there isn't a teeny tiny gap in between the fill and the outline
|
||||
// when filling in a hole
|
||||
expandByOne(this.addedFillItem);
|
||||
expandBy(this.addedFillItem, .5);
|
||||
this.addedFillItem.insertAbove(hitItem.parent);
|
||||
} else if (this.fillItem.parent instanceof paper.CompoundPath) {
|
||||
this.fillItemOrigColor = hitItem.parent.fillColor;
|
||||
|
|
|
@ -4,8 +4,8 @@ import {styleShape} from '../style-path';
|
|||
import {clearSelection} from '../selection';
|
||||
import BoundingBoxTool from '../selection-tools/bounding-box-tool';
|
||||
import NudgeTool from '../selection-tools/nudge-tool';
|
||||
import {getGuideLayer} from '../layer';
|
||||
import {getGuideColor} from '../guides';
|
||||
import {hoverBounds} from '../guides';
|
||||
import {expandBy} from '../math';
|
||||
|
||||
/**
|
||||
* Tool for adding text. Text elements have limited editability; they can't be reshaped,
|
||||
|
@ -148,7 +148,6 @@ class TextTool extends paper.Tool {
|
|||
} else if (this.mode === TextTool.TEXT_EDIT_MODE) {
|
||||
// In text mode clicking away to begin select mode
|
||||
this.mode = TextTool.SELECT_MODE;
|
||||
// this.guide.reomve();
|
||||
this.textBox.selected = true;
|
||||
this.setSelectedItems();
|
||||
} else {
|
||||
|
@ -166,11 +165,9 @@ class TextTool extends paper.Tool {
|
|||
}
|
||||
|
||||
if (this.mode === TextTool.TEXT_EDIT_MODE) {
|
||||
this.guide = new paper.Shape.Rectangle(this.textBox.bounds.expand(TextTool.TEXT_PADDING));
|
||||
this.guide.strokeColor = getGuideColor();
|
||||
this.guide = hoverBounds(this.textBox);
|
||||
expandBy(this.guide, TextTool.TEXT_PADDING);
|
||||
this.guide.dashArray = [4, 4];
|
||||
this.guide.strokeWidth = 2;
|
||||
this.guide.parent = getGuideLayer();
|
||||
} else if (this.guide) {
|
||||
this.guide.remove();
|
||||
this.guide = null;
|
||||
|
@ -213,8 +210,10 @@ class TextTool extends paper.Tool {
|
|||
} else if (!(event.modifiers.alt || event.modifiers.comand || event.modifiers.control ||
|
||||
event.modifiers.meta || event.modifiers.option)) {
|
||||
this.textBox.content = this.textBox.content + event.character;
|
||||
this.guide.size = this.textBox.bounds.expand(TextTool.TEXT_PADDING);
|
||||
this.guide.position = this.textBox.position;
|
||||
if (this.guide) this.guide.remove();
|
||||
this.guide = hoverBounds(this.textBox);
|
||||
expandBy(this.guide, TextTool.TEXT_PADDING);
|
||||
this.guide.dashArray = [4, 4];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue