microboard-temp 0.12.0 → 0.12.2
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 +72 -45
- package/dist/cjs/index.js +72 -45
- package/dist/cjs/node.js +72 -45
- package/dist/esm/browser.js +72 -45
- package/dist/esm/index.js +72 -45
- package/dist/esm/node.js +72 -45
- package/dist/types/Gravity/GravityEngine.d.ts +4 -2
- package/dist/types/Items/AINode/AINode.d.ts +1 -0
- package/dist/types/Items/BaseItem/BaseItem.d.ts +1 -0
- package/dist/types/Items/Comment/Comment.d.ts +1 -0
- package/dist/types/Items/RichText/RichText.d.ts +1 -2
- package/dist/types/Items/Shape/Shape.d.ts +1 -0
- package/dist/types/Items/Sticker/Sticker.d.ts +1 -0
- package/package.json +1 -1
package/dist/esm/browser.js
CHANGED
|
@@ -18044,9 +18044,9 @@ class Transformation {
|
|
|
18044
18044
|
}, timeStamp);
|
|
18045
18045
|
}
|
|
18046
18046
|
applyMatrixSilent(matrixData) {
|
|
18047
|
-
this.previous = this.
|
|
18048
|
-
this.
|
|
18049
|
-
this.
|
|
18047
|
+
this.previous = this._matrix.copy();
|
|
18048
|
+
this._matrix.scale(matrixData.scaleX, matrixData.scaleY);
|
|
18049
|
+
this._matrix.translate(matrixData.translateX, matrixData.translateY);
|
|
18050
18050
|
this.subject.publish(this, {
|
|
18051
18051
|
class: "Transformation",
|
|
18052
18052
|
method: "applyMatrix",
|
|
@@ -19196,13 +19196,18 @@ class Comment {
|
|
|
19196
19196
|
userId
|
|
19197
19197
|
});
|
|
19198
19198
|
}
|
|
19199
|
+
_syncing = false;
|
|
19199
19200
|
transform() {
|
|
19201
|
+
if (this._syncing)
|
|
19202
|
+
return;
|
|
19203
|
+
this._syncing = true;
|
|
19200
19204
|
const { translateX, translateY } = this.transformation.getMatrixData();
|
|
19201
19205
|
if (translateX && translateY) {
|
|
19202
19206
|
this.anchor = new Point(translateX, translateY);
|
|
19203
19207
|
} else {
|
|
19204
19208
|
this.transformation.setLocal(this.anchor.x, this.anchor.y);
|
|
19205
19209
|
}
|
|
19210
|
+
this._syncing = false;
|
|
19206
19211
|
}
|
|
19207
19212
|
getUnreadMessages(userId = ANONYMOUS_ID) {
|
|
19208
19213
|
const unreadMessages = this.thread.filter((mes) => mes && !mes.readers.includes(userId));
|
|
@@ -22029,7 +22034,6 @@ class RichText extends BaseItem {
|
|
|
22029
22034
|
_onLimitReached = () => {};
|
|
22030
22035
|
shrinkWidth = false;
|
|
22031
22036
|
prevMbr = null;
|
|
22032
|
-
worldMatrixGetter;
|
|
22033
22037
|
rtCounter = 0;
|
|
22034
22038
|
constructor(board, container, id = "", transformation = new Transformation(id, board.events), linkTo, placeholderText = conf.i18n?.t("board.textPlaceholder"), isInShape = false, autoSize = false, insideOf, initialTextStyles = conf.DEFAULT_TEXT_STYLES) {
|
|
22035
22039
|
super(board, id);
|
|
@@ -22252,18 +22256,7 @@ class RichText extends BaseItem {
|
|
|
22252
22256
|
top = container.top;
|
|
22253
22257
|
}
|
|
22254
22258
|
const point3 = new Point(left, top);
|
|
22255
|
-
|
|
22256
|
-
this.worldMatrixGetter().apply(point3);
|
|
22257
|
-
} else if (this.isInShape) {
|
|
22258
|
-
const item = this.board.items.getById(this.id);
|
|
22259
|
-
if (item) {
|
|
22260
|
-
item.getParentWorldMatrix().apply(point3);
|
|
22261
|
-
} else {
|
|
22262
|
-
this.getParentWorldMatrix().apply(point3);
|
|
22263
|
-
}
|
|
22264
|
-
} else {
|
|
22265
|
-
this.getParentWorldMatrix().apply(point3);
|
|
22266
|
-
}
|
|
22259
|
+
this.getParentWorldMatrix().apply(point3);
|
|
22267
22260
|
return {
|
|
22268
22261
|
point: point3,
|
|
22269
22262
|
width,
|
|
@@ -36367,6 +36360,11 @@ class AINode extends BaseItem {
|
|
|
36367
36360
|
this.linkTo.setId(id);
|
|
36368
36361
|
return this;
|
|
36369
36362
|
}
|
|
36363
|
+
onParentChanged(newParent) {
|
|
36364
|
+
if (this.text) {
|
|
36365
|
+
this.text.parent = newParent;
|
|
36366
|
+
}
|
|
36367
|
+
}
|
|
36370
36368
|
getId() {
|
|
36371
36369
|
return this.id;
|
|
36372
36370
|
}
|
|
@@ -39891,6 +39889,11 @@ class Shape extends BaseItem {
|
|
|
39891
39889
|
this.linkTo.setId(id);
|
|
39892
39890
|
return this;
|
|
39893
39891
|
}
|
|
39892
|
+
onParentChanged(newParent) {
|
|
39893
|
+
if (this.text) {
|
|
39894
|
+
this.text.parent = newParent;
|
|
39895
|
+
}
|
|
39896
|
+
}
|
|
39894
39897
|
getId() {
|
|
39895
39898
|
return this.id;
|
|
39896
39899
|
}
|
|
@@ -40423,6 +40426,11 @@ class Sticker extends BaseItem {
|
|
|
40423
40426
|
this.transformation.setId(id);
|
|
40424
40427
|
return this;
|
|
40425
40428
|
}
|
|
40429
|
+
onParentChanged(newParent) {
|
|
40430
|
+
if (this.text) {
|
|
40431
|
+
this.text.parent = newParent;
|
|
40432
|
+
}
|
|
40433
|
+
}
|
|
40426
40434
|
getId() {
|
|
40427
40435
|
return this.id;
|
|
40428
40436
|
}
|
|
@@ -40950,15 +40958,6 @@ class Frame2 extends BaseItem {
|
|
|
40950
40958
|
y: translateY
|
|
40951
40959
|
}, timeStamp);
|
|
40952
40960
|
const newMatrix = this.transformation.toMatrix();
|
|
40953
|
-
if (newMatrix.translateX !== oldMatrix.translateX || newMatrix.translateY !== oldMatrix.translateY) {
|
|
40954
|
-
const dx = newMatrix.translateX - oldMatrix.translateX;
|
|
40955
|
-
const dy = newMatrix.translateY - oldMatrix.translateY;
|
|
40956
|
-
this.index?.list().forEach((child) => {
|
|
40957
|
-
if (child instanceof BaseItem) {
|
|
40958
|
-
child.transformation.translateBy(-dx, -dy, timeStamp);
|
|
40959
|
-
}
|
|
40960
|
-
});
|
|
40961
|
-
}
|
|
40962
40961
|
this.setLastFrameScale();
|
|
40963
40962
|
res.mbr = this.getMbr();
|
|
40964
40963
|
return res;
|
|
@@ -54126,14 +54125,18 @@ class BoardSelection {
|
|
|
54126
54125
|
}
|
|
54127
54126
|
}
|
|
54128
54127
|
// src/Gravity/GravityEngine.ts
|
|
54128
|
+
var EXCLUDED_ITEM_TYPES = new Set(["Comment", "Connector"]);
|
|
54129
|
+
|
|
54129
54130
|
class GravityEngine {
|
|
54130
54131
|
board;
|
|
54131
54132
|
velocities = new Map;
|
|
54132
54133
|
tickTimer = null;
|
|
54133
54134
|
syncTimer = null;
|
|
54134
54135
|
lastSyncedPositions = new Map;
|
|
54135
|
-
G =
|
|
54136
|
-
|
|
54136
|
+
G = 80;
|
|
54137
|
+
G_CENTER = 120;
|
|
54138
|
+
DAMPING = 0.92;
|
|
54139
|
+
REPULSION = 60000;
|
|
54137
54140
|
TICK_MS = 33;
|
|
54138
54141
|
SYNC_MS = 300;
|
|
54139
54142
|
MAX_DISTANCE = 3000;
|
|
@@ -54165,9 +54168,18 @@ class GravityEngine {
|
|
|
54165
54168
|
}
|
|
54166
54169
|
tick() {
|
|
54167
54170
|
const dt = this.TICK_MS / 1000;
|
|
54168
|
-
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked);
|
|
54169
|
-
if (items.length <
|
|
54171
|
+
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked && !EXCLUDED_ITEM_TYPES.has(item.itemType));
|
|
54172
|
+
if (items.length < 1)
|
|
54170
54173
|
return;
|
|
54174
|
+
let sumX = 0;
|
|
54175
|
+
let sumY = 0;
|
|
54176
|
+
for (const item of items) {
|
|
54177
|
+
const pos = item.transformation.getTranslation();
|
|
54178
|
+
sumX += pos.x;
|
|
54179
|
+
sumY += pos.y;
|
|
54180
|
+
}
|
|
54181
|
+
const centerX = sumX / items.length;
|
|
54182
|
+
const centerY = sumY / items.length;
|
|
54171
54183
|
for (const item of items) {
|
|
54172
54184
|
const id = item.getId();
|
|
54173
54185
|
if (!this.velocities.has(id)) {
|
|
@@ -54176,30 +54188,45 @@ class GravityEngine {
|
|
|
54176
54188
|
const vel = this.velocities.get(id);
|
|
54177
54189
|
const pos1 = item.transformation.getTranslation();
|
|
54178
54190
|
const mbr1 = item.getMbr();
|
|
54179
|
-
const
|
|
54180
|
-
const
|
|
54191
|
+
const w1 = mbr1.getWidth();
|
|
54192
|
+
const h1 = mbr1.getHeight();
|
|
54181
54193
|
let ax = 0;
|
|
54182
54194
|
let ay = 0;
|
|
54195
|
+
const dcx = centerX - pos1.x;
|
|
54196
|
+
const dcy = centerY - pos1.y;
|
|
54197
|
+
const distCenter = Math.sqrt(dcx * dcx + dcy * dcy) + 1;
|
|
54198
|
+
ax += this.G_CENTER * dcx / distCenter;
|
|
54199
|
+
ay += this.G_CENTER * dcy / distCenter;
|
|
54200
|
+
const nearby = this.board.items.getEnclosedOrCrossed(pos1.x - this.MAX_DISTANCE, pos1.y - this.MAX_DISTANCE, pos1.x + this.MAX_DISTANCE * 2, pos1.y + this.MAX_DISTANCE * 2).filter((other) => other.getId() !== id && !EXCLUDED_ITEM_TYPES.has(other.itemType));
|
|
54183
54201
|
for (const other of nearby) {
|
|
54184
54202
|
const pos2 = other.transformation.getTranslation();
|
|
54185
54203
|
const mbr2 = other.getMbr();
|
|
54186
|
-
const
|
|
54187
|
-
const
|
|
54188
|
-
const
|
|
54189
|
-
const
|
|
54190
|
-
const
|
|
54191
|
-
const
|
|
54192
|
-
|
|
54193
|
-
|
|
54204
|
+
const w2 = mbr2.getWidth();
|
|
54205
|
+
const h2 = mbr2.getHeight();
|
|
54206
|
+
const mass2 = w2 * h2;
|
|
54207
|
+
const dx = pos2.x - pos1.x;
|
|
54208
|
+
const dy = pos2.y - pos1.y;
|
|
54209
|
+
const distSq = dx * dx + dy * dy;
|
|
54210
|
+
const dist = Math.sqrt(distSq) + 0.001;
|
|
54211
|
+
const minDist = (w1 + w2) * 0.5 + (h1 + h2) * 0.5;
|
|
54212
|
+
if (dist < minDist) {
|
|
54213
|
+
const repAcc = this.REPULSION / (distSq + this.SOFTENING_SQ);
|
|
54214
|
+
ax -= repAcc * dx / dist;
|
|
54215
|
+
ay -= repAcc * dy / dist;
|
|
54216
|
+
} else {
|
|
54217
|
+
const gravAcc = this.G * mass2 / (distSq + this.SOFTENING_SQ);
|
|
54218
|
+
ax += gravAcc * dx / dist;
|
|
54219
|
+
ay += gravAcc * dy / dist;
|
|
54220
|
+
}
|
|
54194
54221
|
}
|
|
54195
54222
|
vel.vx = (vel.vx + ax * dt) * this.DAMPING;
|
|
54196
54223
|
vel.vy = (vel.vy + ay * dt) * this.DAMPING;
|
|
54197
|
-
const
|
|
54198
|
-
const
|
|
54199
|
-
if (Math.abs(
|
|
54224
|
+
const moveX = vel.vx * dt;
|
|
54225
|
+
const moveY = vel.vy * dt;
|
|
54226
|
+
if (Math.abs(moveX) >= this.MIN_MOVE_PX || Math.abs(moveY) >= this.MIN_MOVE_PX) {
|
|
54200
54227
|
item.transformation.applyMatrixSilent({
|
|
54201
|
-
translateX:
|
|
54202
|
-
translateY:
|
|
54228
|
+
translateX: moveX,
|
|
54229
|
+
translateY: moveY,
|
|
54203
54230
|
scaleX: 1,
|
|
54204
54231
|
scaleY: 1,
|
|
54205
54232
|
shearX: 0,
|
|
@@ -54209,7 +54236,7 @@ class GravityEngine {
|
|
|
54209
54236
|
}
|
|
54210
54237
|
}
|
|
54211
54238
|
syncPositions() {
|
|
54212
|
-
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked);
|
|
54239
|
+
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked && !EXCLUDED_ITEM_TYPES.has(item.itemType));
|
|
54213
54240
|
if (items.length === 0)
|
|
54214
54241
|
return;
|
|
54215
54242
|
const movedItems = items.map((item) => {
|
package/dist/esm/index.js
CHANGED
|
@@ -18037,9 +18037,9 @@ class Transformation {
|
|
|
18037
18037
|
}, timeStamp);
|
|
18038
18038
|
}
|
|
18039
18039
|
applyMatrixSilent(matrixData) {
|
|
18040
|
-
this.previous = this.
|
|
18041
|
-
this.
|
|
18042
|
-
this.
|
|
18040
|
+
this.previous = this._matrix.copy();
|
|
18041
|
+
this._matrix.scale(matrixData.scaleX, matrixData.scaleY);
|
|
18042
|
+
this._matrix.translate(matrixData.translateX, matrixData.translateY);
|
|
18043
18043
|
this.subject.publish(this, {
|
|
18044
18044
|
class: "Transformation",
|
|
18045
18045
|
method: "applyMatrix",
|
|
@@ -19189,13 +19189,18 @@ class Comment {
|
|
|
19189
19189
|
userId
|
|
19190
19190
|
});
|
|
19191
19191
|
}
|
|
19192
|
+
_syncing = false;
|
|
19192
19193
|
transform() {
|
|
19194
|
+
if (this._syncing)
|
|
19195
|
+
return;
|
|
19196
|
+
this._syncing = true;
|
|
19193
19197
|
const { translateX, translateY } = this.transformation.getMatrixData();
|
|
19194
19198
|
if (translateX && translateY) {
|
|
19195
19199
|
this.anchor = new Point(translateX, translateY);
|
|
19196
19200
|
} else {
|
|
19197
19201
|
this.transformation.setLocal(this.anchor.x, this.anchor.y);
|
|
19198
19202
|
}
|
|
19203
|
+
this._syncing = false;
|
|
19199
19204
|
}
|
|
19200
19205
|
getUnreadMessages(userId = ANONYMOUS_ID) {
|
|
19201
19206
|
const unreadMessages = this.thread.filter((mes) => mes && !mes.readers.includes(userId));
|
|
@@ -22022,7 +22027,6 @@ class RichText extends BaseItem {
|
|
|
22022
22027
|
_onLimitReached = () => {};
|
|
22023
22028
|
shrinkWidth = false;
|
|
22024
22029
|
prevMbr = null;
|
|
22025
|
-
worldMatrixGetter;
|
|
22026
22030
|
rtCounter = 0;
|
|
22027
22031
|
constructor(board, container, id = "", transformation = new Transformation(id, board.events), linkTo, placeholderText = conf.i18n?.t("board.textPlaceholder"), isInShape = false, autoSize = false, insideOf, initialTextStyles = conf.DEFAULT_TEXT_STYLES) {
|
|
22028
22032
|
super(board, id);
|
|
@@ -22245,18 +22249,7 @@ class RichText extends BaseItem {
|
|
|
22245
22249
|
top = container.top;
|
|
22246
22250
|
}
|
|
22247
22251
|
const point3 = new Point(left, top);
|
|
22248
|
-
|
|
22249
|
-
this.worldMatrixGetter().apply(point3);
|
|
22250
|
-
} else if (this.isInShape) {
|
|
22251
|
-
const item = this.board.items.getById(this.id);
|
|
22252
|
-
if (item) {
|
|
22253
|
-
item.getParentWorldMatrix().apply(point3);
|
|
22254
|
-
} else {
|
|
22255
|
-
this.getParentWorldMatrix().apply(point3);
|
|
22256
|
-
}
|
|
22257
|
-
} else {
|
|
22258
|
-
this.getParentWorldMatrix().apply(point3);
|
|
22259
|
-
}
|
|
22252
|
+
this.getParentWorldMatrix().apply(point3);
|
|
22260
22253
|
return {
|
|
22261
22254
|
point: point3,
|
|
22262
22255
|
width,
|
|
@@ -36360,6 +36353,11 @@ class AINode extends BaseItem {
|
|
|
36360
36353
|
this.linkTo.setId(id);
|
|
36361
36354
|
return this;
|
|
36362
36355
|
}
|
|
36356
|
+
onParentChanged(newParent) {
|
|
36357
|
+
if (this.text) {
|
|
36358
|
+
this.text.parent = newParent;
|
|
36359
|
+
}
|
|
36360
|
+
}
|
|
36363
36361
|
getId() {
|
|
36364
36362
|
return this.id;
|
|
36365
36363
|
}
|
|
@@ -39884,6 +39882,11 @@ class Shape extends BaseItem {
|
|
|
39884
39882
|
this.linkTo.setId(id);
|
|
39885
39883
|
return this;
|
|
39886
39884
|
}
|
|
39885
|
+
onParentChanged(newParent) {
|
|
39886
|
+
if (this.text) {
|
|
39887
|
+
this.text.parent = newParent;
|
|
39888
|
+
}
|
|
39889
|
+
}
|
|
39887
39890
|
getId() {
|
|
39888
39891
|
return this.id;
|
|
39889
39892
|
}
|
|
@@ -40416,6 +40419,11 @@ class Sticker extends BaseItem {
|
|
|
40416
40419
|
this.transformation.setId(id);
|
|
40417
40420
|
return this;
|
|
40418
40421
|
}
|
|
40422
|
+
onParentChanged(newParent) {
|
|
40423
|
+
if (this.text) {
|
|
40424
|
+
this.text.parent = newParent;
|
|
40425
|
+
}
|
|
40426
|
+
}
|
|
40419
40427
|
getId() {
|
|
40420
40428
|
return this.id;
|
|
40421
40429
|
}
|
|
@@ -40943,15 +40951,6 @@ class Frame2 extends BaseItem {
|
|
|
40943
40951
|
y: translateY
|
|
40944
40952
|
}, timeStamp);
|
|
40945
40953
|
const newMatrix = this.transformation.toMatrix();
|
|
40946
|
-
if (newMatrix.translateX !== oldMatrix.translateX || newMatrix.translateY !== oldMatrix.translateY) {
|
|
40947
|
-
const dx = newMatrix.translateX - oldMatrix.translateX;
|
|
40948
|
-
const dy = newMatrix.translateY - oldMatrix.translateY;
|
|
40949
|
-
this.index?.list().forEach((child) => {
|
|
40950
|
-
if (child instanceof BaseItem) {
|
|
40951
|
-
child.transformation.translateBy(-dx, -dy, timeStamp);
|
|
40952
|
-
}
|
|
40953
|
-
});
|
|
40954
|
-
}
|
|
40955
40954
|
this.setLastFrameScale();
|
|
40956
40955
|
res.mbr = this.getMbr();
|
|
40957
40956
|
return res;
|
|
@@ -54119,14 +54118,18 @@ class BoardSelection {
|
|
|
54119
54118
|
}
|
|
54120
54119
|
}
|
|
54121
54120
|
// src/Gravity/GravityEngine.ts
|
|
54121
|
+
var EXCLUDED_ITEM_TYPES = new Set(["Comment", "Connector"]);
|
|
54122
|
+
|
|
54122
54123
|
class GravityEngine {
|
|
54123
54124
|
board;
|
|
54124
54125
|
velocities = new Map;
|
|
54125
54126
|
tickTimer = null;
|
|
54126
54127
|
syncTimer = null;
|
|
54127
54128
|
lastSyncedPositions = new Map;
|
|
54128
|
-
G =
|
|
54129
|
-
|
|
54129
|
+
G = 80;
|
|
54130
|
+
G_CENTER = 120;
|
|
54131
|
+
DAMPING = 0.92;
|
|
54132
|
+
REPULSION = 60000;
|
|
54130
54133
|
TICK_MS = 33;
|
|
54131
54134
|
SYNC_MS = 300;
|
|
54132
54135
|
MAX_DISTANCE = 3000;
|
|
@@ -54158,9 +54161,18 @@ class GravityEngine {
|
|
|
54158
54161
|
}
|
|
54159
54162
|
tick() {
|
|
54160
54163
|
const dt = this.TICK_MS / 1000;
|
|
54161
|
-
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked);
|
|
54162
|
-
if (items.length <
|
|
54164
|
+
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked && !EXCLUDED_ITEM_TYPES.has(item.itemType));
|
|
54165
|
+
if (items.length < 1)
|
|
54163
54166
|
return;
|
|
54167
|
+
let sumX = 0;
|
|
54168
|
+
let sumY = 0;
|
|
54169
|
+
for (const item of items) {
|
|
54170
|
+
const pos = item.transformation.getTranslation();
|
|
54171
|
+
sumX += pos.x;
|
|
54172
|
+
sumY += pos.y;
|
|
54173
|
+
}
|
|
54174
|
+
const centerX = sumX / items.length;
|
|
54175
|
+
const centerY = sumY / items.length;
|
|
54164
54176
|
for (const item of items) {
|
|
54165
54177
|
const id = item.getId();
|
|
54166
54178
|
if (!this.velocities.has(id)) {
|
|
@@ -54169,30 +54181,45 @@ class GravityEngine {
|
|
|
54169
54181
|
const vel = this.velocities.get(id);
|
|
54170
54182
|
const pos1 = item.transformation.getTranslation();
|
|
54171
54183
|
const mbr1 = item.getMbr();
|
|
54172
|
-
const
|
|
54173
|
-
const
|
|
54184
|
+
const w1 = mbr1.getWidth();
|
|
54185
|
+
const h1 = mbr1.getHeight();
|
|
54174
54186
|
let ax = 0;
|
|
54175
54187
|
let ay = 0;
|
|
54188
|
+
const dcx = centerX - pos1.x;
|
|
54189
|
+
const dcy = centerY - pos1.y;
|
|
54190
|
+
const distCenter = Math.sqrt(dcx * dcx + dcy * dcy) + 1;
|
|
54191
|
+
ax += this.G_CENTER * dcx / distCenter;
|
|
54192
|
+
ay += this.G_CENTER * dcy / distCenter;
|
|
54193
|
+
const nearby = this.board.items.getEnclosedOrCrossed(pos1.x - this.MAX_DISTANCE, pos1.y - this.MAX_DISTANCE, pos1.x + this.MAX_DISTANCE * 2, pos1.y + this.MAX_DISTANCE * 2).filter((other) => other.getId() !== id && !EXCLUDED_ITEM_TYPES.has(other.itemType));
|
|
54176
54194
|
for (const other of nearby) {
|
|
54177
54195
|
const pos2 = other.transformation.getTranslation();
|
|
54178
54196
|
const mbr2 = other.getMbr();
|
|
54179
|
-
const
|
|
54180
|
-
const
|
|
54181
|
-
const
|
|
54182
|
-
const
|
|
54183
|
-
const
|
|
54184
|
-
const
|
|
54185
|
-
|
|
54186
|
-
|
|
54197
|
+
const w2 = mbr2.getWidth();
|
|
54198
|
+
const h2 = mbr2.getHeight();
|
|
54199
|
+
const mass2 = w2 * h2;
|
|
54200
|
+
const dx = pos2.x - pos1.x;
|
|
54201
|
+
const dy = pos2.y - pos1.y;
|
|
54202
|
+
const distSq = dx * dx + dy * dy;
|
|
54203
|
+
const dist = Math.sqrt(distSq) + 0.001;
|
|
54204
|
+
const minDist = (w1 + w2) * 0.5 + (h1 + h2) * 0.5;
|
|
54205
|
+
if (dist < minDist) {
|
|
54206
|
+
const repAcc = this.REPULSION / (distSq + this.SOFTENING_SQ);
|
|
54207
|
+
ax -= repAcc * dx / dist;
|
|
54208
|
+
ay -= repAcc * dy / dist;
|
|
54209
|
+
} else {
|
|
54210
|
+
const gravAcc = this.G * mass2 / (distSq + this.SOFTENING_SQ);
|
|
54211
|
+
ax += gravAcc * dx / dist;
|
|
54212
|
+
ay += gravAcc * dy / dist;
|
|
54213
|
+
}
|
|
54187
54214
|
}
|
|
54188
54215
|
vel.vx = (vel.vx + ax * dt) * this.DAMPING;
|
|
54189
54216
|
vel.vy = (vel.vy + ay * dt) * this.DAMPING;
|
|
54190
|
-
const
|
|
54191
|
-
const
|
|
54192
|
-
if (Math.abs(
|
|
54217
|
+
const moveX = vel.vx * dt;
|
|
54218
|
+
const moveY = vel.vy * dt;
|
|
54219
|
+
if (Math.abs(moveX) >= this.MIN_MOVE_PX || Math.abs(moveY) >= this.MIN_MOVE_PX) {
|
|
54193
54220
|
item.transformation.applyMatrixSilent({
|
|
54194
|
-
translateX:
|
|
54195
|
-
translateY:
|
|
54221
|
+
translateX: moveX,
|
|
54222
|
+
translateY: moveY,
|
|
54196
54223
|
scaleX: 1,
|
|
54197
54224
|
scaleY: 1,
|
|
54198
54225
|
shearX: 0,
|
|
@@ -54202,7 +54229,7 @@ class GravityEngine {
|
|
|
54202
54229
|
}
|
|
54203
54230
|
}
|
|
54204
54231
|
syncPositions() {
|
|
54205
|
-
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked);
|
|
54232
|
+
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked && !EXCLUDED_ITEM_TYPES.has(item.itemType));
|
|
54206
54233
|
if (items.length === 0)
|
|
54207
54234
|
return;
|
|
54208
54235
|
const movedItems = items.map((item) => {
|
package/dist/esm/node.js
CHANGED
|
@@ -20572,9 +20572,9 @@ class Transformation {
|
|
|
20572
20572
|
}, timeStamp);
|
|
20573
20573
|
}
|
|
20574
20574
|
applyMatrixSilent(matrixData) {
|
|
20575
|
-
this.previous = this.
|
|
20576
|
-
this.
|
|
20577
|
-
this.
|
|
20575
|
+
this.previous = this._matrix.copy();
|
|
20576
|
+
this._matrix.scale(matrixData.scaleX, matrixData.scaleY);
|
|
20577
|
+
this._matrix.translate(matrixData.translateX, matrixData.translateY);
|
|
20578
20578
|
this.subject.publish(this, {
|
|
20579
20579
|
class: "Transformation",
|
|
20580
20580
|
method: "applyMatrix",
|
|
@@ -21723,13 +21723,18 @@ class Comment {
|
|
|
21723
21723
|
userId
|
|
21724
21724
|
});
|
|
21725
21725
|
}
|
|
21726
|
+
_syncing = false;
|
|
21726
21727
|
transform() {
|
|
21728
|
+
if (this._syncing)
|
|
21729
|
+
return;
|
|
21730
|
+
this._syncing = true;
|
|
21727
21731
|
const { translateX, translateY } = this.transformation.getMatrixData();
|
|
21728
21732
|
if (translateX && translateY) {
|
|
21729
21733
|
this.anchor = new Point(translateX, translateY);
|
|
21730
21734
|
} else {
|
|
21731
21735
|
this.transformation.setLocal(this.anchor.x, this.anchor.y);
|
|
21732
21736
|
}
|
|
21737
|
+
this._syncing = false;
|
|
21733
21738
|
}
|
|
21734
21739
|
getUnreadMessages(userId = ANONYMOUS_ID) {
|
|
21735
21740
|
const unreadMessages = this.thread.filter((mes) => mes && !mes.readers.includes(userId));
|
|
@@ -24489,7 +24494,6 @@ class RichText extends BaseItem {
|
|
|
24489
24494
|
_onLimitReached = () => {};
|
|
24490
24495
|
shrinkWidth = false;
|
|
24491
24496
|
prevMbr = null;
|
|
24492
|
-
worldMatrixGetter;
|
|
24493
24497
|
rtCounter = 0;
|
|
24494
24498
|
constructor(board, container, id = "", transformation = new Transformation(id, board.events), linkTo, placeholderText = conf.i18n?.t("board.textPlaceholder"), isInShape = false, autoSize = false, insideOf, initialTextStyles = conf.DEFAULT_TEXT_STYLES) {
|
|
24495
24499
|
super(board, id);
|
|
@@ -24712,18 +24716,7 @@ class RichText extends BaseItem {
|
|
|
24712
24716
|
top = container.top;
|
|
24713
24717
|
}
|
|
24714
24718
|
const point3 = new Point(left, top);
|
|
24715
|
-
|
|
24716
|
-
this.worldMatrixGetter().apply(point3);
|
|
24717
|
-
} else if (this.isInShape) {
|
|
24718
|
-
const item = this.board.items.getById(this.id);
|
|
24719
|
-
if (item) {
|
|
24720
|
-
item.getParentWorldMatrix().apply(point3);
|
|
24721
|
-
} else {
|
|
24722
|
-
this.getParentWorldMatrix().apply(point3);
|
|
24723
|
-
}
|
|
24724
|
-
} else {
|
|
24725
|
-
this.getParentWorldMatrix().apply(point3);
|
|
24726
|
-
}
|
|
24719
|
+
this.getParentWorldMatrix().apply(point3);
|
|
24727
24720
|
return {
|
|
24728
24721
|
point: point3,
|
|
24729
24722
|
width,
|
|
@@ -38828,6 +38821,11 @@ class AINode extends BaseItem {
|
|
|
38828
38821
|
this.linkTo.setId(id);
|
|
38829
38822
|
return this;
|
|
38830
38823
|
}
|
|
38824
|
+
onParentChanged(newParent) {
|
|
38825
|
+
if (this.text) {
|
|
38826
|
+
this.text.parent = newParent;
|
|
38827
|
+
}
|
|
38828
|
+
}
|
|
38831
38829
|
getId() {
|
|
38832
38830
|
return this.id;
|
|
38833
38831
|
}
|
|
@@ -42352,6 +42350,11 @@ class Shape extends BaseItem {
|
|
|
42352
42350
|
this.linkTo.setId(id);
|
|
42353
42351
|
return this;
|
|
42354
42352
|
}
|
|
42353
|
+
onParentChanged(newParent) {
|
|
42354
|
+
if (this.text) {
|
|
42355
|
+
this.text.parent = newParent;
|
|
42356
|
+
}
|
|
42357
|
+
}
|
|
42355
42358
|
getId() {
|
|
42356
42359
|
return this.id;
|
|
42357
42360
|
}
|
|
@@ -42884,6 +42887,11 @@ class Sticker extends BaseItem {
|
|
|
42884
42887
|
this.transformation.setId(id);
|
|
42885
42888
|
return this;
|
|
42886
42889
|
}
|
|
42890
|
+
onParentChanged(newParent) {
|
|
42891
|
+
if (this.text) {
|
|
42892
|
+
this.text.parent = newParent;
|
|
42893
|
+
}
|
|
42894
|
+
}
|
|
42887
42895
|
getId() {
|
|
42888
42896
|
return this.id;
|
|
42889
42897
|
}
|
|
@@ -43411,15 +43419,6 @@ class Frame2 extends BaseItem {
|
|
|
43411
43419
|
y: translateY
|
|
43412
43420
|
}, timeStamp);
|
|
43413
43421
|
const newMatrix = this.transformation.toMatrix();
|
|
43414
|
-
if (newMatrix.translateX !== oldMatrix.translateX || newMatrix.translateY !== oldMatrix.translateY) {
|
|
43415
|
-
const dx = newMatrix.translateX - oldMatrix.translateX;
|
|
43416
|
-
const dy = newMatrix.translateY - oldMatrix.translateY;
|
|
43417
|
-
this.index?.list().forEach((child) => {
|
|
43418
|
-
if (child instanceof BaseItem) {
|
|
43419
|
-
child.transformation.translateBy(-dx, -dy, timeStamp);
|
|
43420
|
-
}
|
|
43421
|
-
});
|
|
43422
|
-
}
|
|
43423
43422
|
this.setLastFrameScale();
|
|
43424
43423
|
res.mbr = this.getMbr();
|
|
43425
43424
|
return res;
|
|
@@ -56587,14 +56586,18 @@ class BoardSelection {
|
|
|
56587
56586
|
}
|
|
56588
56587
|
}
|
|
56589
56588
|
// src/Gravity/GravityEngine.ts
|
|
56589
|
+
var EXCLUDED_ITEM_TYPES = new Set(["Comment", "Connector"]);
|
|
56590
|
+
|
|
56590
56591
|
class GravityEngine {
|
|
56591
56592
|
board;
|
|
56592
56593
|
velocities = new Map;
|
|
56593
56594
|
tickTimer = null;
|
|
56594
56595
|
syncTimer = null;
|
|
56595
56596
|
lastSyncedPositions = new Map;
|
|
56596
|
-
G =
|
|
56597
|
-
|
|
56597
|
+
G = 80;
|
|
56598
|
+
G_CENTER = 120;
|
|
56599
|
+
DAMPING = 0.92;
|
|
56600
|
+
REPULSION = 60000;
|
|
56598
56601
|
TICK_MS = 33;
|
|
56599
56602
|
SYNC_MS = 300;
|
|
56600
56603
|
MAX_DISTANCE = 3000;
|
|
@@ -56626,9 +56629,18 @@ class GravityEngine {
|
|
|
56626
56629
|
}
|
|
56627
56630
|
tick() {
|
|
56628
56631
|
const dt = this.TICK_MS / 1000;
|
|
56629
|
-
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked);
|
|
56630
|
-
if (items.length <
|
|
56632
|
+
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked && !EXCLUDED_ITEM_TYPES.has(item.itemType));
|
|
56633
|
+
if (items.length < 1)
|
|
56631
56634
|
return;
|
|
56635
|
+
let sumX = 0;
|
|
56636
|
+
let sumY = 0;
|
|
56637
|
+
for (const item of items) {
|
|
56638
|
+
const pos = item.transformation.getTranslation();
|
|
56639
|
+
sumX += pos.x;
|
|
56640
|
+
sumY += pos.y;
|
|
56641
|
+
}
|
|
56642
|
+
const centerX = sumX / items.length;
|
|
56643
|
+
const centerY = sumY / items.length;
|
|
56632
56644
|
for (const item of items) {
|
|
56633
56645
|
const id = item.getId();
|
|
56634
56646
|
if (!this.velocities.has(id)) {
|
|
@@ -56637,30 +56649,45 @@ class GravityEngine {
|
|
|
56637
56649
|
const vel = this.velocities.get(id);
|
|
56638
56650
|
const pos1 = item.transformation.getTranslation();
|
|
56639
56651
|
const mbr1 = item.getMbr();
|
|
56640
|
-
const
|
|
56641
|
-
const
|
|
56652
|
+
const w1 = mbr1.getWidth();
|
|
56653
|
+
const h1 = mbr1.getHeight();
|
|
56642
56654
|
let ax = 0;
|
|
56643
56655
|
let ay = 0;
|
|
56656
|
+
const dcx = centerX - pos1.x;
|
|
56657
|
+
const dcy = centerY - pos1.y;
|
|
56658
|
+
const distCenter = Math.sqrt(dcx * dcx + dcy * dcy) + 1;
|
|
56659
|
+
ax += this.G_CENTER * dcx / distCenter;
|
|
56660
|
+
ay += this.G_CENTER * dcy / distCenter;
|
|
56661
|
+
const nearby = this.board.items.getEnclosedOrCrossed(pos1.x - this.MAX_DISTANCE, pos1.y - this.MAX_DISTANCE, pos1.x + this.MAX_DISTANCE * 2, pos1.y + this.MAX_DISTANCE * 2).filter((other) => other.getId() !== id && !EXCLUDED_ITEM_TYPES.has(other.itemType));
|
|
56644
56662
|
for (const other of nearby) {
|
|
56645
56663
|
const pos2 = other.transformation.getTranslation();
|
|
56646
56664
|
const mbr2 = other.getMbr();
|
|
56647
|
-
const
|
|
56648
|
-
const
|
|
56649
|
-
const
|
|
56650
|
-
const
|
|
56651
|
-
const
|
|
56652
|
-
const
|
|
56653
|
-
|
|
56654
|
-
|
|
56665
|
+
const w2 = mbr2.getWidth();
|
|
56666
|
+
const h2 = mbr2.getHeight();
|
|
56667
|
+
const mass2 = w2 * h2;
|
|
56668
|
+
const dx = pos2.x - pos1.x;
|
|
56669
|
+
const dy = pos2.y - pos1.y;
|
|
56670
|
+
const distSq = dx * dx + dy * dy;
|
|
56671
|
+
const dist = Math.sqrt(distSq) + 0.001;
|
|
56672
|
+
const minDist = (w1 + w2) * 0.5 + (h1 + h2) * 0.5;
|
|
56673
|
+
if (dist < minDist) {
|
|
56674
|
+
const repAcc = this.REPULSION / (distSq + this.SOFTENING_SQ);
|
|
56675
|
+
ax -= repAcc * dx / dist;
|
|
56676
|
+
ay -= repAcc * dy / dist;
|
|
56677
|
+
} else {
|
|
56678
|
+
const gravAcc = this.G * mass2 / (distSq + this.SOFTENING_SQ);
|
|
56679
|
+
ax += gravAcc * dx / dist;
|
|
56680
|
+
ay += gravAcc * dy / dist;
|
|
56681
|
+
}
|
|
56655
56682
|
}
|
|
56656
56683
|
vel.vx = (vel.vx + ax * dt) * this.DAMPING;
|
|
56657
56684
|
vel.vy = (vel.vy + ay * dt) * this.DAMPING;
|
|
56658
|
-
const
|
|
56659
|
-
const
|
|
56660
|
-
if (Math.abs(
|
|
56685
|
+
const moveX = vel.vx * dt;
|
|
56686
|
+
const moveY = vel.vy * dt;
|
|
56687
|
+
if (Math.abs(moveX) >= this.MIN_MOVE_PX || Math.abs(moveY) >= this.MIN_MOVE_PX) {
|
|
56661
56688
|
item.transformation.applyMatrixSilent({
|
|
56662
|
-
translateX:
|
|
56663
|
-
translateY:
|
|
56689
|
+
translateX: moveX,
|
|
56690
|
+
translateY: moveY,
|
|
56664
56691
|
scaleX: 1,
|
|
56665
56692
|
scaleY: 1,
|
|
56666
56693
|
shearX: 0,
|
|
@@ -56670,7 +56697,7 @@ class GravityEngine {
|
|
|
56670
56697
|
}
|
|
56671
56698
|
}
|
|
56672
56699
|
syncPositions() {
|
|
56673
|
-
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked);
|
|
56700
|
+
const items = this.board.items.listAll().filter((item) => !item.transformation.isLocked && !EXCLUDED_ITEM_TYPES.has(item.itemType));
|
|
56674
56701
|
if (items.length === 0)
|
|
56675
56702
|
return;
|
|
56676
56703
|
const movedItems = items.map((item) => {
|
|
@@ -5,8 +5,10 @@ export declare class GravityEngine {
|
|
|
5
5
|
private tickTimer;
|
|
6
6
|
private syncTimer;
|
|
7
7
|
private lastSyncedPositions;
|
|
8
|
-
readonly G =
|
|
9
|
-
readonly
|
|
8
|
+
readonly G = 80;
|
|
9
|
+
readonly G_CENTER = 120;
|
|
10
|
+
readonly DAMPING = 0.92;
|
|
11
|
+
readonly REPULSION = 60000;
|
|
10
12
|
readonly TICK_MS = 33;
|
|
11
13
|
readonly SYNC_MS = 300;
|
|
12
14
|
readonly MAX_DISTANCE = 3000;
|
|
@@ -40,6 +40,7 @@ export declare class AINode extends BaseItem {
|
|
|
40
40
|
serialize(isCopy?: boolean): AINodeData;
|
|
41
41
|
deserialize(data: Partial<AINodeData>): this;
|
|
42
42
|
setId(id: string): this;
|
|
43
|
+
protected onParentChanged(newParent: string): void;
|
|
43
44
|
getId(): string;
|
|
44
45
|
getContextItems(): string[];
|
|
45
46
|
getThreadDirection(): ThreadDirection;
|