microboard-temp 0.5.143 → 0.5.145
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 +140 -349
- package/dist/cjs/index.js +140 -349
- package/dist/cjs/node.js +140 -349
- package/dist/esm/browser.js +140 -349
- package/dist/esm/index.js +140 -349
- package/dist/esm/node.js +140 -349
- package/dist/types/Items/Transformation/TransformationOperations.d.ts +7 -2
- package/dist/types/Selection/Selection.d.ts +4 -4
- package/dist/types/Selection/Transformer/TransformerHelpers/handleMultipleItemsResize.d.ts +2 -2
- package/dist/types/Selection/Transformer/TransformerHelpers/transformShape.d.ts +2 -2
- package/dist/types/drawMbrOnCanvas.d.ts +3 -3
- package/package.json +1 -1
package/dist/esm/node.js
CHANGED
|
@@ -7915,17 +7915,29 @@ class TransformationCommand {
|
|
|
7915
7915
|
switch (this.operation.method) {
|
|
7916
7916
|
case "applyMatrix": {
|
|
7917
7917
|
const op2 = this.operation;
|
|
7918
|
-
return
|
|
7919
|
-
|
|
7920
|
-
|
|
7921
|
-
|
|
7922
|
-
|
|
7923
|
-
|
|
7924
|
-
|
|
7925
|
-
|
|
7926
|
-
|
|
7927
|
-
|
|
7928
|
-
|
|
7918
|
+
return this.transformation.map((t3) => {
|
|
7919
|
+
const itemOp = op2.items.find((i) => i.id === t3.getId());
|
|
7920
|
+
if (!itemOp)
|
|
7921
|
+
return { item: t3, operation: op2 };
|
|
7922
|
+
return {
|
|
7923
|
+
item: t3,
|
|
7924
|
+
operation: {
|
|
7925
|
+
class: "Transformation",
|
|
7926
|
+
method: "applyMatrix",
|
|
7927
|
+
items: [{
|
|
7928
|
+
id: t3.getId(),
|
|
7929
|
+
matrix: {
|
|
7930
|
+
translateX: -itemOp.matrix.translateX,
|
|
7931
|
+
translateY: -itemOp.matrix.translateY,
|
|
7932
|
+
scaleX: 1 / itemOp.matrix.scaleX,
|
|
7933
|
+
scaleY: 1 / itemOp.matrix.scaleY,
|
|
7934
|
+
shearX: 0,
|
|
7935
|
+
shearY: 0
|
|
7936
|
+
}
|
|
7937
|
+
}]
|
|
7938
|
+
}
|
|
7939
|
+
};
|
|
7940
|
+
});
|
|
7929
7941
|
}
|
|
7930
7942
|
case "translateTo":
|
|
7931
7943
|
return mapItemsByOperation(this.transformation, (transformation) => {
|
|
@@ -8007,60 +8019,25 @@ class TransformationCommand {
|
|
|
8007
8019
|
const { operation, transformation } = this;
|
|
8008
8020
|
return transformation.map((currTrans) => {
|
|
8009
8021
|
const op2 = operation.items[currTrans.getId()];
|
|
8010
|
-
|
|
8011
|
-
|
|
8012
|
-
|
|
8013
|
-
|
|
8014
|
-
|
|
8015
|
-
|
|
8016
|
-
|
|
8017
|
-
|
|
8018
|
-
|
|
8019
|
-
|
|
8020
|
-
|
|
8021
|
-
|
|
8022
|
-
|
|
8023
|
-
|
|
8024
|
-
|
|
8025
|
-
|
|
8026
|
-
|
|
8027
|
-
|
|
8028
|
-
|
|
8029
|
-
y: -op2.translate.y
|
|
8030
|
-
}
|
|
8031
|
-
};
|
|
8032
|
-
} else if (op2.method === "translateTo") {
|
|
8033
|
-
reverseOp = {
|
|
8034
|
-
...op2,
|
|
8035
|
-
x: currTrans.getTranslation().x,
|
|
8036
|
-
y: currTrans.getTranslation().y
|
|
8037
|
-
};
|
|
8038
|
-
} else if (op2.method === "translateBy") {
|
|
8039
|
-
reverseOp = {
|
|
8040
|
-
...op2,
|
|
8041
|
-
x: -op2.x,
|
|
8042
|
-
y: -op2.y
|
|
8043
|
-
};
|
|
8044
|
-
} else if (op2.method === "scaleTo") {
|
|
8045
|
-
reverseOp = {
|
|
8046
|
-
...op2,
|
|
8047
|
-
x: currTrans.getScale().x,
|
|
8048
|
-
y: currTrans.getScale().y
|
|
8049
|
-
};
|
|
8050
|
-
} else if (op2.method === "scaleBy") {
|
|
8051
|
-
reverseOp = {
|
|
8052
|
-
...op2,
|
|
8053
|
-
x: 1 / op2.x,
|
|
8054
|
-
y: 1 / op2.y
|
|
8055
|
-
};
|
|
8056
|
-
} else {
|
|
8057
|
-
reverseOp = {
|
|
8058
|
-
...op2,
|
|
8059
|
-
x: 1,
|
|
8060
|
-
y: 1
|
|
8061
|
-
};
|
|
8062
|
-
}
|
|
8063
|
-
return { item: currTrans, operation: reverseOp };
|
|
8022
|
+
const m = op2.method === "applyMatrix" ? op2.matrix : op2.method === "scaleByTranslateBy" ? { translateX: -op2.translate.x, translateY: -op2.translate.y, scaleX: 1 / op2.scale.x, scaleY: 1 / op2.scale.y, shearX: 0, shearY: 0 } : { translateX: 0, translateY: 0, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 };
|
|
8023
|
+
return {
|
|
8024
|
+
item: currTrans,
|
|
8025
|
+
operation: {
|
|
8026
|
+
class: "Transformation",
|
|
8027
|
+
method: "applyMatrix",
|
|
8028
|
+
items: [{
|
|
8029
|
+
id: currTrans.getId(),
|
|
8030
|
+
matrix: {
|
|
8031
|
+
translateX: op2.method === "applyMatrix" ? -m.translateX : m.translateX,
|
|
8032
|
+
translateY: op2.method === "applyMatrix" ? -m.translateY : m.translateY,
|
|
8033
|
+
scaleX: op2.method === "applyMatrix" ? 1 / m.scaleX : m.scaleX,
|
|
8034
|
+
scaleY: op2.method === "applyMatrix" ? 1 / m.scaleY : m.scaleY,
|
|
8035
|
+
shearX: 0,
|
|
8036
|
+
shearY: 0
|
|
8037
|
+
}
|
|
8038
|
+
}]
|
|
8039
|
+
}
|
|
8040
|
+
};
|
|
8064
8041
|
});
|
|
8065
8042
|
}
|
|
8066
8043
|
case "locked": {
|
|
@@ -8191,10 +8168,14 @@ class Transformation {
|
|
|
8191
8168
|
apply(op) {
|
|
8192
8169
|
this.previous = this.matrix.copy();
|
|
8193
8170
|
switch (op.method) {
|
|
8194
|
-
case "applyMatrix":
|
|
8195
|
-
|
|
8196
|
-
|
|
8171
|
+
case "applyMatrix": {
|
|
8172
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
8173
|
+
if (itemOp) {
|
|
8174
|
+
this.matrix.scale(itemOp.matrix.scaleX, itemOp.matrix.scaleY);
|
|
8175
|
+
this.matrix.translate(itemOp.matrix.translateX, itemOp.matrix.translateY);
|
|
8176
|
+
}
|
|
8197
8177
|
break;
|
|
8178
|
+
}
|
|
8198
8179
|
case "translateTo":
|
|
8199
8180
|
this.applyTranslateTo(op.x, op.y);
|
|
8200
8181
|
break;
|
|
@@ -8329,8 +8310,7 @@ class Transformation {
|
|
|
8329
8310
|
this.emit({
|
|
8330
8311
|
class: "Transformation",
|
|
8331
8312
|
method: "applyMatrix",
|
|
8332
|
-
|
|
8333
|
-
matrix,
|
|
8313
|
+
items: [{ id: this.id, matrix }],
|
|
8334
8314
|
timeStamp
|
|
8335
8315
|
});
|
|
8336
8316
|
}
|
|
@@ -22075,7 +22055,7 @@ function createCommand(board, operation) {
|
|
|
22075
22055
|
}
|
|
22076
22056
|
default: {
|
|
22077
22057
|
const itemType = operation.class;
|
|
22078
|
-
const itemIdList = "item" in operation ? Array.isArray(operation.item) ? operation.item : [operation.item] : ("items" in operation) ? Object.keys(operation.items) : operation.itemsOps.map((itemOp) => itemOp.item);
|
|
22058
|
+
const itemIdList = "item" in operation ? Array.isArray(operation.item) ? operation.item : [operation.item] : ("items" in operation) ? Array.isArray(operation.items) ? operation.items.map((i) => i.id) : Object.keys(operation.items) : operation.itemsOps.map((itemOp) => itemOp.item);
|
|
22079
22059
|
const items = itemIdList.map((itemId) => board.items.findById(itemId) ?? itemId).filter((item) => {
|
|
22080
22060
|
if (typeof item === "string") {
|
|
22081
22061
|
console.warn(`Item with ID ${item} not found for operation ${operation.class}.${operation.method}`);
|
|
@@ -24250,7 +24230,8 @@ class RichText extends BaseItem {
|
|
|
24250
24230
|
this.transformation.subject.subscribe((tr, op) => {
|
|
24251
24231
|
this.prevMbr = this.getMbr();
|
|
24252
24232
|
if (op.method === "applyMatrix") {
|
|
24253
|
-
|
|
24233
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
24234
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
24254
24235
|
this.setAINodeShirkWidth();
|
|
24255
24236
|
if (!this.isInShape) {
|
|
24256
24237
|
this.transformCanvas();
|
|
@@ -24260,8 +24241,6 @@ class RichText extends BaseItem {
|
|
|
24260
24241
|
} else {
|
|
24261
24242
|
this.transformCanvas();
|
|
24262
24243
|
}
|
|
24263
|
-
} else if (op.method === "transformMany") {
|
|
24264
|
-
this.transformCanvas();
|
|
24265
24244
|
} else if (op.method === "deserialize") {
|
|
24266
24245
|
this.setAINodeShirkWidth();
|
|
24267
24246
|
this.updateElement();
|
|
@@ -38205,19 +38184,15 @@ class AINode extends BaseItem {
|
|
|
38205
38184
|
this.text = new RichText(this.board, new Mbr, this.id, this.transformation, this.linkTo, " ", false, false, "AINode");
|
|
38206
38185
|
this.transformation.subject.subscribe((_subject, op) => {
|
|
38207
38186
|
if (op.method === "applyMatrix") {
|
|
38208
|
-
|
|
38187
|
+
const itemOp = op.items.find((i) => i.id === this.getId());
|
|
38188
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
38209
38189
|
this.prevMbr = this.path?.getMbr();
|
|
38210
38190
|
this.text.handleInshapeScale();
|
|
38211
|
-
} else {
|
|
38212
|
-
this.text.transformCanvas();
|
|
38213
|
-
}
|
|
38214
|
-
} else if (op.method === "transformMany") {
|
|
38215
|
-
const currItemOp = op.items[this.getId()];
|
|
38216
|
-
this.prevMbr = this.path?.getMbr();
|
|
38217
|
-
if (currItemOp.method === "applyMatrix" && currItemOp.matrix.scaleX === 1 && currItemOp.matrix.scaleY === 1) {
|
|
38191
|
+
} else if (itemOp) {
|
|
38218
38192
|
this.text.transformCanvas();
|
|
38219
38193
|
} else {
|
|
38220
|
-
this.
|
|
38194
|
+
this.prevMbr = this.path?.getMbr();
|
|
38195
|
+
this.text.updateElement();
|
|
38221
38196
|
}
|
|
38222
38197
|
} else {
|
|
38223
38198
|
this.prevMbr = this.path?.getMbr();
|
|
@@ -39429,13 +39404,9 @@ class Connector2 extends BaseItem {
|
|
|
39429
39404
|
this.endPointer = getEndPointer(this.endPoint, this.endPointerStyle, this.lineStyle, this.lines, this.lineWidth * 0.1 + 0.3);
|
|
39430
39405
|
this.middlePoint = null;
|
|
39431
39406
|
this.transformation.subject.subscribe((_sub, op) => {
|
|
39432
|
-
if (op.method === "
|
|
39433
|
-
const
|
|
39434
|
-
if (
|
|
39435
|
-
if (operation.matrix.scaleX !== 1 || operation.matrix.scaleY !== 1) {
|
|
39436
|
-
this.scalePoints();
|
|
39437
|
-
}
|
|
39438
|
-
} else if (operation.method === "scaleByTranslateBy" && (operation.scale.x !== 1 || operation.scale.y !== 1)) {
|
|
39407
|
+
if (op.method === "applyMatrix") {
|
|
39408
|
+
const itemOp = op.items.find((i) => i.id === this.getId());
|
|
39409
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
39439
39410
|
this.scalePoints();
|
|
39440
39411
|
}
|
|
39441
39412
|
}
|
|
@@ -41726,8 +41697,13 @@ class Shape extends BaseItem {
|
|
|
41726
41697
|
this.transformation.subject.subscribe((_subject, op) => {
|
|
41727
41698
|
this.transformPath();
|
|
41728
41699
|
this.updateMbr();
|
|
41729
|
-
if (op.method === "applyMatrix"
|
|
41730
|
-
|
|
41700
|
+
if (op.method === "applyMatrix") {
|
|
41701
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
41702
|
+
if (itemOp && itemOp.matrix.scaleX === 1 && itemOp.matrix.scaleY === 1) {
|
|
41703
|
+
this.text.transformCanvas();
|
|
41704
|
+
} else {
|
|
41705
|
+
this.text.updateElement();
|
|
41706
|
+
}
|
|
41731
41707
|
} else {
|
|
41732
41708
|
this.text.updateElement();
|
|
41733
41709
|
}
|
|
@@ -42254,27 +42230,13 @@ class Sticker extends BaseItem {
|
|
|
42254
42230
|
this.transformation.subject.subscribe((_subject, op) => {
|
|
42255
42231
|
this.transformPath();
|
|
42256
42232
|
if (op.method === "applyMatrix") {
|
|
42257
|
-
|
|
42258
|
-
|
|
42259
|
-
if (op.matrix.scaleX !== op.matrix.scaleY) {
|
|
42260
|
-
this.text.applyAutoSizeScale(this.text.calcAutoSize());
|
|
42261
|
-
} else {
|
|
42262
|
-
this.text.scaleAutoSizeScale(op.matrix.scaleX);
|
|
42263
|
-
}
|
|
42264
|
-
this.text.recoordinate();
|
|
42265
|
-
this.text.transformCanvas();
|
|
42266
|
-
} else {
|
|
42267
|
-
this.text.handleInshapeScale();
|
|
42268
|
-
}
|
|
42269
|
-
}
|
|
42270
|
-
} else if (op.method === "transformMany") {
|
|
42271
|
-
const transformOp = op.items[this.id];
|
|
42272
|
-
if (transformOp.method === "applyMatrix" && (transformOp.matrix.scaleX !== 1 || transformOp.matrix.scaleY !== 1)) {
|
|
42233
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
42234
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
42273
42235
|
if (this.text.isAutosize()) {
|
|
42274
|
-
if (
|
|
42236
|
+
if (itemOp.matrix.scaleX !== itemOp.matrix.scaleY) {
|
|
42275
42237
|
this.text.applyAutoSizeScale(this.text.calcAutoSize());
|
|
42276
42238
|
} else {
|
|
42277
|
-
this.text.scaleAutoSizeScale(
|
|
42239
|
+
this.text.scaleAutoSizeScale(itemOp.matrix.scaleX);
|
|
42278
42240
|
}
|
|
42279
42241
|
this.text.recoordinate();
|
|
42280
42242
|
this.text.transformCanvas();
|
|
@@ -47454,7 +47416,7 @@ function createCanvasDrawer(board) {
|
|
|
47454
47416
|
context.setCamera(camera);
|
|
47455
47417
|
context.ctx.setTransform(board2.camera.getMatrix().scaleX, 0, 0, board2.camera.getMatrix().scaleY, 0, 0);
|
|
47456
47418
|
context.matrix.applyToContext(context.ctx);
|
|
47457
|
-
const items =
|
|
47419
|
+
const items = translation.map((i) => i.id).map((id) => {
|
|
47458
47420
|
const item = board2.items.getById(id);
|
|
47459
47421
|
if (item) {
|
|
47460
47422
|
if (item.itemType !== "Frame") {
|
|
@@ -47544,7 +47506,7 @@ function createCanvasDrawer(board) {
|
|
|
47544
47506
|
matrix = new Matrix2;
|
|
47545
47507
|
}
|
|
47546
47508
|
function updateCanvasAndKeys(sumMbr, translation, resizingMatrix, actualMbr) {
|
|
47547
|
-
const translationKeys =
|
|
47509
|
+
const translationKeys = translation.map((i) => i.id);
|
|
47548
47510
|
if (lastCreatedCanvas && lastTranslationKeys?.length === translationKeys.length && lastTranslationKeys?.every((key) => translationKeys.includes(key))) {
|
|
47549
47511
|
recoordinateCanvas(sumMbr);
|
|
47550
47512
|
if (resizingMatrix) {
|
|
@@ -47562,7 +47524,7 @@ function createCanvasDrawer(board) {
|
|
|
47562
47524
|
cnvs.style.pointerEvents = "none";
|
|
47563
47525
|
document.body.appendChild(cnvs);
|
|
47564
47526
|
lastCreatedCanvas = cnvs;
|
|
47565
|
-
lastTranslationKeys =
|
|
47527
|
+
lastTranslationKeys = translation.map((i) => i.id);
|
|
47566
47528
|
lastTranslationKeys.forEach((id) => {
|
|
47567
47529
|
const item = board.items.getById(id);
|
|
47568
47530
|
if (item) {
|
|
@@ -47575,7 +47537,7 @@ function createCanvasDrawer(board) {
|
|
|
47575
47537
|
}
|
|
47576
47538
|
}
|
|
47577
47539
|
function countSumMbr(translation) {
|
|
47578
|
-
return
|
|
47540
|
+
return translation.map((i) => i.id).reduce((mbr, id) => {
|
|
47579
47541
|
const item = board.items.getById(id);
|
|
47580
47542
|
if (item) {
|
|
47581
47543
|
if (!mbr) {
|
|
@@ -48512,14 +48474,7 @@ class AlignmentHelper {
|
|
|
48512
48474
|
this.board.selection.transformMany(translation, timeStamp);
|
|
48513
48475
|
} else {
|
|
48514
48476
|
const id = item.getId();
|
|
48515
|
-
|
|
48516
|
-
transformMap[id] = {
|
|
48517
|
-
class: "Transformation",
|
|
48518
|
-
item: [id],
|
|
48519
|
-
method: "applyMatrix",
|
|
48520
|
-
matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
48521
|
-
};
|
|
48522
|
-
this.board.selection.transformMany(transformMap, timeStamp);
|
|
48477
|
+
this.board.selection.transformMany([{ id, matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } }], timeStamp);
|
|
48523
48478
|
}
|
|
48524
48479
|
}
|
|
48525
48480
|
translateCanvas(x, y, timeStamp) {
|
|
@@ -48930,7 +48885,7 @@ class Select extends Tool {
|
|
|
48930
48885
|
return false;
|
|
48931
48886
|
}
|
|
48932
48887
|
const translation = selection.getManyItemsTranslation(x, y);
|
|
48933
|
-
const translationKeys =
|
|
48888
|
+
const translationKeys = translation.map((i) => i.id);
|
|
48934
48889
|
const commentsSet = new Set(this.board.items.getComments().map((comment2) => comment2.getId()));
|
|
48935
48890
|
if (translationKeys.filter((item) => !commentsSet.has(item)).length > 10) {
|
|
48936
48891
|
const selectedMbr = this.board.selection.getMbr()?.copy();
|
|
@@ -50368,7 +50323,7 @@ class Card extends BaseItem {
|
|
|
50368
50323
|
this.board.bringToFront(this);
|
|
50369
50324
|
}, 1000);
|
|
50370
50325
|
this.transformation.subject.subscribe((_, op) => {
|
|
50371
|
-
if (this.parent === "Board" && op.method === "applyMatrix" && op.matrix.scaleX === 1 && op.matrix.scaleY === 1) {
|
|
50326
|
+
if (this.parent === "Board" && op.method === "applyMatrix" && op.items.find((i) => i.id === this.id)?.matrix.scaleX === 1 && op.items.find((i) => i.id === this.id)?.matrix.scaleY === 1) {
|
|
50372
50327
|
this.throttledBringToFront();
|
|
50373
50328
|
}
|
|
50374
50329
|
this.updateMbr();
|
|
@@ -54123,7 +54078,7 @@ function handleMultipleItemsResize({
|
|
|
54123
54078
|
isShiftPressed
|
|
54124
54079
|
}) {
|
|
54125
54080
|
const { matrix } = resize;
|
|
54126
|
-
const
|
|
54081
|
+
const result = [];
|
|
54127
54082
|
const items = itemsToResize ? itemsToResize : board.selection.items.list();
|
|
54128
54083
|
board.items.getComments().forEach((comment2) => {
|
|
54129
54084
|
if (items.some((item) => item.getId() === comment2.getItemToFollow())) {
|
|
@@ -54142,25 +54097,25 @@ function handleMultipleItemsResize({
|
|
|
54142
54097
|
const deltaY = itemY - initMbr.top;
|
|
54143
54098
|
const translateY = deltaY * matrix.scaleY - deltaY + matrix.translateY;
|
|
54144
54099
|
if (item instanceof RichText) {
|
|
54145
|
-
|
|
54100
|
+
result.push(getRichTextTranslation({
|
|
54146
54101
|
item,
|
|
54147
54102
|
isWidth,
|
|
54148
54103
|
isHeight,
|
|
54149
54104
|
matrix,
|
|
54150
54105
|
translateX,
|
|
54151
54106
|
translateY
|
|
54152
|
-
});
|
|
54107
|
+
}));
|
|
54153
54108
|
} else if (item instanceof AINode) {
|
|
54154
|
-
|
|
54109
|
+
result.push(getAINodeTranslation({
|
|
54155
54110
|
item,
|
|
54156
54111
|
isWidth,
|
|
54157
54112
|
isHeight,
|
|
54158
54113
|
matrix,
|
|
54159
54114
|
translateX,
|
|
54160
54115
|
translateY
|
|
54161
|
-
});
|
|
54116
|
+
}));
|
|
54162
54117
|
} else {
|
|
54163
|
-
|
|
54118
|
+
result.push(getItemTranslation({
|
|
54164
54119
|
item,
|
|
54165
54120
|
isWidth,
|
|
54166
54121
|
isHeight,
|
|
@@ -54168,10 +54123,10 @@ function handleMultipleItemsResize({
|
|
|
54168
54123
|
translateX,
|
|
54169
54124
|
translateY,
|
|
54170
54125
|
isShiftPressed
|
|
54171
|
-
});
|
|
54126
|
+
}));
|
|
54172
54127
|
}
|
|
54173
54128
|
}
|
|
54174
|
-
return
|
|
54129
|
+
return result;
|
|
54175
54130
|
}
|
|
54176
54131
|
function getRichTextTranslation({
|
|
54177
54132
|
item,
|
|
@@ -54183,26 +54138,11 @@ function getRichTextTranslation({
|
|
|
54183
54138
|
}) {
|
|
54184
54139
|
if (isWidth) {
|
|
54185
54140
|
item.editor.setMaxWidth(item.getWidth() / item.transformation.getScale().x * matrix.scaleX);
|
|
54186
|
-
return {
|
|
54187
|
-
class: "Transformation",
|
|
54188
|
-
method: "applyMatrix",
|
|
54189
|
-
item: [item.getId()],
|
|
54190
|
-
matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54191
|
-
};
|
|
54141
|
+
return { id: item.getId(), matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54192
54142
|
} else if (isHeight) {
|
|
54193
|
-
return {
|
|
54194
|
-
class: "Transformation",
|
|
54195
|
-
method: "applyMatrix",
|
|
54196
|
-
item: [item.getId()],
|
|
54197
|
-
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
54198
|
-
};
|
|
54143
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } };
|
|
54199
54144
|
} else {
|
|
54200
|
-
return {
|
|
54201
|
-
class: "Transformation",
|
|
54202
|
-
method: "applyMatrix",
|
|
54203
|
-
item: [item.getId()],
|
|
54204
|
-
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54205
|
-
};
|
|
54145
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54206
54146
|
}
|
|
54207
54147
|
}
|
|
54208
54148
|
function getAINodeTranslation({
|
|
@@ -54215,26 +54155,11 @@ function getAINodeTranslation({
|
|
|
54215
54155
|
}) {
|
|
54216
54156
|
if (isWidth) {
|
|
54217
54157
|
item.text.editor.setMaxWidth(item.text.getWidth() / item.transformation.getScale().x * matrix.scaleX);
|
|
54218
|
-
return {
|
|
54219
|
-
class: "Transformation",
|
|
54220
|
-
method: "applyMatrix",
|
|
54221
|
-
item: [item.getId()],
|
|
54222
|
-
matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54223
|
-
};
|
|
54158
|
+
return { id: item.getId(), matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54224
54159
|
} else if (isHeight) {
|
|
54225
|
-
return {
|
|
54226
|
-
class: "Transformation",
|
|
54227
|
-
method: "applyMatrix",
|
|
54228
|
-
item: [item.getId()],
|
|
54229
|
-
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
54230
|
-
};
|
|
54160
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } };
|
|
54231
54161
|
} else {
|
|
54232
|
-
return {
|
|
54233
|
-
class: "Transformation",
|
|
54234
|
-
method: "applyMatrix",
|
|
54235
|
-
item: [item.getId()],
|
|
54236
|
-
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54237
|
-
};
|
|
54162
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54238
54163
|
}
|
|
54239
54164
|
}
|
|
54240
54165
|
function getItemTranslation({
|
|
@@ -54247,22 +54172,12 @@ function getItemTranslation({
|
|
|
54247
54172
|
isShiftPressed
|
|
54248
54173
|
}) {
|
|
54249
54174
|
if (item instanceof Sticker && (isWidth || isHeight)) {
|
|
54250
|
-
return {
|
|
54251
|
-
class: "Transformation",
|
|
54252
|
-
method: "applyMatrix",
|
|
54253
|
-
item: [item.getId()],
|
|
54254
|
-
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
54255
|
-
};
|
|
54175
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } };
|
|
54256
54176
|
} else {
|
|
54257
54177
|
if (item instanceof Frame2 && item.getCanChangeRatio() && isShiftPressed && item.getFrameType() !== "Custom") {
|
|
54258
54178
|
item.setFrameType("Custom");
|
|
54259
54179
|
}
|
|
54260
|
-
return {
|
|
54261
|
-
class: "Transformation",
|
|
54262
|
-
method: "applyMatrix",
|
|
54263
|
-
item: [item.getId()],
|
|
54264
|
-
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleY, shearX: 0, shearY: 0 }
|
|
54265
|
-
};
|
|
54180
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleY, shearX: 0, shearY: 0 } };
|
|
54266
54181
|
}
|
|
54267
54182
|
}
|
|
54268
54183
|
|
|
@@ -54599,7 +54514,7 @@ function transformItems({
|
|
|
54599
54514
|
isShiftPressed
|
|
54600
54515
|
});
|
|
54601
54516
|
selection.transformMany(translation, beginTimeStamp);
|
|
54602
|
-
if (
|
|
54517
|
+
if (translation.length > 10) {
|
|
54603
54518
|
canvasDrawer.updateCanvasAndKeys(resize.mbr, translation, resize.matrix);
|
|
54604
54519
|
debounceUpd.setFalse();
|
|
54605
54520
|
debounceUpd.setTimeoutUpdate(1000);
|
|
@@ -55627,53 +55542,41 @@ class BoardSelection {
|
|
|
55627
55542
|
this.shouldPublish = false;
|
|
55628
55543
|
this.emit({
|
|
55629
55544
|
class: "Transformation",
|
|
55630
|
-
method: "
|
|
55545
|
+
method: "applyMatrix",
|
|
55631
55546
|
items,
|
|
55632
55547
|
timeStamp
|
|
55633
55548
|
});
|
|
55634
55549
|
this.shouldPublish = true;
|
|
55635
55550
|
}
|
|
55636
55551
|
getManyItemsTranslation(x, y, unselectedItem) {
|
|
55637
|
-
const
|
|
55638
|
-
|
|
55639
|
-
|
|
55640
|
-
|
|
55641
|
-
|
|
55642
|
-
item: [itemId],
|
|
55643
|
-
matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
55644
|
-
};
|
|
55645
|
-
}
|
|
55646
|
-
function tryToAddFrameChildrenToTranslation(selectedItem) {
|
|
55552
|
+
const items = [];
|
|
55553
|
+
const addItem = (itemId) => {
|
|
55554
|
+
items.push({ id: itemId, matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } });
|
|
55555
|
+
};
|
|
55556
|
+
const tryToAddFrameChildren = (selectedItem) => {
|
|
55647
55557
|
if (!("index" in selectedItem) || !selectedItem.index) {
|
|
55648
55558
|
return;
|
|
55649
55559
|
}
|
|
55650
55560
|
for (const childId of selectedItem.getChildrenIds()) {
|
|
55651
|
-
|
|
55561
|
+
addItem(childId);
|
|
55652
55562
|
}
|
|
55653
|
-
}
|
|
55654
|
-
const
|
|
55563
|
+
};
|
|
55564
|
+
const addWithComments = (item) => {
|
|
55565
|
+
addItem(item.getId());
|
|
55566
|
+
tryToAddFrameChildren(item);
|
|
55655
55567
|
const followedComments = this.board.items.getComments().filter((comment2) => comment2.getItemToFollow() === item.getId());
|
|
55656
55568
|
for (const comment2 of followedComments) {
|
|
55657
|
-
|
|
55658
|
-
class: "Transformation",
|
|
55659
|
-
method: "applyMatrix",
|
|
55660
|
-
item: [comment2.getId()],
|
|
55661
|
-
matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
55662
|
-
};
|
|
55569
|
+
addItem(comment2.getId());
|
|
55663
55570
|
}
|
|
55664
55571
|
};
|
|
55665
55572
|
if (unselectedItem) {
|
|
55666
|
-
|
|
55667
|
-
|
|
55668
|
-
createTranslationWithComments(unselectedItem);
|
|
55669
|
-
return translation;
|
|
55573
|
+
addWithComments(unselectedItem);
|
|
55574
|
+
return items;
|
|
55670
55575
|
}
|
|
55671
55576
|
for (const selectedItem of this.board.selection.list()) {
|
|
55672
|
-
|
|
55673
|
-
tryToAddFrameChildrenToTranslation(selectedItem);
|
|
55674
|
-
createTranslationWithComments(selectedItem);
|
|
55577
|
+
addWithComments(selectedItem);
|
|
55675
55578
|
}
|
|
55676
|
-
return
|
|
55579
|
+
return items;
|
|
55677
55580
|
}
|
|
55678
55581
|
setStrokeStyle(borderStyle) {
|
|
55679
55582
|
const shapes = this.items.getIdsByItemTypes(["Shape"]);
|
|
@@ -57216,32 +57119,40 @@ function mergeOperations(opA, opB) {
|
|
|
57216
57119
|
return;
|
|
57217
57120
|
}
|
|
57218
57121
|
function mergeTransformationOperations(opA, opB) {
|
|
57219
|
-
if (
|
|
57122
|
+
if (opA.timeStamp && opB.timeStamp && opA.timeStamp !== opB.timeStamp) {
|
|
57220
57123
|
return;
|
|
57221
57124
|
}
|
|
57222
|
-
if (opA.
|
|
57125
|
+
if (opA.method === "applyMatrix" && opB.method === "applyMatrix") {
|
|
57126
|
+
if (opA.items.length !== opB.items.length)
|
|
57127
|
+
return;
|
|
57128
|
+
const idsA = new Set(opA.items.map((i) => i.id));
|
|
57129
|
+
if (!opB.items.every((b) => idsA.has(b.id)))
|
|
57130
|
+
return;
|
|
57131
|
+
return {
|
|
57132
|
+
class: "Transformation",
|
|
57133
|
+
method: "applyMatrix",
|
|
57134
|
+
items: opB.items.map((b) => {
|
|
57135
|
+
const a2 = opA.items.find((i) => i.id === b.id);
|
|
57136
|
+
return {
|
|
57137
|
+
id: b.id,
|
|
57138
|
+
matrix: {
|
|
57139
|
+
translateX: a2.matrix.translateX + b.matrix.translateX,
|
|
57140
|
+
translateY: a2.matrix.translateY + b.matrix.translateY,
|
|
57141
|
+
scaleX: a2.matrix.scaleX * b.matrix.scaleX,
|
|
57142
|
+
scaleY: a2.matrix.scaleY * b.matrix.scaleY,
|
|
57143
|
+
shearX: 0,
|
|
57144
|
+
shearY: 0
|
|
57145
|
+
}
|
|
57146
|
+
};
|
|
57147
|
+
}),
|
|
57148
|
+
timeStamp: opB.timeStamp
|
|
57149
|
+
};
|
|
57150
|
+
}
|
|
57151
|
+
if (!areItemsTheSame(opA, opB)) {
|
|
57223
57152
|
return;
|
|
57224
57153
|
}
|
|
57225
57154
|
const method = opA.method;
|
|
57226
57155
|
switch (method) {
|
|
57227
|
-
case "applyMatrix":
|
|
57228
|
-
if (opB.method !== method) {
|
|
57229
|
-
return;
|
|
57230
|
-
}
|
|
57231
|
-
return {
|
|
57232
|
-
class: "Transformation",
|
|
57233
|
-
method: "applyMatrix",
|
|
57234
|
-
item: opA.item,
|
|
57235
|
-
matrix: {
|
|
57236
|
-
translateX: opA.matrix.translateX + opB.matrix.translateX,
|
|
57237
|
-
translateY: opA.matrix.translateY + opB.matrix.translateY,
|
|
57238
|
-
scaleX: opA.matrix.scaleX * opB.matrix.scaleX,
|
|
57239
|
-
scaleY: opA.matrix.scaleY * opB.matrix.scaleY,
|
|
57240
|
-
shearX: 0,
|
|
57241
|
-
shearY: 0
|
|
57242
|
-
},
|
|
57243
|
-
timeStamp: opB.timeStamp
|
|
57244
|
-
};
|
|
57245
57156
|
case "translateBy":
|
|
57246
57157
|
if (opB.method !== method) {
|
|
57247
57158
|
return;
|
|
@@ -57295,130 +57206,10 @@ function mergeTransformationOperations(opA, opB) {
|
|
|
57295
57206
|
},
|
|
57296
57207
|
timeStamp: opB.timeStamp
|
|
57297
57208
|
};
|
|
57298
|
-
case "transformMany":
|
|
57299
|
-
const items = mergeItems(opA, opB);
|
|
57300
|
-
if (opB.method !== method) {
|
|
57301
|
-
return;
|
|
57302
|
-
}
|
|
57303
|
-
return {
|
|
57304
|
-
class: "Transformation",
|
|
57305
|
-
method: "transformMany",
|
|
57306
|
-
items,
|
|
57307
|
-
timeStamp: opB.timeStamp
|
|
57308
|
-
};
|
|
57309
57209
|
default:
|
|
57310
57210
|
return;
|
|
57311
57211
|
}
|
|
57312
57212
|
}
|
|
57313
|
-
function mergeItems(opA, opB) {
|
|
57314
|
-
if (opA.method === "transformMany" && opB.method === "transformMany") {
|
|
57315
|
-
const resolve2 = (currScale, currTranslate, opB2) => {
|
|
57316
|
-
switch (opB2.method) {
|
|
57317
|
-
case "scaleByTranslateBy":
|
|
57318
|
-
return {
|
|
57319
|
-
scale: {
|
|
57320
|
-
x: currScale ? currScale.x * opB2.scale.x : opB2.scale.x,
|
|
57321
|
-
y: currScale ? currScale.y * opB2.scale.y : opB2.scale.y
|
|
57322
|
-
},
|
|
57323
|
-
translate: {
|
|
57324
|
-
x: currTranslate ? currTranslate.x + opB2.translate.x : opB2.translate.x,
|
|
57325
|
-
y: currTranslate ? currTranslate.y + opB2.translate.y : opB2.translate.y
|
|
57326
|
-
}
|
|
57327
|
-
};
|
|
57328
|
-
case "scaleBy":
|
|
57329
|
-
return {
|
|
57330
|
-
scale: {
|
|
57331
|
-
x: currScale ? currScale.x * opB2.x : opB2.x,
|
|
57332
|
-
y: currScale ? currScale.y * opB2.y : opB2.y
|
|
57333
|
-
},
|
|
57334
|
-
translate: {
|
|
57335
|
-
x: currTranslate ? currTranslate.x : 0,
|
|
57336
|
-
y: currTranslate ? currTranslate.y : 0
|
|
57337
|
-
}
|
|
57338
|
-
};
|
|
57339
|
-
case "translateBy":
|
|
57340
|
-
return {
|
|
57341
|
-
scale: {
|
|
57342
|
-
x: currScale ? currScale.x : 1,
|
|
57343
|
-
y: currScale ? currScale.y : 1
|
|
57344
|
-
},
|
|
57345
|
-
translate: {
|
|
57346
|
-
x: currTranslate ? currTranslate.x + opB2.x : opB2.x,
|
|
57347
|
-
y: currTranslate ? currTranslate.y + opB2.y : opB2.y
|
|
57348
|
-
}
|
|
57349
|
-
};
|
|
57350
|
-
}
|
|
57351
|
-
return;
|
|
57352
|
-
};
|
|
57353
|
-
const items = {};
|
|
57354
|
-
Object.keys(opB.items).forEach((itemId) => {
|
|
57355
|
-
if (opA.items[itemId] !== undefined) {
|
|
57356
|
-
if (opA.items[itemId].method === "applyMatrix" && opB.items[itemId].method === "applyMatrix") {
|
|
57357
|
-
const a2 = opA.items[itemId].matrix;
|
|
57358
|
-
const b = opB.items[itemId].matrix;
|
|
57359
|
-
items[itemId] = {
|
|
57360
|
-
class: "Transformation",
|
|
57361
|
-
method: "applyMatrix",
|
|
57362
|
-
item: [itemId],
|
|
57363
|
-
matrix: {
|
|
57364
|
-
translateX: a2.translateX + b.translateX,
|
|
57365
|
-
translateY: a2.translateY + b.translateY,
|
|
57366
|
-
scaleX: a2.scaleX * b.scaleX,
|
|
57367
|
-
scaleY: a2.scaleY * b.scaleY,
|
|
57368
|
-
shearX: 0,
|
|
57369
|
-
shearY: 0
|
|
57370
|
-
}
|
|
57371
|
-
};
|
|
57372
|
-
} else if (opA.items[itemId].method === "scaleByTranslateBy") {
|
|
57373
|
-
const newTransformation = resolve2(opA.items[itemId].scale, opA.items[itemId].translate, opB.items[itemId]);
|
|
57374
|
-
if (!newTransformation) {
|
|
57375
|
-
items[itemId] = opB.items[itemId];
|
|
57376
|
-
} else {
|
|
57377
|
-
items[itemId] = {
|
|
57378
|
-
class: "Transformation",
|
|
57379
|
-
method: "scaleByTranslateBy",
|
|
57380
|
-
item: [itemId],
|
|
57381
|
-
scale: newTransformation.scale,
|
|
57382
|
-
translate: newTransformation.translate
|
|
57383
|
-
};
|
|
57384
|
-
}
|
|
57385
|
-
} else if (opA.items[itemId].method === "scaleBy") {
|
|
57386
|
-
const newTransformation = resolve2({ x: opA.items[itemId].x, y: opA.items[itemId].y }, undefined, opB.items[itemId]);
|
|
57387
|
-
if (!newTransformation) {
|
|
57388
|
-
items[itemId] = opB.items[itemId];
|
|
57389
|
-
} else {
|
|
57390
|
-
items[itemId] = {
|
|
57391
|
-
class: "Transformation",
|
|
57392
|
-
method: "scaleByTranslateBy",
|
|
57393
|
-
item: [itemId],
|
|
57394
|
-
scale: newTransformation.scale,
|
|
57395
|
-
translate: newTransformation.translate
|
|
57396
|
-
};
|
|
57397
|
-
}
|
|
57398
|
-
} else if (opA.items[itemId].method === "translateBy") {
|
|
57399
|
-
const newTransformation = resolve2(undefined, { x: opA.items[itemId].x, y: opA.items[itemId].y }, opB.items[itemId]);
|
|
57400
|
-
if (!newTransformation) {
|
|
57401
|
-
items[itemId] = opB.items[itemId];
|
|
57402
|
-
} else {
|
|
57403
|
-
items[itemId] = {
|
|
57404
|
-
class: "Transformation",
|
|
57405
|
-
method: "scaleByTranslateBy",
|
|
57406
|
-
item: [itemId],
|
|
57407
|
-
scale: newTransformation.scale,
|
|
57408
|
-
translate: newTransformation.translate
|
|
57409
|
-
};
|
|
57410
|
-
}
|
|
57411
|
-
} else {
|
|
57412
|
-
items[itemId] = opB.items[itemId];
|
|
57413
|
-
}
|
|
57414
|
-
} else {
|
|
57415
|
-
items[itemId] = opB.items[itemId];
|
|
57416
|
-
}
|
|
57417
|
-
});
|
|
57418
|
-
return items;
|
|
57419
|
-
}
|
|
57420
|
-
return;
|
|
57421
|
-
}
|
|
57422
57213
|
function mergeRichTextOperations(opA, opB) {
|
|
57423
57214
|
if (!areItemsTheSame(opA, opB)) {
|
|
57424
57215
|
return;
|