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/cjs/node.js
CHANGED
|
@@ -8341,17 +8341,29 @@ class TransformationCommand {
|
|
|
8341
8341
|
switch (this.operation.method) {
|
|
8342
8342
|
case "applyMatrix": {
|
|
8343
8343
|
const op2 = this.operation;
|
|
8344
|
-
return
|
|
8345
|
-
|
|
8346
|
-
|
|
8347
|
-
|
|
8348
|
-
|
|
8349
|
-
|
|
8350
|
-
|
|
8351
|
-
|
|
8352
|
-
|
|
8353
|
-
|
|
8354
|
-
|
|
8344
|
+
return this.transformation.map((t3) => {
|
|
8345
|
+
const itemOp = op2.items.find((i) => i.id === t3.getId());
|
|
8346
|
+
if (!itemOp)
|
|
8347
|
+
return { item: t3, operation: op2 };
|
|
8348
|
+
return {
|
|
8349
|
+
item: t3,
|
|
8350
|
+
operation: {
|
|
8351
|
+
class: "Transformation",
|
|
8352
|
+
method: "applyMatrix",
|
|
8353
|
+
items: [{
|
|
8354
|
+
id: t3.getId(),
|
|
8355
|
+
matrix: {
|
|
8356
|
+
translateX: -itemOp.matrix.translateX,
|
|
8357
|
+
translateY: -itemOp.matrix.translateY,
|
|
8358
|
+
scaleX: 1 / itemOp.matrix.scaleX,
|
|
8359
|
+
scaleY: 1 / itemOp.matrix.scaleY,
|
|
8360
|
+
shearX: 0,
|
|
8361
|
+
shearY: 0
|
|
8362
|
+
}
|
|
8363
|
+
}]
|
|
8364
|
+
}
|
|
8365
|
+
};
|
|
8366
|
+
});
|
|
8355
8367
|
}
|
|
8356
8368
|
case "translateTo":
|
|
8357
8369
|
return mapItemsByOperation(this.transformation, (transformation) => {
|
|
@@ -8433,60 +8445,25 @@ class TransformationCommand {
|
|
|
8433
8445
|
const { operation, transformation } = this;
|
|
8434
8446
|
return transformation.map((currTrans) => {
|
|
8435
8447
|
const op2 = operation.items[currTrans.getId()];
|
|
8436
|
-
|
|
8437
|
-
|
|
8438
|
-
|
|
8439
|
-
|
|
8440
|
-
|
|
8441
|
-
|
|
8442
|
-
|
|
8443
|
-
|
|
8444
|
-
|
|
8445
|
-
|
|
8446
|
-
|
|
8447
|
-
|
|
8448
|
-
|
|
8449
|
-
|
|
8450
|
-
|
|
8451
|
-
|
|
8452
|
-
|
|
8453
|
-
|
|
8454
|
-
|
|
8455
|
-
y: -op2.translate.y
|
|
8456
|
-
}
|
|
8457
|
-
};
|
|
8458
|
-
} else if (op2.method === "translateTo") {
|
|
8459
|
-
reverseOp = {
|
|
8460
|
-
...op2,
|
|
8461
|
-
x: currTrans.getTranslation().x,
|
|
8462
|
-
y: currTrans.getTranslation().y
|
|
8463
|
-
};
|
|
8464
|
-
} else if (op2.method === "translateBy") {
|
|
8465
|
-
reverseOp = {
|
|
8466
|
-
...op2,
|
|
8467
|
-
x: -op2.x,
|
|
8468
|
-
y: -op2.y
|
|
8469
|
-
};
|
|
8470
|
-
} else if (op2.method === "scaleTo") {
|
|
8471
|
-
reverseOp = {
|
|
8472
|
-
...op2,
|
|
8473
|
-
x: currTrans.getScale().x,
|
|
8474
|
-
y: currTrans.getScale().y
|
|
8475
|
-
};
|
|
8476
|
-
} else if (op2.method === "scaleBy") {
|
|
8477
|
-
reverseOp = {
|
|
8478
|
-
...op2,
|
|
8479
|
-
x: 1 / op2.x,
|
|
8480
|
-
y: 1 / op2.y
|
|
8481
|
-
};
|
|
8482
|
-
} else {
|
|
8483
|
-
reverseOp = {
|
|
8484
|
-
...op2,
|
|
8485
|
-
x: 1,
|
|
8486
|
-
y: 1
|
|
8487
|
-
};
|
|
8488
|
-
}
|
|
8489
|
-
return { item: currTrans, operation: reverseOp };
|
|
8448
|
+
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 };
|
|
8449
|
+
return {
|
|
8450
|
+
item: currTrans,
|
|
8451
|
+
operation: {
|
|
8452
|
+
class: "Transformation",
|
|
8453
|
+
method: "applyMatrix",
|
|
8454
|
+
items: [{
|
|
8455
|
+
id: currTrans.getId(),
|
|
8456
|
+
matrix: {
|
|
8457
|
+
translateX: op2.method === "applyMatrix" ? -m.translateX : m.translateX,
|
|
8458
|
+
translateY: op2.method === "applyMatrix" ? -m.translateY : m.translateY,
|
|
8459
|
+
scaleX: op2.method === "applyMatrix" ? 1 / m.scaleX : m.scaleX,
|
|
8460
|
+
scaleY: op2.method === "applyMatrix" ? 1 / m.scaleY : m.scaleY,
|
|
8461
|
+
shearX: 0,
|
|
8462
|
+
shearY: 0
|
|
8463
|
+
}
|
|
8464
|
+
}]
|
|
8465
|
+
}
|
|
8466
|
+
};
|
|
8490
8467
|
});
|
|
8491
8468
|
}
|
|
8492
8469
|
case "locked": {
|
|
@@ -8617,10 +8594,14 @@ class Transformation {
|
|
|
8617
8594
|
apply(op) {
|
|
8618
8595
|
this.previous = this.matrix.copy();
|
|
8619
8596
|
switch (op.method) {
|
|
8620
|
-
case "applyMatrix":
|
|
8621
|
-
|
|
8622
|
-
|
|
8597
|
+
case "applyMatrix": {
|
|
8598
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
8599
|
+
if (itemOp) {
|
|
8600
|
+
this.matrix.scale(itemOp.matrix.scaleX, itemOp.matrix.scaleY);
|
|
8601
|
+
this.matrix.translate(itemOp.matrix.translateX, itemOp.matrix.translateY);
|
|
8602
|
+
}
|
|
8623
8603
|
break;
|
|
8604
|
+
}
|
|
8624
8605
|
case "translateTo":
|
|
8625
8606
|
this.applyTranslateTo(op.x, op.y);
|
|
8626
8607
|
break;
|
|
@@ -8755,8 +8736,7 @@ class Transformation {
|
|
|
8755
8736
|
this.emit({
|
|
8756
8737
|
class: "Transformation",
|
|
8757
8738
|
method: "applyMatrix",
|
|
8758
|
-
|
|
8759
|
-
matrix,
|
|
8739
|
+
items: [{ id: this.id, matrix }],
|
|
8760
8740
|
timeStamp
|
|
8761
8741
|
});
|
|
8762
8742
|
}
|
|
@@ -22244,7 +22224,7 @@ function createCommand(board, operation) {
|
|
|
22244
22224
|
}
|
|
22245
22225
|
default: {
|
|
22246
22226
|
const itemType = operation.class;
|
|
22247
|
-
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);
|
|
22227
|
+
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);
|
|
22248
22228
|
const items = itemIdList.map((itemId) => board.items.findById(itemId) ?? itemId).filter((item) => {
|
|
22249
22229
|
if (typeof item === "string") {
|
|
22250
22230
|
console.warn(`Item with ID ${item} not found for operation ${operation.class}.${operation.method}`);
|
|
@@ -24419,7 +24399,8 @@ class RichText extends BaseItem {
|
|
|
24419
24399
|
this.transformation.subject.subscribe((tr, op) => {
|
|
24420
24400
|
this.prevMbr = this.getMbr();
|
|
24421
24401
|
if (op.method === "applyMatrix") {
|
|
24422
|
-
|
|
24402
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
24403
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
24423
24404
|
this.setAINodeShirkWidth();
|
|
24424
24405
|
if (!this.isInShape) {
|
|
24425
24406
|
this.transformCanvas();
|
|
@@ -24429,8 +24410,6 @@ class RichText extends BaseItem {
|
|
|
24429
24410
|
} else {
|
|
24430
24411
|
this.transformCanvas();
|
|
24431
24412
|
}
|
|
24432
|
-
} else if (op.method === "transformMany") {
|
|
24433
|
-
this.transformCanvas();
|
|
24434
24413
|
} else if (op.method === "deserialize") {
|
|
24435
24414
|
this.setAINodeShirkWidth();
|
|
24436
24415
|
this.updateElement();
|
|
@@ -38374,19 +38353,15 @@ class AINode extends BaseItem {
|
|
|
38374
38353
|
this.text = new RichText(this.board, new Mbr, this.id, this.transformation, this.linkTo, " ", false, false, "AINode");
|
|
38375
38354
|
this.transformation.subject.subscribe((_subject, op) => {
|
|
38376
38355
|
if (op.method === "applyMatrix") {
|
|
38377
|
-
|
|
38356
|
+
const itemOp = op.items.find((i) => i.id === this.getId());
|
|
38357
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
38378
38358
|
this.prevMbr = this.path?.getMbr();
|
|
38379
38359
|
this.text.handleInshapeScale();
|
|
38380
|
-
} else {
|
|
38381
|
-
this.text.transformCanvas();
|
|
38382
|
-
}
|
|
38383
|
-
} else if (op.method === "transformMany") {
|
|
38384
|
-
const currItemOp = op.items[this.getId()];
|
|
38385
|
-
this.prevMbr = this.path?.getMbr();
|
|
38386
|
-
if (currItemOp.method === "applyMatrix" && currItemOp.matrix.scaleX === 1 && currItemOp.matrix.scaleY === 1) {
|
|
38360
|
+
} else if (itemOp) {
|
|
38387
38361
|
this.text.transformCanvas();
|
|
38388
38362
|
} else {
|
|
38389
|
-
this.
|
|
38363
|
+
this.prevMbr = this.path?.getMbr();
|
|
38364
|
+
this.text.updateElement();
|
|
38390
38365
|
}
|
|
38391
38366
|
} else {
|
|
38392
38367
|
this.prevMbr = this.path?.getMbr();
|
|
@@ -39598,13 +39573,9 @@ class Connector2 extends BaseItem {
|
|
|
39598
39573
|
this.endPointer = getEndPointer(this.endPoint, this.endPointerStyle, this.lineStyle, this.lines, this.lineWidth * 0.1 + 0.3);
|
|
39599
39574
|
this.middlePoint = null;
|
|
39600
39575
|
this.transformation.subject.subscribe((_sub, op) => {
|
|
39601
|
-
if (op.method === "
|
|
39602
|
-
const
|
|
39603
|
-
if (
|
|
39604
|
-
if (operation.matrix.scaleX !== 1 || operation.matrix.scaleY !== 1) {
|
|
39605
|
-
this.scalePoints();
|
|
39606
|
-
}
|
|
39607
|
-
} else if (operation.method === "scaleByTranslateBy" && (operation.scale.x !== 1 || operation.scale.y !== 1)) {
|
|
39576
|
+
if (op.method === "applyMatrix") {
|
|
39577
|
+
const itemOp = op.items.find((i) => i.id === this.getId());
|
|
39578
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
39608
39579
|
this.scalePoints();
|
|
39609
39580
|
}
|
|
39610
39581
|
}
|
|
@@ -41895,8 +41866,13 @@ class Shape extends BaseItem {
|
|
|
41895
41866
|
this.transformation.subject.subscribe((_subject, op) => {
|
|
41896
41867
|
this.transformPath();
|
|
41897
41868
|
this.updateMbr();
|
|
41898
|
-
if (op.method === "applyMatrix"
|
|
41899
|
-
|
|
41869
|
+
if (op.method === "applyMatrix") {
|
|
41870
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
41871
|
+
if (itemOp && itemOp.matrix.scaleX === 1 && itemOp.matrix.scaleY === 1) {
|
|
41872
|
+
this.text.transformCanvas();
|
|
41873
|
+
} else {
|
|
41874
|
+
this.text.updateElement();
|
|
41875
|
+
}
|
|
41900
41876
|
} else {
|
|
41901
41877
|
this.text.updateElement();
|
|
41902
41878
|
}
|
|
@@ -42423,27 +42399,13 @@ class Sticker extends BaseItem {
|
|
|
42423
42399
|
this.transformation.subject.subscribe((_subject, op) => {
|
|
42424
42400
|
this.transformPath();
|
|
42425
42401
|
if (op.method === "applyMatrix") {
|
|
42426
|
-
|
|
42427
|
-
|
|
42428
|
-
if (op.matrix.scaleX !== op.matrix.scaleY) {
|
|
42429
|
-
this.text.applyAutoSizeScale(this.text.calcAutoSize());
|
|
42430
|
-
} else {
|
|
42431
|
-
this.text.scaleAutoSizeScale(op.matrix.scaleX);
|
|
42432
|
-
}
|
|
42433
|
-
this.text.recoordinate();
|
|
42434
|
-
this.text.transformCanvas();
|
|
42435
|
-
} else {
|
|
42436
|
-
this.text.handleInshapeScale();
|
|
42437
|
-
}
|
|
42438
|
-
}
|
|
42439
|
-
} else if (op.method === "transformMany") {
|
|
42440
|
-
const transformOp = op.items[this.id];
|
|
42441
|
-
if (transformOp.method === "applyMatrix" && (transformOp.matrix.scaleX !== 1 || transformOp.matrix.scaleY !== 1)) {
|
|
42402
|
+
const itemOp = op.items.find((i) => i.id === this.id);
|
|
42403
|
+
if (itemOp && (itemOp.matrix.scaleX !== 1 || itemOp.matrix.scaleY !== 1)) {
|
|
42442
42404
|
if (this.text.isAutosize()) {
|
|
42443
|
-
if (
|
|
42405
|
+
if (itemOp.matrix.scaleX !== itemOp.matrix.scaleY) {
|
|
42444
42406
|
this.text.applyAutoSizeScale(this.text.calcAutoSize());
|
|
42445
42407
|
} else {
|
|
42446
|
-
this.text.scaleAutoSizeScale(
|
|
42408
|
+
this.text.scaleAutoSizeScale(itemOp.matrix.scaleX);
|
|
42447
42409
|
}
|
|
42448
42410
|
this.text.recoordinate();
|
|
42449
42411
|
this.text.transformCanvas();
|
|
@@ -47623,7 +47585,7 @@ function createCanvasDrawer(board) {
|
|
|
47623
47585
|
context.setCamera(camera);
|
|
47624
47586
|
context.ctx.setTransform(board2.camera.getMatrix().scaleX, 0, 0, board2.camera.getMatrix().scaleY, 0, 0);
|
|
47625
47587
|
context.matrix.applyToContext(context.ctx);
|
|
47626
|
-
const items =
|
|
47588
|
+
const items = translation.map((i) => i.id).map((id) => {
|
|
47627
47589
|
const item = board2.items.getById(id);
|
|
47628
47590
|
if (item) {
|
|
47629
47591
|
if (item.itemType !== "Frame") {
|
|
@@ -47713,7 +47675,7 @@ function createCanvasDrawer(board) {
|
|
|
47713
47675
|
matrix = new Matrix2;
|
|
47714
47676
|
}
|
|
47715
47677
|
function updateCanvasAndKeys(sumMbr, translation, resizingMatrix, actualMbr) {
|
|
47716
|
-
const translationKeys =
|
|
47678
|
+
const translationKeys = translation.map((i) => i.id);
|
|
47717
47679
|
if (lastCreatedCanvas && lastTranslationKeys?.length === translationKeys.length && lastTranslationKeys?.every((key) => translationKeys.includes(key))) {
|
|
47718
47680
|
recoordinateCanvas(sumMbr);
|
|
47719
47681
|
if (resizingMatrix) {
|
|
@@ -47731,7 +47693,7 @@ function createCanvasDrawer(board) {
|
|
|
47731
47693
|
cnvs.style.pointerEvents = "none";
|
|
47732
47694
|
document.body.appendChild(cnvs);
|
|
47733
47695
|
lastCreatedCanvas = cnvs;
|
|
47734
|
-
lastTranslationKeys =
|
|
47696
|
+
lastTranslationKeys = translation.map((i) => i.id);
|
|
47735
47697
|
lastTranslationKeys.forEach((id) => {
|
|
47736
47698
|
const item = board.items.getById(id);
|
|
47737
47699
|
if (item) {
|
|
@@ -47744,7 +47706,7 @@ function createCanvasDrawer(board) {
|
|
|
47744
47706
|
}
|
|
47745
47707
|
}
|
|
47746
47708
|
function countSumMbr(translation) {
|
|
47747
|
-
return
|
|
47709
|
+
return translation.map((i) => i.id).reduce((mbr, id) => {
|
|
47748
47710
|
const item = board.items.getById(id);
|
|
47749
47711
|
if (item) {
|
|
47750
47712
|
if (!mbr) {
|
|
@@ -48681,14 +48643,7 @@ class AlignmentHelper {
|
|
|
48681
48643
|
this.board.selection.transformMany(translation, timeStamp);
|
|
48682
48644
|
} else {
|
|
48683
48645
|
const id = item.getId();
|
|
48684
|
-
|
|
48685
|
-
transformMap[id] = {
|
|
48686
|
-
class: "Transformation",
|
|
48687
|
-
item: [id],
|
|
48688
|
-
method: "applyMatrix",
|
|
48689
|
-
matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
48690
|
-
};
|
|
48691
|
-
this.board.selection.transformMany(transformMap, timeStamp);
|
|
48646
|
+
this.board.selection.transformMany([{ id, matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } }], timeStamp);
|
|
48692
48647
|
}
|
|
48693
48648
|
}
|
|
48694
48649
|
translateCanvas(x, y, timeStamp) {
|
|
@@ -49099,7 +49054,7 @@ class Select extends Tool {
|
|
|
49099
49054
|
return false;
|
|
49100
49055
|
}
|
|
49101
49056
|
const translation = selection.getManyItemsTranslation(x, y);
|
|
49102
|
-
const translationKeys =
|
|
49057
|
+
const translationKeys = translation.map((i) => i.id);
|
|
49103
49058
|
const commentsSet = new Set(this.board.items.getComments().map((comment2) => comment2.getId()));
|
|
49104
49059
|
if (translationKeys.filter((item) => !commentsSet.has(item)).length > 10) {
|
|
49105
49060
|
const selectedMbr = this.board.selection.getMbr()?.copy();
|
|
@@ -50537,7 +50492,7 @@ class Card extends BaseItem {
|
|
|
50537
50492
|
this.board.bringToFront(this);
|
|
50538
50493
|
}, 1000);
|
|
50539
50494
|
this.transformation.subject.subscribe((_, op) => {
|
|
50540
|
-
if (this.parent === "Board" && op.method === "applyMatrix" && op.matrix.scaleX === 1 && op.matrix.scaleY === 1) {
|
|
50495
|
+
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) {
|
|
50541
50496
|
this.throttledBringToFront();
|
|
50542
50497
|
}
|
|
50543
50498
|
this.updateMbr();
|
|
@@ -54292,7 +54247,7 @@ function handleMultipleItemsResize({
|
|
|
54292
54247
|
isShiftPressed
|
|
54293
54248
|
}) {
|
|
54294
54249
|
const { matrix } = resize;
|
|
54295
|
-
const
|
|
54250
|
+
const result = [];
|
|
54296
54251
|
const items = itemsToResize ? itemsToResize : board.selection.items.list();
|
|
54297
54252
|
board.items.getComments().forEach((comment2) => {
|
|
54298
54253
|
if (items.some((item) => item.getId() === comment2.getItemToFollow())) {
|
|
@@ -54311,25 +54266,25 @@ function handleMultipleItemsResize({
|
|
|
54311
54266
|
const deltaY = itemY - initMbr.top;
|
|
54312
54267
|
const translateY = deltaY * matrix.scaleY - deltaY + matrix.translateY;
|
|
54313
54268
|
if (item instanceof RichText) {
|
|
54314
|
-
|
|
54269
|
+
result.push(getRichTextTranslation({
|
|
54315
54270
|
item,
|
|
54316
54271
|
isWidth,
|
|
54317
54272
|
isHeight,
|
|
54318
54273
|
matrix,
|
|
54319
54274
|
translateX,
|
|
54320
54275
|
translateY
|
|
54321
|
-
});
|
|
54276
|
+
}));
|
|
54322
54277
|
} else if (item instanceof AINode) {
|
|
54323
|
-
|
|
54278
|
+
result.push(getAINodeTranslation({
|
|
54324
54279
|
item,
|
|
54325
54280
|
isWidth,
|
|
54326
54281
|
isHeight,
|
|
54327
54282
|
matrix,
|
|
54328
54283
|
translateX,
|
|
54329
54284
|
translateY
|
|
54330
|
-
});
|
|
54285
|
+
}));
|
|
54331
54286
|
} else {
|
|
54332
|
-
|
|
54287
|
+
result.push(getItemTranslation({
|
|
54333
54288
|
item,
|
|
54334
54289
|
isWidth,
|
|
54335
54290
|
isHeight,
|
|
@@ -54337,10 +54292,10 @@ function handleMultipleItemsResize({
|
|
|
54337
54292
|
translateX,
|
|
54338
54293
|
translateY,
|
|
54339
54294
|
isShiftPressed
|
|
54340
|
-
});
|
|
54295
|
+
}));
|
|
54341
54296
|
}
|
|
54342
54297
|
}
|
|
54343
|
-
return
|
|
54298
|
+
return result;
|
|
54344
54299
|
}
|
|
54345
54300
|
function getRichTextTranslation({
|
|
54346
54301
|
item,
|
|
@@ -54352,26 +54307,11 @@ function getRichTextTranslation({
|
|
|
54352
54307
|
}) {
|
|
54353
54308
|
if (isWidth) {
|
|
54354
54309
|
item.editor.setMaxWidth(item.getWidth() / item.transformation.getScale().x * matrix.scaleX);
|
|
54355
|
-
return {
|
|
54356
|
-
class: "Transformation",
|
|
54357
|
-
method: "applyMatrix",
|
|
54358
|
-
item: [item.getId()],
|
|
54359
|
-
matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54360
|
-
};
|
|
54310
|
+
return { id: item.getId(), matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54361
54311
|
} else if (isHeight) {
|
|
54362
|
-
return {
|
|
54363
|
-
class: "Transformation",
|
|
54364
|
-
method: "applyMatrix",
|
|
54365
|
-
item: [item.getId()],
|
|
54366
|
-
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
54367
|
-
};
|
|
54312
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } };
|
|
54368
54313
|
} else {
|
|
54369
|
-
return {
|
|
54370
|
-
class: "Transformation",
|
|
54371
|
-
method: "applyMatrix",
|
|
54372
|
-
item: [item.getId()],
|
|
54373
|
-
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54374
|
-
};
|
|
54314
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54375
54315
|
}
|
|
54376
54316
|
}
|
|
54377
54317
|
function getAINodeTranslation({
|
|
@@ -54384,26 +54324,11 @@ function getAINodeTranslation({
|
|
|
54384
54324
|
}) {
|
|
54385
54325
|
if (isWidth) {
|
|
54386
54326
|
item.text.editor.setMaxWidth(item.text.getWidth() / item.transformation.getScale().x * matrix.scaleX);
|
|
54387
|
-
return {
|
|
54388
|
-
class: "Transformation",
|
|
54389
|
-
method: "applyMatrix",
|
|
54390
|
-
item: [item.getId()],
|
|
54391
|
-
matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54392
|
-
};
|
|
54327
|
+
return { id: item.getId(), matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54393
54328
|
} else if (isHeight) {
|
|
54394
|
-
return {
|
|
54395
|
-
class: "Transformation",
|
|
54396
|
-
method: "applyMatrix",
|
|
54397
|
-
item: [item.getId()],
|
|
54398
|
-
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
54399
|
-
};
|
|
54329
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } };
|
|
54400
54330
|
} else {
|
|
54401
|
-
return {
|
|
54402
|
-
class: "Transformation",
|
|
54403
|
-
method: "applyMatrix",
|
|
54404
|
-
item: [item.getId()],
|
|
54405
|
-
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
|
|
54406
|
-
};
|
|
54331
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 } };
|
|
54407
54332
|
}
|
|
54408
54333
|
}
|
|
54409
54334
|
function getItemTranslation({
|
|
@@ -54416,22 +54341,12 @@ function getItemTranslation({
|
|
|
54416
54341
|
isShiftPressed
|
|
54417
54342
|
}) {
|
|
54418
54343
|
if (item instanceof Sticker && (isWidth || isHeight)) {
|
|
54419
|
-
return {
|
|
54420
|
-
class: "Transformation",
|
|
54421
|
-
method: "applyMatrix",
|
|
54422
|
-
item: [item.getId()],
|
|
54423
|
-
matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
54424
|
-
};
|
|
54344
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } };
|
|
54425
54345
|
} else {
|
|
54426
54346
|
if (item instanceof Frame2 && item.getCanChangeRatio() && isShiftPressed && item.getFrameType() !== "Custom") {
|
|
54427
54347
|
item.setFrameType("Custom");
|
|
54428
54348
|
}
|
|
54429
|
-
return {
|
|
54430
|
-
class: "Transformation",
|
|
54431
|
-
method: "applyMatrix",
|
|
54432
|
-
item: [item.getId()],
|
|
54433
|
-
matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleY, shearX: 0, shearY: 0 }
|
|
54434
|
-
};
|
|
54349
|
+
return { id: item.getId(), matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleY, shearX: 0, shearY: 0 } };
|
|
54435
54350
|
}
|
|
54436
54351
|
}
|
|
54437
54352
|
|
|
@@ -54768,7 +54683,7 @@ function transformItems({
|
|
|
54768
54683
|
isShiftPressed
|
|
54769
54684
|
});
|
|
54770
54685
|
selection.transformMany(translation, beginTimeStamp);
|
|
54771
|
-
if (
|
|
54686
|
+
if (translation.length > 10) {
|
|
54772
54687
|
canvasDrawer.updateCanvasAndKeys(resize.mbr, translation, resize.matrix);
|
|
54773
54688
|
debounceUpd.setFalse();
|
|
54774
54689
|
debounceUpd.setTimeoutUpdate(1000);
|
|
@@ -55796,53 +55711,41 @@ class BoardSelection {
|
|
|
55796
55711
|
this.shouldPublish = false;
|
|
55797
55712
|
this.emit({
|
|
55798
55713
|
class: "Transformation",
|
|
55799
|
-
method: "
|
|
55714
|
+
method: "applyMatrix",
|
|
55800
55715
|
items,
|
|
55801
55716
|
timeStamp
|
|
55802
55717
|
});
|
|
55803
55718
|
this.shouldPublish = true;
|
|
55804
55719
|
}
|
|
55805
55720
|
getManyItemsTranslation(x, y, unselectedItem) {
|
|
55806
|
-
const
|
|
55807
|
-
|
|
55808
|
-
|
|
55809
|
-
|
|
55810
|
-
|
|
55811
|
-
item: [itemId],
|
|
55812
|
-
matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
55813
|
-
};
|
|
55814
|
-
}
|
|
55815
|
-
function tryToAddFrameChildrenToTranslation(selectedItem) {
|
|
55721
|
+
const items = [];
|
|
55722
|
+
const addItem = (itemId) => {
|
|
55723
|
+
items.push({ id: itemId, matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 } });
|
|
55724
|
+
};
|
|
55725
|
+
const tryToAddFrameChildren = (selectedItem) => {
|
|
55816
55726
|
if (!("index" in selectedItem) || !selectedItem.index) {
|
|
55817
55727
|
return;
|
|
55818
55728
|
}
|
|
55819
55729
|
for (const childId of selectedItem.getChildrenIds()) {
|
|
55820
|
-
|
|
55730
|
+
addItem(childId);
|
|
55821
55731
|
}
|
|
55822
|
-
}
|
|
55823
|
-
const
|
|
55732
|
+
};
|
|
55733
|
+
const addWithComments = (item) => {
|
|
55734
|
+
addItem(item.getId());
|
|
55735
|
+
tryToAddFrameChildren(item);
|
|
55824
55736
|
const followedComments = this.board.items.getComments().filter((comment2) => comment2.getItemToFollow() === item.getId());
|
|
55825
55737
|
for (const comment2 of followedComments) {
|
|
55826
|
-
|
|
55827
|
-
class: "Transformation",
|
|
55828
|
-
method: "applyMatrix",
|
|
55829
|
-
item: [comment2.getId()],
|
|
55830
|
-
matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
|
|
55831
|
-
};
|
|
55738
|
+
addItem(comment2.getId());
|
|
55832
55739
|
}
|
|
55833
55740
|
};
|
|
55834
55741
|
if (unselectedItem) {
|
|
55835
|
-
|
|
55836
|
-
|
|
55837
|
-
createTranslationWithComments(unselectedItem);
|
|
55838
|
-
return translation;
|
|
55742
|
+
addWithComments(unselectedItem);
|
|
55743
|
+
return items;
|
|
55839
55744
|
}
|
|
55840
55745
|
for (const selectedItem of this.board.selection.list()) {
|
|
55841
|
-
|
|
55842
|
-
tryToAddFrameChildrenToTranslation(selectedItem);
|
|
55843
|
-
createTranslationWithComments(selectedItem);
|
|
55746
|
+
addWithComments(selectedItem);
|
|
55844
55747
|
}
|
|
55845
|
-
return
|
|
55748
|
+
return items;
|
|
55846
55749
|
}
|
|
55847
55750
|
setStrokeStyle(borderStyle) {
|
|
55848
55751
|
const shapes = this.items.getIdsByItemTypes(["Shape"]);
|
|
@@ -57385,32 +57288,40 @@ function mergeOperations(opA, opB) {
|
|
|
57385
57288
|
return;
|
|
57386
57289
|
}
|
|
57387
57290
|
function mergeTransformationOperations(opA, opB) {
|
|
57388
|
-
if (
|
|
57291
|
+
if (opA.timeStamp && opB.timeStamp && opA.timeStamp !== opB.timeStamp) {
|
|
57389
57292
|
return;
|
|
57390
57293
|
}
|
|
57391
|
-
if (opA.
|
|
57294
|
+
if (opA.method === "applyMatrix" && opB.method === "applyMatrix") {
|
|
57295
|
+
if (opA.items.length !== opB.items.length)
|
|
57296
|
+
return;
|
|
57297
|
+
const idsA = new Set(opA.items.map((i) => i.id));
|
|
57298
|
+
if (!opB.items.every((b) => idsA.has(b.id)))
|
|
57299
|
+
return;
|
|
57300
|
+
return {
|
|
57301
|
+
class: "Transformation",
|
|
57302
|
+
method: "applyMatrix",
|
|
57303
|
+
items: opB.items.map((b) => {
|
|
57304
|
+
const a2 = opA.items.find((i) => i.id === b.id);
|
|
57305
|
+
return {
|
|
57306
|
+
id: b.id,
|
|
57307
|
+
matrix: {
|
|
57308
|
+
translateX: a2.matrix.translateX + b.matrix.translateX,
|
|
57309
|
+
translateY: a2.matrix.translateY + b.matrix.translateY,
|
|
57310
|
+
scaleX: a2.matrix.scaleX * b.matrix.scaleX,
|
|
57311
|
+
scaleY: a2.matrix.scaleY * b.matrix.scaleY,
|
|
57312
|
+
shearX: 0,
|
|
57313
|
+
shearY: 0
|
|
57314
|
+
}
|
|
57315
|
+
};
|
|
57316
|
+
}),
|
|
57317
|
+
timeStamp: opB.timeStamp
|
|
57318
|
+
};
|
|
57319
|
+
}
|
|
57320
|
+
if (!areItemsTheSame(opA, opB)) {
|
|
57392
57321
|
return;
|
|
57393
57322
|
}
|
|
57394
57323
|
const method = opA.method;
|
|
57395
57324
|
switch (method) {
|
|
57396
|
-
case "applyMatrix":
|
|
57397
|
-
if (opB.method !== method) {
|
|
57398
|
-
return;
|
|
57399
|
-
}
|
|
57400
|
-
return {
|
|
57401
|
-
class: "Transformation",
|
|
57402
|
-
method: "applyMatrix",
|
|
57403
|
-
item: opA.item,
|
|
57404
|
-
matrix: {
|
|
57405
|
-
translateX: opA.matrix.translateX + opB.matrix.translateX,
|
|
57406
|
-
translateY: opA.matrix.translateY + opB.matrix.translateY,
|
|
57407
|
-
scaleX: opA.matrix.scaleX * opB.matrix.scaleX,
|
|
57408
|
-
scaleY: opA.matrix.scaleY * opB.matrix.scaleY,
|
|
57409
|
-
shearX: 0,
|
|
57410
|
-
shearY: 0
|
|
57411
|
-
},
|
|
57412
|
-
timeStamp: opB.timeStamp
|
|
57413
|
-
};
|
|
57414
57325
|
case "translateBy":
|
|
57415
57326
|
if (opB.method !== method) {
|
|
57416
57327
|
return;
|
|
@@ -57464,130 +57375,10 @@ function mergeTransformationOperations(opA, opB) {
|
|
|
57464
57375
|
},
|
|
57465
57376
|
timeStamp: opB.timeStamp
|
|
57466
57377
|
};
|
|
57467
|
-
case "transformMany":
|
|
57468
|
-
const items = mergeItems(opA, opB);
|
|
57469
|
-
if (opB.method !== method) {
|
|
57470
|
-
return;
|
|
57471
|
-
}
|
|
57472
|
-
return {
|
|
57473
|
-
class: "Transformation",
|
|
57474
|
-
method: "transformMany",
|
|
57475
|
-
items,
|
|
57476
|
-
timeStamp: opB.timeStamp
|
|
57477
|
-
};
|
|
57478
57378
|
default:
|
|
57479
57379
|
return;
|
|
57480
57380
|
}
|
|
57481
57381
|
}
|
|
57482
|
-
function mergeItems(opA, opB) {
|
|
57483
|
-
if (opA.method === "transformMany" && opB.method === "transformMany") {
|
|
57484
|
-
const resolve2 = (currScale, currTranslate, opB2) => {
|
|
57485
|
-
switch (opB2.method) {
|
|
57486
|
-
case "scaleByTranslateBy":
|
|
57487
|
-
return {
|
|
57488
|
-
scale: {
|
|
57489
|
-
x: currScale ? currScale.x * opB2.scale.x : opB2.scale.x,
|
|
57490
|
-
y: currScale ? currScale.y * opB2.scale.y : opB2.scale.y
|
|
57491
|
-
},
|
|
57492
|
-
translate: {
|
|
57493
|
-
x: currTranslate ? currTranslate.x + opB2.translate.x : opB2.translate.x,
|
|
57494
|
-
y: currTranslate ? currTranslate.y + opB2.translate.y : opB2.translate.y
|
|
57495
|
-
}
|
|
57496
|
-
};
|
|
57497
|
-
case "scaleBy":
|
|
57498
|
-
return {
|
|
57499
|
-
scale: {
|
|
57500
|
-
x: currScale ? currScale.x * opB2.x : opB2.x,
|
|
57501
|
-
y: currScale ? currScale.y * opB2.y : opB2.y
|
|
57502
|
-
},
|
|
57503
|
-
translate: {
|
|
57504
|
-
x: currTranslate ? currTranslate.x : 0,
|
|
57505
|
-
y: currTranslate ? currTranslate.y : 0
|
|
57506
|
-
}
|
|
57507
|
-
};
|
|
57508
|
-
case "translateBy":
|
|
57509
|
-
return {
|
|
57510
|
-
scale: {
|
|
57511
|
-
x: currScale ? currScale.x : 1,
|
|
57512
|
-
y: currScale ? currScale.y : 1
|
|
57513
|
-
},
|
|
57514
|
-
translate: {
|
|
57515
|
-
x: currTranslate ? currTranslate.x + opB2.x : opB2.x,
|
|
57516
|
-
y: currTranslate ? currTranslate.y + opB2.y : opB2.y
|
|
57517
|
-
}
|
|
57518
|
-
};
|
|
57519
|
-
}
|
|
57520
|
-
return;
|
|
57521
|
-
};
|
|
57522
|
-
const items = {};
|
|
57523
|
-
Object.keys(opB.items).forEach((itemId) => {
|
|
57524
|
-
if (opA.items[itemId] !== undefined) {
|
|
57525
|
-
if (opA.items[itemId].method === "applyMatrix" && opB.items[itemId].method === "applyMatrix") {
|
|
57526
|
-
const a2 = opA.items[itemId].matrix;
|
|
57527
|
-
const b = opB.items[itemId].matrix;
|
|
57528
|
-
items[itemId] = {
|
|
57529
|
-
class: "Transformation",
|
|
57530
|
-
method: "applyMatrix",
|
|
57531
|
-
item: [itemId],
|
|
57532
|
-
matrix: {
|
|
57533
|
-
translateX: a2.translateX + b.translateX,
|
|
57534
|
-
translateY: a2.translateY + b.translateY,
|
|
57535
|
-
scaleX: a2.scaleX * b.scaleX,
|
|
57536
|
-
scaleY: a2.scaleY * b.scaleY,
|
|
57537
|
-
shearX: 0,
|
|
57538
|
-
shearY: 0
|
|
57539
|
-
}
|
|
57540
|
-
};
|
|
57541
|
-
} else if (opA.items[itemId].method === "scaleByTranslateBy") {
|
|
57542
|
-
const newTransformation = resolve2(opA.items[itemId].scale, opA.items[itemId].translate, opB.items[itemId]);
|
|
57543
|
-
if (!newTransformation) {
|
|
57544
|
-
items[itemId] = opB.items[itemId];
|
|
57545
|
-
} else {
|
|
57546
|
-
items[itemId] = {
|
|
57547
|
-
class: "Transformation",
|
|
57548
|
-
method: "scaleByTranslateBy",
|
|
57549
|
-
item: [itemId],
|
|
57550
|
-
scale: newTransformation.scale,
|
|
57551
|
-
translate: newTransformation.translate
|
|
57552
|
-
};
|
|
57553
|
-
}
|
|
57554
|
-
} else if (opA.items[itemId].method === "scaleBy") {
|
|
57555
|
-
const newTransformation = resolve2({ x: opA.items[itemId].x, y: opA.items[itemId].y }, undefined, opB.items[itemId]);
|
|
57556
|
-
if (!newTransformation) {
|
|
57557
|
-
items[itemId] = opB.items[itemId];
|
|
57558
|
-
} else {
|
|
57559
|
-
items[itemId] = {
|
|
57560
|
-
class: "Transformation",
|
|
57561
|
-
method: "scaleByTranslateBy",
|
|
57562
|
-
item: [itemId],
|
|
57563
|
-
scale: newTransformation.scale,
|
|
57564
|
-
translate: newTransformation.translate
|
|
57565
|
-
};
|
|
57566
|
-
}
|
|
57567
|
-
} else if (opA.items[itemId].method === "translateBy") {
|
|
57568
|
-
const newTransformation = resolve2(undefined, { x: opA.items[itemId].x, y: opA.items[itemId].y }, opB.items[itemId]);
|
|
57569
|
-
if (!newTransformation) {
|
|
57570
|
-
items[itemId] = opB.items[itemId];
|
|
57571
|
-
} else {
|
|
57572
|
-
items[itemId] = {
|
|
57573
|
-
class: "Transformation",
|
|
57574
|
-
method: "scaleByTranslateBy",
|
|
57575
|
-
item: [itemId],
|
|
57576
|
-
scale: newTransformation.scale,
|
|
57577
|
-
translate: newTransformation.translate
|
|
57578
|
-
};
|
|
57579
|
-
}
|
|
57580
|
-
} else {
|
|
57581
|
-
items[itemId] = opB.items[itemId];
|
|
57582
|
-
}
|
|
57583
|
-
} else {
|
|
57584
|
-
items[itemId] = opB.items[itemId];
|
|
57585
|
-
}
|
|
57586
|
-
});
|
|
57587
|
-
return items;
|
|
57588
|
-
}
|
|
57589
|
-
return;
|
|
57590
|
-
}
|
|
57591
57382
|
function mergeRichTextOperations(opA, opB) {
|
|
57592
57383
|
if (!areItemsTheSame(opA, opB)) {
|
|
57593
57384
|
return;
|