microboard-temp 0.5.137 → 0.5.138
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/browser.js +157 -84
- package/dist/cjs/index.js +157 -84
- package/dist/cjs/node.js +157 -84
- package/dist/esm/browser.js +157 -84
- package/dist/esm/index.js +157 -84
- package/dist/esm/node.js +157 -84
- package/dist/types/Items/Transformation/Transformation.d.ts +2 -1
- package/dist/types/Items/Transformation/TransformationOperations.d.ts +15 -2
- package/package.json +1 -1
package/dist/cjs/browser.js
CHANGED
|
@@ -7302,6 +7302,20 @@ class TransformationCommand {
|
|
|
7302
7302
|
getReverse() {
|
|
7303
7303
|
const op = this.operation;
|
|
7304
7304
|
switch (this.operation.method) {
|
|
7305
|
+
case "applyMatrix": {
|
|
7306
|
+
const op2 = this.operation;
|
|
7307
|
+
return mapItemsByOperation(this.transformation, () => ({
|
|
7308
|
+
...op2,
|
|
7309
|
+
matrix: {
|
|
7310
|
+
translateX: -op2.matrix.translateX,
|
|
7311
|
+
translateY: -op2.matrix.translateY,
|
|
7312
|
+
scaleX: 1 / op2.matrix.scaleX,
|
|
7313
|
+
scaleY: 1 / op2.matrix.scaleY,
|
|
7314
|
+
shearX: 0,
|
|
7315
|
+
shearY: 0
|
|
7316
|
+
}
|
|
7317
|
+
}));
|
|
7318
|
+
}
|
|
7305
7319
|
case "translateTo":
|
|
7306
7320
|
return mapItemsByOperation(this.transformation, (transformation) => {
|
|
7307
7321
|
return {
|
|
@@ -7383,7 +7397,19 @@ class TransformationCommand {
|
|
|
7383
7397
|
return transformation.map((currTrans) => {
|
|
7384
7398
|
const op2 = operation.items[currTrans.getId()];
|
|
7385
7399
|
let reverseOp;
|
|
7386
|
-
if (op2.method === "
|
|
7400
|
+
if (op2.method === "applyMatrix") {
|
|
7401
|
+
reverseOp = {
|
|
7402
|
+
...op2,
|
|
7403
|
+
matrix: {
|
|
7404
|
+
translateX: -op2.matrix.translateX,
|
|
7405
|
+
translateY: -op2.matrix.translateY,
|
|
7406
|
+
scaleX: 1 / op2.matrix.scaleX,
|
|
7407
|
+
scaleY: 1 / op2.matrix.scaleY,
|
|
7408
|
+
shearX: 0,
|
|
7409
|
+
shearY: 0
|
|
7410
|
+
}
|
|
7411
|
+
};
|
|
7412
|
+
} else if (op2.method === "scaleByTranslateBy") {
|
|
7387
7413
|
reverseOp = {
|
|
7388
7414
|
...op2,
|
|
7389
7415
|
scale: { x: 1 / op2.scale.x, y: 1 / op2.scale.y },
|
|
@@ -7554,6 +7580,10 @@ class Transformation {
|
|
|
7554
7580
|
apply(op) {
|
|
7555
7581
|
this.previous = this.matrix.copy();
|
|
7556
7582
|
switch (op.method) {
|
|
7583
|
+
case "applyMatrix":
|
|
7584
|
+
this.matrix.scale(op.matrix.scaleX, op.matrix.scaleY);
|
|
7585
|
+
this.matrix.translate(op.matrix.translateX, op.matrix.translateY);
|
|
7586
|
+
break;
|
|
7557
7587
|
case "translateTo":
|
|
7558
7588
|
this.applyTranslateTo(op.x, op.y);
|
|
7559
7589
|
break;
|
|
@@ -7614,7 +7644,10 @@ class Transformation {
|
|
|
7614
7644
|
this.matrix.translate(translate.x, translate.y);
|
|
7615
7645
|
}
|
|
7616
7646
|
applyTransformMany(op) {
|
|
7617
|
-
if (op.method === "
|
|
7647
|
+
if (op.method === "applyMatrix") {
|
|
7648
|
+
this.matrix.scale(op.matrix.scaleX, op.matrix.scaleY);
|
|
7649
|
+
this.matrix.translate(op.matrix.translateX, op.matrix.translateY);
|
|
7650
|
+
} else if (op.method === "scaleByTranslateBy") {
|
|
7618
7651
|
this.applyScaleByTranslateBy(op.scale, op.translate);
|
|
7619
7652
|
} else if (op.method === "scaleBy") {
|
|
7620
7653
|
this.applyScaleBy(op.x, op.y);
|
|
@@ -7681,66 +7714,75 @@ class Transformation {
|
|
|
7681
7714
|
getId() {
|
|
7682
7715
|
return this.id;
|
|
7683
7716
|
}
|
|
7684
|
-
|
|
7685
|
-
if (!this.id) {}
|
|
7717
|
+
emitMatrix(matrix, timeStamp) {
|
|
7686
7718
|
this.emit({
|
|
7687
7719
|
class: "Transformation",
|
|
7688
|
-
method: "
|
|
7720
|
+
method: "applyMatrix",
|
|
7689
7721
|
item: [this.id],
|
|
7690
|
-
|
|
7691
|
-
y,
|
|
7722
|
+
matrix,
|
|
7692
7723
|
timeStamp
|
|
7693
7724
|
});
|
|
7694
7725
|
}
|
|
7726
|
+
translateTo(x, y, timeStamp) {
|
|
7727
|
+
if (!this.id) {}
|
|
7728
|
+
this.emitMatrix({
|
|
7729
|
+
translateX: x - this.matrix.translateX,
|
|
7730
|
+
translateY: y - this.matrix.translateY,
|
|
7731
|
+
scaleX: 1,
|
|
7732
|
+
scaleY: 1,
|
|
7733
|
+
shearX: 0,
|
|
7734
|
+
shearY: 0
|
|
7735
|
+
}, timeStamp);
|
|
7736
|
+
}
|
|
7695
7737
|
translateBy(x, y, timeStamp) {
|
|
7696
7738
|
if (!this.id) {}
|
|
7697
7739
|
if (x === 0 && y === 0) {
|
|
7698
7740
|
return;
|
|
7699
7741
|
}
|
|
7700
|
-
this.
|
|
7701
|
-
|
|
7702
|
-
|
|
7703
|
-
|
|
7704
|
-
|
|
7705
|
-
|
|
7706
|
-
|
|
7707
|
-
});
|
|
7742
|
+
this.emitMatrix({
|
|
7743
|
+
translateX: x,
|
|
7744
|
+
translateY: y,
|
|
7745
|
+
scaleX: 1,
|
|
7746
|
+
scaleY: 1,
|
|
7747
|
+
shearX: 0,
|
|
7748
|
+
shearY: 0
|
|
7749
|
+
}, timeStamp);
|
|
7708
7750
|
}
|
|
7709
7751
|
scaleTo(x, y, timeStamp) {
|
|
7710
|
-
this.
|
|
7711
|
-
|
|
7712
|
-
|
|
7713
|
-
|
|
7714
|
-
|
|
7715
|
-
|
|
7716
|
-
|
|
7717
|
-
});
|
|
7752
|
+
this.emitMatrix({
|
|
7753
|
+
translateX: 0,
|
|
7754
|
+
translateY: 0,
|
|
7755
|
+
scaleX: x / this.matrix.scaleX,
|
|
7756
|
+
scaleY: y / this.matrix.scaleY,
|
|
7757
|
+
shearX: 0,
|
|
7758
|
+
shearY: 0
|
|
7759
|
+
}, timeStamp);
|
|
7718
7760
|
}
|
|
7719
7761
|
scaleBy(x, y, timeStamp) {
|
|
7720
7762
|
if (x === 0 && y === 0) {
|
|
7721
7763
|
return;
|
|
7722
7764
|
}
|
|
7723
|
-
this.
|
|
7724
|
-
|
|
7725
|
-
|
|
7726
|
-
|
|
7727
|
-
|
|
7728
|
-
|
|
7729
|
-
|
|
7730
|
-
});
|
|
7765
|
+
this.emitMatrix({
|
|
7766
|
+
translateX: 0,
|
|
7767
|
+
translateY: 0,
|
|
7768
|
+
scaleX: x,
|
|
7769
|
+
scaleY: y,
|
|
7770
|
+
shearX: 0,
|
|
7771
|
+
shearY: 0
|
|
7772
|
+
}, timeStamp);
|
|
7731
7773
|
}
|
|
7732
7774
|
scaleByTranslateBy(scale, translate, timeStamp) {
|
|
7733
7775
|
if (scale.x === 0 && scale.y === 0 && translate.x === 0 && translate.y === 0) {
|
|
7734
7776
|
return;
|
|
7735
7777
|
}
|
|
7736
|
-
this.
|
|
7737
|
-
|
|
7738
|
-
|
|
7739
|
-
|
|
7740
|
-
scale,
|
|
7741
|
-
|
|
7742
|
-
|
|
7743
|
-
});
|
|
7778
|
+
this.emitMatrix({
|
|
7779
|
+
translateX: translate.x,
|
|
7780
|
+
translateY: translate.y,
|
|
7781
|
+
scaleX: scale.x,
|
|
7782
|
+
scaleY: scale.y,
|
|
7783
|
+
shearX: 0,
|
|
7784
|
+
shearY: 0
|
|
7785
|
+
}, timeStamp);
|
|
7744
7786
|
}
|
|
7745
7787
|
rotateTo(degree, timeStamp) {
|
|
7746
7788
|
this.emit({
|
|
@@ -7760,27 +7802,28 @@ class Transformation {
|
|
|
7760
7802
|
timeStamp
|
|
7761
7803
|
});
|
|
7762
7804
|
}
|
|
7763
|
-
scaleToRelativeTo(x, y,
|
|
7764
|
-
this.
|
|
7765
|
-
|
|
7766
|
-
|
|
7767
|
-
|
|
7768
|
-
|
|
7769
|
-
|
|
7770
|
-
|
|
7771
|
-
|
|
7772
|
-
});
|
|
7805
|
+
scaleToRelativeTo(x, y, _point, timeStamp) {
|
|
7806
|
+
this.emitMatrix({
|
|
7807
|
+
translateX: 0,
|
|
7808
|
+
translateY: 0,
|
|
7809
|
+
scaleX: x / this.matrix.scaleX,
|
|
7810
|
+
scaleY: y / this.matrix.scaleY,
|
|
7811
|
+
shearX: 0,
|
|
7812
|
+
shearY: 0
|
|
7813
|
+
}, timeStamp);
|
|
7773
7814
|
}
|
|
7774
7815
|
scaleByRelativeTo(x, y, point, timeStamp) {
|
|
7775
|
-
this.
|
|
7776
|
-
|
|
7777
|
-
|
|
7778
|
-
|
|
7779
|
-
x,
|
|
7780
|
-
y,
|
|
7781
|
-
|
|
7782
|
-
|
|
7783
|
-
|
|
7816
|
+
const { scaleX: sx0, scaleY: sy0, translateX: tx0, translateY: ty0 } = this.matrix;
|
|
7817
|
+
const newSx = sx0 * x;
|
|
7818
|
+
const newSy = sy0 * y;
|
|
7819
|
+
this.emitMatrix({
|
|
7820
|
+
translateX: -point.x * newSx + point.x - tx0,
|
|
7821
|
+
translateY: -point.y * newSy + point.y - ty0,
|
|
7822
|
+
scaleX: x,
|
|
7823
|
+
scaleY: y,
|
|
7824
|
+
shearX: 0,
|
|
7825
|
+
shearY: 0
|
|
7826
|
+
}, timeStamp);
|
|
7784
7827
|
}
|
|
7785
7828
|
setIsLocked(isLocked, timestamp) {
|
|
7786
7829
|
if (isLocked) {
|
|
@@ -37079,7 +37122,11 @@ class Connector2 extends BaseItem {
|
|
|
37079
37122
|
this.transformation.subject.subscribe((_sub, op) => {
|
|
37080
37123
|
if (op.method === "transformMany") {
|
|
37081
37124
|
const operation = op.items[this.getId()];
|
|
37082
|
-
if (operation.method === "
|
|
37125
|
+
if (operation.method === "applyMatrix") {
|
|
37126
|
+
if (operation.matrix.scaleX !== 1 || operation.matrix.scaleY !== 1) {
|
|
37127
|
+
this.scalePoints();
|
|
37128
|
+
}
|
|
37129
|
+
} else if (operation.method === "scaleByTranslateBy" && (operation.scale.x !== 1 || operation.scale.y !== 1)) {
|
|
37083
37130
|
this.scalePoints();
|
|
37084
37131
|
}
|
|
37085
37132
|
}
|
|
@@ -51823,26 +51870,23 @@ function getRichTextTranslation({
|
|
|
51823
51870
|
item.editor.setMaxWidth(item.getWidth() / item.transformation.getScale().x * matrix.scaleX);
|
|
51824
51871
|
return {
|
|
51825
51872
|
class: "Transformation",
|
|
51826
|
-
method: "
|
|
51873
|
+
method: "applyMatrix",
|
|
51827
51874
|
item: [item.getId()],
|
|
51828
|
-
|
|
51829
|
-
scale: { x: matrix.scaleX, y: matrix.scaleX }
|
|
51875
|
+
matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
51830
51876
|
};
|
|
51831
51877
|
} else if (isHeight) {
|
|
51832
51878
|
return {
|
|
51833
51879
|
class: "Transformation",
|
|
51834
|
-
method: "
|
|
51880
|
+
method: "applyMatrix",
|
|
51835
51881
|
item: [item.getId()],
|
|
51836
|
-
|
|
51837
|
-
scale: { x: 1, y: 1 }
|
|
51882
|
+
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
51838
51883
|
};
|
|
51839
51884
|
} else {
|
|
51840
51885
|
return {
|
|
51841
51886
|
class: "Transformation",
|
|
51842
|
-
method: "
|
|
51887
|
+
method: "applyMatrix",
|
|
51843
51888
|
item: [item.getId()],
|
|
51844
|
-
|
|
51845
|
-
scale: { x: matrix.scaleX, y: matrix.scaleX }
|
|
51889
|
+
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
51846
51890
|
};
|
|
51847
51891
|
}
|
|
51848
51892
|
}
|
|
@@ -51858,26 +51902,23 @@ function getAINodeTranslation({
|
|
|
51858
51902
|
item.text.editor.setMaxWidth(item.text.getWidth() / item.transformation.getScale().x * matrix.scaleX);
|
|
51859
51903
|
return {
|
|
51860
51904
|
class: "Transformation",
|
|
51861
|
-
method: "
|
|
51905
|
+
method: "applyMatrix",
|
|
51862
51906
|
item: [item.getId()],
|
|
51863
|
-
|
|
51864
|
-
scale: { x: matrix.scaleX, y: matrix.scaleX }
|
|
51907
|
+
matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
51865
51908
|
};
|
|
51866
51909
|
} else if (isHeight) {
|
|
51867
51910
|
return {
|
|
51868
51911
|
class: "Transformation",
|
|
51869
|
-
method: "
|
|
51912
|
+
method: "applyMatrix",
|
|
51870
51913
|
item: [item.getId()],
|
|
51871
|
-
|
|
51872
|
-
scale: { x: 1, y: 1 }
|
|
51914
|
+
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
51873
51915
|
};
|
|
51874
51916
|
} else {
|
|
51875
51917
|
return {
|
|
51876
51918
|
class: "Transformation",
|
|
51877
|
-
method: "
|
|
51919
|
+
method: "applyMatrix",
|
|
51878
51920
|
item: [item.getId()],
|
|
51879
|
-
|
|
51880
|
-
scale: { x: matrix.scaleX, y: matrix.scaleX }
|
|
51921
|
+
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
51881
51922
|
};
|
|
51882
51923
|
}
|
|
51883
51924
|
}
|
|
@@ -51893,10 +51934,9 @@ function getItemTranslation({
|
|
|
51893
51934
|
if (item instanceof Sticker && (isWidth || isHeight)) {
|
|
51894
51935
|
return {
|
|
51895
51936
|
class: "Transformation",
|
|
51896
|
-
method: "
|
|
51937
|
+
method: "applyMatrix",
|
|
51897
51938
|
item: [item.getId()],
|
|
51898
|
-
|
|
51899
|
-
scale: { x: 1, y: 1 }
|
|
51939
|
+
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
51900
51940
|
};
|
|
51901
51941
|
} else {
|
|
51902
51942
|
if (item instanceof Frame2 && item.getCanChangeRatio() && isShiftPressed && item.getFrameType() !== "Custom") {
|
|
@@ -51904,10 +51944,9 @@ function getItemTranslation({
|
|
|
51904
51944
|
}
|
|
51905
51945
|
return {
|
|
51906
51946
|
class: "Transformation",
|
|
51907
|
-
method: "
|
|
51947
|
+
method: "applyMatrix",
|
|
51908
51948
|
item: [item.getId()],
|
|
51909
|
-
|
|
51910
|
-
scale: { x: matrix.scaleX, y: matrix.scaleY }
|
|
51949
|
+
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleY, shearX: 0, shearY: 0 }
|
|
51911
51950
|
};
|
|
51912
51951
|
}
|
|
51913
51952
|
}
|
|
@@ -54872,6 +54911,24 @@ function mergeTransformationOperations(opA, opB) {
|
|
|
54872
54911
|
}
|
|
54873
54912
|
const method = opA.method;
|
|
54874
54913
|
switch (method) {
|
|
54914
|
+
case "applyMatrix":
|
|
54915
|
+
if (opB.method !== method) {
|
|
54916
|
+
return;
|
|
54917
|
+
}
|
|
54918
|
+
return {
|
|
54919
|
+
class: "Transformation",
|
|
54920
|
+
method: "applyMatrix",
|
|
54921
|
+
item: opA.item,
|
|
54922
|
+
matrix: {
|
|
54923
|
+
translateX: opA.matrix.translateX + opB.matrix.translateX,
|
|
54924
|
+
translateY: opA.matrix.translateY + opB.matrix.translateY,
|
|
54925
|
+
scaleX: opA.matrix.scaleX * opB.matrix.scaleX,
|
|
54926
|
+
scaleY: opA.matrix.scaleY * opB.matrix.scaleY,
|
|
54927
|
+
shearX: 0,
|
|
54928
|
+
shearY: 0
|
|
54929
|
+
},
|
|
54930
|
+
timeStamp: opB.timeStamp
|
|
54931
|
+
};
|
|
54875
54932
|
case "translateBy":
|
|
54876
54933
|
if (opB.method !== method) {
|
|
54877
54934
|
return;
|
|
@@ -54983,7 +55040,23 @@ function mergeItems(opA, opB) {
|
|
|
54983
55040
|
const items = {};
|
|
54984
55041
|
Object.keys(opB.items).forEach((itemId) => {
|
|
54985
55042
|
if (opA.items[itemId] !== undefined) {
|
|
54986
|
-
if (opA.items[itemId].method === "
|
|
55043
|
+
if (opA.items[itemId].method === "applyMatrix" && opB.items[itemId].method === "applyMatrix") {
|
|
55044
|
+
const a2 = opA.items[itemId].matrix;
|
|
55045
|
+
const b = opB.items[itemId].matrix;
|
|
55046
|
+
items[itemId] = {
|
|
55047
|
+
class: "Transformation",
|
|
55048
|
+
method: "applyMatrix",
|
|
55049
|
+
item: [itemId],
|
|
55050
|
+
matrix: {
|
|
55051
|
+
translateX: a2.translateX + b.translateX,
|
|
55052
|
+
translateY: a2.translateY + b.translateY,
|
|
55053
|
+
scaleX: a2.scaleX * b.scaleX,
|
|
55054
|
+
scaleY: a2.scaleY * b.scaleY,
|
|
55055
|
+
shearX: 0,
|
|
55056
|
+
shearY: 0
|
|
55057
|
+
}
|
|
55058
|
+
};
|
|
55059
|
+
} else if (opA.items[itemId].method === "scaleByTranslateBy") {
|
|
54987
55060
|
const newTransformation = resolve2(opA.items[itemId].scale, opA.items[itemId].translate, opB.items[itemId]);
|
|
54988
55061
|
items[itemId] = {
|
|
54989
55062
|
class: "Transformation",
|