aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections/collectionFreeForm/FormatShapePane.tsx
diff options
context:
space:
mode:
authorMelissa Zhang <mzhang19096@gmail.com>2020-08-03 15:15:33 -0700
committerMelissa Zhang <mzhang19096@gmail.com>2020-08-03 15:15:33 -0700
commite9737412cb3d60ed76c31c9571e9516518cddd77 (patch)
tree407f4a4cbc4947d4057d317dc3a8b7369197c01d /src/client/views/collections/collectionFreeForm/FormatShapePane.tsx
parent1713f5415294b996e6dbbe9ca45f0f4511c69824 (diff)
parentef5dbc6ad8bdb70f3e68d2fc4ace1a483b031add (diff)
merge with master
Diffstat (limited to 'src/client/views/collections/collectionFreeForm/FormatShapePane.tsx')
-rw-r--r--src/client/views/collections/collectionFreeForm/FormatShapePane.tsx27
1 files changed, 13 insertions, 14 deletions
diff --git a/src/client/views/collections/collectionFreeForm/FormatShapePane.tsx b/src/client/views/collections/collectionFreeForm/FormatShapePane.tsx
index ddc282e57..6263be261 100644
--- a/src/client/views/collections/collectionFreeForm/FormatShapePane.tsx
+++ b/src/client/views/collections/collectionFreeForm/FormatShapePane.tsx
@@ -13,7 +13,6 @@ import AntimodeMenu from "../../AntimodeMenu";
import "./FormatShapePane.scss";
import { undoBatch } from "../../../util/UndoManager";
import { ColorState, SketchPicker } from 'react-color';
-import { DocumentView } from "../../../views/nodes/DocumentView"
@observer
export default class FormatShapePane extends AntimodeMenu {
@@ -124,12 +123,12 @@ export default class FormatShapePane extends AntimodeMenu {
console.log(ink);
if (ink) {
const newPoints: { X: number, Y: number }[] = [];
- for (var j = 0; j < ink.length; j++) {
+ ink.forEach(i => {
// (new x — oldx) + (oldxpoint * newWidt)/oldWidth
- const newX = (doc.x - oldX) + (ink[j].X * doc._width) / oldWidth;
- const newY = (doc.y - oldY) + (ink[j].Y * doc._height) / oldHeight;
+ const newX = ((doc.x || 0) - oldX) + (i.X * (doc._width || 0)) / oldWidth;
+ const newY = ((doc.y || 0) - oldY) + (i.Y * (doc._height || 0)) / oldHeight;
newPoints.push({ X: newX, Y: newY });
- }
+ });
doc.data = new InkField(newPoints);
}
}
@@ -148,12 +147,12 @@ export default class FormatShapePane extends AntimodeMenu {
console.log(ink);
if (ink) {
const newPoints: { X: number, Y: number }[] = [];
- for (var j = 0; j < ink.length; j++) {
+ ink.forEach(i => {
// (new x — oldx) + (oldxpoint * newWidt)/oldWidth
- const newX = (doc.x - oldX) + (ink[j].X * doc._width) / oldWidth;
- const newY = (doc.y - oldY) + (ink[j].Y * doc._height) / oldHeight;
+ const newX = ((doc.x || 0) - oldX) + (i.X * (doc._width || 0)) / oldWidth;
+ const newY = ((doc.y || 0) - oldY) + (i.Y * (doc._height || 0)) / oldHeight;
newPoints.push({ X: newX, Y: newY });
- }
+ });
doc.data = new InkField(newPoints);
}
}
@@ -191,11 +190,11 @@ export default class FormatShapePane extends AntimodeMenu {
if (ink) {
const newPoints: { X: number, Y: number }[] = [];
- for (var i = 0; i < ink.length; i++) {
- const newX = Math.cos(angle) * (ink[i].X - _centerPoints[index].X) - Math.sin(angle) * (ink[i].Y - _centerPoints[index].Y) + _centerPoints[index].X;
- const newY = Math.sin(angle) * (ink[i].X - _centerPoints[index].X) + Math.cos(angle) * (ink[i].Y - _centerPoints[index].Y) + _centerPoints[index].Y;
+ ink.forEach(i => {
+ const newX = Math.cos(angle) * (i.X - _centerPoints[index].X) - Math.sin(angle) * (i.Y - _centerPoints[index].Y) + _centerPoints[index].X;
+ const newY = Math.sin(angle) * (i.X - _centerPoints[index].X) + Math.cos(angle) * (i.Y - _centerPoints[index].Y) + _centerPoints[index].Y;
newPoints.push({ X: newX, Y: newY });
- }
+ });
doc.data = new InkField(newPoints);
const xs = newPoints.map(p => p.X);
const ys = newPoints.map(p => p.Y);
@@ -395,12 +394,12 @@ export default class FormatShapePane extends AntimodeMenu {
@computed get widInput() { return this.inputBox("wid", this.shapeWid, (val: string) => this.shapeWid = val); }
@computed get rotInput() { return this.inputBoxDuo("rot", this.shapeRot, (val: string) => { this.rotate(Number(val) - Number(this.shapeRot)); this.shapeRot = val; return true; }, "∠:", "rot", this.shapeRot, (val: string) => this.shapeRot = val, ""); }
- @computed get XpsInput() { return this.inputBoxDuo("Xps", this.shapeXps, (val: string) => this.shapeXps = val, "X:", "Yps", this.shapeYps, (val: string) => this.shapeYps = val, "Y:"); }
@computed get YpsInput() { return this.inputBox("Yps", this.shapeYps, (val: string) => this.shapeYps = val); }
@computed get controlPoints() { return this.controlPointsButton(); }
@computed get lockRatio() { return this.lockRatioButton(); }
@computed get rotate90() { return this.rotate90Button(); }
+ @computed get XpsInput() { return this.inputBoxDuo("Xps", this.shapeXps, (val: string) => this.shapeXps = val, "X:", "Yps", this.shapeYps, (val: string) => this.shapeYps = val, "Y:"); }
@computed get propertyGroupItems() {