@netless/forge-whiteboard 0.1.10 → 0.1.11
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/changelog.md +5 -1
- package/dist/Camera.d.ts +2 -1
- package/dist/Camera.d.ts.map +1 -1
- package/dist/WhitePermissions.d.ts.map +1 -1
- package/dist/Whiteboard.d.ts +2 -1
- package/dist/Whiteboard.d.ts.map +1 -1
- package/dist/WhiteboardApplication.d.ts +13 -0
- package/dist/WhiteboardApplication.d.ts.map +1 -1
- package/dist/model/RenderableModel.d.ts +1 -0
- package/dist/model/RenderableModel.d.ts.map +1 -1
- package/dist/model/ToolbarModel.d.ts +2 -2
- package/dist/model/ToolbarModel.d.ts.map +1 -1
- package/dist/model/renderable/ElementModel.d.ts +2 -2
- package/dist/model/renderable/ElementModel.d.ts.map +1 -1
- package/dist/whiteboard.esm.js +2002 -1390
- package/dist/whiteboard.esm.js.map +3 -3
- package/dist/whiteboard.js +2002 -1390
- package/dist/whiteboard.js.map +3 -3
- package/package.json +7 -6
- package/dist/utils/paper.d.ts +0 -2
- package/dist/utils/paper.d.ts.map +0 -1
package/dist/whiteboard.esm.js
CHANGED
|
@@ -25526,23 +25526,26 @@ var import_lodash = __toESM(require_lodash(), 1);
|
|
|
25526
25526
|
|
|
25527
25527
|
// src/model/renderable/ElementModel.ts
|
|
25528
25528
|
import * as Y from "yjs";
|
|
25529
|
+
function _defineProperty(e, r, t) {
|
|
25530
|
+
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25531
|
+
}
|
|
25532
|
+
function _toPropertyKey(t) {
|
|
25533
|
+
var i = _toPrimitive(t, "string");
|
|
25534
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25535
|
+
}
|
|
25536
|
+
function _toPrimitive(t, r) {
|
|
25537
|
+
if ("object" != typeof t || !t) return t;
|
|
25538
|
+
var e = t[Symbol.toPrimitive];
|
|
25539
|
+
if (void 0 !== e) {
|
|
25540
|
+
var i = e.call(t, r || "default");
|
|
25541
|
+
if ("object" != typeof i) return i;
|
|
25542
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25543
|
+
}
|
|
25544
|
+
return ("string" === r ? String : Number)(t);
|
|
25545
|
+
}
|
|
25529
25546
|
var ElementModel = class _ElementModel {
|
|
25530
|
-
|
|
25531
|
-
|
|
25532
|
-
uuid: "uuid",
|
|
25533
|
-
strokeWidth: "strokeWidth",
|
|
25534
|
-
strokeColor: "strokeColor",
|
|
25535
|
-
fillColor: "fillColor",
|
|
25536
|
-
dashArray: "dashArray",
|
|
25537
|
-
pointsMatrix: "pointsMatrix",
|
|
25538
|
-
points: "points",
|
|
25539
|
-
ownerId: "ownerId",
|
|
25540
|
-
ctrlId: "ctrlId",
|
|
25541
|
-
shadow: "shadow"
|
|
25542
|
-
};
|
|
25543
|
-
shadowEmitter = null;
|
|
25544
|
-
root;
|
|
25545
|
-
scope;
|
|
25547
|
+
// 矢量数据发生变化后调用
|
|
25548
|
+
// 哪些属性变化后需要调用 onVectorUpdate
|
|
25546
25549
|
get index() {
|
|
25547
25550
|
return this.root.get(_ElementModel.KEYS.index);
|
|
25548
25551
|
}
|
|
@@ -25604,6 +25607,49 @@ var ElementModel = class _ElementModel {
|
|
|
25604
25607
|
this.root.set(_ElementModel.KEYS.shadow, value);
|
|
25605
25608
|
}
|
|
25606
25609
|
constructor(root, scope) {
|
|
25610
|
+
_defineProperty(this, "shadowEmitter", null);
|
|
25611
|
+
_defineProperty(this, "root", void 0);
|
|
25612
|
+
_defineProperty(this, "scope", void 0);
|
|
25613
|
+
_defineProperty(this, "item", void 0);
|
|
25614
|
+
_defineProperty(this, "handlePropChange", (events) => {
|
|
25615
|
+
if (!this.item) {
|
|
25616
|
+
return;
|
|
25617
|
+
}
|
|
25618
|
+
for (const event of events) {
|
|
25619
|
+
if (event.target === this.root) {
|
|
25620
|
+
const updatePaperItemKeys = this.vectorKeys().concat([_ElementModel.KEYS.pointsMatrix]);
|
|
25621
|
+
for (const [key, value] of event.changes.keys.entries()) {
|
|
25622
|
+
if (value.action === "update") {
|
|
25623
|
+
const includeKeys = this.styleKeys().include;
|
|
25624
|
+
if (includeKeys.indexOf(key) >= 0) {
|
|
25625
|
+
this.onStyleKeyUpdate(key);
|
|
25626
|
+
return;
|
|
25627
|
+
}
|
|
25628
|
+
if (updatePaperItemKeys.indexOf(key) >= 0) {
|
|
25629
|
+
this.onVectorUpdate();
|
|
25630
|
+
} else if (key === _ElementModel.KEYS.strokeColor) {
|
|
25631
|
+
this.item.strokeColor = new this.scope.Color(this.strokeColor);
|
|
25632
|
+
} else if (key === _ElementModel.KEYS.fillColor && this.fillColor) {
|
|
25633
|
+
this.item.fillColor = new this.scope.Color(this.fillColor);
|
|
25634
|
+
} else if (key === _ElementModel.KEYS.strokeWidth) {
|
|
25635
|
+
this.item.strokeWidth = this.strokeWidth;
|
|
25636
|
+
} else if (key === _ElementModel.KEYS.dashArray) {
|
|
25637
|
+
this.item.dashArray = this.dashArray;
|
|
25638
|
+
} else if (key === _ElementModel.KEYS.shadow) {
|
|
25639
|
+
if (this.shadow !== "") {
|
|
25640
|
+
this.shadowEmitter?.emit("translateIn", [this.uuid], this.shadow);
|
|
25641
|
+
} else {
|
|
25642
|
+
this.shadowEmitter?.emit("translateOut", [this.uuid], value.oldValue);
|
|
25643
|
+
}
|
|
25644
|
+
}
|
|
25645
|
+
}
|
|
25646
|
+
}
|
|
25647
|
+
} else if (event.target === this.root.get(_ElementModel.KEYS.points)) {
|
|
25648
|
+
this.onVectorUpdate();
|
|
25649
|
+
} else {
|
|
25650
|
+
}
|
|
25651
|
+
}
|
|
25652
|
+
});
|
|
25607
25653
|
this.scope = scope;
|
|
25608
25654
|
this.root = root;
|
|
25609
25655
|
if (!this.root.has(_ElementModel.KEYS.pointsMatrix)) {
|
|
@@ -25611,45 +25657,6 @@ var ElementModel = class _ElementModel {
|
|
|
25611
25657
|
}
|
|
25612
25658
|
this.root.observeDeep(this.handlePropChange);
|
|
25613
25659
|
}
|
|
25614
|
-
handlePropChange = (events) => {
|
|
25615
|
-
if (!this.item) {
|
|
25616
|
-
return;
|
|
25617
|
-
}
|
|
25618
|
-
for (const event of events) {
|
|
25619
|
-
if (event.target === this.root) {
|
|
25620
|
-
const updatePaperItemKeys = this.vectorKeys().concat([_ElementModel.KEYS.pointsMatrix]);
|
|
25621
|
-
for (const [key, value] of event.changes.keys.entries()) {
|
|
25622
|
-
if (value.action === "update") {
|
|
25623
|
-
const includeKeys = this.styleKeys().include;
|
|
25624
|
-
if (includeKeys.indexOf(key) >= 0) {
|
|
25625
|
-
this.onStyleKeyUpdate(key);
|
|
25626
|
-
return;
|
|
25627
|
-
}
|
|
25628
|
-
if (updatePaperItemKeys.indexOf(key) >= 0) {
|
|
25629
|
-
this.onVectorUpdate();
|
|
25630
|
-
} else if (key === _ElementModel.KEYS.strokeColor) {
|
|
25631
|
-
this.item.strokeColor = new this.scope.Color(this.strokeColor);
|
|
25632
|
-
} else if (key === _ElementModel.KEYS.fillColor) {
|
|
25633
|
-
this.item.fillColor = new this.scope.Color(this.fillColor);
|
|
25634
|
-
} else if (key === _ElementModel.KEYS.strokeWidth) {
|
|
25635
|
-
this.item.strokeWidth = this.strokeWidth;
|
|
25636
|
-
} else if (key === _ElementModel.KEYS.dashArray) {
|
|
25637
|
-
this.item.dashArray = this.dashArray;
|
|
25638
|
-
} else if (key === _ElementModel.KEYS.shadow) {
|
|
25639
|
-
if (this.shadow !== "") {
|
|
25640
|
-
this.shadowEmitter?.emit("translateIn", [this.uuid], this.shadow);
|
|
25641
|
-
} else {
|
|
25642
|
-
this.shadowEmitter?.emit("translateOut", [this.uuid], value.oldValue);
|
|
25643
|
-
}
|
|
25644
|
-
}
|
|
25645
|
-
}
|
|
25646
|
-
}
|
|
25647
|
-
} else if (event.target === this.root.get(_ElementModel.KEYS.points)) {
|
|
25648
|
-
this.onVectorUpdate();
|
|
25649
|
-
} else {
|
|
25650
|
-
}
|
|
25651
|
-
}
|
|
25652
|
-
};
|
|
25653
25660
|
createPaperElement() {
|
|
25654
25661
|
this.createPaperItem();
|
|
25655
25662
|
if (this.item) {
|
|
@@ -25702,16 +25709,45 @@ var ElementModel = class _ElementModel {
|
|
|
25702
25709
|
return Array.from(new Set(["dashArray", "strokeColor", "fillColor", "strokeWidth"].filter((v) => ext.exclude.indexOf(v) < 0).concat(ext.include)));
|
|
25703
25710
|
}
|
|
25704
25711
|
};
|
|
25712
|
+
_defineProperty(ElementModel, "KEYS", {
|
|
25713
|
+
index: "index",
|
|
25714
|
+
uuid: "uuid",
|
|
25715
|
+
strokeWidth: "strokeWidth",
|
|
25716
|
+
strokeColor: "strokeColor",
|
|
25717
|
+
fillColor: "fillColor",
|
|
25718
|
+
dashArray: "dashArray",
|
|
25719
|
+
pointsMatrix: "pointsMatrix",
|
|
25720
|
+
points: "points",
|
|
25721
|
+
ownerId: "ownerId",
|
|
25722
|
+
ctrlId: "ctrlId",
|
|
25723
|
+
shadow: "shadow"
|
|
25724
|
+
});
|
|
25705
25725
|
|
|
25706
25726
|
// src/edit/EditorConfig.ts
|
|
25727
|
+
function _defineProperty2(e, r, t) {
|
|
25728
|
+
return (r = _toPropertyKey2(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25729
|
+
}
|
|
25730
|
+
function _toPropertyKey2(t) {
|
|
25731
|
+
var i = _toPrimitive2(t, "string");
|
|
25732
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25733
|
+
}
|
|
25734
|
+
function _toPrimitive2(t, r) {
|
|
25735
|
+
if ("object" != typeof t || !t) return t;
|
|
25736
|
+
var e = t[Symbol.toPrimitive];
|
|
25737
|
+
if (void 0 !== e) {
|
|
25738
|
+
var i = e.call(t, r || "default");
|
|
25739
|
+
if ("object" != typeof i) return i;
|
|
25740
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25741
|
+
}
|
|
25742
|
+
return ("string" === r ? String : Number)(t);
|
|
25743
|
+
}
|
|
25707
25744
|
var RESIZE_MODEL_LEVEL = ["horizontal", "four-corner", "four", "eight"];
|
|
25708
25745
|
var EditorConfig = class _EditorConfig {
|
|
25709
|
-
|
|
25710
|
-
|
|
25711
|
-
|
|
25712
|
-
|
|
25713
|
-
|
|
25714
|
-
controlPoints = [];
|
|
25746
|
+
constructor() {
|
|
25747
|
+
_defineProperty2(this, "resizeModel", () => "eight");
|
|
25748
|
+
_defineProperty2(this, "uniformScale", () => false);
|
|
25749
|
+
_defineProperty2(this, "controlPoints", []);
|
|
25750
|
+
}
|
|
25715
25751
|
merge(other) {
|
|
25716
25752
|
const next = new _EditorConfig();
|
|
25717
25753
|
const i = RESIZE_MODEL_LEVEL.findIndex((v) => v === this.resizeModel());
|
|
@@ -25724,10 +25760,27 @@ var EditorConfig = class _EditorConfig {
|
|
|
25724
25760
|
};
|
|
25725
25761
|
|
|
25726
25762
|
// src/model/renderable/CurveModel.ts
|
|
25763
|
+
function _defineProperty3(e, r, t) {
|
|
25764
|
+
return (r = _toPropertyKey3(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25765
|
+
}
|
|
25766
|
+
function _toPropertyKey3(t) {
|
|
25767
|
+
var i = _toPrimitive3(t, "string");
|
|
25768
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25769
|
+
}
|
|
25770
|
+
function _toPrimitive3(t, r) {
|
|
25771
|
+
if ("object" != typeof t || !t) return t;
|
|
25772
|
+
var e = t[Symbol.toPrimitive];
|
|
25773
|
+
if (void 0 !== e) {
|
|
25774
|
+
var i = e.call(t, r || "default");
|
|
25775
|
+
if ("object" != typeof i) return i;
|
|
25776
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25777
|
+
}
|
|
25778
|
+
return ("string" === r ? String : Number)(t);
|
|
25779
|
+
}
|
|
25727
25780
|
var CurveModel = class extends ElementModel {
|
|
25728
|
-
item = null;
|
|
25729
25781
|
constructor(root, scope) {
|
|
25730
25782
|
super(root, scope);
|
|
25783
|
+
_defineProperty3(this, "item", null);
|
|
25731
25784
|
if (!this.root.has("type")) {
|
|
25732
25785
|
this.root.set("type", "curve");
|
|
25733
25786
|
}
|
|
@@ -25758,7 +25811,10 @@ var CurveModel = class extends ElementModel {
|
|
|
25758
25811
|
}
|
|
25759
25812
|
matrixedPoints() {
|
|
25760
25813
|
const groupPoints = (0, import_lodash.chunk)(this.points, 2);
|
|
25761
|
-
return groupPoints.map((
|
|
25814
|
+
return groupPoints.map((_ref) => {
|
|
25815
|
+
let [x, y] = _ref;
|
|
25816
|
+
return new this.scope.Point(x, y);
|
|
25817
|
+
}).map((p) => p.transform(new this.scope.Matrix(this.pointsMatrix))).reduce((result, next) => {
|
|
25762
25818
|
result.push(next.x);
|
|
25763
25819
|
result.push(next.y);
|
|
25764
25820
|
return result;
|
|
@@ -25836,10 +25892,27 @@ var CurveModel = class extends ElementModel {
|
|
|
25836
25892
|
|
|
25837
25893
|
// src/model/renderable/SelectorModel.ts
|
|
25838
25894
|
import * as Y3 from "yjs";
|
|
25895
|
+
function _defineProperty4(e, r, t) {
|
|
25896
|
+
return (r = _toPropertyKey4(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25897
|
+
}
|
|
25898
|
+
function _toPropertyKey4(t) {
|
|
25899
|
+
var i = _toPrimitive4(t, "string");
|
|
25900
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25901
|
+
}
|
|
25902
|
+
function _toPrimitive4(t, r) {
|
|
25903
|
+
if ("object" != typeof t || !t) return t;
|
|
25904
|
+
var e = t[Symbol.toPrimitive];
|
|
25905
|
+
if (void 0 !== e) {
|
|
25906
|
+
var i = e.call(t, r || "default");
|
|
25907
|
+
if ("object" != typeof i) return i;
|
|
25908
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25909
|
+
}
|
|
25910
|
+
return ("string" === r ? String : Number)(t);
|
|
25911
|
+
}
|
|
25839
25912
|
var SelectorModel = class extends ElementModel {
|
|
25840
|
-
item = null;
|
|
25841
25913
|
constructor(root, scope) {
|
|
25842
25914
|
super(root, scope);
|
|
25915
|
+
_defineProperty4(this, "item", null);
|
|
25843
25916
|
if (!this.root.has("type")) {
|
|
25844
25917
|
this.root.set("type", "selector");
|
|
25845
25918
|
}
|
|
@@ -25851,10 +25924,7 @@ var SelectorModel = class extends ElementModel {
|
|
|
25851
25924
|
}
|
|
25852
25925
|
createPaperRect() {
|
|
25853
25926
|
const scope = this.scope;
|
|
25854
|
-
const bounds = new scope.Rectangle(
|
|
25855
|
-
new scope.Point(this.points[0], this.points[1]),
|
|
25856
|
-
new scope.Size(this.points[2], this.points[3])
|
|
25857
|
-
);
|
|
25927
|
+
const bounds = new scope.Rectangle(new scope.Point(this.points[0], this.points[1]), new scope.Size(this.points[2], this.points[3]));
|
|
25858
25928
|
return new scope.Path.Rectangle(
|
|
25859
25929
|
bounds,
|
|
25860
25930
|
new scope.Point(this.points[4], this.points[4])
|
|
@@ -25894,22 +25964,28 @@ import * as Y4 from "yjs";
|
|
|
25894
25964
|
|
|
25895
25965
|
// src/utils/paperjs.ts
|
|
25896
25966
|
var import_lodash2 = __toESM(require_lodash(), 1);
|
|
25967
|
+
function _defineProperty5(e, r, t) {
|
|
25968
|
+
return (r = _toPropertyKey5(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25969
|
+
}
|
|
25970
|
+
function _toPropertyKey5(t) {
|
|
25971
|
+
var i = _toPrimitive5(t, "string");
|
|
25972
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25973
|
+
}
|
|
25974
|
+
function _toPrimitive5(t, r) {
|
|
25975
|
+
if ("object" != typeof t || !t) return t;
|
|
25976
|
+
var e = t[Symbol.toPrimitive];
|
|
25977
|
+
if (void 0 !== e) {
|
|
25978
|
+
var i = e.call(t, r || "default");
|
|
25979
|
+
if ("object" != typeof i) return i;
|
|
25980
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25981
|
+
}
|
|
25982
|
+
return ("string" === r ? String : Number)(t);
|
|
25983
|
+
}
|
|
25897
25984
|
function serializeSegment(segment) {
|
|
25898
|
-
return [
|
|
25899
|
-
segment.point.x,
|
|
25900
|
-
segment.point.y,
|
|
25901
|
-
segment.handleIn.x,
|
|
25902
|
-
segment.handleIn.y,
|
|
25903
|
-
segment.handleOut.x,
|
|
25904
|
-
segment.handleOut.y
|
|
25905
|
-
];
|
|
25985
|
+
return [segment.point.x, segment.point.y, segment.handleIn.x, segment.handleIn.y, segment.handleOut.x, segment.handleOut.y];
|
|
25906
25986
|
}
|
|
25907
25987
|
function deserializeSegment(points, scope, matrix) {
|
|
25908
|
-
const segment = new scope.Segment(
|
|
25909
|
-
new scope.Point(points[0], points[1]),
|
|
25910
|
-
new scope.Point(points[2], points[3]),
|
|
25911
|
-
new scope.Point(points[4], points[5])
|
|
25912
|
-
);
|
|
25988
|
+
const segment = new scope.Segment(new scope.Point(points[0], points[1]), new scope.Point(points[2], points[3]), new scope.Point(points[4], points[5]));
|
|
25913
25989
|
segment.transform(matrix);
|
|
25914
25990
|
return segment;
|
|
25915
25991
|
}
|
|
@@ -25926,29 +26002,29 @@ function deserializePath(points, scope, matrix) {
|
|
|
25926
26002
|
return path;
|
|
25927
26003
|
}
|
|
25928
26004
|
var AnimationFrame = class {
|
|
25929
|
-
callbacks = [];
|
|
25930
|
-
lastTime = 0;
|
|
25931
|
-
fps = 45;
|
|
25932
26005
|
constructor() {
|
|
26006
|
+
_defineProperty5(this, "callbacks", []);
|
|
26007
|
+
_defineProperty5(this, "lastTime", 0);
|
|
26008
|
+
_defineProperty5(this, "fps", 45);
|
|
26009
|
+
_defineProperty5(this, "handleCallbacks", () => {
|
|
26010
|
+
let functions = this.callbacks;
|
|
26011
|
+
this.callbacks = [];
|
|
26012
|
+
for (let i = 0, l2 = functions.length; i < l2; i++) {
|
|
26013
|
+
functions[i]();
|
|
26014
|
+
}
|
|
26015
|
+
});
|
|
26016
|
+
_defineProperty5(this, "addCallback", (callback) => {
|
|
26017
|
+
this.callbacks.push(callback);
|
|
26018
|
+
});
|
|
26019
|
+
_defineProperty5(this, "handleFrame", (time) => {
|
|
26020
|
+
if (time - this.lastTime > 1e3 / this.fps) {
|
|
26021
|
+
this.handleCallbacks();
|
|
26022
|
+
this.lastTime = time;
|
|
26023
|
+
}
|
|
26024
|
+
window.requestAnimationFrame(this.handleFrame);
|
|
26025
|
+
});
|
|
25933
26026
|
window.requestAnimationFrame(this.handleFrame);
|
|
25934
26027
|
}
|
|
25935
|
-
handleCallbacks = () => {
|
|
25936
|
-
let functions = this.callbacks;
|
|
25937
|
-
this.callbacks = [];
|
|
25938
|
-
for (let i = 0, l2 = functions.length; i < l2; i++) {
|
|
25939
|
-
functions[i]();
|
|
25940
|
-
}
|
|
25941
|
-
};
|
|
25942
|
-
addCallback = (callback) => {
|
|
25943
|
-
this.callbacks.push(callback);
|
|
25944
|
-
};
|
|
25945
|
-
handleFrame = (time) => {
|
|
25946
|
-
if (time - this.lastTime > 1e3 / this.fps) {
|
|
25947
|
-
this.handleCallbacks();
|
|
25948
|
-
this.lastTime = time;
|
|
25949
|
-
}
|
|
25950
|
-
window.requestAnimationFrame(this.handleFrame);
|
|
25951
|
-
};
|
|
25952
26028
|
};
|
|
25953
26029
|
function requestAnimationFrameHook(scope) {
|
|
25954
26030
|
const animationFrame = new AnimationFrame();
|
|
@@ -25956,10 +26032,27 @@ function requestAnimationFrameHook(scope) {
|
|
|
25956
26032
|
}
|
|
25957
26033
|
|
|
25958
26034
|
// src/model/renderable/SegmentsModel.ts
|
|
26035
|
+
function _defineProperty6(e, r, t) {
|
|
26036
|
+
return (r = _toPropertyKey6(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26037
|
+
}
|
|
26038
|
+
function _toPropertyKey6(t) {
|
|
26039
|
+
var i = _toPrimitive6(t, "string");
|
|
26040
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26041
|
+
}
|
|
26042
|
+
function _toPrimitive6(t, r) {
|
|
26043
|
+
if ("object" != typeof t || !t) return t;
|
|
26044
|
+
var e = t[Symbol.toPrimitive];
|
|
26045
|
+
if (void 0 !== e) {
|
|
26046
|
+
var i = e.call(t, r || "default");
|
|
26047
|
+
if ("object" != typeof i) return i;
|
|
26048
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26049
|
+
}
|
|
26050
|
+
return ("string" === r ? String : Number)(t);
|
|
26051
|
+
}
|
|
25959
26052
|
var SegmentsModel = class extends ElementModel {
|
|
25960
|
-
item = null;
|
|
25961
26053
|
constructor(root, scope, type) {
|
|
25962
26054
|
super(root, scope);
|
|
26055
|
+
_defineProperty6(this, "item", null);
|
|
25963
26056
|
if (!this.root.has("type")) {
|
|
25964
26057
|
this.root.set("type", type);
|
|
25965
26058
|
}
|
|
@@ -26010,14 +26103,52 @@ var import_lodash4 = __toESM(require_lodash(), 1);
|
|
|
26010
26103
|
import * as Y5 from "yjs";
|
|
26011
26104
|
|
|
26012
26105
|
// src/tool/WhiteboardTool.ts
|
|
26106
|
+
function _defineProperty7(e, r, t) {
|
|
26107
|
+
return (r = _toPropertyKey7(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26108
|
+
}
|
|
26109
|
+
function _toPropertyKey7(t) {
|
|
26110
|
+
var i = _toPrimitive7(t, "string");
|
|
26111
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26112
|
+
}
|
|
26113
|
+
function _toPrimitive7(t, r) {
|
|
26114
|
+
if ("object" != typeof t || !t) return t;
|
|
26115
|
+
var e = t[Symbol.toPrimitive];
|
|
26116
|
+
if (void 0 !== e) {
|
|
26117
|
+
var i = e.call(t, r || "default");
|
|
26118
|
+
if ("object" != typeof i) return i;
|
|
26119
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26120
|
+
}
|
|
26121
|
+
return ("string" === r ? String : Number)(t);
|
|
26122
|
+
}
|
|
26013
26123
|
var WhiteboardTool = class {
|
|
26014
|
-
modelGetter;
|
|
26015
|
-
scope;
|
|
26016
|
-
tool;
|
|
26017
|
-
shadowEmitter;
|
|
26018
|
-
enableToolEvent;
|
|
26019
|
-
eventAvailable = false;
|
|
26020
26124
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
26125
|
+
_defineProperty7(this, "modelGetter", void 0);
|
|
26126
|
+
_defineProperty7(this, "scope", void 0);
|
|
26127
|
+
_defineProperty7(this, "tool", void 0);
|
|
26128
|
+
_defineProperty7(this, "shadowEmitter", void 0);
|
|
26129
|
+
_defineProperty7(this, "enableToolEvent", void 0);
|
|
26130
|
+
_defineProperty7(this, "eventAvailable", false);
|
|
26131
|
+
_defineProperty7(this, "onMouseDownSelf", (event) => {
|
|
26132
|
+
this.eventAvailable = this.enableToolEvent();
|
|
26133
|
+
if (!this.eventAvailable) {
|
|
26134
|
+
return;
|
|
26135
|
+
}
|
|
26136
|
+
this.shadowEmitter.setActive(true);
|
|
26137
|
+
this.onMouseDown(event);
|
|
26138
|
+
});
|
|
26139
|
+
_defineProperty7(this, "onMouseDragSelf", (event) => {
|
|
26140
|
+
if (!this.eventAvailable) {
|
|
26141
|
+
return;
|
|
26142
|
+
}
|
|
26143
|
+
this.onMouseDrag(event);
|
|
26144
|
+
});
|
|
26145
|
+
_defineProperty7(this, "onMouseUpSelf", (event) => {
|
|
26146
|
+
if (!this.eventAvailable) {
|
|
26147
|
+
return;
|
|
26148
|
+
}
|
|
26149
|
+
this.onMouseUp(event);
|
|
26150
|
+
this.shadowEmitter.setActive(false);
|
|
26151
|
+
});
|
|
26021
26152
|
this.modelGetter = modelGetter;
|
|
26022
26153
|
this.enableToolEvent = enableToolEvent;
|
|
26023
26154
|
this.scope = scope;
|
|
@@ -26027,37 +26158,33 @@ var WhiteboardTool = class {
|
|
|
26027
26158
|
this.tool.onMouseDrag = this.onMouseDragSelf;
|
|
26028
26159
|
this.tool.onMouseUp = this.onMouseUpSelf;
|
|
26029
26160
|
}
|
|
26030
|
-
onMouseDownSelf = (event) => {
|
|
26031
|
-
this.eventAvailable = this.enableToolEvent();
|
|
26032
|
-
if (!this.eventAvailable) {
|
|
26033
|
-
return;
|
|
26034
|
-
}
|
|
26035
|
-
this.shadowEmitter.setActive(true);
|
|
26036
|
-
this.onMouseDown(event);
|
|
26037
|
-
};
|
|
26038
|
-
onMouseDragSelf = (event) => {
|
|
26039
|
-
if (!this.eventAvailable) {
|
|
26040
|
-
return;
|
|
26041
|
-
}
|
|
26042
|
-
this.onMouseDrag(event);
|
|
26043
|
-
};
|
|
26044
|
-
onMouseUpSelf = (event) => {
|
|
26045
|
-
if (!this.eventAvailable) {
|
|
26046
|
-
return;
|
|
26047
|
-
}
|
|
26048
|
-
this.onMouseUp(event);
|
|
26049
|
-
this.shadowEmitter.setActive(false);
|
|
26050
|
-
};
|
|
26051
26161
|
};
|
|
26052
26162
|
|
|
26053
26163
|
// src/tool/LineTool.ts
|
|
26054
26164
|
var import_lodash3 = __toESM(require_lodash(), 1);
|
|
26165
|
+
function _defineProperty8(e, r, t) {
|
|
26166
|
+
return (r = _toPropertyKey8(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26167
|
+
}
|
|
26168
|
+
function _toPropertyKey8(t) {
|
|
26169
|
+
var i = _toPrimitive8(t, "string");
|
|
26170
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26171
|
+
}
|
|
26172
|
+
function _toPrimitive8(t, r) {
|
|
26173
|
+
if ("object" != typeof t || !t) return t;
|
|
26174
|
+
var e = t[Symbol.toPrimitive];
|
|
26175
|
+
if (void 0 !== e) {
|
|
26176
|
+
var i = e.call(t, r || "default");
|
|
26177
|
+
if ("object" != typeof i) return i;
|
|
26178
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26179
|
+
}
|
|
26180
|
+
return ("string" === r ? String : Number)(t);
|
|
26181
|
+
}
|
|
26055
26182
|
var LineTool = class extends WhiteboardTool {
|
|
26056
|
-
elementModel = null;
|
|
26057
|
-
from = null;
|
|
26058
|
-
to = null;
|
|
26059
26183
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
26060
26184
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
26185
|
+
_defineProperty8(this, "elementModel", null);
|
|
26186
|
+
_defineProperty8(this, "from", null);
|
|
26187
|
+
_defineProperty8(this, "to", null);
|
|
26061
26188
|
this.tool.minDistance = 1;
|
|
26062
26189
|
}
|
|
26063
26190
|
onMouseDown(event) {
|
|
@@ -26086,9 +26213,24 @@ var LineTool = class extends WhiteboardTool {
|
|
|
26086
26213
|
var MAX_LINE_POINTS = 5;
|
|
26087
26214
|
|
|
26088
26215
|
// src/model/renderable/LineModel.ts
|
|
26216
|
+
function _defineProperty9(e, r, t) {
|
|
26217
|
+
return (r = _toPropertyKey9(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26218
|
+
}
|
|
26219
|
+
function _toPropertyKey9(t) {
|
|
26220
|
+
var i = _toPrimitive9(t, "string");
|
|
26221
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26222
|
+
}
|
|
26223
|
+
function _toPrimitive9(t, r) {
|
|
26224
|
+
if ("object" != typeof t || !t) return t;
|
|
26225
|
+
var e = t[Symbol.toPrimitive];
|
|
26226
|
+
if (void 0 !== e) {
|
|
26227
|
+
var i = e.call(t, r || "default");
|
|
26228
|
+
if ("object" != typeof i) return i;
|
|
26229
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26230
|
+
}
|
|
26231
|
+
return ("string" === r ? String : Number)(t);
|
|
26232
|
+
}
|
|
26089
26233
|
var LineModel = class extends ElementModel {
|
|
26090
|
-
controlledPoints = [];
|
|
26091
|
-
item = null;
|
|
26092
26234
|
get arrowSize() {
|
|
26093
26235
|
return this.strokeWidth * 5 + 15;
|
|
26094
26236
|
}
|
|
@@ -26106,6 +26248,8 @@ var LineModel = class extends ElementModel {
|
|
|
26106
26248
|
}
|
|
26107
26249
|
constructor(root, scope) {
|
|
26108
26250
|
super(root, scope);
|
|
26251
|
+
_defineProperty9(this, "controlledPoints", []);
|
|
26252
|
+
_defineProperty9(this, "item", null);
|
|
26109
26253
|
if (!this.root.has("type")) {
|
|
26110
26254
|
this.root.set("type", "arrow");
|
|
26111
26255
|
}
|
|
@@ -26189,7 +26333,10 @@ var LineModel = class extends ElementModel {
|
|
|
26189
26333
|
cfg.resizeModel = () => "horizontal";
|
|
26190
26334
|
if (this.controlledPoints.length === 0) {
|
|
26191
26335
|
this.controlledPoints.push(...new Array(MAX_LINE_POINTS).fill(0).map((_, index) => {
|
|
26192
|
-
return new LineControlPoint(`line-${index}`, this, {
|
|
26336
|
+
return new LineControlPoint(`line-${index}`, this, {
|
|
26337
|
+
index,
|
|
26338
|
+
total: MAX_LINE_POINTS
|
|
26339
|
+
}, this.scope);
|
|
26193
26340
|
}));
|
|
26194
26341
|
cfg.controlPoints = this.controlledPoints;
|
|
26195
26342
|
} else {
|
|
@@ -26211,12 +26358,12 @@ var LineModel = class extends ElementModel {
|
|
|
26211
26358
|
}
|
|
26212
26359
|
};
|
|
26213
26360
|
var LineControlPoint = class {
|
|
26214
|
-
position = null;
|
|
26215
|
-
name;
|
|
26216
|
-
model;
|
|
26217
|
-
options;
|
|
26218
|
-
scope;
|
|
26219
26361
|
constructor(name, model, options, scope) {
|
|
26362
|
+
_defineProperty9(this, "position", null);
|
|
26363
|
+
_defineProperty9(this, "name", void 0);
|
|
26364
|
+
_defineProperty9(this, "model", void 0);
|
|
26365
|
+
_defineProperty9(this, "options", void 0);
|
|
26366
|
+
_defineProperty9(this, "scope", void 0);
|
|
26220
26367
|
this.name = name;
|
|
26221
26368
|
this.model = model;
|
|
26222
26369
|
this.options = options;
|
|
@@ -26231,8 +26378,14 @@ var LineControlPoint = class {
|
|
|
26231
26378
|
if (this.position) {
|
|
26232
26379
|
return this.model.scope.project.view.projectToView(this.position.transform(matrix));
|
|
26233
26380
|
}
|
|
26234
|
-
const from = {
|
|
26235
|
-
|
|
26381
|
+
const from = {
|
|
26382
|
+
x: this.model.points[0],
|
|
26383
|
+
y: this.model.points[1]
|
|
26384
|
+
};
|
|
26385
|
+
const to = {
|
|
26386
|
+
x: this.model.points[this.model.points.length - 2],
|
|
26387
|
+
y: this.model.points[this.model.points.length - 1]
|
|
26388
|
+
};
|
|
26236
26389
|
const clonedPath = new this.scope.Path.Line(from, to);
|
|
26237
26390
|
this.position = clonedPath.getPointAt(clonedPath.length * distance);
|
|
26238
26391
|
return this.model.scope.project.view.projectToView(this.position.transform(matrix));
|
|
@@ -26255,8 +26408,24 @@ var LineControlPoint = class {
|
|
|
26255
26408
|
|
|
26256
26409
|
// src/model/renderable/PointTextModel.ts
|
|
26257
26410
|
import * as Y6 from "yjs";
|
|
26411
|
+
function _defineProperty10(e, r, t) {
|
|
26412
|
+
return (r = _toPropertyKey10(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26413
|
+
}
|
|
26414
|
+
function _toPropertyKey10(t) {
|
|
26415
|
+
var i = _toPrimitive10(t, "string");
|
|
26416
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26417
|
+
}
|
|
26418
|
+
function _toPrimitive10(t, r) {
|
|
26419
|
+
if ("object" != typeof t || !t) return t;
|
|
26420
|
+
var e = t[Symbol.toPrimitive];
|
|
26421
|
+
if (void 0 !== e) {
|
|
26422
|
+
var i = e.call(t, r || "default");
|
|
26423
|
+
if ("object" != typeof i) return i;
|
|
26424
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26425
|
+
}
|
|
26426
|
+
return ("string" === r ? String : Number)(t);
|
|
26427
|
+
}
|
|
26258
26428
|
var PointTextModel = class extends ElementModel {
|
|
26259
|
-
item = null;
|
|
26260
26429
|
set content(value) {
|
|
26261
26430
|
this.root.set("content", value);
|
|
26262
26431
|
}
|
|
@@ -26277,6 +26446,23 @@ var PointTextModel = class extends ElementModel {
|
|
|
26277
26446
|
}
|
|
26278
26447
|
constructor(root, scope) {
|
|
26279
26448
|
super(root, scope);
|
|
26449
|
+
_defineProperty10(this, "item", null);
|
|
26450
|
+
_defineProperty10(this, "handleTextPropChange", (event) => {
|
|
26451
|
+
if (!this.item) {
|
|
26452
|
+
return;
|
|
26453
|
+
}
|
|
26454
|
+
for (const [key, value] of event.changes.keys.entries()) {
|
|
26455
|
+
if (value.action === "update" || value.action === "add") {
|
|
26456
|
+
if (key === "content") {
|
|
26457
|
+
this.item.content = this.root.get("content") ?? "";
|
|
26458
|
+
this.updateTextPosition();
|
|
26459
|
+
} else if (key === "font-size") {
|
|
26460
|
+
this.item.fontSize = this.fontSize;
|
|
26461
|
+
this.updateTextPosition();
|
|
26462
|
+
}
|
|
26463
|
+
}
|
|
26464
|
+
}
|
|
26465
|
+
});
|
|
26280
26466
|
if (!this.root.has("type")) {
|
|
26281
26467
|
this.root.set("type", "point-text");
|
|
26282
26468
|
}
|
|
@@ -26290,22 +26476,6 @@ var PointTextModel = class extends ElementModel {
|
|
|
26290
26476
|
}, 60);
|
|
26291
26477
|
}
|
|
26292
26478
|
}
|
|
26293
|
-
handleTextPropChange = (event) => {
|
|
26294
|
-
if (!this.item) {
|
|
26295
|
-
return;
|
|
26296
|
-
}
|
|
26297
|
-
for (const [key, value] of event.changes.keys.entries()) {
|
|
26298
|
-
if (value.action === "update" || value.action === "add") {
|
|
26299
|
-
if (key === "content") {
|
|
26300
|
-
this.item.content = this.root.get("content") ?? "";
|
|
26301
|
-
this.updateTextPosition();
|
|
26302
|
-
} else if (key === "font-size") {
|
|
26303
|
-
this.item.fontSize = this.fontSize;
|
|
26304
|
-
this.updateTextPosition();
|
|
26305
|
-
}
|
|
26306
|
-
}
|
|
26307
|
-
}
|
|
26308
|
-
};
|
|
26309
26479
|
getInternalMeasurement() {
|
|
26310
26480
|
if (!this.item) {
|
|
26311
26481
|
return null;
|
|
@@ -26317,14 +26487,25 @@ var PointTextModel = class extends ElementModel {
|
|
|
26317
26487
|
let scaleX = topRight.getDistance(topLeft) / bounds.width;
|
|
26318
26488
|
scaleX = Number.isNaN(scaleX) ? 1 : scaleX;
|
|
26319
26489
|
const angle = topRight.subtract(topLeft).angle;
|
|
26320
|
-
return {
|
|
26490
|
+
return {
|
|
26491
|
+
scaleX,
|
|
26492
|
+
topLeft,
|
|
26493
|
+
topRight,
|
|
26494
|
+
angle,
|
|
26495
|
+
bounds
|
|
26496
|
+
};
|
|
26321
26497
|
}
|
|
26322
26498
|
updateTextPosition() {
|
|
26323
26499
|
const measurement = this.getInternalMeasurement();
|
|
26324
26500
|
if (!this.item || !measurement) {
|
|
26325
26501
|
return;
|
|
26326
26502
|
}
|
|
26327
|
-
const {
|
|
26503
|
+
const {
|
|
26504
|
+
scaleX,
|
|
26505
|
+
topLeft,
|
|
26506
|
+
angle,
|
|
26507
|
+
bounds
|
|
26508
|
+
} = measurement;
|
|
26328
26509
|
const fontSize = this.fontSize * scaleX;
|
|
26329
26510
|
this.item.position.x = topLeft.x + bounds.width / 2;
|
|
26330
26511
|
this.item.position.y = topLeft.y + bounds.height / 2;
|
|
@@ -26372,10 +26553,27 @@ var PointTextModel = class extends ElementModel {
|
|
|
26372
26553
|
|
|
26373
26554
|
// src/model/renderable/TriangleModel.ts
|
|
26374
26555
|
import * as Y7 from "yjs";
|
|
26556
|
+
function _defineProperty11(e, r, t) {
|
|
26557
|
+
return (r = _toPropertyKey11(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26558
|
+
}
|
|
26559
|
+
function _toPropertyKey11(t) {
|
|
26560
|
+
var i = _toPrimitive11(t, "string");
|
|
26561
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26562
|
+
}
|
|
26563
|
+
function _toPrimitive11(t, r) {
|
|
26564
|
+
if ("object" != typeof t || !t) return t;
|
|
26565
|
+
var e = t[Symbol.toPrimitive];
|
|
26566
|
+
if (void 0 !== e) {
|
|
26567
|
+
var i = e.call(t, r || "default");
|
|
26568
|
+
if ("object" != typeof i) return i;
|
|
26569
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26570
|
+
}
|
|
26571
|
+
return ("string" === r ? String : Number)(t);
|
|
26572
|
+
}
|
|
26375
26573
|
var TriangleModel = class extends ElementModel {
|
|
26376
|
-
item = null;
|
|
26377
26574
|
constructor(root, scope) {
|
|
26378
26575
|
super(root, scope);
|
|
26576
|
+
_defineProperty11(this, "item", null);
|
|
26379
26577
|
if (!this.root.has("type")) {
|
|
26380
26578
|
this.root.set("type", "triangle");
|
|
26381
26579
|
}
|
|
@@ -26425,14 +26623,7 @@ var TriangleModel = class extends ElementModel {
|
|
|
26425
26623
|
const pointsMatrix = new this.scope.Matrix(this.pointsMatrix);
|
|
26426
26624
|
const trPoint = point.transform(pointsMatrix.inverted());
|
|
26427
26625
|
const oldPoints = this.points;
|
|
26428
|
-
this.setPoints([
|
|
26429
|
-
trPoint.x,
|
|
26430
|
-
trPoint.y,
|
|
26431
|
-
oldPoints[2],
|
|
26432
|
-
oldPoints[3],
|
|
26433
|
-
oldPoints[4],
|
|
26434
|
-
oldPoints[5]
|
|
26435
|
-
]);
|
|
26626
|
+
this.setPoints([trPoint.x, trPoint.y, oldPoints[2], oldPoints[3], oldPoints[4], oldPoints[5]]);
|
|
26436
26627
|
}
|
|
26437
26628
|
});
|
|
26438
26629
|
return config;
|
|
@@ -26452,10 +26643,27 @@ var TriangleModel = class extends ElementModel {
|
|
|
26452
26643
|
|
|
26453
26644
|
// src/model/renderable/RectangleModel.ts
|
|
26454
26645
|
import * as Y8 from "yjs";
|
|
26646
|
+
function _defineProperty12(e, r, t) {
|
|
26647
|
+
return (r = _toPropertyKey12(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26648
|
+
}
|
|
26649
|
+
function _toPropertyKey12(t) {
|
|
26650
|
+
var i = _toPrimitive12(t, "string");
|
|
26651
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26652
|
+
}
|
|
26653
|
+
function _toPrimitive12(t, r) {
|
|
26654
|
+
if ("object" != typeof t || !t) return t;
|
|
26655
|
+
var e = t[Symbol.toPrimitive];
|
|
26656
|
+
if (void 0 !== e) {
|
|
26657
|
+
var i = e.call(t, r || "default");
|
|
26658
|
+
if ("object" != typeof i) return i;
|
|
26659
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26660
|
+
}
|
|
26661
|
+
return ("string" === r ? String : Number)(t);
|
|
26662
|
+
}
|
|
26455
26663
|
var RectangleModel = class extends ElementModel {
|
|
26456
|
-
item = null;
|
|
26457
26664
|
constructor(root, scope) {
|
|
26458
26665
|
super(root, scope);
|
|
26666
|
+
_defineProperty12(this, "item", null);
|
|
26459
26667
|
if (!this.root.has("type")) {
|
|
26460
26668
|
this.root.set("type", "rectangle");
|
|
26461
26669
|
}
|
|
@@ -26609,11 +26817,28 @@ var elementsUndoOrigin = "elementsUndoOrigin";
|
|
|
26609
26817
|
// src/model/renderable/EraserModel.ts
|
|
26610
26818
|
var import_lodash5 = __toESM(require_lodash(), 1);
|
|
26611
26819
|
import * as Y9 from "yjs";
|
|
26820
|
+
function _defineProperty13(e, r, t) {
|
|
26821
|
+
return (r = _toPropertyKey13(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26822
|
+
}
|
|
26823
|
+
function _toPropertyKey13(t) {
|
|
26824
|
+
var i = _toPrimitive13(t, "string");
|
|
26825
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26826
|
+
}
|
|
26827
|
+
function _toPrimitive13(t, r) {
|
|
26828
|
+
if ("object" != typeof t || !t) return t;
|
|
26829
|
+
var e = t[Symbol.toPrimitive];
|
|
26830
|
+
if (void 0 !== e) {
|
|
26831
|
+
var i = e.call(t, r || "default");
|
|
26832
|
+
if ("object" != typeof i) return i;
|
|
26833
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26834
|
+
}
|
|
26835
|
+
return ("string" === r ? String : Number)(t);
|
|
26836
|
+
}
|
|
26612
26837
|
var EraserModel = class extends ElementModel {
|
|
26613
|
-
item = null;
|
|
26614
|
-
sliceBegin = 0;
|
|
26615
26838
|
constructor(root, scope) {
|
|
26616
26839
|
super(root, scope);
|
|
26840
|
+
_defineProperty13(this, "item", null);
|
|
26841
|
+
_defineProperty13(this, "sliceBegin", 0);
|
|
26617
26842
|
if (!this.root.has("type")) {
|
|
26618
26843
|
this.root.set("type", "eraser");
|
|
26619
26844
|
}
|
|
@@ -26669,7 +26894,10 @@ var EraserModel = class extends ElementModel {
|
|
|
26669
26894
|
matrixedPoints() {
|
|
26670
26895
|
const matrix = new this.scope.Matrix(this.pointsMatrix);
|
|
26671
26896
|
const groupPoints = (0, import_lodash5.chunk)(this.points, 2).slice(this.sliceBegin);
|
|
26672
|
-
return groupPoints.map((
|
|
26897
|
+
return groupPoints.map((_ref) => {
|
|
26898
|
+
let [x, y] = _ref;
|
|
26899
|
+
return matrix.transform([x, y]);
|
|
26900
|
+
}).map((p) => [p.x, p.y]);
|
|
26673
26901
|
}
|
|
26674
26902
|
getNextSegments() {
|
|
26675
26903
|
const points = this.parsePoints(this.matrixedPoints());
|
|
@@ -26728,14 +26956,31 @@ var EraserModel = class extends ElementModel {
|
|
|
26728
26956
|
// src/model/renderable/LaserPointerModel.ts
|
|
26729
26957
|
var import_lodash6 = __toESM(require_lodash(), 1);
|
|
26730
26958
|
import * as Y10 from "yjs";
|
|
26959
|
+
function _defineProperty14(e, r, t) {
|
|
26960
|
+
return (r = _toPropertyKey14(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26961
|
+
}
|
|
26962
|
+
function _toPropertyKey14(t) {
|
|
26963
|
+
var i = _toPrimitive14(t, "string");
|
|
26964
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26965
|
+
}
|
|
26966
|
+
function _toPrimitive14(t, r) {
|
|
26967
|
+
if ("object" != typeof t || !t) return t;
|
|
26968
|
+
var e = t[Symbol.toPrimitive];
|
|
26969
|
+
if (void 0 !== e) {
|
|
26970
|
+
var i = e.call(t, r || "default");
|
|
26971
|
+
if ("object" != typeof i) return i;
|
|
26972
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26973
|
+
}
|
|
26974
|
+
return ("string" === r ? String : Number)(t);
|
|
26975
|
+
}
|
|
26731
26976
|
var LaserPointerModel = class extends ElementModel {
|
|
26732
|
-
item = null;
|
|
26733
|
-
clientId;
|
|
26734
|
-
sliceBegin = 0;
|
|
26735
|
-
displayStrokeWidth = 8;
|
|
26736
|
-
cachedPoints = null;
|
|
26737
26977
|
constructor(clientId, root, scope, removeElement) {
|
|
26738
26978
|
super(root, scope);
|
|
26979
|
+
_defineProperty14(this, "item", null);
|
|
26980
|
+
_defineProperty14(this, "clientId", void 0);
|
|
26981
|
+
_defineProperty14(this, "sliceBegin", 0);
|
|
26982
|
+
_defineProperty14(this, "displayStrokeWidth", 8);
|
|
26983
|
+
_defineProperty14(this, "cachedPoints", null);
|
|
26739
26984
|
this.clientId = clientId;
|
|
26740
26985
|
if (!this.root.has("type")) {
|
|
26741
26986
|
this.root.set("type", "laser");
|
|
@@ -26824,7 +27069,10 @@ var LaserPointerModel = class extends ElementModel {
|
|
|
26824
27069
|
const matrix = new this.scope.Matrix(this.pointsMatrix);
|
|
26825
27070
|
const points = this.cachedPoints || this.points;
|
|
26826
27071
|
const groupPoints = (0, import_lodash6.chunk)(points, 2).slice(this.sliceBegin);
|
|
26827
|
-
return groupPoints.map((
|
|
27072
|
+
return groupPoints.map((_ref) => {
|
|
27073
|
+
let [x, y] = _ref;
|
|
27074
|
+
return matrix.transform([x, y]);
|
|
27075
|
+
}).map((p) => [p.x, p.y]);
|
|
26828
27076
|
}
|
|
26829
27077
|
getNextSegments() {
|
|
26830
27078
|
const points = this.parsePoints(this.matrixedPoints());
|
|
@@ -26866,7 +27114,24 @@ var LaserPointerModel = class extends ElementModel {
|
|
|
26866
27114
|
|
|
26867
27115
|
// src/WhitePermissions.ts
|
|
26868
27116
|
import EventEmitter from "eventemitter3";
|
|
26869
|
-
|
|
27117
|
+
function _defineProperty15(e, r, t) {
|
|
27118
|
+
return (r = _toPropertyKey15(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27119
|
+
}
|
|
27120
|
+
function _toPropertyKey15(t) {
|
|
27121
|
+
var i = _toPrimitive15(t, "string");
|
|
27122
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27123
|
+
}
|
|
27124
|
+
function _toPrimitive15(t, r) {
|
|
27125
|
+
if ("object" != typeof t || !t) return t;
|
|
27126
|
+
var e = t[Symbol.toPrimitive];
|
|
27127
|
+
if (void 0 !== e) {
|
|
27128
|
+
var i = e.call(t, r || "default");
|
|
27129
|
+
if ("object" != typeof i) return i;
|
|
27130
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27131
|
+
}
|
|
27132
|
+
return ("string" === r ? String : Number)(t);
|
|
27133
|
+
}
|
|
27134
|
+
var WhiteboardPermissionFlag = function(WhiteboardPermissionFlag2) {
|
|
26870
27135
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["none"] = 0] = "none";
|
|
26871
27136
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["draw"] = 1] = "draw";
|
|
26872
27137
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["editSelf"] = 2] = "editSelf";
|
|
@@ -26875,15 +27140,24 @@ var WhiteboardPermissionFlag = /* @__PURE__ */ ((WhiteboardPermissionFlag2) => {
|
|
|
26875
27140
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["deleteOthers"] = 16] = "deleteOthers";
|
|
26876
27141
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["mainView"] = 32] = "mainView";
|
|
26877
27142
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["setOthersView"] = 64] = "setOthersView";
|
|
26878
|
-
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["all"] =
|
|
27143
|
+
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["all"] = WhiteboardPermissionFlag2.draw | WhiteboardPermissionFlag2.editSelf | WhiteboardPermissionFlag2.editOthers | WhiteboardPermissionFlag2.deleteSelf | WhiteboardPermissionFlag2.deleteOthers | WhiteboardPermissionFlag2.mainView | WhiteboardPermissionFlag2.setOthersView] = "all";
|
|
26879
27144
|
return WhiteboardPermissionFlag2;
|
|
26880
|
-
}
|
|
27145
|
+
}({});
|
|
26881
27146
|
var WhiteboardPermissions = class extends EventEmitter {
|
|
26882
|
-
requestUserMap;
|
|
26883
|
-
userManager;
|
|
26884
|
-
observers = /* @__PURE__ */ new Map();
|
|
26885
27147
|
constructor(userManager, requestUserMap) {
|
|
26886
27148
|
super();
|
|
27149
|
+
_defineProperty15(this, "requestUserMap", void 0);
|
|
27150
|
+
_defineProperty15(this, "userManager", void 0);
|
|
27151
|
+
_defineProperty15(this, "observers", /* @__PURE__ */ new Map());
|
|
27152
|
+
_defineProperty15(this, "handleUserLeave", (user) => {
|
|
27153
|
+
const cb = this.observers.get(user.id);
|
|
27154
|
+
if (cb) {
|
|
27155
|
+
this.requestUserMap(user.id).unobserve(cb);
|
|
27156
|
+
}
|
|
27157
|
+
});
|
|
27158
|
+
_defineProperty15(this, "handleUserJoin", (user) => {
|
|
27159
|
+
this.addObserve(user.id);
|
|
27160
|
+
});
|
|
26887
27161
|
this.userManager = userManager;
|
|
26888
27162
|
this.requestUserMap = requestUserMap;
|
|
26889
27163
|
this.createModel(this.userManager.selfId);
|
|
@@ -26893,16 +27167,10 @@ var WhiteboardPermissions = class extends EventEmitter {
|
|
|
26893
27167
|
this.userManager.on("join", this.handleUserJoin);
|
|
26894
27168
|
this.userManager.on("leave", this.handleUserLeave);
|
|
26895
27169
|
}
|
|
26896
|
-
handleUserLeave = (user) => {
|
|
26897
|
-
const cb = this.observers.get(user.id);
|
|
26898
|
-
if (cb) {
|
|
26899
|
-
this.requestUserMap(user.id).unobserve(cb);
|
|
26900
|
-
}
|
|
26901
|
-
};
|
|
26902
|
-
handleUserJoin = (user) => {
|
|
26903
|
-
this.addObserve(user.id);
|
|
26904
|
-
};
|
|
26905
27170
|
addObserve(userId) {
|
|
27171
|
+
if (this.observers.has(userId)) {
|
|
27172
|
+
return;
|
|
27173
|
+
}
|
|
26906
27174
|
const observer = (evt) => {
|
|
26907
27175
|
this.handleUserPermissionChange(userId, evt);
|
|
26908
27176
|
};
|
|
@@ -26931,14 +27199,7 @@ var WhiteboardPermissions = class extends EventEmitter {
|
|
|
26931
27199
|
* @return {WhiteboardPermissionFlag[]} - 权限列表
|
|
26932
27200
|
*/
|
|
26933
27201
|
resolveFlags(value) {
|
|
26934
|
-
return [
|
|
26935
|
-
4 /* editOthers */,
|
|
26936
|
-
2 /* editSelf */,
|
|
26937
|
-
16 /* deleteOthers */,
|
|
26938
|
-
8 /* deleteSelf */,
|
|
26939
|
-
32 /* mainView */,
|
|
26940
|
-
1 /* draw */
|
|
26941
|
-
].filter((v) => (v & value) !== 0);
|
|
27202
|
+
return [WhiteboardPermissionFlag.draw, WhiteboardPermissionFlag.editSelf, WhiteboardPermissionFlag.editOthers, WhiteboardPermissionFlag.deleteSelf, WhiteboardPermissionFlag.deleteOthers, WhiteboardPermissionFlag.mainView, WhiteboardPermissionFlag.setOthersView].filter((v) => (v & value) !== 0);
|
|
26942
27203
|
}
|
|
26943
27204
|
/**
|
|
26944
27205
|
* 获取权限列表组合对应的数值
|
|
@@ -26988,10 +27249,27 @@ var WhiteboardPermissions = class extends EventEmitter {
|
|
|
26988
27249
|
// src/model/renderable/StraightLineModel.ts
|
|
26989
27250
|
var import_lodash7 = __toESM(require_lodash(), 1);
|
|
26990
27251
|
import * as Y11 from "yjs";
|
|
27252
|
+
function _defineProperty16(e, r, t) {
|
|
27253
|
+
return (r = _toPropertyKey16(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27254
|
+
}
|
|
27255
|
+
function _toPropertyKey16(t) {
|
|
27256
|
+
var i = _toPrimitive16(t, "string");
|
|
27257
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27258
|
+
}
|
|
27259
|
+
function _toPrimitive16(t, r) {
|
|
27260
|
+
if ("object" != typeof t || !t) return t;
|
|
27261
|
+
var e = t[Symbol.toPrimitive];
|
|
27262
|
+
if (void 0 !== e) {
|
|
27263
|
+
var i = e.call(t, r || "default");
|
|
27264
|
+
if ("object" != typeof i) return i;
|
|
27265
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27266
|
+
}
|
|
27267
|
+
return ("string" === r ? String : Number)(t);
|
|
27268
|
+
}
|
|
26991
27269
|
var StraightLineModel = class extends ElementModel {
|
|
26992
|
-
item = null;
|
|
26993
27270
|
constructor(root, scope) {
|
|
26994
27271
|
super(root, scope);
|
|
27272
|
+
_defineProperty16(this, "item", null);
|
|
26995
27273
|
if (!this.root.has("type")) {
|
|
26996
27274
|
this.root.set("type", "line");
|
|
26997
27275
|
}
|
|
@@ -27041,12 +27319,7 @@ var StraightLineModel = class extends ElementModel {
|
|
|
27041
27319
|
}
|
|
27042
27320
|
const pointsMatrix = new this.scope.Matrix(this.pointsMatrix);
|
|
27043
27321
|
const trPoint = point.transform(pointsMatrix.inverted());
|
|
27044
|
-
this.setPoints([
|
|
27045
|
-
trPoint.x,
|
|
27046
|
-
trPoint.y,
|
|
27047
|
-
this.points[2],
|
|
27048
|
-
this.points[3]
|
|
27049
|
-
]);
|
|
27322
|
+
this.setPoints([trPoint.x, trPoint.y, this.points[2], this.points[3]]);
|
|
27050
27323
|
}
|
|
27051
27324
|
});
|
|
27052
27325
|
cfg.controlPoints.push({
|
|
@@ -27063,12 +27336,7 @@ var StraightLineModel = class extends ElementModel {
|
|
|
27063
27336
|
}
|
|
27064
27337
|
const pointsMatrix = new this.scope.Matrix(this.pointsMatrix);
|
|
27065
27338
|
const trPoint = point.transform(pointsMatrix.inverted());
|
|
27066
|
-
this.setPoints([
|
|
27067
|
-
this.points[0],
|
|
27068
|
-
this.points[1],
|
|
27069
|
-
trPoint.x,
|
|
27070
|
-
trPoint.y
|
|
27071
|
-
]);
|
|
27339
|
+
this.setPoints([this.points[0], this.points[1], trPoint.x, trPoint.y]);
|
|
27072
27340
|
}
|
|
27073
27341
|
});
|
|
27074
27342
|
return cfg;
|
|
@@ -27093,21 +27361,53 @@ var StraightLineModel = class extends ElementModel {
|
|
|
27093
27361
|
};
|
|
27094
27362
|
|
|
27095
27363
|
// src/model/RenderableModel.ts
|
|
27364
|
+
function _defineProperty17(e, r, t) {
|
|
27365
|
+
return (r = _toPropertyKey17(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27366
|
+
}
|
|
27367
|
+
function _toPropertyKey17(t) {
|
|
27368
|
+
var i = _toPrimitive17(t, "string");
|
|
27369
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27370
|
+
}
|
|
27371
|
+
function _toPrimitive17(t, r) {
|
|
27372
|
+
if ("object" != typeof t || !t) return t;
|
|
27373
|
+
var e = t[Symbol.toPrimitive];
|
|
27374
|
+
if (void 0 !== e) {
|
|
27375
|
+
var i = e.call(t, r || "default");
|
|
27376
|
+
if ("object" != typeof i) return i;
|
|
27377
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27378
|
+
}
|
|
27379
|
+
return ("string" === r ? String : Number)(t);
|
|
27380
|
+
}
|
|
27096
27381
|
var RenderableModel = class extends EventEmitter2 {
|
|
27097
|
-
scope;
|
|
27098
|
-
toolbarModel;
|
|
27099
|
-
userManager;
|
|
27100
|
-
elementModels;
|
|
27101
|
-
elements;
|
|
27102
|
-
layerId;
|
|
27103
|
-
maxIndex = -1;
|
|
27104
|
-
hasPermission;
|
|
27105
|
-
shadowEmitter;
|
|
27106
27382
|
get uuid() {
|
|
27107
27383
|
return uuidv4();
|
|
27108
27384
|
}
|
|
27109
27385
|
constructor(layerId, shadowEmitter, elements, scope, toolbarModel, userManager, hasPermission) {
|
|
27110
27386
|
super();
|
|
27387
|
+
_defineProperty17(this, "scope", void 0);
|
|
27388
|
+
_defineProperty17(this, "toolbarModel", void 0);
|
|
27389
|
+
_defineProperty17(this, "userManager", void 0);
|
|
27390
|
+
_defineProperty17(this, "elementModels", void 0);
|
|
27391
|
+
_defineProperty17(this, "elements", void 0);
|
|
27392
|
+
_defineProperty17(this, "layerId", void 0);
|
|
27393
|
+
_defineProperty17(this, "maxIndex", -1);
|
|
27394
|
+
_defineProperty17(this, "hasPermission", void 0);
|
|
27395
|
+
_defineProperty17(this, "shadowEmitter", void 0);
|
|
27396
|
+
_defineProperty17(this, "onElementsChange", (event) => {
|
|
27397
|
+
for (const [key, value] of event.changes.keys.entries()) {
|
|
27398
|
+
if (value.action === "add") {
|
|
27399
|
+
const root = this.elements.get(key);
|
|
27400
|
+
if (root) {
|
|
27401
|
+
const model = this.convertToModel(root);
|
|
27402
|
+
if (model) {
|
|
27403
|
+
this.emit("elementInsert", [model]);
|
|
27404
|
+
}
|
|
27405
|
+
}
|
|
27406
|
+
} else if (value.action === "delete") {
|
|
27407
|
+
this.emit("elementRemove", key, this.layerId);
|
|
27408
|
+
}
|
|
27409
|
+
}
|
|
27410
|
+
});
|
|
27111
27411
|
this.hasPermission = hasPermission;
|
|
27112
27412
|
this.shadowEmitter = shadowEmitter;
|
|
27113
27413
|
this.layerId = layerId;
|
|
@@ -27142,21 +27442,6 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27142
27442
|
});
|
|
27143
27443
|
});
|
|
27144
27444
|
}
|
|
27145
|
-
onElementsChange = (event) => {
|
|
27146
|
-
for (const [key, value] of event.changes.keys.entries()) {
|
|
27147
|
-
if (value.action === "add") {
|
|
27148
|
-
const root = this.elements.get(key);
|
|
27149
|
-
if (root) {
|
|
27150
|
-
const model = this.convertToModel(root);
|
|
27151
|
-
if (model) {
|
|
27152
|
-
this.emit("elementInsert", [model]);
|
|
27153
|
-
}
|
|
27154
|
-
}
|
|
27155
|
-
} else if (value.action === "delete") {
|
|
27156
|
-
this.emit("elementRemove", key, this.layerId);
|
|
27157
|
-
}
|
|
27158
|
-
}
|
|
27159
|
-
};
|
|
27160
27445
|
convertToModel(yMap) {
|
|
27161
27446
|
const type = yMap.get("type");
|
|
27162
27447
|
let model = null;
|
|
@@ -27189,7 +27474,8 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27189
27474
|
}
|
|
27190
27475
|
return model;
|
|
27191
27476
|
}
|
|
27192
|
-
initElement(element
|
|
27477
|
+
initElement(element) {
|
|
27478
|
+
let shadow = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
|
|
27193
27479
|
if (shadow) {
|
|
27194
27480
|
element.shadow = "layer";
|
|
27195
27481
|
}
|
|
@@ -27210,8 +27496,16 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27210
27496
|
this.elements.set(uuid, map);
|
|
27211
27497
|
}, elementsUndoOrigin);
|
|
27212
27498
|
}
|
|
27213
|
-
|
|
27214
|
-
|
|
27499
|
+
confirmPermission() {
|
|
27500
|
+
const hasPermission = this.hasPermission(WhiteboardPermissionFlag.draw);
|
|
27501
|
+
if (!hasPermission) {
|
|
27502
|
+
console.warn("[@netless/forge-whiteboard] no permission to draw");
|
|
27503
|
+
}
|
|
27504
|
+
return hasPermission;
|
|
27505
|
+
}
|
|
27506
|
+
createCurve() {
|
|
27507
|
+
let shadow = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
|
|
27508
|
+
if (!this.confirmPermission()) {
|
|
27215
27509
|
return null;
|
|
27216
27510
|
}
|
|
27217
27511
|
const curveModel = new CurveModel(new Y12.Map(), this.scope);
|
|
@@ -27220,7 +27514,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27220
27514
|
return curveModel;
|
|
27221
27515
|
}
|
|
27222
27516
|
createLaserPointer() {
|
|
27223
|
-
if (!this.
|
|
27517
|
+
if (!this.confirmPermission()) {
|
|
27224
27518
|
return null;
|
|
27225
27519
|
}
|
|
27226
27520
|
const model = new LaserPointerModel(this.userManager.selfId, new Y12.Map(), this.scope, (uuid) => {
|
|
@@ -27235,7 +27529,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27235
27529
|
return model;
|
|
27236
27530
|
}
|
|
27237
27531
|
createEraser() {
|
|
27238
|
-
if (!this.hasPermission(
|
|
27532
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.deleteSelf) && !this.hasPermission(WhiteboardPermissionFlag.deleteOthers)) {
|
|
27239
27533
|
return null;
|
|
27240
27534
|
}
|
|
27241
27535
|
const model = new EraserModel(new Y12.Map(), this.scope);
|
|
@@ -27248,7 +27542,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27248
27542
|
return model;
|
|
27249
27543
|
}
|
|
27250
27544
|
createTriangle(shadow) {
|
|
27251
|
-
if (!this.
|
|
27545
|
+
if (!this.confirmPermission()) {
|
|
27252
27546
|
return null;
|
|
27253
27547
|
}
|
|
27254
27548
|
const triangle = new TriangleModel(new Y12.Map(), this.scope);
|
|
@@ -27258,7 +27552,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27258
27552
|
return triangle;
|
|
27259
27553
|
}
|
|
27260
27554
|
createRectangle(shadow) {
|
|
27261
|
-
if (!this.
|
|
27555
|
+
if (!this.confirmPermission()) {
|
|
27262
27556
|
return null;
|
|
27263
27557
|
}
|
|
27264
27558
|
const rect = new RectangleModel(new Y12.Map(), this.scope);
|
|
@@ -27268,7 +27562,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27268
27562
|
return rect;
|
|
27269
27563
|
}
|
|
27270
27564
|
createSegmentedPath(type, shadow) {
|
|
27271
|
-
if (!this.
|
|
27565
|
+
if (!this.confirmPermission()) {
|
|
27272
27566
|
return null;
|
|
27273
27567
|
}
|
|
27274
27568
|
const segmentsModel = new SegmentsModel(new Y12.Map(), this.scope, type);
|
|
@@ -27277,8 +27571,9 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27277
27571
|
this.addElementToDoc(segmentsModel.root);
|
|
27278
27572
|
return segmentsModel;
|
|
27279
27573
|
}
|
|
27280
|
-
createSelector(
|
|
27281
|
-
|
|
27574
|
+
createSelector() {
|
|
27575
|
+
let shadow = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
|
|
27576
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.editSelf) && !this.hasPermission(WhiteboardPermissionFlag.deleteOthers)) {
|
|
27282
27577
|
return null;
|
|
27283
27578
|
}
|
|
27284
27579
|
const selectorModel = new SelectorModel(new Y12.Map(), this.scope);
|
|
@@ -27287,7 +27582,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27287
27582
|
return selectorModel;
|
|
27288
27583
|
}
|
|
27289
27584
|
createStraightLine(shadow) {
|
|
27290
|
-
if (!this.
|
|
27585
|
+
if (!this.confirmPermission()) {
|
|
27291
27586
|
return null;
|
|
27292
27587
|
}
|
|
27293
27588
|
const straightLineModel = new StraightLineModel(new Y12.Map(), this.scope);
|
|
@@ -27297,7 +27592,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27297
27592
|
return straightLineModel;
|
|
27298
27593
|
}
|
|
27299
27594
|
createLinePath(shadow) {
|
|
27300
|
-
if (!this.
|
|
27595
|
+
if (!this.confirmPermission()) {
|
|
27301
27596
|
return null;
|
|
27302
27597
|
}
|
|
27303
27598
|
const lineModel = new LineModel(new Y12.Map(), this.scope);
|
|
@@ -27307,7 +27602,7 @@ var RenderableModel = class extends EventEmitter2 {
|
|
|
27307
27602
|
return lineModel;
|
|
27308
27603
|
}
|
|
27309
27604
|
createPointText(x, y, shadow) {
|
|
27310
|
-
if (!this.
|
|
27605
|
+
if (!this.confirmPermission()) {
|
|
27311
27606
|
return null;
|
|
27312
27607
|
}
|
|
27313
27608
|
const pointTextModel = new PointTextModel(new Y12.Map(), this.scope);
|
|
@@ -27560,8 +27855,27 @@ function Deg2Rad(d) {
|
|
|
27560
27855
|
}
|
|
27561
27856
|
|
|
27562
27857
|
// src/utils/Recognizer.ts
|
|
27858
|
+
function _defineProperty18(e, r, t) {
|
|
27859
|
+
return (r = _toPropertyKey18(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27860
|
+
}
|
|
27861
|
+
function _toPropertyKey18(t) {
|
|
27862
|
+
var i = _toPrimitive18(t, "string");
|
|
27863
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27864
|
+
}
|
|
27865
|
+
function _toPrimitive18(t, r) {
|
|
27866
|
+
if ("object" != typeof t || !t) return t;
|
|
27867
|
+
var e = t[Symbol.toPrimitive];
|
|
27868
|
+
if (void 0 !== e) {
|
|
27869
|
+
var i = e.call(t, r || "default");
|
|
27870
|
+
if ("object" != typeof i) return i;
|
|
27871
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27872
|
+
}
|
|
27873
|
+
return ("string" === r ? String : Number)(t);
|
|
27874
|
+
}
|
|
27563
27875
|
var Recognizer = class {
|
|
27564
|
-
|
|
27876
|
+
constructor() {
|
|
27877
|
+
_defineProperty18(this, "dollar", new DollarRecognizer());
|
|
27878
|
+
}
|
|
27565
27879
|
recognize(points) {
|
|
27566
27880
|
let minX = Number.MAX_VALUE;
|
|
27567
27881
|
let maxX = -Number.MAX_VALUE;
|
|
@@ -27588,12 +27902,29 @@ var Recognizer = class {
|
|
|
27588
27902
|
};
|
|
27589
27903
|
|
|
27590
27904
|
// src/tool/CurveTool.ts
|
|
27905
|
+
function _defineProperty19(e, r, t) {
|
|
27906
|
+
return (r = _toPropertyKey19(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27907
|
+
}
|
|
27908
|
+
function _toPropertyKey19(t) {
|
|
27909
|
+
var i = _toPrimitive19(t, "string");
|
|
27910
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27911
|
+
}
|
|
27912
|
+
function _toPrimitive19(t, r) {
|
|
27913
|
+
if ("object" != typeof t || !t) return t;
|
|
27914
|
+
var e = t[Symbol.toPrimitive];
|
|
27915
|
+
if (void 0 !== e) {
|
|
27916
|
+
var i = e.call(t, r || "default");
|
|
27917
|
+
if ("object" != typeof i) return i;
|
|
27918
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27919
|
+
}
|
|
27920
|
+
return ("string" === r ? String : Number)(t);
|
|
27921
|
+
}
|
|
27591
27922
|
var CurveTool = class extends WhiteboardTool {
|
|
27592
|
-
elementModel = null;
|
|
27593
|
-
recognizer = new Recognizer();
|
|
27594
|
-
pointCount = 0;
|
|
27595
27923
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
27596
27924
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
27925
|
+
_defineProperty19(this, "elementModel", null);
|
|
27926
|
+
_defineProperty19(this, "recognizer", new Recognizer());
|
|
27927
|
+
_defineProperty19(this, "pointCount", 0);
|
|
27597
27928
|
this.tool.minDistance = 1;
|
|
27598
27929
|
}
|
|
27599
27930
|
onMouseDown(event) {
|
|
@@ -27625,31 +27956,16 @@ var CurveTool = class extends WhiteboardTool {
|
|
|
27625
27956
|
model?.setPoints([result.minX, result.minY, result.maxX, result.maxY]);
|
|
27626
27957
|
} else if (/^circle/.test(result.shape)) {
|
|
27627
27958
|
const model = this.modelGetter().createSegmentedPath("ellipse", false);
|
|
27628
|
-
const rect = new this.scope.Rectangle(
|
|
27629
|
-
new this.scope.Point(result.minX, result.minY),
|
|
27630
|
-
new this.scope.Point(result.maxX, result.maxY)
|
|
27631
|
-
);
|
|
27959
|
+
const rect = new this.scope.Rectangle(new this.scope.Point(result.minX, result.minY), new this.scope.Point(result.maxX, result.maxY));
|
|
27632
27960
|
const pathRect = new this.scope.Path.Ellipse(rect);
|
|
27633
27961
|
const points = serializePath(pathRect);
|
|
27634
27962
|
model?.setPoints(points);
|
|
27635
27963
|
} else if (/^triangle/.test(result.shape)) {
|
|
27636
27964
|
const model = this.modelGetter().createTriangle(false);
|
|
27637
|
-
model?.setPoints([
|
|
27638
|
-
result.minX + (result.maxX - result.minX) / 2,
|
|
27639
|
-
result.minY,
|
|
27640
|
-
result.minX,
|
|
27641
|
-
result.maxY,
|
|
27642
|
-
result.maxX,
|
|
27643
|
-
result.maxY
|
|
27644
|
-
]);
|
|
27965
|
+
model?.setPoints([result.minX + (result.maxX - result.minX) / 2, result.minY, result.minX, result.maxY, result.maxX, result.maxY]);
|
|
27645
27966
|
} else if (/^arrow/.test(result.shape)) {
|
|
27646
27967
|
const model = this.modelGetter().createLinePath(false);
|
|
27647
|
-
model?.setPoints([
|
|
27648
|
-
result.minX,
|
|
27649
|
-
(result.maxY + result.minY) / 2,
|
|
27650
|
-
result.maxX,
|
|
27651
|
-
(result.maxY + result.minY) / 2
|
|
27652
|
-
]);
|
|
27968
|
+
model?.setPoints([result.minX, (result.maxY + result.minY) / 2, result.maxX, (result.maxY + result.minY) / 2]);
|
|
27653
27969
|
}
|
|
27654
27970
|
}
|
|
27655
27971
|
}
|
|
@@ -27657,12 +27973,29 @@ var CurveTool = class extends WhiteboardTool {
|
|
|
27657
27973
|
};
|
|
27658
27974
|
|
|
27659
27975
|
// src/tool/RectangleTool.ts
|
|
27976
|
+
function _defineProperty20(e, r, t) {
|
|
27977
|
+
return (r = _toPropertyKey20(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27978
|
+
}
|
|
27979
|
+
function _toPropertyKey20(t) {
|
|
27980
|
+
var i = _toPrimitive20(t, "string");
|
|
27981
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27982
|
+
}
|
|
27983
|
+
function _toPrimitive20(t, r) {
|
|
27984
|
+
if ("object" != typeof t || !t) return t;
|
|
27985
|
+
var e = t[Symbol.toPrimitive];
|
|
27986
|
+
if (void 0 !== e) {
|
|
27987
|
+
var i = e.call(t, r || "default");
|
|
27988
|
+
if ("object" != typeof i) return i;
|
|
27989
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27990
|
+
}
|
|
27991
|
+
return ("string" === r ? String : Number)(t);
|
|
27992
|
+
}
|
|
27660
27993
|
var RectangleTool = class extends WhiteboardTool {
|
|
27661
|
-
elementModel = null;
|
|
27662
|
-
from = null;
|
|
27663
|
-
to = null;
|
|
27664
27994
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
27665
27995
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
27996
|
+
_defineProperty20(this, "elementModel", null);
|
|
27997
|
+
_defineProperty20(this, "from", null);
|
|
27998
|
+
_defineProperty20(this, "to", null);
|
|
27666
27999
|
this.tool.minDistance = 1;
|
|
27667
28000
|
}
|
|
27668
28001
|
onMouseDown(event) {
|
|
@@ -27673,12 +28006,7 @@ var RectangleTool = class extends WhiteboardTool {
|
|
|
27673
28006
|
onMouseDrag(event) {
|
|
27674
28007
|
if (this.from && this.elementModel) {
|
|
27675
28008
|
this.to = event.point.clone();
|
|
27676
|
-
this.elementModel.setPoints([
|
|
27677
|
-
this.from.x,
|
|
27678
|
-
this.from.y,
|
|
27679
|
-
this.to.x,
|
|
27680
|
-
this.to.y
|
|
27681
|
-
]);
|
|
28009
|
+
this.elementModel.setPoints([this.from.x, this.from.y, this.to.x, this.to.y]);
|
|
27682
28010
|
}
|
|
27683
28011
|
}
|
|
27684
28012
|
onMouseUp(event) {
|
|
@@ -27693,6 +28021,23 @@ var RectangleTool = class extends WhiteboardTool {
|
|
|
27693
28021
|
|
|
27694
28022
|
// src/model/ToolbarModel.ts
|
|
27695
28023
|
import EventEmitter3 from "eventemitter3";
|
|
28024
|
+
function _defineProperty21(e, r, t) {
|
|
28025
|
+
return (r = _toPropertyKey21(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28026
|
+
}
|
|
28027
|
+
function _toPropertyKey21(t) {
|
|
28028
|
+
var i = _toPrimitive21(t, "string");
|
|
28029
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28030
|
+
}
|
|
28031
|
+
function _toPrimitive21(t, r) {
|
|
28032
|
+
if ("object" != typeof t || !t) return t;
|
|
28033
|
+
var e = t[Symbol.toPrimitive];
|
|
28034
|
+
if (void 0 !== e) {
|
|
28035
|
+
var i = e.call(t, r || "default");
|
|
28036
|
+
if ("object" != typeof i) return i;
|
|
28037
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28038
|
+
}
|
|
28039
|
+
return ("string" === r ? String : Number)(t);
|
|
28040
|
+
}
|
|
27696
28041
|
var TOOLBAR_KEYS = {
|
|
27697
28042
|
tool: "tool",
|
|
27698
28043
|
fontSize: "fontSize",
|
|
@@ -27703,7 +28048,6 @@ var TOOLBAR_KEYS = {
|
|
|
27703
28048
|
dashArray: "dashArray"
|
|
27704
28049
|
};
|
|
27705
28050
|
var ToolbarModel = class extends EventEmitter3 {
|
|
27706
|
-
root;
|
|
27707
28051
|
get currentTool() {
|
|
27708
28052
|
return this.root.get(TOOLBAR_KEYS.tool);
|
|
27709
28053
|
}
|
|
@@ -27748,6 +28092,22 @@ var ToolbarModel = class extends EventEmitter3 {
|
|
|
27748
28092
|
}
|
|
27749
28093
|
constructor(root, defaultStyle) {
|
|
27750
28094
|
super();
|
|
28095
|
+
_defineProperty21(this, "root", void 0);
|
|
28096
|
+
_defineProperty21(this, "handleRootUpdate", (evt) => {
|
|
28097
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
28098
|
+
if (Object.keys(TOOLBAR_KEYS).indexOf(key) >= 0 && (value.action === "add" || value.action === "update")) {
|
|
28099
|
+
this.emit("update", {
|
|
28100
|
+
tool: this.currentTool,
|
|
28101
|
+
fontSize: this.fontSize,
|
|
28102
|
+
fontFamily: this.fontFamily,
|
|
28103
|
+
strokeColor: this.strokeColor,
|
|
28104
|
+
fillColor: this.fillColor,
|
|
28105
|
+
strokeWidth: this.strokeWidth,
|
|
28106
|
+
dashArray: this.dashArray
|
|
28107
|
+
});
|
|
28108
|
+
}
|
|
28109
|
+
}
|
|
28110
|
+
});
|
|
27751
28111
|
this.root = root;
|
|
27752
28112
|
this.root.observe(this.handleRootUpdate);
|
|
27753
28113
|
Object.keys(defaultStyle).forEach((key) => {
|
|
@@ -27756,32 +28116,34 @@ var ToolbarModel = class extends EventEmitter3 {
|
|
|
27756
28116
|
}
|
|
27757
28117
|
});
|
|
27758
28118
|
}
|
|
27759
|
-
handleRootUpdate = (evt) => {
|
|
27760
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
27761
|
-
if (Object.keys(TOOLBAR_KEYS).indexOf(key) >= 0 && (value.action === "add" || value.action === "update")) {
|
|
27762
|
-
this.emit("update", {
|
|
27763
|
-
tool: this.currentTool,
|
|
27764
|
-
fontSize: this.fontSize,
|
|
27765
|
-
fontFamily: this.fontFamily,
|
|
27766
|
-
strokeColor: this.strokeColor,
|
|
27767
|
-
fillColor: this.fillColor,
|
|
27768
|
-
strokeWidth: this.strokeWidth,
|
|
27769
|
-
dashArray: this.dashArray
|
|
27770
|
-
});
|
|
27771
|
-
}
|
|
27772
|
-
}
|
|
27773
|
-
};
|
|
27774
28119
|
};
|
|
27775
28120
|
|
|
27776
28121
|
// src/tool/SelectorTool.ts
|
|
28122
|
+
function _defineProperty22(e, r, t) {
|
|
28123
|
+
return (r = _toPropertyKey22(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28124
|
+
}
|
|
28125
|
+
function _toPropertyKey22(t) {
|
|
28126
|
+
var i = _toPrimitive22(t, "string");
|
|
28127
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28128
|
+
}
|
|
28129
|
+
function _toPrimitive22(t, r) {
|
|
28130
|
+
if ("object" != typeof t || !t) return t;
|
|
28131
|
+
var e = t[Symbol.toPrimitive];
|
|
28132
|
+
if (void 0 !== e) {
|
|
28133
|
+
var i = e.call(t, r || "default");
|
|
28134
|
+
if ("object" != typeof i) return i;
|
|
28135
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28136
|
+
}
|
|
28137
|
+
return ("string" === r ? String : Number)(t);
|
|
28138
|
+
}
|
|
27777
28139
|
var SelectorTool = class extends WhiteboardTool {
|
|
27778
|
-
elementModel = null;
|
|
27779
|
-
from = null;
|
|
27780
|
-
to = null;
|
|
27781
|
-
selectElementsModel;
|
|
27782
|
-
selectElements = /* @__PURE__ */ new Map();
|
|
27783
28140
|
constructor(enableToolEvent, renderableModel, shadowEmitter, scope, selectElementsModel) {
|
|
27784
28141
|
super(enableToolEvent, renderableModel, shadowEmitter, scope);
|
|
28142
|
+
_defineProperty22(this, "elementModel", null);
|
|
28143
|
+
_defineProperty22(this, "from", null);
|
|
28144
|
+
_defineProperty22(this, "to", null);
|
|
28145
|
+
_defineProperty22(this, "selectElementsModel", void 0);
|
|
28146
|
+
_defineProperty22(this, "selectElements", /* @__PURE__ */ new Map());
|
|
27785
28147
|
this.selectElementsModel = selectElementsModel;
|
|
27786
28148
|
}
|
|
27787
28149
|
onMouseDown(event) {
|
|
@@ -27791,24 +28153,14 @@ var SelectorTool = class extends WhiteboardTool {
|
|
|
27791
28153
|
this.from = event.point.clone();
|
|
27792
28154
|
this.to = event.point.clone();
|
|
27793
28155
|
const rect = new this.scope.Rectangle(this.from, this.to);
|
|
27794
|
-
this.elementModel?.setPoints([
|
|
27795
|
-
rect.topLeft.x,
|
|
27796
|
-
rect.topLeft.y,
|
|
27797
|
-
rect.size.width,
|
|
27798
|
-
rect.size.height
|
|
27799
|
-
]);
|
|
28156
|
+
this.elementModel?.setPoints([rect.topLeft.x, rect.topLeft.y, rect.size.width, rect.size.height]);
|
|
27800
28157
|
this.selectElements.clear();
|
|
27801
28158
|
}
|
|
27802
28159
|
onMouseDrag(event) {
|
|
27803
28160
|
if (this.from && this.elementModel) {
|
|
27804
28161
|
this.to = event.point.clone();
|
|
27805
28162
|
const rect = new this.scope.Rectangle(this.from, this.to);
|
|
27806
|
-
this.elementModel.setPoints([
|
|
27807
|
-
rect.topLeft.x,
|
|
27808
|
-
rect.topLeft.y,
|
|
27809
|
-
rect.size.width,
|
|
27810
|
-
rect.size.height
|
|
27811
|
-
]);
|
|
28163
|
+
this.elementModel.setPoints([rect.topLeft.x, rect.topLeft.y, rect.size.width, rect.size.height]);
|
|
27812
28164
|
this.selectElementsModel.clearSelectElementForSelf();
|
|
27813
28165
|
this.scope.project.activeLayer.children.forEach((item) => {
|
|
27814
28166
|
if (item.data.type && ["selector", "eraser", "laser"].indexOf(item.data.type) < 0) {
|
|
@@ -27826,7 +28178,10 @@ var SelectorTool = class extends WhiteboardTool {
|
|
|
27826
28178
|
this.modelGetter().removeElementItem(this.elementModel.uuid);
|
|
27827
28179
|
}
|
|
27828
28180
|
const elements = Array.from(this.selectElements.keys()).reduce((result, next) => {
|
|
27829
|
-
result.push({
|
|
28181
|
+
result.push({
|
|
28182
|
+
elementId: next,
|
|
28183
|
+
ownerId: this.selectElements.get(next)
|
|
28184
|
+
});
|
|
27830
28185
|
return result;
|
|
27831
28186
|
}, []);
|
|
27832
28187
|
const hitResult = this.scope.project.hitTest(event.point);
|
|
@@ -27857,19 +28212,57 @@ var WhiteboardKeys = {
|
|
|
27857
28212
|
};
|
|
27858
28213
|
|
|
27859
28214
|
// src/model/SelectElementsModel.ts
|
|
28215
|
+
function _defineProperty23(e, r, t) {
|
|
28216
|
+
return (r = _toPropertyKey23(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28217
|
+
}
|
|
28218
|
+
function _toPropertyKey23(t) {
|
|
28219
|
+
var i = _toPrimitive23(t, "string");
|
|
28220
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28221
|
+
}
|
|
28222
|
+
function _toPrimitive23(t, r) {
|
|
28223
|
+
if ("object" != typeof t || !t) return t;
|
|
28224
|
+
var e = t[Symbol.toPrimitive];
|
|
28225
|
+
if (void 0 !== e) {
|
|
28226
|
+
var i = e.call(t, r || "default");
|
|
28227
|
+
if ("object" != typeof i) return i;
|
|
28228
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28229
|
+
}
|
|
28230
|
+
return ("string" === r ? String : Number)(t);
|
|
28231
|
+
}
|
|
27860
28232
|
var SelectElementsModel = class extends EventEmitter4 {
|
|
27861
|
-
requestUserMap;
|
|
27862
|
-
userManager;
|
|
27863
|
-
hasPermission;
|
|
27864
|
-
observers = /* @__PURE__ */ new Map();
|
|
27865
28233
|
get hasEditSelfPermission() {
|
|
27866
|
-
return this.hasPermission(
|
|
28234
|
+
return this.hasPermission(WhiteboardPermissionFlag.editSelf);
|
|
27867
28235
|
}
|
|
27868
28236
|
get hasEditOthersPermission() {
|
|
27869
|
-
return this.hasPermission(
|
|
28237
|
+
return this.hasPermission(WhiteboardPermissionFlag.editOthers);
|
|
27870
28238
|
}
|
|
27871
28239
|
constructor(userManager, requestUserMap, hasPermission) {
|
|
27872
28240
|
super();
|
|
28241
|
+
_defineProperty23(this, "requestUserMap", void 0);
|
|
28242
|
+
_defineProperty23(this, "userManager", void 0);
|
|
28243
|
+
_defineProperty23(this, "hasPermission", void 0);
|
|
28244
|
+
_defineProperty23(this, "observers", /* @__PURE__ */ new Map());
|
|
28245
|
+
_defineProperty23(this, "handleUserLeave", (user) => {
|
|
28246
|
+
const cb = this.observers.get(user.id);
|
|
28247
|
+
if (cb) {
|
|
28248
|
+
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
28249
|
+
}
|
|
28250
|
+
});
|
|
28251
|
+
_defineProperty23(this, "handleUserJoin", (user) => {
|
|
28252
|
+
const observer = (evts) => {
|
|
28253
|
+
this.handleUserSelectElementsChange(user.id, evts);
|
|
28254
|
+
};
|
|
28255
|
+
this.requestUserMap(user.id).observeDeep(observer);
|
|
28256
|
+
this.observers.set(user.id, observer);
|
|
28257
|
+
});
|
|
28258
|
+
_defineProperty23(this, "handleUserSelectElementsChange", (userId, evts) => {
|
|
28259
|
+
for (const evt of evts) {
|
|
28260
|
+
if (evt.target.get("inner-map-id") === WhiteboardKeys.selectElements) {
|
|
28261
|
+
const elementIds = Array.from(evt.target.keys()).filter((v) => v !== "inner-map-id");
|
|
28262
|
+
this.emit("elementsChange", userId, Array.from(elementIds));
|
|
28263
|
+
}
|
|
28264
|
+
}
|
|
28265
|
+
});
|
|
27873
28266
|
this.hasPermission = hasPermission;
|
|
27874
28267
|
this.userManager = userManager;
|
|
27875
28268
|
this.requestUserMap = requestUserMap;
|
|
@@ -27884,27 +28277,6 @@ var SelectElementsModel = class extends EventEmitter4 {
|
|
|
27884
28277
|
this.userManager.on("join", this.handleUserJoin);
|
|
27885
28278
|
this.userManager.on("leave", this.handleUserLeave);
|
|
27886
28279
|
}
|
|
27887
|
-
handleUserLeave = (user) => {
|
|
27888
|
-
const cb = this.observers.get(user.id);
|
|
27889
|
-
if (cb) {
|
|
27890
|
-
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
27891
|
-
}
|
|
27892
|
-
};
|
|
27893
|
-
handleUserJoin = (user) => {
|
|
27894
|
-
const observer = (evts) => {
|
|
27895
|
-
this.handleUserSelectElementsChange(user.id, evts);
|
|
27896
|
-
};
|
|
27897
|
-
this.requestUserMap(user.id).observeDeep(observer);
|
|
27898
|
-
this.observers.set(user.id, observer);
|
|
27899
|
-
};
|
|
27900
|
-
handleUserSelectElementsChange = (userId, evts) => {
|
|
27901
|
-
for (const evt of evts) {
|
|
27902
|
-
if (evt.target.get("inner-map-id") === WhiteboardKeys.selectElements) {
|
|
27903
|
-
const elementIds = Array.from(evt.target.keys()).filter((v) => v !== "inner-map-id");
|
|
27904
|
-
this.emit("elementsChange", userId, Array.from(elementIds));
|
|
27905
|
-
}
|
|
27906
|
-
}
|
|
27907
|
-
};
|
|
27908
28280
|
createModel(userId) {
|
|
27909
28281
|
const userMap = this.requestUserMap(userId);
|
|
27910
28282
|
if (!userMap.has(WhiteboardKeys.selectElements)) {
|
|
@@ -27914,7 +28286,10 @@ var SelectElementsModel = class extends EventEmitter4 {
|
|
|
27914
28286
|
}
|
|
27915
28287
|
}
|
|
27916
28288
|
addSelectElementForSelf(elements) {
|
|
27917
|
-
const {
|
|
28289
|
+
const {
|
|
28290
|
+
hasEditSelfPermission,
|
|
28291
|
+
hasEditOthersPermission
|
|
28292
|
+
} = this;
|
|
27918
28293
|
const ids = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.selectElements);
|
|
27919
28294
|
const ignoreIds = /* @__PURE__ */ new Set();
|
|
27920
28295
|
for (const userId of this.userManager.userIdList()) {
|
|
@@ -27967,16 +28342,54 @@ import EventEmitter6 from "eventemitter3";
|
|
|
27967
28342
|
|
|
27968
28343
|
// src/edit/TextEditor.ts
|
|
27969
28344
|
import { EventEmitter as EventEmitter5 } from "eventemitter3";
|
|
28345
|
+
function _defineProperty24(e, r, t) {
|
|
28346
|
+
return (r = _toPropertyKey24(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28347
|
+
}
|
|
28348
|
+
function _toPropertyKey24(t) {
|
|
28349
|
+
var i = _toPrimitive24(t, "string");
|
|
28350
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28351
|
+
}
|
|
28352
|
+
function _toPrimitive24(t, r) {
|
|
28353
|
+
if ("object" != typeof t || !t) return t;
|
|
28354
|
+
var e = t[Symbol.toPrimitive];
|
|
28355
|
+
if (void 0 !== e) {
|
|
28356
|
+
var i = e.call(t, r || "default");
|
|
28357
|
+
if ("object" != typeof i) return i;
|
|
28358
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28359
|
+
}
|
|
28360
|
+
return ("string" === r ? String : Number)(t);
|
|
28361
|
+
}
|
|
27970
28362
|
var TextEditor = class extends EventEmitter5 {
|
|
27971
|
-
rootView;
|
|
27972
|
-
content;
|
|
27973
|
-
camera;
|
|
27974
|
-
originX = 0;
|
|
27975
|
-
originY = 0;
|
|
27976
|
-
rotation = 0;
|
|
27977
|
-
scale = 1;
|
|
27978
28363
|
constructor(camera) {
|
|
27979
28364
|
super();
|
|
28365
|
+
_defineProperty24(this, "rootView", void 0);
|
|
28366
|
+
_defineProperty24(this, "content", void 0);
|
|
28367
|
+
_defineProperty24(this, "camera", void 0);
|
|
28368
|
+
_defineProperty24(this, "originX", 0);
|
|
28369
|
+
_defineProperty24(this, "originY", 0);
|
|
28370
|
+
_defineProperty24(this, "rotation", 0);
|
|
28371
|
+
_defineProperty24(this, "scale", 1);
|
|
28372
|
+
_defineProperty24(this, "handleContentInput", () => {
|
|
28373
|
+
this.emit("change", this.content.textContent ?? "");
|
|
28374
|
+
this.translateCaretIntoView();
|
|
28375
|
+
});
|
|
28376
|
+
_defineProperty24(this, "handleContentKeydown", (evt) => {
|
|
28377
|
+
if (/^Arrow/.test(evt.key)) {
|
|
28378
|
+
setTimeout(() => {
|
|
28379
|
+
this.translateCaretIntoView();
|
|
28380
|
+
}, 50);
|
|
28381
|
+
}
|
|
28382
|
+
});
|
|
28383
|
+
_defineProperty24(this, "handleContentBlur", () => {
|
|
28384
|
+
this.emit("done", this.content.textContent ?? "");
|
|
28385
|
+
});
|
|
28386
|
+
_defineProperty24(this, "handleRootClick", (evt) => {
|
|
28387
|
+
if (evt.target === this.rootView) {
|
|
28388
|
+
evt.stopPropagation();
|
|
28389
|
+
evt.preventDefault();
|
|
28390
|
+
this.emit("done", this.content.textContent ?? "");
|
|
28391
|
+
}
|
|
28392
|
+
});
|
|
27980
28393
|
this.camera = camera;
|
|
27981
28394
|
this.rootView = document.createElement("div");
|
|
27982
28395
|
this.rootView.style.cssText = `position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;`;
|
|
@@ -27996,27 +28409,6 @@ var TextEditor = class extends EventEmitter5 {
|
|
|
27996
28409
|
this.updateMatrixStyle();
|
|
27997
28410
|
});
|
|
27998
28411
|
}
|
|
27999
|
-
handleContentInput = () => {
|
|
28000
|
-
this.emit("change", this.content.textContent ?? "");
|
|
28001
|
-
this.translateCaretIntoView();
|
|
28002
|
-
};
|
|
28003
|
-
handleContentKeydown = (evt) => {
|
|
28004
|
-
if (/^Arrow/.test(evt.key)) {
|
|
28005
|
-
setTimeout(() => {
|
|
28006
|
-
this.translateCaretIntoView();
|
|
28007
|
-
}, 50);
|
|
28008
|
-
}
|
|
28009
|
-
};
|
|
28010
|
-
handleContentBlur = () => {
|
|
28011
|
-
this.emit("done", this.content.textContent ?? "");
|
|
28012
|
-
};
|
|
28013
|
-
handleRootClick = (evt) => {
|
|
28014
|
-
if (evt.target === this.rootView) {
|
|
28015
|
-
evt.stopPropagation();
|
|
28016
|
-
evt.preventDefault();
|
|
28017
|
-
this.emit("done", this.content.textContent ?? "");
|
|
28018
|
-
}
|
|
28019
|
-
};
|
|
28020
28412
|
// 通过移动相机, 使光标在可见区域内
|
|
28021
28413
|
translateCaretIntoView() {
|
|
28022
28414
|
const selection = window.getSelection();
|
|
@@ -28083,6 +28475,23 @@ var TextEditor = class extends EventEmitter5 {
|
|
|
28083
28475
|
};
|
|
28084
28476
|
|
|
28085
28477
|
// src/edit/Editor.ts
|
|
28478
|
+
function _defineProperty25(e, r, t) {
|
|
28479
|
+
return (r = _toPropertyKey25(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28480
|
+
}
|
|
28481
|
+
function _toPropertyKey25(t) {
|
|
28482
|
+
var i = _toPrimitive25(t, "string");
|
|
28483
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28484
|
+
}
|
|
28485
|
+
function _toPrimitive25(t, r) {
|
|
28486
|
+
if ("object" != typeof t || !t) return t;
|
|
28487
|
+
var e = t[Symbol.toPrimitive];
|
|
28488
|
+
if (void 0 !== e) {
|
|
28489
|
+
var i = e.call(t, r || "default");
|
|
28490
|
+
if ("object" != typeof i) return i;
|
|
28491
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28492
|
+
}
|
|
28493
|
+
return ("string" === r ? String : Number)(t);
|
|
28494
|
+
}
|
|
28086
28495
|
var ANCHOR_STYLE = {
|
|
28087
28496
|
tl: "cursor:nw-resize;top:-3px;left:-3px",
|
|
28088
28497
|
t: "cursor:n-resize;top:-3px;left:50%;translate:-50%;",
|
|
@@ -28094,12 +28503,6 @@ var ANCHOR_STYLE = {
|
|
|
28094
28503
|
br: "cursor:se-resize;bottom:-3px;right:-3px"
|
|
28095
28504
|
};
|
|
28096
28505
|
var Bounds = class extends EventEmitter6 {
|
|
28097
|
-
minX = 0;
|
|
28098
|
-
minY = 0;
|
|
28099
|
-
maxX = 0;
|
|
28100
|
-
maxY = 0;
|
|
28101
|
-
binding;
|
|
28102
|
-
scope;
|
|
28103
28506
|
get width() {
|
|
28104
28507
|
return this.maxX - this.minX;
|
|
28105
28508
|
}
|
|
@@ -28114,6 +28517,12 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28114
28517
|
}
|
|
28115
28518
|
constructor(binding, scope) {
|
|
28116
28519
|
super();
|
|
28520
|
+
_defineProperty25(this, "minX", 0);
|
|
28521
|
+
_defineProperty25(this, "minY", 0);
|
|
28522
|
+
_defineProperty25(this, "maxX", 0);
|
|
28523
|
+
_defineProperty25(this, "maxY", 0);
|
|
28524
|
+
_defineProperty25(this, "binding", void 0);
|
|
28525
|
+
_defineProperty25(this, "scope", void 0);
|
|
28117
28526
|
this.binding = binding;
|
|
28118
28527
|
this.scope = scope;
|
|
28119
28528
|
}
|
|
@@ -28159,11 +28568,7 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28159
28568
|
}
|
|
28160
28569
|
this.minY += offsetY;
|
|
28161
28570
|
this.minX += offsetX;
|
|
28162
|
-
matrix.scale(
|
|
28163
|
-
this.width / prevWidth,
|
|
28164
|
-
this.height / prevHeight,
|
|
28165
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY))
|
|
28166
|
-
);
|
|
28571
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY)));
|
|
28167
28572
|
} else if (anchor === "t") {
|
|
28168
28573
|
if (aspectRatio > 0) {
|
|
28169
28574
|
offsetX = offsetY * aspectRatio;
|
|
@@ -28172,22 +28577,14 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28172
28577
|
}
|
|
28173
28578
|
this.minX += offsetX;
|
|
28174
28579
|
this.minY += offsetY;
|
|
28175
|
-
matrix.scale(
|
|
28176
|
-
this.width / prevWidth,
|
|
28177
|
-
this.height / prevHeight,
|
|
28178
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY))
|
|
28179
|
-
);
|
|
28580
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY)));
|
|
28180
28581
|
} else if (anchor === "tr") {
|
|
28181
28582
|
if (aspectRatio > 0) {
|
|
28182
28583
|
offsetY = -1 * offsetX / aspectRatio;
|
|
28183
28584
|
}
|
|
28184
28585
|
this.minY += offsetY;
|
|
28185
28586
|
this.maxX += offsetX;
|
|
28186
|
-
matrix.scale(
|
|
28187
|
-
this.width / prevWidth,
|
|
28188
|
-
this.height / prevHeight,
|
|
28189
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY))
|
|
28190
|
-
);
|
|
28587
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY)));
|
|
28191
28588
|
} else if (anchor === "l") {
|
|
28192
28589
|
if (aspectRatio > 0) {
|
|
28193
28590
|
offsetY = offsetX / aspectRatio;
|
|
@@ -28196,11 +28593,7 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28196
28593
|
}
|
|
28197
28594
|
this.minY += offsetY;
|
|
28198
28595
|
this.minX += offsetX;
|
|
28199
|
-
matrix.scale(
|
|
28200
|
-
this.width / prevWidth,
|
|
28201
|
-
this.height / prevHeight,
|
|
28202
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY))
|
|
28203
|
-
);
|
|
28596
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY)));
|
|
28204
28597
|
} else if (anchor === "r") {
|
|
28205
28598
|
if (aspectRatio > 0) {
|
|
28206
28599
|
offsetY = -1 * offsetX / aspectRatio;
|
|
@@ -28209,22 +28602,14 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28209
28602
|
}
|
|
28210
28603
|
this.maxX += offsetX;
|
|
28211
28604
|
this.minY += offsetY;
|
|
28212
|
-
matrix.scale(
|
|
28213
|
-
this.width / prevWidth,
|
|
28214
|
-
this.height / prevHeight,
|
|
28215
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY))
|
|
28216
|
-
);
|
|
28605
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY)));
|
|
28217
28606
|
} else if (anchor === "bl") {
|
|
28218
28607
|
if (aspectRatio > 0) {
|
|
28219
28608
|
offsetY = -1 * offsetX / aspectRatio;
|
|
28220
28609
|
}
|
|
28221
28610
|
this.minX += offsetX;
|
|
28222
28611
|
this.maxY += offsetY;
|
|
28223
|
-
matrix.scale(
|
|
28224
|
-
this.width / prevWidth,
|
|
28225
|
-
this.height / prevHeight,
|
|
28226
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY))
|
|
28227
|
-
);
|
|
28612
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY)));
|
|
28228
28613
|
} else if (anchor === "b") {
|
|
28229
28614
|
if (aspectRatio > 0) {
|
|
28230
28615
|
offsetX = -1 * offsetY * aspectRatio;
|
|
@@ -28233,22 +28618,14 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28233
28618
|
}
|
|
28234
28619
|
this.minX += offsetX;
|
|
28235
28620
|
this.maxY += offsetY;
|
|
28236
|
-
matrix.scale(
|
|
28237
|
-
this.width / prevWidth,
|
|
28238
|
-
this.height / prevHeight,
|
|
28239
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY))
|
|
28240
|
-
);
|
|
28621
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY)));
|
|
28241
28622
|
} else if (anchor === "br") {
|
|
28242
28623
|
if (aspectRatio > 0) {
|
|
28243
28624
|
offsetY = offsetX / aspectRatio;
|
|
28244
28625
|
}
|
|
28245
28626
|
this.maxY += offsetY;
|
|
28246
28627
|
this.maxX += offsetX;
|
|
28247
|
-
matrix.scale(
|
|
28248
|
-
this.width / prevWidth,
|
|
28249
|
-
this.height / prevHeight,
|
|
28250
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.minY))
|
|
28251
|
-
);
|
|
28628
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.minY)));
|
|
28252
28629
|
}
|
|
28253
28630
|
this.updateBinding();
|
|
28254
28631
|
this.emit("matrix", matrix);
|
|
@@ -28265,56 +28642,215 @@ var Bounds = class extends EventEmitter6 {
|
|
|
28265
28642
|
}
|
|
28266
28643
|
};
|
|
28267
28644
|
var Editor = class extends EventEmitter6 {
|
|
28268
|
-
rootView;
|
|
28269
|
-
frame;
|
|
28270
|
-
rotator;
|
|
28271
|
-
scope;
|
|
28272
|
-
shadowScope;
|
|
28273
|
-
shadowContainer;
|
|
28274
|
-
ctrlUserMap;
|
|
28275
|
-
// 当前是谁的视角
|
|
28276
|
-
viewerId;
|
|
28277
|
-
// 谁在操控 Editor
|
|
28278
|
-
ctrlId;
|
|
28279
|
-
ctrlNickName;
|
|
28280
|
-
editMode = null;
|
|
28281
|
-
editCtrlName = null;
|
|
28282
|
-
editAnchor = null;
|
|
28283
|
-
lastEditPoint = null;
|
|
28284
|
-
bounds;
|
|
28285
|
-
targets = [];
|
|
28286
|
-
editorConfig = null;
|
|
28287
|
-
aspectRatio = -1;
|
|
28288
|
-
// 是否等比缩放, 设置后只会应用一次, 即 pointerup 之后会恢复为 false
|
|
28289
|
-
uniformScale = false;
|
|
28290
|
-
camera;
|
|
28291
|
-
canvasElement;
|
|
28292
|
-
resizeObserver;
|
|
28293
|
-
anchors = [];
|
|
28294
|
-
title = null;
|
|
28295
|
-
shadowEmitter;
|
|
28296
28645
|
constructor(scope, shadowScope, shadowEmitter, canvasElement, camera, initConfig) {
|
|
28297
28646
|
super();
|
|
28298
|
-
this
|
|
28299
|
-
this
|
|
28300
|
-
this
|
|
28301
|
-
this
|
|
28302
|
-
this
|
|
28303
|
-
this
|
|
28304
|
-
this
|
|
28305
|
-
this
|
|
28306
|
-
this
|
|
28307
|
-
this
|
|
28308
|
-
this
|
|
28309
|
-
this
|
|
28310
|
-
this
|
|
28311
|
-
this
|
|
28312
|
-
this
|
|
28313
|
-
this
|
|
28314
|
-
this
|
|
28315
|
-
this
|
|
28316
|
-
|
|
28317
|
-
this
|
|
28647
|
+
_defineProperty25(this, "rootView", void 0);
|
|
28648
|
+
_defineProperty25(this, "frame", void 0);
|
|
28649
|
+
_defineProperty25(this, "rotator", void 0);
|
|
28650
|
+
_defineProperty25(this, "scope", void 0);
|
|
28651
|
+
_defineProperty25(this, "shadowScope", void 0);
|
|
28652
|
+
_defineProperty25(this, "shadowContainer", void 0);
|
|
28653
|
+
_defineProperty25(this, "ctrlUserMap", void 0);
|
|
28654
|
+
_defineProperty25(this, "viewerId", void 0);
|
|
28655
|
+
_defineProperty25(this, "ctrlId", void 0);
|
|
28656
|
+
_defineProperty25(this, "ctrlNickName", void 0);
|
|
28657
|
+
_defineProperty25(this, "editMode", null);
|
|
28658
|
+
_defineProperty25(this, "editCtrlName", null);
|
|
28659
|
+
_defineProperty25(this, "editAnchor", null);
|
|
28660
|
+
_defineProperty25(this, "lastEditPoint", null);
|
|
28661
|
+
_defineProperty25(this, "bounds", void 0);
|
|
28662
|
+
_defineProperty25(this, "targets", []);
|
|
28663
|
+
_defineProperty25(this, "editorConfig", null);
|
|
28664
|
+
_defineProperty25(this, "aspectRatio", -1);
|
|
28665
|
+
_defineProperty25(this, "uniformScale", false);
|
|
28666
|
+
_defineProperty25(this, "camera", void 0);
|
|
28667
|
+
_defineProperty25(this, "canvasElement", void 0);
|
|
28668
|
+
_defineProperty25(this, "resizeObserver", void 0);
|
|
28669
|
+
_defineProperty25(this, "anchors", []);
|
|
28670
|
+
_defineProperty25(this, "title", null);
|
|
28671
|
+
_defineProperty25(this, "shadowEmitter", void 0);
|
|
28672
|
+
_defineProperty25(this, "handleMatrix", (matrix) => {
|
|
28673
|
+
if (this.shadowContainer) {
|
|
28674
|
+
const next = matrix.appended(this.shadowContainer.data.shadowMatrix ?? new this.shadowScope.Matrix());
|
|
28675
|
+
this.shadowContainer.data.shadowMatrix = next;
|
|
28676
|
+
this.shadowContainer.transform(this.shadowContainer.matrix.inverted());
|
|
28677
|
+
this.shadowContainer.matrix = next;
|
|
28678
|
+
} else {
|
|
28679
|
+
this.targets.forEach((target) => target.appendPointsMatrix(matrix));
|
|
28680
|
+
}
|
|
28681
|
+
});
|
|
28682
|
+
_defineProperty25(this, "handlePointerDown", (evt) => {
|
|
28683
|
+
if (!evt.target) {
|
|
28684
|
+
return;
|
|
28685
|
+
}
|
|
28686
|
+
this.shadowEmitter.setActive(true);
|
|
28687
|
+
this.translateShadow();
|
|
28688
|
+
const target = evt.target;
|
|
28689
|
+
const anchorType = target.getAttribute("data-anchor");
|
|
28690
|
+
if (anchorType) {
|
|
28691
|
+
evt.preventDefault();
|
|
28692
|
+
if (evt.metaKey || this.editorConfig?.uniformScale()) {
|
|
28693
|
+
this.uniformScale = true;
|
|
28694
|
+
}
|
|
28695
|
+
if (this.uniformScale) {
|
|
28696
|
+
this.aspectRatio = this.bounds.width / this.bounds.height;
|
|
28697
|
+
}
|
|
28698
|
+
this.editMode = "matrix";
|
|
28699
|
+
this.editAnchor = anchorType;
|
|
28700
|
+
this.lastEditPoint = {
|
|
28701
|
+
x: evt.pageX,
|
|
28702
|
+
y: evt.pageY
|
|
28703
|
+
};
|
|
28704
|
+
this.hiddenCtrlPoints();
|
|
28705
|
+
}
|
|
28706
|
+
if (target.getAttribute("data-rotator")) {
|
|
28707
|
+
evt.preventDefault();
|
|
28708
|
+
this.editMode = "rotate";
|
|
28709
|
+
this.lastEditPoint = {
|
|
28710
|
+
x: evt.pageX,
|
|
28711
|
+
y: evt.pageY
|
|
28712
|
+
};
|
|
28713
|
+
this.rootView.style.opacity = "0";
|
|
28714
|
+
}
|
|
28715
|
+
if (target === this.frame) {
|
|
28716
|
+
evt.preventDefault();
|
|
28717
|
+
this.editMode = "translate";
|
|
28718
|
+
this.lastEditPoint = {
|
|
28719
|
+
x: evt.pageX,
|
|
28720
|
+
y: evt.pageY
|
|
28721
|
+
};
|
|
28722
|
+
this.hiddenCtrlPoints();
|
|
28723
|
+
}
|
|
28724
|
+
if (target === this.rootView) {
|
|
28725
|
+
this.emit("clear");
|
|
28726
|
+
}
|
|
28727
|
+
const ctrlName = target.getAttribute("data-ctrl-name");
|
|
28728
|
+
if (ctrlName) {
|
|
28729
|
+
evt.preventDefault();
|
|
28730
|
+
this.editMode = "ctrl-point";
|
|
28731
|
+
this.editCtrlName = ctrlName;
|
|
28732
|
+
this.lastEditPoint = {
|
|
28733
|
+
x: evt.offsetX,
|
|
28734
|
+
y: evt.offsetY
|
|
28735
|
+
};
|
|
28736
|
+
}
|
|
28737
|
+
});
|
|
28738
|
+
_defineProperty25(this, "handlePointerMove", (evt) => {
|
|
28739
|
+
evt.preventDefault();
|
|
28740
|
+
if (!evt.target) {
|
|
28741
|
+
return;
|
|
28742
|
+
}
|
|
28743
|
+
if (this.editMode === "matrix" && this.editAnchor && this.lastEditPoint) {
|
|
28744
|
+
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28745
|
+
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28746
|
+
this.bounds.offsetBy(this.editAnchor, offsetX, offsetY, this.uniformScale ? this.aspectRatio : -1);
|
|
28747
|
+
this.lastEditPoint = {
|
|
28748
|
+
x: evt.pageX,
|
|
28749
|
+
y: evt.pageY
|
|
28750
|
+
};
|
|
28751
|
+
}
|
|
28752
|
+
if (this.editMode === "rotate" && this.lastEditPoint) {
|
|
28753
|
+
const pageCenter = this.bounds.pageCenter();
|
|
28754
|
+
const vector1 = new this.scope.Point(this.lastEditPoint.x, this.lastEditPoint.y).subtract(new this.scope.Point(pageCenter));
|
|
28755
|
+
const vector2 = new this.scope.Point(evt.pageX, evt.pageY).subtract(new this.scope.Point(pageCenter));
|
|
28756
|
+
const viewPoint = new this.scope.Point(this.bounds.midX, this.bounds.midY);
|
|
28757
|
+
const projectPoint = this.scope.project.view.viewToProject(viewPoint);
|
|
28758
|
+
this.targets.forEach((target) => {
|
|
28759
|
+
if (target.item) {
|
|
28760
|
+
target.rotateByOffset(vector2.angle - vector1.angle, projectPoint.x, projectPoint.y);
|
|
28761
|
+
}
|
|
28762
|
+
});
|
|
28763
|
+
this.lastEditPoint = {
|
|
28764
|
+
x: evt.pageX,
|
|
28765
|
+
y: evt.pageY
|
|
28766
|
+
};
|
|
28767
|
+
}
|
|
28768
|
+
if (this.editMode === "translate" && this.lastEditPoint) {
|
|
28769
|
+
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28770
|
+
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28771
|
+
this.bounds.translate(offsetX, offsetY);
|
|
28772
|
+
this.updateBoundsByShadow();
|
|
28773
|
+
this.lastEditPoint = {
|
|
28774
|
+
x: evt.pageX,
|
|
28775
|
+
y: evt.pageY
|
|
28776
|
+
};
|
|
28777
|
+
}
|
|
28778
|
+
if (this.editMode === "ctrl-point" && this.editorConfig) {
|
|
28779
|
+
const ctrlPoint = this.editorConfig.controlPoints.find((v) => v.name === this.editCtrlName);
|
|
28780
|
+
const ctrlElement = this.rootView.querySelector(`[data-ctrl-name="${this.editCtrlName}"]`);
|
|
28781
|
+
if (ctrlPoint && ctrlElement) {
|
|
28782
|
+
const projectPoint = this.scope.project.view.getEventPoint(evt);
|
|
28783
|
+
ctrlPoint.onPositionChange(projectPoint);
|
|
28784
|
+
this.updateBoundsByShadow();
|
|
28785
|
+
this.updateControlPointsPosition();
|
|
28786
|
+
}
|
|
28787
|
+
}
|
|
28788
|
+
});
|
|
28789
|
+
_defineProperty25(this, "handlePointerUp", (evt) => {
|
|
28790
|
+
evt.preventDefault();
|
|
28791
|
+
this.resetShadow();
|
|
28792
|
+
this.shadowEmitter.setActive(false);
|
|
28793
|
+
this.updateBounds();
|
|
28794
|
+
if (this.editMode === "rotate") {
|
|
28795
|
+
this.applyConfig(this.editorConfig);
|
|
28796
|
+
this.rootView.style.opacity = "1";
|
|
28797
|
+
}
|
|
28798
|
+
if (this.editMode === "matrix") {
|
|
28799
|
+
this.bounds.reset();
|
|
28800
|
+
}
|
|
28801
|
+
this.editMode = null;
|
|
28802
|
+
this.editAnchor = null;
|
|
28803
|
+
this.lastEditPoint = null;
|
|
28804
|
+
this.uniformScale = false;
|
|
28805
|
+
});
|
|
28806
|
+
_defineProperty25(this, "handleFrameDBClick", (evt) => {
|
|
28807
|
+
if (evt.target === this.frame && this.targets.length === 1) {
|
|
28808
|
+
if (this.targets[0].type === "point-text") {
|
|
28809
|
+
this.frame.style.display = "none";
|
|
28810
|
+
this.createTextEditor(this.targets[0]);
|
|
28811
|
+
}
|
|
28812
|
+
}
|
|
28813
|
+
});
|
|
28814
|
+
_defineProperty25(this, "updateBounds", () => {
|
|
28815
|
+
let minX = Number.MAX_VALUE;
|
|
28816
|
+
let maxX = -Number.MAX_VALUE;
|
|
28817
|
+
let minY = Number.MAX_VALUE;
|
|
28818
|
+
let maxY = -Number.MAX_VALUE;
|
|
28819
|
+
for (const model of this.targets) {
|
|
28820
|
+
if (!model.item) {
|
|
28821
|
+
continue;
|
|
28822
|
+
}
|
|
28823
|
+
const bound = model.item.bounds;
|
|
28824
|
+
minX = Math.min(bound.topLeft.x, minX);
|
|
28825
|
+
maxX = Math.max(bound.bottomRight.x, maxX);
|
|
28826
|
+
minY = Math.min(bound.topLeft.y, minY);
|
|
28827
|
+
maxY = Math.max(bound.bottomRight.y, maxY);
|
|
28828
|
+
}
|
|
28829
|
+
const fromPoint = new this.scope.Point(minX, minY).transform(this.scope.project.view.matrix);
|
|
28830
|
+
const toPoint = new this.scope.Point(maxX, maxY).transform(this.scope.project.view.matrix);
|
|
28831
|
+
this.bounds.update(fromPoint.x, fromPoint.y, toPoint.x, toPoint.y);
|
|
28832
|
+
this.updateControlPointsPosition();
|
|
28833
|
+
});
|
|
28834
|
+
this.shadowEmitter = shadowEmitter;
|
|
28835
|
+
this.shadowScope = shadowScope;
|
|
28836
|
+
this.shadowContainer = new shadowScope.Group();
|
|
28837
|
+
this.shadowContainer.applyMatrix = false;
|
|
28838
|
+
this.shadowContainer.data.uuid = `shadow-container-${initConfig.ctrlId}`;
|
|
28839
|
+
this.canvasElement = canvasElement;
|
|
28840
|
+
this.camera = camera;
|
|
28841
|
+
this.scope = scope;
|
|
28842
|
+
this.ctrlUserMap = initConfig.ctrlUserMap;
|
|
28843
|
+
this.viewerId = initConfig.viewerId;
|
|
28844
|
+
this.ctrlId = initConfig.ctrlId;
|
|
28845
|
+
this.ctrlNickName = initConfig.ctrlNickName;
|
|
28846
|
+
this.rootView = document.createElement("div");
|
|
28847
|
+
this.rootView.style.cssText = `position:absolute;display:none;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%,-50%);`;
|
|
28848
|
+
this.frame = document.createElement("div");
|
|
28849
|
+
this.frame.style.position = "absolute";
|
|
28850
|
+
this.frame.style.padding = "8px";
|
|
28851
|
+
this.frame.style.transform = "translate(-8px, -8px)";
|
|
28852
|
+
this.rootView.appendChild(this.frame);
|
|
28853
|
+
this.bounds = new Bounds(this.frame, this.scope);
|
|
28318
28854
|
this.bounds.on("matrix", this.handleMatrix);
|
|
28319
28855
|
this.rotator = document.createElement("div");
|
|
28320
28856
|
this.rotator.setAttribute("data-rotator", "true");
|
|
@@ -28344,104 +28880,6 @@ var Editor = class extends EventEmitter6 {
|
|
|
28344
28880
|
this.rootView.style.width = `${rect.width}px`;
|
|
28345
28881
|
this.rootView.style.height = `${rect.height}px`;
|
|
28346
28882
|
}
|
|
28347
|
-
handleMatrix = (matrix) => {
|
|
28348
|
-
if (this.shadowContainer) {
|
|
28349
|
-
const next = matrix.appended(
|
|
28350
|
-
this.shadowContainer.data.shadowMatrix ?? new this.shadowScope.Matrix()
|
|
28351
|
-
);
|
|
28352
|
-
this.shadowContainer.data.shadowMatrix = next;
|
|
28353
|
-
this.shadowContainer.transform(this.shadowContainer.matrix.inverted());
|
|
28354
|
-
this.shadowContainer.matrix = next;
|
|
28355
|
-
} else {
|
|
28356
|
-
this.targets.forEach((target) => target.appendPointsMatrix(matrix));
|
|
28357
|
-
}
|
|
28358
|
-
};
|
|
28359
|
-
handlePointerDown = (evt) => {
|
|
28360
|
-
if (!evt.target) {
|
|
28361
|
-
return;
|
|
28362
|
-
}
|
|
28363
|
-
this.shadowEmitter.setActive(true);
|
|
28364
|
-
this.translateShadow();
|
|
28365
|
-
const target = evt.target;
|
|
28366
|
-
const anchorType = target.getAttribute("data-anchor");
|
|
28367
|
-
if (anchorType) {
|
|
28368
|
-
evt.preventDefault();
|
|
28369
|
-
if (evt.metaKey || this.editorConfig?.uniformScale()) {
|
|
28370
|
-
this.uniformScale = true;
|
|
28371
|
-
}
|
|
28372
|
-
if (this.uniformScale) {
|
|
28373
|
-
this.aspectRatio = this.bounds.width / this.bounds.height;
|
|
28374
|
-
}
|
|
28375
|
-
this.editMode = "matrix";
|
|
28376
|
-
this.editAnchor = anchorType;
|
|
28377
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28378
|
-
this.hiddenCtrlPoints();
|
|
28379
|
-
}
|
|
28380
|
-
if (target.getAttribute("data-rotator")) {
|
|
28381
|
-
evt.preventDefault();
|
|
28382
|
-
this.editMode = "rotate";
|
|
28383
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28384
|
-
this.rootView.style.opacity = "0";
|
|
28385
|
-
}
|
|
28386
|
-
if (target === this.frame) {
|
|
28387
|
-
evt.preventDefault();
|
|
28388
|
-
this.editMode = "translate";
|
|
28389
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28390
|
-
this.hiddenCtrlPoints();
|
|
28391
|
-
}
|
|
28392
|
-
if (target === this.rootView) {
|
|
28393
|
-
this.emit("clear");
|
|
28394
|
-
}
|
|
28395
|
-
const ctrlName = target.getAttribute("data-ctrl-name");
|
|
28396
|
-
if (ctrlName) {
|
|
28397
|
-
evt.preventDefault();
|
|
28398
|
-
this.editMode = "ctrl-point";
|
|
28399
|
-
this.editCtrlName = ctrlName;
|
|
28400
|
-
this.lastEditPoint = { x: evt.offsetX, y: evt.offsetY };
|
|
28401
|
-
}
|
|
28402
|
-
};
|
|
28403
|
-
handlePointerMove = (evt) => {
|
|
28404
|
-
evt.preventDefault();
|
|
28405
|
-
if (!evt.target) {
|
|
28406
|
-
return;
|
|
28407
|
-
}
|
|
28408
|
-
if (this.editMode === "matrix" && this.editAnchor && this.lastEditPoint) {
|
|
28409
|
-
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28410
|
-
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28411
|
-
this.bounds.offsetBy(this.editAnchor, offsetX, offsetY, this.uniformScale ? this.aspectRatio : -1);
|
|
28412
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28413
|
-
}
|
|
28414
|
-
if (this.editMode === "rotate" && this.lastEditPoint) {
|
|
28415
|
-
const pageCenter = this.bounds.pageCenter();
|
|
28416
|
-
const vector1 = new this.scope.Point(this.lastEditPoint.x, this.lastEditPoint.y).subtract(new this.scope.Point(pageCenter));
|
|
28417
|
-
const vector2 = new this.scope.Point(evt.pageX, evt.pageY).subtract(new this.scope.Point(pageCenter));
|
|
28418
|
-
const viewPoint = new this.scope.Point(this.bounds.midX, this.bounds.midY);
|
|
28419
|
-
const projectPoint = this.scope.project.view.viewToProject(viewPoint);
|
|
28420
|
-
this.targets.forEach((target) => {
|
|
28421
|
-
if (target.item) {
|
|
28422
|
-
target.rotateByOffset(vector2.angle - vector1.angle, projectPoint.x, projectPoint.y);
|
|
28423
|
-
}
|
|
28424
|
-
});
|
|
28425
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28426
|
-
}
|
|
28427
|
-
if (this.editMode === "translate" && this.lastEditPoint) {
|
|
28428
|
-
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28429
|
-
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28430
|
-
this.bounds.translate(offsetX, offsetY);
|
|
28431
|
-
this.updateBoundsByShadow();
|
|
28432
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28433
|
-
}
|
|
28434
|
-
if (this.editMode === "ctrl-point" && this.editorConfig) {
|
|
28435
|
-
const ctrlPoint = this.editorConfig.controlPoints.find((v) => v.name === this.editCtrlName);
|
|
28436
|
-
const ctrlElement = this.rootView.querySelector(`[data-ctrl-name="${this.editCtrlName}"]`);
|
|
28437
|
-
if (ctrlPoint && ctrlElement) {
|
|
28438
|
-
const projectPoint = this.scope.project.view.getEventPoint(evt);
|
|
28439
|
-
ctrlPoint.onPositionChange(projectPoint);
|
|
28440
|
-
this.updateBoundsByShadow();
|
|
28441
|
-
this.updateControlPointsPosition();
|
|
28442
|
-
}
|
|
28443
|
-
}
|
|
28444
|
-
};
|
|
28445
28883
|
hiddenCtrlPoints() {
|
|
28446
28884
|
this.editorConfig?.controlPoints.forEach((ctrl) => {
|
|
28447
28885
|
const ctrlElement = this.rootView.querySelector(`[data-ctrl-name="${ctrl.name}"]`);
|
|
@@ -28450,31 +28888,6 @@ var Editor = class extends EventEmitter6 {
|
|
|
28450
28888
|
}
|
|
28451
28889
|
});
|
|
28452
28890
|
}
|
|
28453
|
-
handlePointerUp = (evt) => {
|
|
28454
|
-
evt.preventDefault();
|
|
28455
|
-
this.resetShadow();
|
|
28456
|
-
this.shadowEmitter.setActive(false);
|
|
28457
|
-
this.updateBounds();
|
|
28458
|
-
if (this.editMode === "rotate") {
|
|
28459
|
-
this.applyConfig(this.editorConfig);
|
|
28460
|
-
this.rootView.style.opacity = "1";
|
|
28461
|
-
}
|
|
28462
|
-
if (this.editMode === "matrix") {
|
|
28463
|
-
this.bounds.reset();
|
|
28464
|
-
}
|
|
28465
|
-
this.editMode = null;
|
|
28466
|
-
this.editAnchor = null;
|
|
28467
|
-
this.lastEditPoint = null;
|
|
28468
|
-
this.uniformScale = false;
|
|
28469
|
-
};
|
|
28470
|
-
handleFrameDBClick = (evt) => {
|
|
28471
|
-
if (evt.target === this.frame && this.targets.length === 1) {
|
|
28472
|
-
if (this.targets[0].type === "point-text") {
|
|
28473
|
-
this.frame.style.display = "none";
|
|
28474
|
-
this.createTextEditor(this.targets[0]);
|
|
28475
|
-
}
|
|
28476
|
-
}
|
|
28477
|
-
};
|
|
28478
28891
|
createTextEditor(target) {
|
|
28479
28892
|
const measurement = target.getInternalMeasurement();
|
|
28480
28893
|
if (!measurement) {
|
|
@@ -28595,38 +29008,10 @@ var Editor = class extends EventEmitter6 {
|
|
|
28595
29008
|
maxX = Math.max(bounds.bottomRight.x, maxX);
|
|
28596
29009
|
minY = Math.min(bounds.topLeft.y, minY);
|
|
28597
29010
|
maxY = Math.max(bounds.bottomRight.y, maxY);
|
|
28598
|
-
const fromPoint = new this.shadowScope.Point(minX, minY).transform(
|
|
28599
|
-
|
|
28600
|
-
);
|
|
28601
|
-
const toPoint = new this.shadowScope.Point(maxX, maxY).transform(
|
|
28602
|
-
this.shadowScope.project.view.matrix
|
|
28603
|
-
);
|
|
29011
|
+
const fromPoint = new this.shadowScope.Point(minX, minY).transform(this.shadowScope.project.view.matrix);
|
|
29012
|
+
const toPoint = new this.shadowScope.Point(maxX, maxY).transform(this.shadowScope.project.view.matrix);
|
|
28604
29013
|
this.bounds.update(fromPoint.x, fromPoint.y, toPoint.x, toPoint.y);
|
|
28605
29014
|
}
|
|
28606
|
-
updateBounds = () => {
|
|
28607
|
-
let minX = Number.MAX_VALUE;
|
|
28608
|
-
let maxX = -Number.MAX_VALUE;
|
|
28609
|
-
let minY = Number.MAX_VALUE;
|
|
28610
|
-
let maxY = -Number.MAX_VALUE;
|
|
28611
|
-
for (const model of this.targets) {
|
|
28612
|
-
if (!model.item) {
|
|
28613
|
-
continue;
|
|
28614
|
-
}
|
|
28615
|
-
const bound = model.item.bounds;
|
|
28616
|
-
minX = Math.min(bound.topLeft.x, minX);
|
|
28617
|
-
maxX = Math.max(bound.bottomRight.x, maxX);
|
|
28618
|
-
minY = Math.min(bound.topLeft.y, minY);
|
|
28619
|
-
maxY = Math.max(bound.bottomRight.y, maxY);
|
|
28620
|
-
}
|
|
28621
|
-
const fromPoint = new this.scope.Point(minX, minY).transform(
|
|
28622
|
-
this.scope.project.view.matrix
|
|
28623
|
-
);
|
|
28624
|
-
const toPoint = new this.scope.Point(maxX, maxY).transform(
|
|
28625
|
-
this.scope.project.view.matrix
|
|
28626
|
-
);
|
|
28627
|
-
this.bounds.update(fromPoint.x, fromPoint.y, toPoint.x, toPoint.y);
|
|
28628
|
-
this.updateControlPointsPosition();
|
|
28629
|
-
};
|
|
28630
29015
|
translateShadow() {
|
|
28631
29016
|
this.shadowContainer.removeChildren();
|
|
28632
29017
|
this.shadowContainer.remove();
|
|
@@ -28676,16 +29061,33 @@ var Editor = class extends EventEmitter6 {
|
|
|
28676
29061
|
};
|
|
28677
29062
|
|
|
28678
29063
|
// src/tool/TextTool.ts
|
|
29064
|
+
function _defineProperty26(e, r, t) {
|
|
29065
|
+
return (r = _toPropertyKey26(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29066
|
+
}
|
|
29067
|
+
function _toPropertyKey26(t) {
|
|
29068
|
+
var i = _toPrimitive26(t, "string");
|
|
29069
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29070
|
+
}
|
|
29071
|
+
function _toPrimitive26(t, r) {
|
|
29072
|
+
if ("object" != typeof t || !t) return t;
|
|
29073
|
+
var e = t[Symbol.toPrimitive];
|
|
29074
|
+
if (void 0 !== e) {
|
|
29075
|
+
var i = e.call(t, r || "default");
|
|
29076
|
+
if ("object" != typeof i) return i;
|
|
29077
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29078
|
+
}
|
|
29079
|
+
return ("string" === r ? String : Number)(t);
|
|
29080
|
+
}
|
|
28679
29081
|
var TextTool = class extends WhiteboardTool {
|
|
28680
|
-
from = null;
|
|
28681
|
-
to = null;
|
|
28682
|
-
rootView;
|
|
28683
|
-
canvasElement;
|
|
28684
|
-
elementModel = null;
|
|
28685
|
-
toolbarModel;
|
|
28686
|
-
camera;
|
|
28687
29082
|
constructor(enableToolEvent, model, shadowEmitter, scope, rootView, canvasElement, toolbarModel, camera) {
|
|
28688
29083
|
super(enableToolEvent, model, shadowEmitter, scope);
|
|
29084
|
+
_defineProperty26(this, "from", null);
|
|
29085
|
+
_defineProperty26(this, "to", null);
|
|
29086
|
+
_defineProperty26(this, "rootView", void 0);
|
|
29087
|
+
_defineProperty26(this, "canvasElement", void 0);
|
|
29088
|
+
_defineProperty26(this, "elementModel", null);
|
|
29089
|
+
_defineProperty26(this, "toolbarModel", void 0);
|
|
29090
|
+
_defineProperty26(this, "camera", void 0);
|
|
28689
29091
|
this.rootView = rootView;
|
|
28690
29092
|
this.canvasElement = canvasElement;
|
|
28691
29093
|
this.toolbarModel = toolbarModel;
|
|
@@ -28750,92 +29152,105 @@ import EventEmitter8 from "eventemitter3";
|
|
|
28750
29152
|
|
|
28751
29153
|
// src/Gesture.ts
|
|
28752
29154
|
import EventEmitter7 from "eventemitter3";
|
|
29155
|
+
function _defineProperty27(e, r, t) {
|
|
29156
|
+
return (r = _toPropertyKey27(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29157
|
+
}
|
|
29158
|
+
function _toPropertyKey27(t) {
|
|
29159
|
+
var i = _toPrimitive27(t, "string");
|
|
29160
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29161
|
+
}
|
|
29162
|
+
function _toPrimitive27(t, r) {
|
|
29163
|
+
if ("object" != typeof t || !t) return t;
|
|
29164
|
+
var e = t[Symbol.toPrimitive];
|
|
29165
|
+
if (void 0 !== e) {
|
|
29166
|
+
var i = e.call(t, r || "default");
|
|
29167
|
+
if ("object" != typeof i) return i;
|
|
29168
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29169
|
+
}
|
|
29170
|
+
return ("string" === r ? String : Number)(t);
|
|
29171
|
+
}
|
|
28753
29172
|
var Gesture = class extends EventEmitter7 {
|
|
28754
|
-
element;
|
|
28755
|
-
scope;
|
|
28756
|
-
lastVector = null;
|
|
28757
|
-
lastPoint = null;
|
|
28758
29173
|
constructor(element, scope) {
|
|
28759
29174
|
super();
|
|
28760
|
-
this
|
|
28761
|
-
this
|
|
28762
|
-
this
|
|
28763
|
-
this
|
|
28764
|
-
this
|
|
28765
|
-
|
|
28766
|
-
|
|
28767
|
-
|
|
28768
|
-
|
|
28769
|
-
evt.stopPropagation();
|
|
28770
|
-
evt.stopImmediatePropagation();
|
|
28771
|
-
} else {
|
|
28772
|
-
return;
|
|
28773
|
-
}
|
|
28774
|
-
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
28775
|
-
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
28776
|
-
this.lastVector = p2.subtract(p1);
|
|
28777
|
-
this.lastPoint = p1;
|
|
28778
|
-
};
|
|
28779
|
-
onTouchMove = (evt) => {
|
|
28780
|
-
if (this.lastVector && this.lastPoint && evt.touches.length === 2) {
|
|
28781
|
-
evt.preventDefault();
|
|
28782
|
-
evt.stopPropagation();
|
|
28783
|
-
evt.stopImmediatePropagation();
|
|
28784
|
-
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
28785
|
-
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
28786
|
-
const currentVector = p2.subtract(p1);
|
|
28787
|
-
if (Math.abs(this.lastVector.length - currentVector.length) < 5) {
|
|
28788
|
-
this.emit("offset", p1.x - this.lastPoint.x, p1.y - this.lastPoint.y);
|
|
29175
|
+
_defineProperty27(this, "element", void 0);
|
|
29176
|
+
_defineProperty27(this, "scope", void 0);
|
|
29177
|
+
_defineProperty27(this, "lastVector", null);
|
|
29178
|
+
_defineProperty27(this, "lastPoint", null);
|
|
29179
|
+
_defineProperty27(this, "onTouchStart", (evt) => {
|
|
29180
|
+
if (evt.touches.length > 1) {
|
|
29181
|
+
evt.preventDefault();
|
|
29182
|
+
evt.stopPropagation();
|
|
29183
|
+
evt.stopImmediatePropagation();
|
|
28789
29184
|
} else {
|
|
28790
|
-
|
|
28791
|
-
x: (p2.x + p1.x) / 2,
|
|
28792
|
-
y: (p2.y + p1.y) / 2
|
|
28793
|
-
}));
|
|
29185
|
+
return;
|
|
28794
29186
|
}
|
|
28795
|
-
this.lastPoint = p1;
|
|
28796
|
-
this.lastVector = currentVector;
|
|
28797
|
-
} else if (evt.touches.length === 2) {
|
|
28798
|
-
evt.preventDefault();
|
|
28799
|
-
evt.stopPropagation();
|
|
28800
|
-
evt.stopImmediatePropagation();
|
|
28801
29187
|
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
28802
29188
|
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
28803
29189
|
this.lastVector = p2.subtract(p1);
|
|
28804
29190
|
this.lastPoint = p1;
|
|
28805
|
-
}
|
|
29191
|
+
});
|
|
29192
|
+
_defineProperty27(this, "onTouchMove", (evt) => {
|
|
29193
|
+
if (this.lastVector && this.lastPoint && evt.touches.length === 2) {
|
|
29194
|
+
evt.preventDefault();
|
|
29195
|
+
evt.stopPropagation();
|
|
29196
|
+
evt.stopImmediatePropagation();
|
|
29197
|
+
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
29198
|
+
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
29199
|
+
const currentVector = p2.subtract(p1);
|
|
29200
|
+
if (Math.abs(this.lastVector.length - currentVector.length) < 5) {
|
|
29201
|
+
this.emit("offset", p1.x - this.lastPoint.x, p1.y - this.lastPoint.y);
|
|
29202
|
+
} else {
|
|
29203
|
+
this.emit("scale", currentVector.length / this.lastVector.length, new this.scope.Point({
|
|
29204
|
+
x: (p2.x + p1.x) / 2,
|
|
29205
|
+
y: (p2.y + p1.y) / 2
|
|
29206
|
+
}));
|
|
29207
|
+
}
|
|
29208
|
+
this.lastPoint = p1;
|
|
29209
|
+
this.lastVector = currentVector;
|
|
29210
|
+
} else if (evt.touches.length === 2) {
|
|
29211
|
+
evt.preventDefault();
|
|
29212
|
+
evt.stopPropagation();
|
|
29213
|
+
evt.stopImmediatePropagation();
|
|
29214
|
+
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
29215
|
+
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
29216
|
+
this.lastVector = p2.subtract(p1);
|
|
29217
|
+
this.lastPoint = p1;
|
|
29218
|
+
} else {
|
|
29219
|
+
this.lastVector = null;
|
|
29220
|
+
this.lastPoint = null;
|
|
29221
|
+
}
|
|
29222
|
+
});
|
|
29223
|
+
_defineProperty27(this, "onTouchEnd", () => {
|
|
28806
29224
|
this.lastVector = null;
|
|
28807
29225
|
this.lastPoint = null;
|
|
28808
|
-
}
|
|
28809
|
-
|
|
28810
|
-
|
|
28811
|
-
this.
|
|
28812
|
-
this.
|
|
28813
|
-
|
|
29226
|
+
});
|
|
29227
|
+
this.element = element;
|
|
29228
|
+
this.scope = scope;
|
|
29229
|
+
this.element.addEventListener("touchstart", this.onTouchStart);
|
|
29230
|
+
this.element.addEventListener("touchmove", this.onTouchMove);
|
|
29231
|
+
this.element.addEventListener("touchend", this.onTouchEnd);
|
|
29232
|
+
}
|
|
28814
29233
|
};
|
|
28815
29234
|
|
|
28816
29235
|
// src/Camera.ts
|
|
29236
|
+
function _defineProperty28(e, r, t) {
|
|
29237
|
+
return (r = _toPropertyKey28(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29238
|
+
}
|
|
29239
|
+
function _toPropertyKey28(t) {
|
|
29240
|
+
var i = _toPrimitive28(t, "string");
|
|
29241
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29242
|
+
}
|
|
29243
|
+
function _toPrimitive28(t, r) {
|
|
29244
|
+
if ("object" != typeof t || !t) return t;
|
|
29245
|
+
var e = t[Symbol.toPrimitive];
|
|
29246
|
+
if (void 0 !== e) {
|
|
29247
|
+
var i = e.call(t, r || "default");
|
|
29248
|
+
if ("object" != typeof i) return i;
|
|
29249
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29250
|
+
}
|
|
29251
|
+
return ("string" === r ? String : Number)(t);
|
|
29252
|
+
}
|
|
28817
29253
|
var Camera = class extends EventEmitter8 {
|
|
28818
|
-
scope;
|
|
28819
|
-
dom;
|
|
28820
|
-
lastTriggerTime = 0;
|
|
28821
|
-
lastDelta = { x: 0, y: 0 };
|
|
28822
|
-
requestUserMap;
|
|
28823
|
-
userManager;
|
|
28824
|
-
observers = /* @__PURE__ */ new Map();
|
|
28825
|
-
whiteboardAttrsMap;
|
|
28826
|
-
paperSize;
|
|
28827
|
-
domSize;
|
|
28828
|
-
hasPermission;
|
|
28829
|
-
gesture;
|
|
28830
|
-
inherentScale = 1;
|
|
28831
|
-
maxScale;
|
|
28832
|
-
initSize;
|
|
28833
|
-
bound;
|
|
28834
|
-
boundTiemoutId;
|
|
28835
|
-
enableByMouse = true;
|
|
28836
|
-
enableByTouch = true;
|
|
28837
|
-
boundaryColor = "#F44336";
|
|
28838
|
-
enableBoundaryHighlight = true;
|
|
28839
29254
|
get inherentMatrix() {
|
|
28840
29255
|
const inherentMatrix = new this.scope.Matrix();
|
|
28841
29256
|
inherentMatrix.scale(this.inherentScale, [0, 0]);
|
|
@@ -28845,25 +29260,158 @@ var Camera = class extends EventEmitter8 {
|
|
|
28845
29260
|
const view = this.scope.project.view;
|
|
28846
29261
|
return 1 / view.matrix.scaling.x;
|
|
28847
29262
|
}
|
|
28848
|
-
constructor(initSize, maxScale, dom, userManager, scope, whiteboardAttrsMap, hasPermission, requestUserMap,
|
|
29263
|
+
constructor(initSize, maxScale, dom, userManager, scope, whiteboardAttrsMap, hasPermission, requestUserMap, _paperSize, _domSize) {
|
|
28849
29264
|
super();
|
|
29265
|
+
_defineProperty28(this, "scope", void 0);
|
|
29266
|
+
_defineProperty28(this, "dom", void 0);
|
|
29267
|
+
_defineProperty28(this, "lastTriggerTime", 0);
|
|
29268
|
+
_defineProperty28(this, "lastDelta", {
|
|
29269
|
+
x: 0,
|
|
29270
|
+
y: 0
|
|
29271
|
+
});
|
|
29272
|
+
_defineProperty28(this, "requestUserMap", void 0);
|
|
29273
|
+
_defineProperty28(this, "userManager", void 0);
|
|
29274
|
+
_defineProperty28(this, "observers", /* @__PURE__ */ new Map());
|
|
29275
|
+
_defineProperty28(this, "whiteboardAttrsMap", void 0);
|
|
29276
|
+
_defineProperty28(this, "paperSize", void 0);
|
|
29277
|
+
_defineProperty28(this, "domSize", void 0);
|
|
29278
|
+
_defineProperty28(this, "hasPermission", void 0);
|
|
29279
|
+
_defineProperty28(this, "gesture", void 0);
|
|
29280
|
+
_defineProperty28(this, "inherentScale", 1);
|
|
29281
|
+
_defineProperty28(this, "maxScale", void 0);
|
|
29282
|
+
_defineProperty28(this, "initSize", void 0);
|
|
29283
|
+
_defineProperty28(this, "bound", void 0);
|
|
29284
|
+
_defineProperty28(this, "boundTiemoutId", void 0);
|
|
29285
|
+
_defineProperty28(this, "enableByMouse", true);
|
|
29286
|
+
_defineProperty28(this, "enableByTouch", true);
|
|
29287
|
+
_defineProperty28(this, "boundaryColor", "#F44336");
|
|
29288
|
+
_defineProperty28(this, "enableBoundaryHighlight", true);
|
|
29289
|
+
_defineProperty28(this, "handleMainCameraChange", (evt) => {
|
|
29290
|
+
const userMap = this.requestUserMap(this.userManager.selfId);
|
|
29291
|
+
const cameraMode = userMap.get(WhiteboardKeys.cameraMode);
|
|
29292
|
+
if (cameraMode !== "main") {
|
|
29293
|
+
return;
|
|
29294
|
+
}
|
|
29295
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29296
|
+
if (key === WhiteboardKeys.viewMatrix) {
|
|
29297
|
+
if (value.action === "add" || value.action === "update") {
|
|
29298
|
+
const matrixValue = this.whiteboardAttrsMap.get(WhiteboardKeys.viewMatrix);
|
|
29299
|
+
const matrix = new this.scope.Matrix(matrixValue);
|
|
29300
|
+
userMap.set(WhiteboardKeys.viewMatrix, matrixValue);
|
|
29301
|
+
this.emit("zoom", this.inherentMatrix.appended(matrix));
|
|
29302
|
+
}
|
|
29303
|
+
}
|
|
29304
|
+
}
|
|
29305
|
+
});
|
|
29306
|
+
_defineProperty28(this, "handleUserLeave", (user) => {
|
|
29307
|
+
const cb = this.observers.get(user.id);
|
|
29308
|
+
if (cb) {
|
|
29309
|
+
this.requestUserMap(user.id).unobserve(cb);
|
|
29310
|
+
}
|
|
29311
|
+
});
|
|
29312
|
+
_defineProperty28(this, "handleUserJoin", (user) => {
|
|
29313
|
+
const observer = (evt) => {
|
|
29314
|
+
this.handleViewMatrixUpdate(user.id, evt);
|
|
29315
|
+
};
|
|
29316
|
+
this.requestUserMap(user.id).observe(observer);
|
|
29317
|
+
this.observers.set(user.id, observer);
|
|
29318
|
+
});
|
|
29319
|
+
_defineProperty28(this, "handleViewMatrixUpdate", (userId, evt) => {
|
|
29320
|
+
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
29321
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29322
|
+
if (value.action === "update") {
|
|
29323
|
+
if (key === WhiteboardKeys.viewMatrix) {
|
|
29324
|
+
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
29325
|
+
const targetMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
29326
|
+
const target = new this.scope.Matrix(targetMatrixValue);
|
|
29327
|
+
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.viewMatrix, targetMatrixValue);
|
|
29328
|
+
this.emit("zoom", this.inherentMatrix.appended(target));
|
|
29329
|
+
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
29330
|
+
const currentMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
29331
|
+
const current = new this.scope.Matrix(currentMatrixValue);
|
|
29332
|
+
this.emit("zoom", this.inherentMatrix.appended(current));
|
|
29333
|
+
}
|
|
29334
|
+
} else if (key === WhiteboardKeys.currentPage) {
|
|
29335
|
+
if (value.action === "update" || value.action === "add") {
|
|
29336
|
+
this.emit("userPageChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.currentPage));
|
|
29337
|
+
}
|
|
29338
|
+
} else if (key === WhiteboardKeys.cameraMode) {
|
|
29339
|
+
if (value.action === "update" || value.action === "add") {
|
|
29340
|
+
this.emit("userViewModeChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.cameraMode));
|
|
29341
|
+
}
|
|
29342
|
+
}
|
|
29343
|
+
}
|
|
29344
|
+
}
|
|
29345
|
+
});
|
|
29346
|
+
_defineProperty28(this, "handleWheel", (evt) => {
|
|
29347
|
+
if (!this.enableByMouse) {
|
|
29348
|
+
return;
|
|
29349
|
+
}
|
|
29350
|
+
evt.preventDefault();
|
|
29351
|
+
evt.stopImmediatePropagation();
|
|
29352
|
+
evt.stopPropagation();
|
|
29353
|
+
const domSize = this.domSize();
|
|
29354
|
+
const paperSize = this.paperSize();
|
|
29355
|
+
const inherentDeltaY = evt.deltaY / domSize[1] * paperSize[1];
|
|
29356
|
+
const inherentDeltaX = evt.deltaX / domSize[0] * paperSize[0];
|
|
29357
|
+
if (Date.now() - this.lastTriggerTime < 32) {
|
|
29358
|
+
this.lastDelta.y += inherentDeltaY;
|
|
29359
|
+
this.lastDelta.x += inherentDeltaX;
|
|
29360
|
+
return;
|
|
29361
|
+
}
|
|
29362
|
+
if (evt.ctrlKey) {
|
|
29363
|
+
const wheelDelta = Math.sign(evt.wheelDelta || 100) * 120;
|
|
29364
|
+
const paperPoint = this.scope.project.view.getEventPoint(evt);
|
|
29365
|
+
const deltaY = inherentDeltaY + this.lastDelta.y;
|
|
29366
|
+
const matrix = new this.scope.Matrix();
|
|
29367
|
+
let scale = 1;
|
|
29368
|
+
if (deltaY > 0) {
|
|
29369
|
+
scale = Math.max(1 - Math.abs(deltaY / wheelDelta), 1e-8);
|
|
29370
|
+
} else {
|
|
29371
|
+
scale = 1 + Math.abs(deltaY / wheelDelta);
|
|
29372
|
+
}
|
|
29373
|
+
scale = Math.max(0.9, scale);
|
|
29374
|
+
scale = Math.min(1.1, scale);
|
|
29375
|
+
matrix.scale(scale, paperPoint);
|
|
29376
|
+
this.updateViewMatrix(matrix);
|
|
29377
|
+
} else {
|
|
29378
|
+
const deltaX = this.lastDelta.x + evt.deltaX;
|
|
29379
|
+
const deltaY = this.lastDelta.y + evt.deltaY;
|
|
29380
|
+
const matrix = new this.scope.Matrix();
|
|
29381
|
+
matrix.translate({
|
|
29382
|
+
x: -deltaX * window.devicePixelRatio,
|
|
29383
|
+
y: -deltaY * window.devicePixelRatio
|
|
29384
|
+
});
|
|
29385
|
+
this.updateViewMatrix(matrix);
|
|
29386
|
+
}
|
|
29387
|
+
this.lastTriggerTime = Date.now();
|
|
29388
|
+
this.lastDelta = {
|
|
29389
|
+
x: 0,
|
|
29390
|
+
y: 0
|
|
29391
|
+
};
|
|
29392
|
+
});
|
|
28850
29393
|
this.maxScale = maxScale;
|
|
28851
29394
|
this.bound = window.document.createElement("div");
|
|
28852
29395
|
this.bound.style.cssText = `transition: box-shadow 100ms;pointer-events:none;z-index:99;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);`;
|
|
28853
29396
|
this.initSize = initSize;
|
|
28854
29397
|
this.hasPermission = hasPermission;
|
|
28855
|
-
this.paperSize =
|
|
28856
|
-
this.domSize =
|
|
29398
|
+
this.paperSize = _paperSize;
|
|
29399
|
+
this.domSize = _domSize;
|
|
28857
29400
|
this.whiteboardAttrsMap = whiteboardAttrsMap;
|
|
28858
29401
|
this.scope = scope;
|
|
28859
29402
|
this.requestUserMap = requestUserMap;
|
|
28860
29403
|
this.userManager = userManager;
|
|
28861
29404
|
this.dom = dom;
|
|
28862
29405
|
this.dom.appendChild(this.bound);
|
|
28863
|
-
this.dom.addEventListener("wheel", this.handleWheel, {
|
|
29406
|
+
this.dom.addEventListener("wheel", this.handleWheel, {
|
|
29407
|
+
passive: false,
|
|
29408
|
+
capture: true
|
|
29409
|
+
});
|
|
28864
29410
|
this.dom.addEventListener("touchstart", (e) => {
|
|
28865
29411
|
e.preventDefault();
|
|
28866
|
-
}, {
|
|
29412
|
+
}, {
|
|
29413
|
+
passive: false
|
|
29414
|
+
});
|
|
28867
29415
|
this.createModel(this.userManager.selfId);
|
|
28868
29416
|
this.userManager.userIdList().forEach((userId) => {
|
|
28869
29417
|
const observer = (evt) => {
|
|
@@ -28884,7 +29432,10 @@ var Camera = class extends EventEmitter8 {
|
|
|
28884
29432
|
return;
|
|
28885
29433
|
}
|
|
28886
29434
|
const matrix = new this.scope.Matrix();
|
|
28887
|
-
matrix.translate({
|
|
29435
|
+
matrix.translate({
|
|
29436
|
+
x: x * this.translateScale,
|
|
29437
|
+
y: y * this.translateScale
|
|
29438
|
+
});
|
|
28888
29439
|
this.updateViewMatrix(matrix);
|
|
28889
29440
|
});
|
|
28890
29441
|
this.gesture.on("scale", (scale, center) => {
|
|
@@ -28906,6 +29457,9 @@ var Camera = class extends EventEmitter8 {
|
|
|
28906
29457
|
}, 100);
|
|
28907
29458
|
}
|
|
28908
29459
|
}
|
|
29460
|
+
updateInitSize(size) {
|
|
29461
|
+
this.initSize = size;
|
|
29462
|
+
}
|
|
28909
29463
|
updateInherentScale(scale) {
|
|
28910
29464
|
this.inherentScale = scale;
|
|
28911
29465
|
}
|
|
@@ -28937,36 +29491,6 @@ var Camera = class extends EventEmitter8 {
|
|
|
28937
29491
|
const matrix = new this.scope.Matrix(matrixValue);
|
|
28938
29492
|
this.emit("zoom", this.inherentMatrix.appended(matrix));
|
|
28939
29493
|
}
|
|
28940
|
-
handleMainCameraChange = (evt) => {
|
|
28941
|
-
const userMap = this.requestUserMap(this.userManager.selfId);
|
|
28942
|
-
const cameraMode = userMap.get(WhiteboardKeys.cameraMode);
|
|
28943
|
-
if (cameraMode !== "main") {
|
|
28944
|
-
return;
|
|
28945
|
-
}
|
|
28946
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
28947
|
-
if (key === WhiteboardKeys.viewMatrix) {
|
|
28948
|
-
if (value.action === "add" || value.action === "update") {
|
|
28949
|
-
const matrixValue = this.whiteboardAttrsMap.get(WhiteboardKeys.viewMatrix);
|
|
28950
|
-
const matrix = new this.scope.Matrix(matrixValue);
|
|
28951
|
-
userMap.set(WhiteboardKeys.viewMatrix, matrixValue);
|
|
28952
|
-
this.emit("zoom", this.inherentMatrix.appended(matrix));
|
|
28953
|
-
}
|
|
28954
|
-
}
|
|
28955
|
-
}
|
|
28956
|
-
};
|
|
28957
|
-
handleUserLeave = (user) => {
|
|
28958
|
-
const cb = this.observers.get(user.id);
|
|
28959
|
-
if (cb) {
|
|
28960
|
-
this.requestUserMap(user.id).unobserve(cb);
|
|
28961
|
-
}
|
|
28962
|
-
};
|
|
28963
|
-
handleUserJoin = (user) => {
|
|
28964
|
-
const observer = (evt) => {
|
|
28965
|
-
this.handleViewMatrixUpdate(user.id, evt);
|
|
28966
|
-
};
|
|
28967
|
-
this.requestUserMap(user.id).observe(observer);
|
|
28968
|
-
this.observers.set(user.id, observer);
|
|
28969
|
-
};
|
|
28970
29494
|
createModel(userId) {
|
|
28971
29495
|
const userMap = this.requestUserMap(userId);
|
|
28972
29496
|
if (!userMap.has(WhiteboardKeys.viewMatrix)) {
|
|
@@ -28976,33 +29500,6 @@ var Camera = class extends EventEmitter8 {
|
|
|
28976
29500
|
userMap.set(WhiteboardKeys.cameraMode, "main");
|
|
28977
29501
|
}
|
|
28978
29502
|
}
|
|
28979
|
-
handleViewMatrixUpdate = (userId, evt) => {
|
|
28980
|
-
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
28981
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
28982
|
-
if (value.action === "update") {
|
|
28983
|
-
if (key === WhiteboardKeys.viewMatrix) {
|
|
28984
|
-
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
28985
|
-
const targetMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
28986
|
-
const target = new this.scope.Matrix(targetMatrixValue);
|
|
28987
|
-
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.viewMatrix, targetMatrixValue);
|
|
28988
|
-
this.emit("zoom", this.inherentMatrix.appended(target));
|
|
28989
|
-
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
28990
|
-
const currentMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
28991
|
-
const current = new this.scope.Matrix(currentMatrixValue);
|
|
28992
|
-
this.emit("zoom", this.inherentMatrix.appended(current));
|
|
28993
|
-
}
|
|
28994
|
-
} else if (key === WhiteboardKeys.currentPage) {
|
|
28995
|
-
if (value.action === "update" || value.action === "add") {
|
|
28996
|
-
this.emit("userPageChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.currentPage));
|
|
28997
|
-
}
|
|
28998
|
-
} else if (key === WhiteboardKeys.cameraMode) {
|
|
28999
|
-
if (value.action === "update" || value.action === "add") {
|
|
29000
|
-
this.emit("userViewModeChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.cameraMode));
|
|
29001
|
-
}
|
|
29002
|
-
}
|
|
29003
|
-
}
|
|
29004
|
-
}
|
|
29005
|
-
};
|
|
29006
29503
|
validNextMatrix(next) {
|
|
29007
29504
|
let shouldHighlightBound = false;
|
|
29008
29505
|
const maxTranslate = (this.maxScale - 1) / 2;
|
|
@@ -29057,7 +29554,8 @@ var Camera = class extends EventEmitter8 {
|
|
|
29057
29554
|
}
|
|
29058
29555
|
return next;
|
|
29059
29556
|
}
|
|
29060
|
-
updateViewMatrix(matrix
|
|
29557
|
+
updateViewMatrix(matrix) {
|
|
29558
|
+
let append = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
|
|
29061
29559
|
const userMap = this.requestUserMap(this.userManager.selfId);
|
|
29062
29560
|
const cameraMode = userMap.get(WhiteboardKeys.cameraMode);
|
|
29063
29561
|
let next = matrix;
|
|
@@ -29077,75 +29575,62 @@ var Camera = class extends EventEmitter8 {
|
|
|
29077
29575
|
userMap.set(WhiteboardKeys.viewMatrix, [next.a, next.b, next.c, next.d, next.tx, next.ty]);
|
|
29078
29576
|
}
|
|
29079
29577
|
if (cameraMode === "main") {
|
|
29080
|
-
if (this.hasPermission(
|
|
29578
|
+
if (this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29081
29579
|
this.whiteboardAttrsMap.set(WhiteboardKeys.viewMatrix, [next.a, next.b, next.c, next.d, next.tx, next.ty]);
|
|
29082
29580
|
}
|
|
29083
29581
|
}
|
|
29084
29582
|
}
|
|
29085
|
-
handleWheel = (evt) => {
|
|
29086
|
-
if (!this.enableByMouse) {
|
|
29087
|
-
return;
|
|
29088
|
-
}
|
|
29089
|
-
evt.preventDefault();
|
|
29090
|
-
evt.stopImmediatePropagation();
|
|
29091
|
-
evt.stopPropagation();
|
|
29092
|
-
const domSize = this.domSize();
|
|
29093
|
-
const paperSize = this.paperSize();
|
|
29094
|
-
const inherentDeltaY = evt.deltaY / domSize[1] * paperSize[1];
|
|
29095
|
-
const inherentDeltaX = evt.deltaX / domSize[0] * paperSize[0];
|
|
29096
|
-
if (Date.now() - this.lastTriggerTime < 32) {
|
|
29097
|
-
this.lastDelta.y += inherentDeltaY;
|
|
29098
|
-
this.lastDelta.x += inherentDeltaX;
|
|
29099
|
-
return;
|
|
29100
|
-
}
|
|
29101
|
-
if (evt.ctrlKey) {
|
|
29102
|
-
const wheelDelta = Math.sign(evt.wheelDelta || 100) * 120;
|
|
29103
|
-
const paperPoint = this.scope.project.view.getEventPoint(evt);
|
|
29104
|
-
const deltaY = inherentDeltaY + this.lastDelta.y;
|
|
29105
|
-
const matrix = new this.scope.Matrix();
|
|
29106
|
-
let scale = 1;
|
|
29107
|
-
if (deltaY > 0) {
|
|
29108
|
-
scale = Math.max(1 - Math.abs(deltaY / wheelDelta), 1e-8);
|
|
29109
|
-
} else {
|
|
29110
|
-
scale = 1 + Math.abs(deltaY / wheelDelta);
|
|
29111
|
-
}
|
|
29112
|
-
scale = Math.max(0.9, scale);
|
|
29113
|
-
scale = Math.min(1.1, scale);
|
|
29114
|
-
matrix.scale(scale, paperPoint);
|
|
29115
|
-
this.updateViewMatrix(matrix);
|
|
29116
|
-
} else {
|
|
29117
|
-
const deltaX = this.lastDelta.x + evt.deltaX;
|
|
29118
|
-
const deltaY = this.lastDelta.y + evt.deltaY;
|
|
29119
|
-
const matrix = new this.scope.Matrix();
|
|
29120
|
-
matrix.translate({ x: -deltaX * window.devicePixelRatio, y: -deltaY * window.devicePixelRatio });
|
|
29121
|
-
this.updateViewMatrix(matrix);
|
|
29122
|
-
}
|
|
29123
|
-
this.lastTriggerTime = Date.now();
|
|
29124
|
-
this.lastDelta = { x: 0, y: 0 };
|
|
29125
|
-
};
|
|
29126
29583
|
scale(value) {
|
|
29584
|
+
let origin = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "center";
|
|
29127
29585
|
const matrix = new this.scope.Matrix();
|
|
29128
|
-
|
|
29586
|
+
if (origin === "center") {
|
|
29587
|
+
matrix.scale(value, this.scope.project.view.bounds.center);
|
|
29588
|
+
} else if (origin === "top-left") {
|
|
29589
|
+
matrix.scale(value, [0, 0]);
|
|
29590
|
+
}
|
|
29129
29591
|
this.updateViewMatrix(matrix);
|
|
29130
29592
|
}
|
|
29131
29593
|
translate(offsetX, offsetY) {
|
|
29132
29594
|
const matrix = new this.scope.Matrix();
|
|
29133
|
-
matrix.translate({
|
|
29595
|
+
matrix.translate({
|
|
29596
|
+
x: offsetX,
|
|
29597
|
+
y: offsetY
|
|
29598
|
+
});
|
|
29134
29599
|
this.updateViewMatrix(matrix);
|
|
29135
29600
|
}
|
|
29136
29601
|
reset() {
|
|
29137
29602
|
this.updateViewMatrix(new this.scope.Matrix(), false);
|
|
29138
|
-
this.lastDelta = {
|
|
29603
|
+
this.lastDelta = {
|
|
29604
|
+
x: 0,
|
|
29605
|
+
y: 0
|
|
29606
|
+
};
|
|
29139
29607
|
}
|
|
29140
29608
|
};
|
|
29141
29609
|
|
|
29142
29610
|
// src/tool/EllipseTool.ts
|
|
29611
|
+
function _defineProperty29(e, r, t) {
|
|
29612
|
+
return (r = _toPropertyKey29(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29613
|
+
}
|
|
29614
|
+
function _toPropertyKey29(t) {
|
|
29615
|
+
var i = _toPrimitive29(t, "string");
|
|
29616
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29617
|
+
}
|
|
29618
|
+
function _toPrimitive29(t, r) {
|
|
29619
|
+
if ("object" != typeof t || !t) return t;
|
|
29620
|
+
var e = t[Symbol.toPrimitive];
|
|
29621
|
+
if (void 0 !== e) {
|
|
29622
|
+
var i = e.call(t, r || "default");
|
|
29623
|
+
if ("object" != typeof i) return i;
|
|
29624
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29625
|
+
}
|
|
29626
|
+
return ("string" === r ? String : Number)(t);
|
|
29627
|
+
}
|
|
29143
29628
|
var EllipseTool = class extends WhiteboardTool {
|
|
29144
|
-
elementModel = null;
|
|
29145
|
-
from = null;
|
|
29146
|
-
to = null;
|
|
29147
29629
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
29148
29630
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
29631
|
+
_defineProperty29(this, "elementModel", null);
|
|
29632
|
+
_defineProperty29(this, "from", null);
|
|
29633
|
+
_defineProperty29(this, "to", null);
|
|
29149
29634
|
this.tool.minDistance = 1;
|
|
29150
29635
|
}
|
|
29151
29636
|
onMouseDown(event) {
|
|
@@ -29174,225 +29659,145 @@ var EllipseTool = class extends WhiteboardTool {
|
|
|
29174
29659
|
};
|
|
29175
29660
|
|
|
29176
29661
|
// src/tool/TriangleTool.ts
|
|
29662
|
+
function _defineProperty30(e, r, t) {
|
|
29663
|
+
return (r = _toPropertyKey30(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29664
|
+
}
|
|
29665
|
+
function _toPropertyKey30(t) {
|
|
29666
|
+
var i = _toPrimitive30(t, "string");
|
|
29667
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29668
|
+
}
|
|
29669
|
+
function _toPrimitive30(t, r) {
|
|
29670
|
+
if ("object" != typeof t || !t) return t;
|
|
29671
|
+
var e = t[Symbol.toPrimitive];
|
|
29672
|
+
if (void 0 !== e) {
|
|
29673
|
+
var i = e.call(t, r || "default");
|
|
29674
|
+
if ("object" != typeof i) return i;
|
|
29675
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29676
|
+
}
|
|
29677
|
+
return ("string" === r ? String : Number)(t);
|
|
29678
|
+
}
|
|
29177
29679
|
var TriangleTool = class extends WhiteboardTool {
|
|
29178
|
-
elementModel = null;
|
|
29179
|
-
from = null;
|
|
29180
|
-
to = null;
|
|
29181
29680
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
29182
29681
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
29183
|
-
this
|
|
29184
|
-
|
|
29185
|
-
|
|
29186
|
-
this.
|
|
29187
|
-
|
|
29188
|
-
|
|
29189
|
-
|
|
29190
|
-
|
|
29191
|
-
|
|
29192
|
-
|
|
29193
|
-
|
|
29194
|
-
|
|
29195
|
-
|
|
29196
|
-
|
|
29197
|
-
|
|
29198
|
-
|
|
29199
|
-
|
|
29200
|
-
|
|
29201
|
-
|
|
29202
|
-
|
|
29203
|
-
|
|
29204
|
-
|
|
29205
|
-
|
|
29206
|
-
|
|
29207
|
-
|
|
29208
|
-
|
|
29209
|
-
|
|
29210
|
-
|
|
29211
|
-
|
|
29212
|
-
|
|
29213
|
-
|
|
29214
|
-
|
|
29215
|
-
var
|
|
29216
|
-
|
|
29217
|
-
|
|
29218
|
-
|
|
29219
|
-
|
|
29220
|
-
|
|
29221
|
-
|
|
29222
|
-
|
|
29223
|
-
|
|
29224
|
-
|
|
29225
|
-
|
|
29226
|
-
|
|
29227
|
-
|
|
29228
|
-
|
|
29229
|
-
*/
|
|
29230
|
-
dashArray;
|
|
29231
|
-
/**
|
|
29232
|
-
* 字体名称
|
|
29233
|
-
*/
|
|
29234
|
-
fontFamily;
|
|
29235
|
-
/**
|
|
29236
|
-
* 描边颜色
|
|
29237
|
-
*/
|
|
29238
|
-
strokeColor;
|
|
29239
|
-
/**
|
|
29240
|
-
* 填充颜色
|
|
29241
|
-
*/
|
|
29242
|
-
fillColor;
|
|
29243
|
-
/**
|
|
29244
|
-
* 描边宽度
|
|
29245
|
-
*/
|
|
29246
|
-
strokeWidth;
|
|
29247
|
-
/**
|
|
29248
|
-
* 是否允许用鼠标/触控板进行缩放和拖动画布
|
|
29249
|
-
*/
|
|
29250
|
-
enableCameraByMouse;
|
|
29251
|
-
/**
|
|
29252
|
-
* 是否允许触摸屏上触摸事件进行缩放和拖动画布
|
|
29253
|
-
*/
|
|
29254
|
-
enableCameraByTouch;
|
|
29255
|
-
/**
|
|
29256
|
-
* 相机超出边界时, 警示阴影的颜色, 默认 "#F44336"
|
|
29257
|
-
*/
|
|
29258
|
-
cameraBoundaryColor;
|
|
29259
|
-
/**
|
|
29260
|
-
* 是否允许相机超出边界时, 警示高亮阴影, 默认 true
|
|
29261
|
-
*/
|
|
29262
|
-
enableCameraBoundaryHighlight;
|
|
29263
|
-
getElementAttribute;
|
|
29264
|
-
setElementAttribute;
|
|
29265
|
-
getCurrentTool;
|
|
29266
|
-
setCurrentTool;
|
|
29267
|
-
/**
|
|
29268
|
-
* 设置画布区域背景色
|
|
29269
|
-
* @param {string} color - css 颜色值
|
|
29270
|
-
*/
|
|
29271
|
-
setCanvasBackgroundColor;
|
|
29272
|
-
/**
|
|
29273
|
-
* 设置主题色, 主题色影响选中框和昵称的背景色
|
|
29274
|
-
* @param {string} color - css 颜色值
|
|
29275
|
-
*/
|
|
29276
|
-
setThemeColor;
|
|
29277
|
-
/**
|
|
29278
|
-
* 切换到指定页面, 调用端需要有页面切换权限
|
|
29279
|
-
* @param {string} id - 指定要切换到的页面 id
|
|
29280
|
-
*/
|
|
29281
|
-
gotoPage;
|
|
29282
|
-
/**
|
|
29283
|
-
* 添加页面, 如果页面已经存在则不做任何修改
|
|
29284
|
-
* @param {string} id - 指定要添加到的页面 id
|
|
29285
|
-
*/
|
|
29286
|
-
addPage;
|
|
29287
|
-
deletePage;
|
|
29288
|
-
pageList;
|
|
29289
|
-
/**
|
|
29290
|
-
* 获取当前页面 id
|
|
29291
|
-
* @param {string=} userId - 指定要获取对应用户的当前页面 id, 不传 userId 参数则获取自己的当前页面 id
|
|
29292
|
-
*/
|
|
29293
|
-
currentPageId;
|
|
29294
|
-
/**
|
|
29295
|
-
* 复制页面
|
|
29296
|
-
* @param {string} sourceId - 指定要复制的页面, string 类型指定 id
|
|
29297
|
-
* @param {string} targetId - 指定要复制到的页面, string 类型指定 id
|
|
29298
|
-
*/
|
|
29299
|
-
clonePage;
|
|
29300
|
-
/**
|
|
29301
|
-
* 清空当前页面
|
|
29302
|
-
*/
|
|
29303
|
-
clearPage;
|
|
29304
|
-
/**
|
|
29305
|
-
* 平移画布
|
|
29306
|
-
* @param {number} offsetX - x 轴偏移量
|
|
29307
|
-
* @param {number} offsetY - y 轴偏移量
|
|
29308
|
-
*/
|
|
29309
|
-
translateCamera;
|
|
29310
|
-
/**
|
|
29311
|
-
* 以画布中心为固定点缩放画布
|
|
29312
|
-
* @param {number} scale - 缩放比例
|
|
29313
|
-
*/
|
|
29314
|
-
scaleCamera;
|
|
29315
|
-
/**
|
|
29316
|
-
* 重置画布, 将画布缩放比例重置为 1, 平移量重置为 [0, 0]
|
|
29317
|
-
*/
|
|
29318
|
-
resetCamera;
|
|
29319
|
-
/**
|
|
29320
|
-
* 为 userId 指定的用户设置页面, 调用需要有 `WhiteboardPermissionFlag.setOthersView` 权限,
|
|
29321
|
-
* userId 指定的用户的视角模式应为 `free`, 否则调用无效
|
|
29322
|
-
*/
|
|
29323
|
-
setFreeModelUserPage;
|
|
29324
|
-
indexedNavigation;
|
|
29325
|
-
/**
|
|
29326
|
-
* 设置视角模式为自由模式, 可以修改自己或者他人视角, 修改他人视角需要 `WhiteboardPermissionFlag.setOthersView` 权限
|
|
29327
|
-
* @param {string=} userId 可选, 指定要修改视角的 userId, 默认修改自己的视角
|
|
29328
|
-
*/
|
|
29329
|
-
setViewModeToFree;
|
|
29330
|
-
/**
|
|
29331
|
-
* 设置视角模式为跟随其他用户, 可以修改自己或者他人视角, 修改他人视角需要 `WhiteboardPermissionFlag.setOthersView` 权限
|
|
29332
|
-
* @param {string} flowId 指定要跟随的用户 id
|
|
29333
|
-
* @param {string=} userId 可选, 指定要修改视角的 userId, 默认修改自己的视角
|
|
29334
|
-
*/
|
|
29335
|
-
setViewModeToFlow;
|
|
29336
|
-
/**
|
|
29337
|
-
* 设置视角模式为跟随白板主视角, 可以修改自己或者他人视角, 修改他人视角需要 `WhiteboardPermissionFlag.setOthersView` 权限
|
|
29338
|
-
* @param {string=} userId 可选, 指定要修改视角的 userId, 默认修改自己的视角
|
|
29339
|
-
*/
|
|
29340
|
-
setViewModeToMain;
|
|
29341
|
-
/**
|
|
29342
|
-
* 获取视角模式
|
|
29343
|
-
* @param {string=} userId 可选, 默认获取自己的视角模式
|
|
29344
|
-
* @return {'free' | 'main' | string} `free` 表示自由视角, `main` 表示主视角, 其他 string 类型代表跟随视角, string 值为跟随的 userId
|
|
29345
|
-
*/
|
|
29346
|
-
getViewModel;
|
|
29347
|
-
/**
|
|
29348
|
-
* 撤销
|
|
29349
|
-
*/
|
|
29350
|
-
undo;
|
|
29351
|
-
/**
|
|
29352
|
-
* 重做
|
|
29353
|
-
*/
|
|
29354
|
-
redo;
|
|
29355
|
-
/**
|
|
29356
|
-
* 光栅化指定页面的可视区域
|
|
29357
|
-
* @param {number} scale 缩放比例
|
|
29358
|
-
* @param {string=} page string 指示页码 id; number 指示 IndexedNavigation 页面索引; undefined 指示光栅化当前页
|
|
29359
|
-
* @return {Promise<string>} 异步返回光栅化结果, 图片 png 对应的 base64 url. 如果页面不存在返回 null
|
|
29360
|
-
*/
|
|
29361
|
-
rasterizeViewport;
|
|
29362
|
-
/**
|
|
29363
|
-
* 光栅化指定页面包含所有元素的包围盒
|
|
29364
|
-
* @param {number} outputMaxWidth 输出图片最大宽度, 在保证高宽比的情况下限值输出图片的宽度小于等于此值
|
|
29365
|
-
* @param {number} outputMaxHeight 输出图片最大高度, 在保证高宽比的情况下限值输出图片的高度小于等于此值
|
|
29366
|
-
* @param {string=} page string 指示页码 id; number 指示 IndexedNavigation 页面索引; undefined 指示光栅化当前页
|
|
29367
|
-
* @return {Promise<string>} 异步返回光栅化结果, 图片 png 对应的 base64 url. 如果页面不存在返回 null
|
|
29368
|
-
*/
|
|
29369
|
-
rasterizeElementsBounds;
|
|
29370
|
-
/**
|
|
29371
|
-
* 光栅化指定页面最大缩放区域, 如果没有指定 `WhiteboardOption.maxScaleRatio` 或者指定的值为 -1, 则按 `rasterizeViewport` 返回结果.
|
|
29372
|
-
* @param {number} scale 缩放比例
|
|
29373
|
-
* @param {string=} page string 指示页码 id; number 指示 IndexedNavigation 页面索引; undefined 指示光栅化当前页
|
|
29374
|
-
* @return {Promise<string>} 异步返回光栅化结果, 图片 png 对应的 base64 url. 如果页面不存在返回 null
|
|
29375
|
-
*/
|
|
29376
|
-
rasterizeMaxBounds;
|
|
29377
|
-
/**
|
|
29378
|
-
* 设置输入类型, "pen" 仅接受手写笔输入, "any" 接受任意输入, 当首次侦测到手写笔输入时, 将自动切换为 "pen"
|
|
29379
|
-
* @param {"pen" | "any"} type 输入类型
|
|
29380
|
-
*/
|
|
29381
|
-
setInputType;
|
|
29682
|
+
_defineProperty30(this, "elementModel", null);
|
|
29683
|
+
_defineProperty30(this, "from", null);
|
|
29684
|
+
_defineProperty30(this, "to", null);
|
|
29685
|
+
this.tool.minDistance = 1;
|
|
29686
|
+
}
|
|
29687
|
+
onMouseDown(event) {
|
|
29688
|
+
this.elementModel = this.modelGetter().createTriangle(true);
|
|
29689
|
+
this.from = event.point.clone();
|
|
29690
|
+
this.to = event.point.clone();
|
|
29691
|
+
}
|
|
29692
|
+
onMouseDrag(event) {
|
|
29693
|
+
if (this.from && this.elementModel) {
|
|
29694
|
+
this.to = event.point.clone();
|
|
29695
|
+
this.elementModel.setPoints([(this.to.x - this.from.x) / 2 + this.from.x, this.from.y, this.to.x, this.to.y, this.from.x, this.to.y]);
|
|
29696
|
+
}
|
|
29697
|
+
}
|
|
29698
|
+
onMouseUp(event) {
|
|
29699
|
+
if (this.elementModel && this.from && this.from.getDistance(event.point) < 3) {
|
|
29700
|
+
this.modelGetter().removeElementItem(this.elementModel.uuid);
|
|
29701
|
+
}
|
|
29702
|
+
if (this.elementModel) {
|
|
29703
|
+
this.elementModel.shadow = "";
|
|
29704
|
+
}
|
|
29705
|
+
}
|
|
29706
|
+
};
|
|
29707
|
+
|
|
29708
|
+
// src/Whiteboard.ts
|
|
29709
|
+
import EventEmitter9 from "eventemitter3";
|
|
29710
|
+
function _defineProperty31(e, r, t) {
|
|
29711
|
+
return (r = _toPropertyKey31(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29712
|
+
}
|
|
29713
|
+
function _toPropertyKey31(t) {
|
|
29714
|
+
var i = _toPrimitive31(t, "string");
|
|
29715
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29716
|
+
}
|
|
29717
|
+
function _toPrimitive31(t, r) {
|
|
29718
|
+
if ("object" != typeof t || !t) return t;
|
|
29719
|
+
var e = t[Symbol.toPrimitive];
|
|
29720
|
+
if (void 0 !== e) {
|
|
29721
|
+
var i = e.call(t, r || "default");
|
|
29722
|
+
if ("object" != typeof i) return i;
|
|
29723
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29724
|
+
}
|
|
29725
|
+
return ("string" === r ? String : Number)(t);
|
|
29726
|
+
}
|
|
29727
|
+
var Whiteboard = class extends EventEmitter9 {
|
|
29382
29728
|
// public insertImage!: (src: string) => void;
|
|
29383
29729
|
constructor(view) {
|
|
29384
29730
|
super();
|
|
29731
|
+
_defineProperty31(this, "view", void 0);
|
|
29732
|
+
_defineProperty31(this, "selfUserId", void 0);
|
|
29733
|
+
_defineProperty31(this, "permissions", void 0);
|
|
29734
|
+
_defineProperty31(this, "tool", void 0);
|
|
29735
|
+
_defineProperty31(this, "fontSize", void 0);
|
|
29736
|
+
_defineProperty31(this, "dashArray", void 0);
|
|
29737
|
+
_defineProperty31(this, "fontFamily", void 0);
|
|
29738
|
+
_defineProperty31(this, "strokeColor", void 0);
|
|
29739
|
+
_defineProperty31(this, "fillColor", void 0);
|
|
29740
|
+
_defineProperty31(this, "strokeWidth", void 0);
|
|
29741
|
+
_defineProperty31(this, "enableCameraByMouse", void 0);
|
|
29742
|
+
_defineProperty31(this, "enableCameraByTouch", void 0);
|
|
29743
|
+
_defineProperty31(this, "cameraBoundaryColor", void 0);
|
|
29744
|
+
_defineProperty31(this, "enableCameraBoundaryHighlight", void 0);
|
|
29745
|
+
_defineProperty31(this, "getElementAttribute", void 0);
|
|
29746
|
+
_defineProperty31(this, "setElementAttribute", void 0);
|
|
29747
|
+
_defineProperty31(this, "getCurrentTool", void 0);
|
|
29748
|
+
_defineProperty31(this, "setCurrentTool", void 0);
|
|
29749
|
+
_defineProperty31(this, "setCanvasBackgroundColor", void 0);
|
|
29750
|
+
_defineProperty31(this, "setThemeColor", void 0);
|
|
29751
|
+
_defineProperty31(this, "gotoPage", void 0);
|
|
29752
|
+
_defineProperty31(this, "addPage", void 0);
|
|
29753
|
+
_defineProperty31(this, "deletePage", void 0);
|
|
29754
|
+
_defineProperty31(this, "pageList", void 0);
|
|
29755
|
+
_defineProperty31(this, "currentPageId", void 0);
|
|
29756
|
+
_defineProperty31(this, "clonePage", void 0);
|
|
29757
|
+
_defineProperty31(this, "clearPage", void 0);
|
|
29758
|
+
_defineProperty31(this, "translateCamera", void 0);
|
|
29759
|
+
_defineProperty31(this, "scaleCamera", void 0);
|
|
29760
|
+
_defineProperty31(this, "resetCamera", void 0);
|
|
29761
|
+
_defineProperty31(this, "setFreeModelUserPage", void 0);
|
|
29762
|
+
_defineProperty31(this, "indexedNavigation", void 0);
|
|
29763
|
+
_defineProperty31(this, "setViewModeToFree", void 0);
|
|
29764
|
+
_defineProperty31(this, "setViewModeToFlow", void 0);
|
|
29765
|
+
_defineProperty31(this, "setViewModeToMain", void 0);
|
|
29766
|
+
_defineProperty31(this, "getViewModel", void 0);
|
|
29767
|
+
_defineProperty31(this, "undo", void 0);
|
|
29768
|
+
_defineProperty31(this, "redo", void 0);
|
|
29769
|
+
_defineProperty31(this, "rasterizeViewport", void 0);
|
|
29770
|
+
_defineProperty31(this, "rasterizeElementsBounds", void 0);
|
|
29771
|
+
_defineProperty31(this, "rasterizeMaxBounds", void 0);
|
|
29772
|
+
_defineProperty31(this, "setInputType", void 0);
|
|
29385
29773
|
this.view = view;
|
|
29386
29774
|
}
|
|
29387
29775
|
};
|
|
29388
29776
|
|
|
29389
29777
|
// src/tool/EraserTool.ts
|
|
29778
|
+
function _defineProperty32(e, r, t) {
|
|
29779
|
+
return (r = _toPropertyKey32(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29780
|
+
}
|
|
29781
|
+
function _toPropertyKey32(t) {
|
|
29782
|
+
var i = _toPrimitive32(t, "string");
|
|
29783
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29784
|
+
}
|
|
29785
|
+
function _toPrimitive32(t, r) {
|
|
29786
|
+
if ("object" != typeof t || !t) return t;
|
|
29787
|
+
var e = t[Symbol.toPrimitive];
|
|
29788
|
+
if (void 0 !== e) {
|
|
29789
|
+
var i = e.call(t, r || "default");
|
|
29790
|
+
if ("object" != typeof i) return i;
|
|
29791
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29792
|
+
}
|
|
29793
|
+
return ("string" === r ? String : Number)(t);
|
|
29794
|
+
}
|
|
29390
29795
|
var EraserTool = class extends WhiteboardTool {
|
|
29391
|
-
elementModel = null;
|
|
29392
|
-
trashedElementsModel;
|
|
29393
|
-
pointCount = 0;
|
|
29394
29796
|
constructor(enableToolEvent, renderableModel, shadowEmitter, scope, trashedElementsModel) {
|
|
29395
29797
|
super(enableToolEvent, renderableModel, shadowEmitter, scope);
|
|
29798
|
+
_defineProperty32(this, "elementModel", null);
|
|
29799
|
+
_defineProperty32(this, "trashedElementsModel", void 0);
|
|
29800
|
+
_defineProperty32(this, "pointCount", 0);
|
|
29396
29801
|
this.trashedElementsModel = trashedElementsModel;
|
|
29397
29802
|
this.tool.minDistance = 1;
|
|
29398
29803
|
}
|
|
@@ -29430,19 +29835,49 @@ var EraserTool = class extends WhiteboardTool {
|
|
|
29430
29835
|
// src/model/TrashedElementsModel.ts
|
|
29431
29836
|
import * as Y14 from "yjs";
|
|
29432
29837
|
import EventEmitter10 from "eventemitter3";
|
|
29838
|
+
function _defineProperty33(e, r, t) {
|
|
29839
|
+
return (r = _toPropertyKey33(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29840
|
+
}
|
|
29841
|
+
function _toPropertyKey33(t) {
|
|
29842
|
+
var i = _toPrimitive33(t, "string");
|
|
29843
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29844
|
+
}
|
|
29845
|
+
function _toPrimitive33(t, r) {
|
|
29846
|
+
if ("object" != typeof t || !t) return t;
|
|
29847
|
+
var e = t[Symbol.toPrimitive];
|
|
29848
|
+
if (void 0 !== e) {
|
|
29849
|
+
var i = e.call(t, r || "default");
|
|
29850
|
+
if ("object" != typeof i) return i;
|
|
29851
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29852
|
+
}
|
|
29853
|
+
return ("string" === r ? String : Number)(t);
|
|
29854
|
+
}
|
|
29433
29855
|
var TrashedElementsModel = class extends EventEmitter10 {
|
|
29434
|
-
requestUserMap;
|
|
29435
|
-
userManager;
|
|
29436
|
-
hasPermission;
|
|
29437
|
-
observers = /* @__PURE__ */ new Map();
|
|
29438
29856
|
get hasDeleteSelfPermission() {
|
|
29439
|
-
return this.hasPermission(
|
|
29857
|
+
return this.hasPermission(WhiteboardPermissionFlag.deleteSelf);
|
|
29440
29858
|
}
|
|
29441
29859
|
get hasDeleteOthersPermission() {
|
|
29442
|
-
return this.hasPermission(
|
|
29860
|
+
return this.hasPermission(WhiteboardPermissionFlag.deleteOthers);
|
|
29443
29861
|
}
|
|
29444
29862
|
constructor(userManager, requestUserMap, hasPermission) {
|
|
29445
29863
|
super();
|
|
29864
|
+
_defineProperty33(this, "requestUserMap", void 0);
|
|
29865
|
+
_defineProperty33(this, "userManager", void 0);
|
|
29866
|
+
_defineProperty33(this, "hasPermission", void 0);
|
|
29867
|
+
_defineProperty33(this, "observers", /* @__PURE__ */ new Map());
|
|
29868
|
+
_defineProperty33(this, "handleUserLeave", (user) => {
|
|
29869
|
+
const cb = this.observers.get(user.id);
|
|
29870
|
+
if (cb) {
|
|
29871
|
+
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
29872
|
+
}
|
|
29873
|
+
});
|
|
29874
|
+
_defineProperty33(this, "handleUserJoin", (user) => {
|
|
29875
|
+
const observer = (evts) => {
|
|
29876
|
+
this.handleUserTrashElementsChange(user.id, evts);
|
|
29877
|
+
};
|
|
29878
|
+
this.requestUserMap(user.id).observeDeep(observer);
|
|
29879
|
+
this.observers.set(user.id, observer);
|
|
29880
|
+
});
|
|
29446
29881
|
this.hasPermission = hasPermission;
|
|
29447
29882
|
this.userManager = userManager;
|
|
29448
29883
|
this.requestUserMap = requestUserMap;
|
|
@@ -29457,19 +29892,6 @@ var TrashedElementsModel = class extends EventEmitter10 {
|
|
|
29457
29892
|
this.userManager.on("join", this.handleUserJoin);
|
|
29458
29893
|
this.userManager.on("leave", this.handleUserLeave);
|
|
29459
29894
|
}
|
|
29460
|
-
handleUserLeave = (user) => {
|
|
29461
|
-
const cb = this.observers.get(user.id);
|
|
29462
|
-
if (cb) {
|
|
29463
|
-
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
29464
|
-
}
|
|
29465
|
-
};
|
|
29466
|
-
handleUserJoin = (user) => {
|
|
29467
|
-
const observer = (evts) => {
|
|
29468
|
-
this.handleUserTrashElementsChange(user.id, evts);
|
|
29469
|
-
};
|
|
29470
|
-
this.requestUserMap(user.id).observeDeep(observer);
|
|
29471
|
-
this.observers.set(user.id, observer);
|
|
29472
|
-
};
|
|
29473
29895
|
handleUserTrashElementsChange(userId, evts) {
|
|
29474
29896
|
for (const evt of evts) {
|
|
29475
29897
|
if (evt.target.get("inner-map-id") === "trashedElements") {
|
|
@@ -29531,11 +29953,28 @@ var TrashedElementsModel = class extends EventEmitter10 {
|
|
|
29531
29953
|
};
|
|
29532
29954
|
|
|
29533
29955
|
// src/tool/LaserPointerTool.ts
|
|
29956
|
+
function _defineProperty34(e, r, t) {
|
|
29957
|
+
return (r = _toPropertyKey34(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29958
|
+
}
|
|
29959
|
+
function _toPropertyKey34(t) {
|
|
29960
|
+
var i = _toPrimitive34(t, "string");
|
|
29961
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29962
|
+
}
|
|
29963
|
+
function _toPrimitive34(t, r) {
|
|
29964
|
+
if ("object" != typeof t || !t) return t;
|
|
29965
|
+
var e = t[Symbol.toPrimitive];
|
|
29966
|
+
if (void 0 !== e) {
|
|
29967
|
+
var i = e.call(t, r || "default");
|
|
29968
|
+
if ("object" != typeof i) return i;
|
|
29969
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29970
|
+
}
|
|
29971
|
+
return ("string" === r ? String : Number)(t);
|
|
29972
|
+
}
|
|
29534
29973
|
var LaserPointerTool = class extends WhiteboardTool {
|
|
29535
|
-
elementModel = null;
|
|
29536
|
-
pointCount = 0;
|
|
29537
29974
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
29538
29975
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
29976
|
+
_defineProperty34(this, "elementModel", null);
|
|
29977
|
+
_defineProperty34(this, "pointCount", 0);
|
|
29539
29978
|
this.tool.minDistance = 5;
|
|
29540
29979
|
}
|
|
29541
29980
|
onMouseDown(event) {
|
|
@@ -29561,15 +30000,79 @@ var LaserPointerTool = class extends WhiteboardTool {
|
|
|
29561
30000
|
// src/model/PageModel.ts
|
|
29562
30001
|
import EventEmitter11 from "eventemitter3";
|
|
29563
30002
|
import { log } from "@netless/forge-room";
|
|
30003
|
+
function _defineProperty35(e, r, t) {
|
|
30004
|
+
return (r = _toPropertyKey35(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30005
|
+
}
|
|
30006
|
+
function _toPropertyKey35(t) {
|
|
30007
|
+
var i = _toPrimitive35(t, "string");
|
|
30008
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30009
|
+
}
|
|
30010
|
+
function _toPrimitive35(t, r) {
|
|
30011
|
+
if ("object" != typeof t || !t) return t;
|
|
30012
|
+
var e = t[Symbol.toPrimitive];
|
|
30013
|
+
if (void 0 !== e) {
|
|
30014
|
+
var i = e.call(t, r || "default");
|
|
30015
|
+
if ("object" != typeof i) return i;
|
|
30016
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30017
|
+
}
|
|
30018
|
+
return ("string" === r ? String : Number)(t);
|
|
30019
|
+
}
|
|
29564
30020
|
var PageModel = class extends EventEmitter11 {
|
|
29565
|
-
whiteboardAttrsMap;
|
|
29566
|
-
pageMap;
|
|
29567
|
-
requestUserMap;
|
|
29568
|
-
userManager;
|
|
29569
|
-
observers = /* @__PURE__ */ new Map();
|
|
29570
|
-
hasPermission;
|
|
29571
30021
|
constructor(whiteboardAttrsMap, userManager, requestUserMap, pageMap, hasPermission) {
|
|
29572
30022
|
super();
|
|
30023
|
+
_defineProperty35(this, "whiteboardAttrsMap", void 0);
|
|
30024
|
+
_defineProperty35(this, "pageMap", void 0);
|
|
30025
|
+
_defineProperty35(this, "requestUserMap", void 0);
|
|
30026
|
+
_defineProperty35(this, "userManager", void 0);
|
|
30027
|
+
_defineProperty35(this, "observers", /* @__PURE__ */ new Map());
|
|
30028
|
+
_defineProperty35(this, "hasPermission", void 0);
|
|
30029
|
+
_defineProperty35(this, "handleUserLeave", (user) => {
|
|
30030
|
+
const cb = this.observers.get(user.id);
|
|
30031
|
+
if (cb) {
|
|
30032
|
+
this.requestUserMap(user.id).unobserve(cb);
|
|
30033
|
+
}
|
|
30034
|
+
});
|
|
30035
|
+
_defineProperty35(this, "handleUserJoin", (user) => {
|
|
30036
|
+
this.createCurrentPageObserver(user.id);
|
|
30037
|
+
});
|
|
30038
|
+
_defineProperty35(this, "handleMainPageChange", (evt) => {
|
|
30039
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
30040
|
+
if (key === WhiteboardKeys.currentPage) {
|
|
30041
|
+
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
30042
|
+
if (value.action === "update" || value.action === "add") {
|
|
30043
|
+
if (cameraMode === "main") {
|
|
30044
|
+
const targetPage = this.whiteboardAttrsMap.get(WhiteboardKeys.currentPage);
|
|
30045
|
+
if (!this.pageMap.has(targetPage) && targetPage !== "_i_") {
|
|
30046
|
+
log(`main page {${targetPage}} not found.`, {}, "error");
|
|
30047
|
+
return;
|
|
30048
|
+
}
|
|
30049
|
+
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
30050
|
+
this.emit("switchPage", targetPage);
|
|
30051
|
+
}
|
|
30052
|
+
}
|
|
30053
|
+
}
|
|
30054
|
+
}
|
|
30055
|
+
});
|
|
30056
|
+
_defineProperty35(this, "handleUserCurrentPageChange", (userId, evt) => {
|
|
30057
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
30058
|
+
if (key === WhiteboardKeys.currentPage) {
|
|
30059
|
+
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
30060
|
+
if (value.action === "update" || value.action === "add") {
|
|
30061
|
+
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
30062
|
+
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
30063
|
+
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
30064
|
+
this.emit("switchPage", targetPage);
|
|
30065
|
+
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
30066
|
+
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
30067
|
+
this.emit("switchPage", targetPage);
|
|
30068
|
+
}
|
|
30069
|
+
}
|
|
30070
|
+
}
|
|
30071
|
+
}
|
|
30072
|
+
});
|
|
30073
|
+
_defineProperty35(this, "handlePageMapChange", () => {
|
|
30074
|
+
this.emit("pagesChange", Array.from(this.pageMap.keys()));
|
|
30075
|
+
});
|
|
29573
30076
|
this.hasPermission = hasPermission;
|
|
29574
30077
|
this.pageMap = pageMap;
|
|
29575
30078
|
this.userManager = userManager;
|
|
@@ -29590,53 +30093,6 @@ var PageModel = class extends EventEmitter11 {
|
|
|
29590
30093
|
this.requestUserMap(userId).observe(observer);
|
|
29591
30094
|
this.observers.set(userId, observer);
|
|
29592
30095
|
}
|
|
29593
|
-
handleUserLeave = (user) => {
|
|
29594
|
-
const cb = this.observers.get(user.id);
|
|
29595
|
-
if (cb) {
|
|
29596
|
-
this.requestUserMap(user.id).unobserve(cb);
|
|
29597
|
-
}
|
|
29598
|
-
};
|
|
29599
|
-
handleUserJoin = (user) => {
|
|
29600
|
-
this.createCurrentPageObserver(user.id);
|
|
29601
|
-
};
|
|
29602
|
-
handleMainPageChange = (evt) => {
|
|
29603
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29604
|
-
if (key === WhiteboardKeys.currentPage) {
|
|
29605
|
-
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
29606
|
-
if (value.action === "update" || value.action === "add") {
|
|
29607
|
-
if (cameraMode === "main") {
|
|
29608
|
-
const targetPage = this.whiteboardAttrsMap.get(WhiteboardKeys.currentPage);
|
|
29609
|
-
if (!this.pageMap.has(targetPage) && targetPage !== "_i_") {
|
|
29610
|
-
log(`main page {${targetPage}} not found.`, {}, "error");
|
|
29611
|
-
return;
|
|
29612
|
-
}
|
|
29613
|
-
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
29614
|
-
this.emit("switchPage", targetPage);
|
|
29615
|
-
}
|
|
29616
|
-
}
|
|
29617
|
-
}
|
|
29618
|
-
}
|
|
29619
|
-
};
|
|
29620
|
-
handleUserCurrentPageChange = (userId, evt) => {
|
|
29621
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29622
|
-
if (key === WhiteboardKeys.currentPage) {
|
|
29623
|
-
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
29624
|
-
if (value.action === "update" || value.action === "add") {
|
|
29625
|
-
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
29626
|
-
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
29627
|
-
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
29628
|
-
this.emit("switchPage", targetPage);
|
|
29629
|
-
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
29630
|
-
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
29631
|
-
this.emit("switchPage", targetPage);
|
|
29632
|
-
}
|
|
29633
|
-
}
|
|
29634
|
-
}
|
|
29635
|
-
}
|
|
29636
|
-
};
|
|
29637
|
-
handlePageMapChange = () => {
|
|
29638
|
-
this.emit("pagesChange", Array.from(this.pageMap.keys()));
|
|
29639
|
-
};
|
|
29640
30096
|
getCurrentPage(userId) {
|
|
29641
30097
|
const cameraMode = this.requestUserMap(userId).get(WhiteboardKeys.cameraMode);
|
|
29642
30098
|
if (cameraMode === "main") {
|
|
@@ -29659,7 +30115,7 @@ var PageModel = class extends EventEmitter11 {
|
|
|
29659
30115
|
console.warn(`cannot modify pages in non-main view mode.`);
|
|
29660
30116
|
return false;
|
|
29661
30117
|
}
|
|
29662
|
-
if (!this.hasPermission(
|
|
30118
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29663
30119
|
console.warn(`cannot modify pages without WhiteboardPermissionFlag.mainView.`);
|
|
29664
30120
|
return false;
|
|
29665
30121
|
}
|
|
@@ -29688,7 +30144,7 @@ var PageModel = class extends EventEmitter11 {
|
|
|
29688
30144
|
}
|
|
29689
30145
|
}
|
|
29690
30146
|
setUserPage(id, userId) {
|
|
29691
|
-
if (this.pageList().indexOf(id) < 0 || !this.hasPermission(
|
|
30147
|
+
if (this.pageList().indexOf(id) < 0 || !this.hasPermission(WhiteboardPermissionFlag.setOthersView)) {
|
|
29692
30148
|
return;
|
|
29693
30149
|
}
|
|
29694
30150
|
const userMap = this.requestUserMap(userId);
|
|
@@ -29707,7 +30163,7 @@ var PageModel = class extends EventEmitter11 {
|
|
|
29707
30163
|
userMap.set(WhiteboardKeys.currentPage, id);
|
|
29708
30164
|
}
|
|
29709
30165
|
if (cameraMode === "main") {
|
|
29710
|
-
if (this.hasPermission(
|
|
30166
|
+
if (this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29711
30167
|
this.whiteboardAttrsMap.set(WhiteboardKeys.currentPage, id);
|
|
29712
30168
|
}
|
|
29713
30169
|
}
|
|
@@ -29727,13 +30183,24 @@ async function waitUntil(fn, timeout) {
|
|
|
29727
30183
|
// src/IndexedNavigation.ts
|
|
29728
30184
|
import EventEmitter12 from "eventemitter3";
|
|
29729
30185
|
import { log as log2 } from "@netless/forge-room";
|
|
30186
|
+
function _defineProperty36(e, r, t) {
|
|
30187
|
+
return (r = _toPropertyKey36(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30188
|
+
}
|
|
30189
|
+
function _toPropertyKey36(t) {
|
|
30190
|
+
var i = _toPrimitive36(t, "string");
|
|
30191
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30192
|
+
}
|
|
30193
|
+
function _toPrimitive36(t, r) {
|
|
30194
|
+
if ("object" != typeof t || !t) return t;
|
|
30195
|
+
var e = t[Symbol.toPrimitive];
|
|
30196
|
+
if (void 0 !== e) {
|
|
30197
|
+
var i = e.call(t, r || "default");
|
|
30198
|
+
if ("object" != typeof i) return i;
|
|
30199
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30200
|
+
}
|
|
30201
|
+
return ("string" === r ? String : Number)(t);
|
|
30202
|
+
}
|
|
29730
30203
|
var IndexedNavigation = class extends EventEmitter12 {
|
|
29731
|
-
idPool = /* @__PURE__ */ new Set();
|
|
29732
|
-
pageModel;
|
|
29733
|
-
userMap;
|
|
29734
|
-
indexedPageMap;
|
|
29735
|
-
list = {};
|
|
29736
|
-
hasPermission;
|
|
29737
30204
|
get idList() {
|
|
29738
30205
|
return this.pageModel.pageList().filter((id) => /^_i_/.test(id));
|
|
29739
30206
|
}
|
|
@@ -29760,6 +30227,21 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
29760
30227
|
}
|
|
29761
30228
|
constructor(pageModel, userMap, indexedPageMap, hasPermission) {
|
|
29762
30229
|
super();
|
|
30230
|
+
_defineProperty36(this, "idPool", /* @__PURE__ */ new Set());
|
|
30231
|
+
_defineProperty36(this, "pageModel", void 0);
|
|
30232
|
+
_defineProperty36(this, "userMap", void 0);
|
|
30233
|
+
_defineProperty36(this, "indexedPageMap", void 0);
|
|
30234
|
+
_defineProperty36(this, "list", {});
|
|
30235
|
+
_defineProperty36(this, "hasPermission", void 0);
|
|
30236
|
+
_defineProperty36(this, "handleIndexedPageMapUpdate", (evt) => {
|
|
30237
|
+
this.list = this.indexedPageMap.get("list");
|
|
30238
|
+
const needRemoveList = this.pageModel.pageList().filter((v) => /^_i_/.test(v) && Object.keys(this.list).indexOf(v) < 0);
|
|
30239
|
+
const needAddList = Object.keys(this.list).filter((v) => this.pageModel.pageList().indexOf(v) < 0);
|
|
30240
|
+
this.indexedPageMap.doc.transact(() => {
|
|
30241
|
+
needAddList.forEach((id) => this.pageModel.addPage(id));
|
|
30242
|
+
needRemoveList.forEach((id) => this.pageModel.deletePage(id));
|
|
30243
|
+
});
|
|
30244
|
+
});
|
|
29763
30245
|
this.hasPermission = hasPermission;
|
|
29764
30246
|
this.pageModel = pageModel;
|
|
29765
30247
|
this.userMap = userMap;
|
|
@@ -29776,7 +30258,12 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
29776
30258
|
this.emit("pageCountChange", this.pageCount);
|
|
29777
30259
|
});
|
|
29778
30260
|
if (!this.indexedPageMap.has("list")) {
|
|
29779
|
-
this.list = {
|
|
30261
|
+
this.list = {
|
|
30262
|
+
"_i_": {
|
|
30263
|
+
prev: "",
|
|
30264
|
+
next: ""
|
|
30265
|
+
}
|
|
30266
|
+
};
|
|
29780
30267
|
this.indexedPageMap.set("list", this.list);
|
|
29781
30268
|
this.idPool.add("_i_");
|
|
29782
30269
|
} else {
|
|
@@ -29810,15 +30297,6 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
29810
30297
|
});
|
|
29811
30298
|
});
|
|
29812
30299
|
}
|
|
29813
|
-
handleIndexedPageMapUpdate = (evt) => {
|
|
29814
|
-
this.list = this.indexedPageMap.get("list");
|
|
29815
|
-
const needRemoveList = this.pageModel.pageList().filter((v) => /^_i_/.test(v) && Object.keys(this.list).indexOf(v) < 0);
|
|
29816
|
-
const needAddList = Object.keys(this.list).filter((v) => this.pageModel.pageList().indexOf(v) < 0);
|
|
29817
|
-
this.indexedPageMap.doc.transact(() => {
|
|
29818
|
-
needAddList.forEach((id) => this.pageModel.addPage(id));
|
|
29819
|
-
needRemoveList.forEach((id) => this.pageModel.deletePage(id));
|
|
29820
|
-
});
|
|
29821
|
-
};
|
|
29822
30300
|
/**
|
|
29823
30301
|
* 获取总页数
|
|
29824
30302
|
* @returns {number}
|
|
@@ -29875,7 +30353,7 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
29875
30353
|
console.warn(`cannot modify pages in non-main view mode.`);
|
|
29876
30354
|
return false;
|
|
29877
30355
|
}
|
|
29878
|
-
if (!this.hasPermission(
|
|
30356
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29879
30357
|
console.warn(`cannot modify pages without WhiteboardPermissionFlag.mainView.`);
|
|
29880
30358
|
return false;
|
|
29881
30359
|
}
|
|
@@ -29886,7 +30364,8 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
29886
30364
|
* @param {boolean=} goto 是否跳转到新页面, 默认 true
|
|
29887
30365
|
* @return 总页数
|
|
29888
30366
|
*/
|
|
29889
|
-
pushPage(
|
|
30367
|
+
pushPage() {
|
|
30368
|
+
let goto = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
|
|
29890
30369
|
this.indexedPageMap.doc.transact(() => {
|
|
29891
30370
|
const id = this.getNextId();
|
|
29892
30371
|
if (!this.pageModel.addPage(id)) {
|
|
@@ -29918,7 +30397,8 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
29918
30397
|
* @param {boolean=} goto 是否跳转到新页面, 默认 true
|
|
29919
30398
|
* @return 总页数
|
|
29920
30399
|
*/
|
|
29921
|
-
insertPage(after
|
|
30400
|
+
insertPage(after) {
|
|
30401
|
+
let goto = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
|
|
29922
30402
|
const afterPageId = this.getPageId(after);
|
|
29923
30403
|
if (!afterPageId) {
|
|
29924
30404
|
return this.pageCount;
|
|
@@ -30047,10 +30527,27 @@ var IndexedNavigation = class extends EventEmitter12 {
|
|
|
30047
30527
|
|
|
30048
30528
|
// src/utils/ShadowEmitter.ts
|
|
30049
30529
|
import EventEmitter13 from "eventemitter3";
|
|
30530
|
+
function _defineProperty37(e, r, t) {
|
|
30531
|
+
return (r = _toPropertyKey37(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30532
|
+
}
|
|
30533
|
+
function _toPropertyKey37(t) {
|
|
30534
|
+
var i = _toPrimitive37(t, "string");
|
|
30535
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30536
|
+
}
|
|
30537
|
+
function _toPrimitive37(t, r) {
|
|
30538
|
+
if ("object" != typeof t || !t) return t;
|
|
30539
|
+
var e = t[Symbol.toPrimitive];
|
|
30540
|
+
if (void 0 !== e) {
|
|
30541
|
+
var i = e.call(t, r || "default");
|
|
30542
|
+
if ("object" != typeof i) return i;
|
|
30543
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30544
|
+
}
|
|
30545
|
+
return ("string" === r ? String : Number)(t);
|
|
30546
|
+
}
|
|
30050
30547
|
var ShadowEmitter = class extends EventEmitter13 {
|
|
30051
|
-
userMap;
|
|
30052
30548
|
constructor(userMap) {
|
|
30053
30549
|
super();
|
|
30550
|
+
_defineProperty37(this, "userMap", void 0);
|
|
30054
30551
|
this.userMap = userMap;
|
|
30055
30552
|
}
|
|
30056
30553
|
getActive() {
|
|
@@ -30062,12 +30559,29 @@ var ShadowEmitter = class extends EventEmitter13 {
|
|
|
30062
30559
|
};
|
|
30063
30560
|
|
|
30064
30561
|
// src/tool/StraightLineTool.ts
|
|
30562
|
+
function _defineProperty38(e, r, t) {
|
|
30563
|
+
return (r = _toPropertyKey38(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30564
|
+
}
|
|
30565
|
+
function _toPropertyKey38(t) {
|
|
30566
|
+
var i = _toPrimitive38(t, "string");
|
|
30567
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30568
|
+
}
|
|
30569
|
+
function _toPrimitive38(t, r) {
|
|
30570
|
+
if ("object" != typeof t || !t) return t;
|
|
30571
|
+
var e = t[Symbol.toPrimitive];
|
|
30572
|
+
if (void 0 !== e) {
|
|
30573
|
+
var i = e.call(t, r || "default");
|
|
30574
|
+
if ("object" != typeof i) return i;
|
|
30575
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30576
|
+
}
|
|
30577
|
+
return ("string" === r ? String : Number)(t);
|
|
30578
|
+
}
|
|
30065
30579
|
var StraightLineTool = class extends WhiteboardTool {
|
|
30066
|
-
elementModel = null;
|
|
30067
|
-
from = null;
|
|
30068
|
-
to = null;
|
|
30069
30580
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
30070
30581
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
30582
|
+
_defineProperty38(this, "elementModel", null);
|
|
30583
|
+
_defineProperty38(this, "from", null);
|
|
30584
|
+
_defineProperty38(this, "to", null);
|
|
30071
30585
|
this.tool.minDistance = 1;
|
|
30072
30586
|
}
|
|
30073
30587
|
onMouseDown(event) {
|
|
@@ -30092,11 +30606,28 @@ var StraightLineTool = class extends WhiteboardTool {
|
|
|
30092
30606
|
};
|
|
30093
30607
|
|
|
30094
30608
|
// src/tool/GrabTool.ts
|
|
30609
|
+
function _defineProperty39(e, r, t) {
|
|
30610
|
+
return (r = _toPropertyKey39(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30611
|
+
}
|
|
30612
|
+
function _toPropertyKey39(t) {
|
|
30613
|
+
var i = _toPrimitive39(t, "string");
|
|
30614
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30615
|
+
}
|
|
30616
|
+
function _toPrimitive39(t, r) {
|
|
30617
|
+
if ("object" != typeof t || !t) return t;
|
|
30618
|
+
var e = t[Symbol.toPrimitive];
|
|
30619
|
+
if (void 0 !== e) {
|
|
30620
|
+
var i = e.call(t, r || "default");
|
|
30621
|
+
if ("object" != typeof i) return i;
|
|
30622
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30623
|
+
}
|
|
30624
|
+
return ("string" === r ? String : Number)(t);
|
|
30625
|
+
}
|
|
30095
30626
|
var GrabTool = class extends WhiteboardTool {
|
|
30096
|
-
camera;
|
|
30097
|
-
downPoint = null;
|
|
30098
30627
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope, camera) {
|
|
30099
30628
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
30629
|
+
_defineProperty39(this, "camera", void 0);
|
|
30630
|
+
_defineProperty39(this, "downPoint", null);
|
|
30100
30631
|
this.camera = camera;
|
|
30101
30632
|
}
|
|
30102
30633
|
onMouseDown(event) {
|
|
@@ -30117,34 +30648,25 @@ var GrabTool = class extends WhiteboardTool {
|
|
|
30117
30648
|
};
|
|
30118
30649
|
|
|
30119
30650
|
// src/WhiteboardApplication.ts
|
|
30651
|
+
function _defineProperty40(e, r, t) {
|
|
30652
|
+
return (r = _toPropertyKey40(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30653
|
+
}
|
|
30654
|
+
function _toPropertyKey40(t) {
|
|
30655
|
+
var i = _toPrimitive40(t, "string");
|
|
30656
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30657
|
+
}
|
|
30658
|
+
function _toPrimitive40(t, r) {
|
|
30659
|
+
if ("object" != typeof t || !t) return t;
|
|
30660
|
+
var e = t[Symbol.toPrimitive];
|
|
30661
|
+
if (void 0 !== e) {
|
|
30662
|
+
var i = e.call(t, r || "default");
|
|
30663
|
+
if ("object" != typeof i) return i;
|
|
30664
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30665
|
+
}
|
|
30666
|
+
return ("string" === r ? String : Number)(t);
|
|
30667
|
+
}
|
|
30120
30668
|
var WHITEBOARD_APP_NAME = "whiteboard";
|
|
30121
30669
|
var WhiteboardApplication = class extends AbstractApplication {
|
|
30122
|
-
static applicationName = WHITEBOARD_APP_NAME;
|
|
30123
|
-
name = WHITEBOARD_APP_NAME;
|
|
30124
|
-
emitter;
|
|
30125
|
-
toolbarModel;
|
|
30126
|
-
selectElementsModel;
|
|
30127
|
-
trashedElementsModel;
|
|
30128
|
-
pageModel;
|
|
30129
|
-
layers = /* @__PURE__ */ new Map();
|
|
30130
|
-
undoManagers = /* @__PURE__ */ new Map();
|
|
30131
|
-
rootElement = document.createElement("div");
|
|
30132
|
-
paperScope = new import_paper.default.PaperScope();
|
|
30133
|
-
canvasElement = document.createElement("canvas");
|
|
30134
|
-
shadowScope = new import_paper.default.PaperScope();
|
|
30135
|
-
snapshotCanvasElement = document.createElement("canvas");
|
|
30136
|
-
snapshotScope = new import_paper.default.PaperScope();
|
|
30137
|
-
shadowCanvasElement = document.createElement("canvas");
|
|
30138
|
-
shadowEmitter;
|
|
30139
|
-
tools;
|
|
30140
|
-
editors = /* @__PURE__ */ new Map();
|
|
30141
|
-
camera;
|
|
30142
|
-
resizeObserver;
|
|
30143
|
-
option;
|
|
30144
|
-
permissions;
|
|
30145
|
-
inputType = "any";
|
|
30146
|
-
isPenEvent = false;
|
|
30147
|
-
hasPenInput = null;
|
|
30148
30670
|
get undoManager() {
|
|
30149
30671
|
const page = this.pageModel.getCurrentPage(this.userId);
|
|
30150
30672
|
if (page) {
|
|
@@ -30153,7 +30675,250 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30153
30675
|
return null;
|
|
30154
30676
|
}
|
|
30155
30677
|
constructor() {
|
|
30678
|
+
var _this;
|
|
30156
30679
|
super();
|
|
30680
|
+
_this = this;
|
|
30681
|
+
_defineProperty40(this, "name", WHITEBOARD_APP_NAME);
|
|
30682
|
+
_defineProperty40(this, "emitter", void 0);
|
|
30683
|
+
_defineProperty40(this, "toolbarModel", void 0);
|
|
30684
|
+
_defineProperty40(this, "selectElementsModel", void 0);
|
|
30685
|
+
_defineProperty40(this, "trashedElementsModel", void 0);
|
|
30686
|
+
_defineProperty40(this, "pageModel", void 0);
|
|
30687
|
+
_defineProperty40(this, "layers", /* @__PURE__ */ new Map());
|
|
30688
|
+
_defineProperty40(this, "undoManagers", /* @__PURE__ */ new Map());
|
|
30689
|
+
_defineProperty40(this, "rootElement", document.createElement("div"));
|
|
30690
|
+
_defineProperty40(this, "paperScope", new import_paper.default.PaperScope());
|
|
30691
|
+
_defineProperty40(this, "canvasElement", document.createElement("canvas"));
|
|
30692
|
+
_defineProperty40(this, "shadowScope", new import_paper.default.PaperScope());
|
|
30693
|
+
_defineProperty40(this, "snapshotCanvasElement", document.createElement("canvas"));
|
|
30694
|
+
_defineProperty40(this, "snapshotScope", new import_paper.default.PaperScope());
|
|
30695
|
+
_defineProperty40(this, "shadowCanvasElement", document.createElement("canvas"));
|
|
30696
|
+
_defineProperty40(this, "shadowEmitter", void 0);
|
|
30697
|
+
_defineProperty40(this, "tools", void 0);
|
|
30698
|
+
_defineProperty40(this, "editors", /* @__PURE__ */ new Map());
|
|
30699
|
+
_defineProperty40(this, "camera", void 0);
|
|
30700
|
+
_defineProperty40(this, "resizeObserver", void 0);
|
|
30701
|
+
_defineProperty40(this, "option", void 0);
|
|
30702
|
+
_defineProperty40(this, "permissions", void 0);
|
|
30703
|
+
_defineProperty40(this, "linkTarget", null);
|
|
30704
|
+
_defineProperty40(this, "inputType", "any");
|
|
30705
|
+
_defineProperty40(this, "isPenEvent", false);
|
|
30706
|
+
_defineProperty40(this, "hasPenInput", null);
|
|
30707
|
+
_defineProperty40(this, "disableViewModelUpdate", false);
|
|
30708
|
+
_defineProperty40(this, "internalResizeObserver", true);
|
|
30709
|
+
_defineProperty40(this, "enableToolEvent", () => {
|
|
30710
|
+
return !(this.inputType === "pen" && !this.isPenEvent);
|
|
30711
|
+
});
|
|
30712
|
+
_defineProperty40(this, "handlePageSwitch", (pageId) => {
|
|
30713
|
+
for (const editor of this.editors.values()) {
|
|
30714
|
+
editor.hidden();
|
|
30715
|
+
}
|
|
30716
|
+
this.selectElementsModel.clearSelectElementForSelf();
|
|
30717
|
+
waitUntil(() => this.layers.has(pageId), 3e3).then(() => {
|
|
30718
|
+
if (this.layers.has(pageId)) {
|
|
30719
|
+
for (const entry of this.layers.entries()) {
|
|
30720
|
+
entry[1].off("elementInsert", this.handleElementInsert);
|
|
30721
|
+
entry[1].off("elementRemove", this.handleElementRemove);
|
|
30722
|
+
entry[1].off("elementClear", this.handleElementClear);
|
|
30723
|
+
}
|
|
30724
|
+
const renderableModel = this.layers.get(pageId);
|
|
30725
|
+
renderableModel.on("elementInsert", this.handleElementInsert);
|
|
30726
|
+
renderableModel.on("elementRemove", this.handleElementRemove);
|
|
30727
|
+
renderableModel.on("elementClear", this.handleElementClear);
|
|
30728
|
+
renderableModel.flushRenderables();
|
|
30729
|
+
const others = this.userManager.userIdList().filter((v) => v !== this.userId);
|
|
30730
|
+
for (const other of others) {
|
|
30731
|
+
if (this.userMap(other).get(WhiteboardKeys.currentPage) === pageId) {
|
|
30732
|
+
const elementIds = Array.from(this.userMap(other).get(WhiteboardKeys.selectElements).keys()).filter((v) => v !== "inner-map-id");
|
|
30733
|
+
if (elementIds.length > 0) {
|
|
30734
|
+
this.handleElementsSelect(other, elementIds);
|
|
30735
|
+
}
|
|
30736
|
+
}
|
|
30737
|
+
}
|
|
30738
|
+
}
|
|
30739
|
+
});
|
|
30740
|
+
waitUntil(() => this.undoManagers.has(pageId), 3e3).then(() => {
|
|
30741
|
+
if (this.undoManagers.has(pageId)) {
|
|
30742
|
+
for (const entry of this.undoManagers.entries()) {
|
|
30743
|
+
entry[1].off("stack-item-added", this.handleStackItemAdded);
|
|
30744
|
+
entry[1].off("stack-item-popped", this.handleStackItemPopped);
|
|
30745
|
+
}
|
|
30746
|
+
this.undoManagers.get(pageId).on("stack-item-added", this.handleStackItemAdded);
|
|
30747
|
+
this.undoManagers.get(pageId).on("stack-item-popped", this.handleStackItemPopped);
|
|
30748
|
+
}
|
|
30749
|
+
});
|
|
30750
|
+
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30751
|
+
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30752
|
+
});
|
|
30753
|
+
_defineProperty40(this, "hasPermission", (flag) => {
|
|
30754
|
+
return this.permissions.hasPermission(flag, this.userId);
|
|
30755
|
+
});
|
|
30756
|
+
_defineProperty40(this, "handleStackItemAdded", () => {
|
|
30757
|
+
this.selectElementsModel.clearSelectElementForSelf();
|
|
30758
|
+
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30759
|
+
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30760
|
+
});
|
|
30761
|
+
_defineProperty40(this, "handleStackItemPopped", () => {
|
|
30762
|
+
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30763
|
+
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30764
|
+
});
|
|
30765
|
+
_defineProperty40(this, "handleLayersChange", (ids) => {
|
|
30766
|
+
for (let i = 0, len = ids.length; i < len; i++) {
|
|
30767
|
+
const id = ids[i];
|
|
30768
|
+
if (!this.layers.has(id)) {
|
|
30769
|
+
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30770
|
+
const renderableModel = new RenderableModel(id, this.shadowEmitter, elementsMap, this.paperScope, this.toolbarModel, this.userManager, this.hasPermission);
|
|
30771
|
+
this.layers.set(id, renderableModel);
|
|
30772
|
+
}
|
|
30773
|
+
if (!this.undoManagers.has(id)) {
|
|
30774
|
+
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30775
|
+
const undoManager = new Y15.UndoManager(elementsMap, {
|
|
30776
|
+
trackedOrigins: /* @__PURE__ */ new Set([elementsUndoOrigin])
|
|
30777
|
+
});
|
|
30778
|
+
this.undoManagers.set(id, undoManager);
|
|
30779
|
+
}
|
|
30780
|
+
}
|
|
30781
|
+
for (let entry of this.layers.entries()) {
|
|
30782
|
+
if (ids.indexOf(entry[0]) < 0) {
|
|
30783
|
+
const renderableModel = this.layers.get(entry[0]);
|
|
30784
|
+
this.layers.delete(entry[0]);
|
|
30785
|
+
if (renderableModel) {
|
|
30786
|
+
renderableModel.dispose();
|
|
30787
|
+
}
|
|
30788
|
+
const cameraMode = this.userMap(this.userId).get(WhiteboardKeys.cameraMode);
|
|
30789
|
+
const currentPage = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30790
|
+
if (cameraMode === "free" && entry[0] === currentPage) {
|
|
30791
|
+
this.userMap(this.userId).set(WhiteboardKeys.cameraMode, "main");
|
|
30792
|
+
this.userMap(this.userId).set(WhiteboardKeys.currentPage, this.getMap("attrs").get(WhiteboardKeys.currentPage));
|
|
30793
|
+
}
|
|
30794
|
+
}
|
|
30795
|
+
}
|
|
30796
|
+
});
|
|
30797
|
+
_defineProperty40(this, "getCurrentRenderableModel", () => {
|
|
30798
|
+
let layerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30799
|
+
if (!this.layers.has(layerId)) {
|
|
30800
|
+
this.emitter.emit("error", 300002, `target page: ${layerId} not found`);
|
|
30801
|
+
}
|
|
30802
|
+
return this.layers.get(layerId);
|
|
30803
|
+
});
|
|
30804
|
+
_defineProperty40(this, "handleElementClear", () => {
|
|
30805
|
+
this.paperScope.project.activeLayer.removeChildren();
|
|
30806
|
+
});
|
|
30807
|
+
_defineProperty40(this, "handleElementInsert", (elements) => {
|
|
30808
|
+
for (const element of elements) {
|
|
30809
|
+
element.createPaperElement();
|
|
30810
|
+
const scope = element.shadow === "" ? this.paperScope : this.shadowScope;
|
|
30811
|
+
const children = scope.project.activeLayer.children;
|
|
30812
|
+
const oldPaperElement = children.find((v) => v.data.uuid === element.uuid);
|
|
30813
|
+
if (oldPaperElement) {
|
|
30814
|
+
oldPaperElement.remove();
|
|
30815
|
+
}
|
|
30816
|
+
this.insertElementToParent(element.item, scope.project.activeLayer);
|
|
30817
|
+
}
|
|
30818
|
+
});
|
|
30819
|
+
_defineProperty40(this, "handleElementRemove", (elementId, layerId) => {
|
|
30820
|
+
const layerModel = this.layers.get(layerId);
|
|
30821
|
+
if (!layerModel) {
|
|
30822
|
+
return;
|
|
30823
|
+
}
|
|
30824
|
+
const target = layerModel.elementModels.get(elementId);
|
|
30825
|
+
if (target && target.item) {
|
|
30826
|
+
target.item.remove();
|
|
30827
|
+
}
|
|
30828
|
+
layerModel.elementModels.delete(elementId);
|
|
30829
|
+
});
|
|
30830
|
+
_defineProperty40(this, "handleRemoveTrashedElementForSelf", (userId, elementId) => {
|
|
30831
|
+
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30832
|
+
this.layers.get(selfLayerId)?.removeElementItem(elementId);
|
|
30833
|
+
});
|
|
30834
|
+
_defineProperty40(this, "handleElementsTrash", (userId, elements) => {
|
|
30835
|
+
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30836
|
+
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30837
|
+
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30838
|
+
return;
|
|
30839
|
+
}
|
|
30840
|
+
elements.forEach((id) => {
|
|
30841
|
+
const paperItem = this.layers.get(targetLayerId).elementModels.get(id);
|
|
30842
|
+
if (paperItem && paperItem.item) {
|
|
30843
|
+
paperItem.item.opacity = 0.3;
|
|
30844
|
+
}
|
|
30845
|
+
});
|
|
30846
|
+
});
|
|
30847
|
+
_defineProperty40(this, "handleElementsSelect", (userId, elements) => {
|
|
30848
|
+
if (!this.editors.has(userId)) {
|
|
30849
|
+
const ctrl = this.userManager.getUser(userId);
|
|
30850
|
+
const editor2 = new Editor(this.paperScope, this.shadowScope, this.shadowEmitter, this.canvasElement, this.camera, {
|
|
30851
|
+
viewerId: this.userId,
|
|
30852
|
+
ctrlId: userId,
|
|
30853
|
+
ctrlNickName: ctrl?.nickName ?? "",
|
|
30854
|
+
ctrlUserMap: this.userMap(userId)
|
|
30855
|
+
});
|
|
30856
|
+
editor2.on("clear", () => {
|
|
30857
|
+
this.selectElementsModel.clearSelectElementForSelf();
|
|
30858
|
+
});
|
|
30859
|
+
this.editors.set(userId, editor2);
|
|
30860
|
+
this.rootElement.appendChild(editor2.rootView);
|
|
30861
|
+
}
|
|
30862
|
+
const editor = this.editors.get(userId);
|
|
30863
|
+
if (elements.length === 0) {
|
|
30864
|
+
editor.hidden();
|
|
30865
|
+
this.emitter.emit("elementDeselected", userId);
|
|
30866
|
+
return;
|
|
30867
|
+
}
|
|
30868
|
+
editor.show();
|
|
30869
|
+
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30870
|
+
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30871
|
+
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30872
|
+
return;
|
|
30873
|
+
}
|
|
30874
|
+
const elementModels = elements.map((id) => {
|
|
30875
|
+
return this.layers.get(targetLayerId).elementModels.get(id);
|
|
30876
|
+
}).filter((v) => !!v);
|
|
30877
|
+
editor.setTargets(elementModels);
|
|
30878
|
+
if (elementModels.length === 1) {
|
|
30879
|
+
let model = elementModels[0];
|
|
30880
|
+
if (model.item) {
|
|
30881
|
+
const topLeft = this.paperScope.project.view.projectToView(model.item.bounds.topLeft);
|
|
30882
|
+
const bottomRight = this.paperScope.project.view.projectToView(model.item.bounds.bottomRight);
|
|
30883
|
+
this.emitter.emit("elementSelected", userId, targetLayerId, model.uuid, model.getStyleKeys(), [topLeft.x, topLeft.y, bottomRight.x - topLeft.x, bottomRight.y - topLeft.y]);
|
|
30884
|
+
}
|
|
30885
|
+
}
|
|
30886
|
+
if (elementModels.length > 1) {
|
|
30887
|
+
this.emitter.emit("elementDeselected", userId);
|
|
30888
|
+
}
|
|
30889
|
+
});
|
|
30890
|
+
_defineProperty40(this, "onLinkTargetToolbarChange", (style) => {
|
|
30891
|
+
this.toolbarModel.currentTool = style.tool;
|
|
30892
|
+
this.toolbarModel.strokeColor = style.strokeColor;
|
|
30893
|
+
this.toolbarModel.fillColor = style.fillColor;
|
|
30894
|
+
this.toolbarModel.fontSize = style.fontSize;
|
|
30895
|
+
this.toolbarModel.fontFamily = style.fontFamily;
|
|
30896
|
+
this.toolbarModel.strokeWidth = style.strokeWidth;
|
|
30897
|
+
this.toolbarModel.dashArray = style.dashArray;
|
|
30898
|
+
});
|
|
30899
|
+
_defineProperty40(this, "onLinkTargetPermissionChange", (userId, flags) => {
|
|
30900
|
+
if (userId == this.userId) {
|
|
30901
|
+
flags.forEach((flag) => {
|
|
30902
|
+
this.permissions.addPermission(flag, this.userId);
|
|
30903
|
+
});
|
|
30904
|
+
}
|
|
30905
|
+
});
|
|
30906
|
+
_defineProperty40(this, "adjustByOutFrame", (frameWidth, frameHeight) => {
|
|
30907
|
+
if (this.option.width > 0 && this.option.height > 0) {
|
|
30908
|
+
const minWidth = Math.max(frameWidth, 10);
|
|
30909
|
+
const minHeight = Math.max(frameHeight, 10);
|
|
30910
|
+
let width = minWidth;
|
|
30911
|
+
let height = width * this.option.height / this.option.width;
|
|
30912
|
+
if (height > minHeight) {
|
|
30913
|
+
height = minHeight;
|
|
30914
|
+
width = height * this.option.width / this.option.height;
|
|
30915
|
+
}
|
|
30916
|
+
this.camera.updateInherentScale(width / this.option.width);
|
|
30917
|
+
this.paperScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30918
|
+
this.shadowScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30919
|
+
this.camera.triggerZoom();
|
|
30920
|
+
}
|
|
30921
|
+
});
|
|
30157
30922
|
requestAnimationFrameHook(this.paperScope);
|
|
30158
30923
|
requestAnimationFrameHook(this.shadowScope);
|
|
30159
30924
|
this.rootElement.setAttribute("data-forge-app", "whiteboard");
|
|
@@ -30164,7 +30929,9 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30164
30929
|
this.inputType = "pen";
|
|
30165
30930
|
this.emitter.emit("inputTypeChange", this.inputType);
|
|
30166
30931
|
}
|
|
30167
|
-
}, {
|
|
30932
|
+
}, {
|
|
30933
|
+
capture: true
|
|
30934
|
+
});
|
|
30168
30935
|
this.emitter = new Whiteboard(this.rootElement);
|
|
30169
30936
|
this.emitter.getElementAttribute = (layerId, elementId, attribute) => {
|
|
30170
30937
|
const layerModel = this.layers.get(layerId);
|
|
@@ -30214,13 +30981,23 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30214
30981
|
return this.userMap(targetId).get(WhiteboardKeys.currentPage);
|
|
30215
30982
|
};
|
|
30216
30983
|
this.emitter.setViewModeToFree = (userId) => {
|
|
30217
|
-
|
|
30984
|
+
if (that.disableViewModelUpdate) {
|
|
30985
|
+
console.warn("Operation failed. Perspective mode switching is disabled in the current environment.");
|
|
30986
|
+
log3("Operation failed. Perspective mode switching is disabled in the current environment.", {}, "warning");
|
|
30987
|
+
return;
|
|
30988
|
+
}
|
|
30989
|
+
const targetId = userId ? this.hasPermission(WhiteboardPermissionFlag.setOthersView) ? userId : null : this.userId;
|
|
30218
30990
|
if (targetId) {
|
|
30219
30991
|
this.userMap(targetId).set(WhiteboardKeys.cameraMode, "free");
|
|
30220
30992
|
}
|
|
30221
30993
|
};
|
|
30222
30994
|
this.emitter.setViewModeToFlow = (flowId, userId) => {
|
|
30223
|
-
|
|
30995
|
+
if (that.disableViewModelUpdate) {
|
|
30996
|
+
console.warn("Operation failed. Perspective mode switching is disabled in the current environment.");
|
|
30997
|
+
log3("Operation failed. Perspective mode switching is disabled in the current environment.", {}, "warning");
|
|
30998
|
+
return;
|
|
30999
|
+
}
|
|
31000
|
+
const targetId = userId ? this.hasPermission(WhiteboardPermissionFlag.setOthersView) ? userId : null : this.userId;
|
|
30224
31001
|
if (targetId && this.userManager.getUser(flowId)) {
|
|
30225
31002
|
this.userMap(targetId).set(WhiteboardKeys.cameraMode, flowId);
|
|
30226
31003
|
const flowPage = this.userMap(flowId).get(WhiteboardKeys.currentPage);
|
|
@@ -30230,7 +31007,12 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30230
31007
|
}
|
|
30231
31008
|
};
|
|
30232
31009
|
this.emitter.setViewModeToMain = (userId) => {
|
|
30233
|
-
|
|
31010
|
+
if (that.disableViewModelUpdate) {
|
|
31011
|
+
console.warn("Operation failed. Perspective mode switching is disabled in the current environment.");
|
|
31012
|
+
log3("Operation failed. Perspective mode switching is disabled in the current environment.", {}, "warning");
|
|
31013
|
+
return;
|
|
31014
|
+
}
|
|
31015
|
+
const targetId = userId ? this.hasPermission(WhiteboardPermissionFlag.setOthersView) ? userId : null : this.userId;
|
|
30234
31016
|
if (targetId) {
|
|
30235
31017
|
this.userMap(targetId).set(WhiteboardKeys.cameraMode, "main");
|
|
30236
31018
|
const mainPage = this.getMap("attrs").get(WhiteboardKeys.currentPage);
|
|
@@ -30297,8 +31079,9 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30297
31079
|
this.emitter.translateCamera = (offsetX, offsetY) => {
|
|
30298
31080
|
this.camera.translate(offsetX, offsetY);
|
|
30299
31081
|
};
|
|
30300
|
-
this.emitter.scaleCamera = (scale)
|
|
30301
|
-
|
|
31082
|
+
this.emitter.scaleCamera = function(scale) {
|
|
31083
|
+
let origin = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "center";
|
|
31084
|
+
_this.camera.scale(scale, origin);
|
|
30302
31085
|
};
|
|
30303
31086
|
this.emitter.resetCamera = () => {
|
|
30304
31087
|
this.camera.reset();
|
|
@@ -30398,14 +31181,10 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30398
31181
|
that.camera.enableBoundaryHighlight = value;
|
|
30399
31182
|
}
|
|
30400
31183
|
});
|
|
30401
|
-
window["__wb"] = this;
|
|
30402
31184
|
}
|
|
30403
31185
|
userMap(userId) {
|
|
30404
31186
|
return this.getMap(`user/${userId}`);
|
|
30405
31187
|
}
|
|
30406
|
-
enableToolEvent = () => {
|
|
30407
|
-
return !(this.inputType === "pen" && !this.isPenEvent);
|
|
30408
|
-
};
|
|
30409
31188
|
async initialize(option) {
|
|
30410
31189
|
this.permissions = new WhiteboardPermissions(this.userManager, (userId) => {
|
|
30411
31190
|
return this.userMap(userId);
|
|
@@ -30415,39 +31194,22 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30415
31194
|
this.option = option;
|
|
30416
31195
|
this.userMap(this.userId).set(WhiteboardKeys.themeColor, "#009688");
|
|
30417
31196
|
this.shadowEmitter = new ShadowEmitter(this.userMap(this.userId));
|
|
30418
|
-
this.pageModel = new PageModel(
|
|
30419
|
-
this.
|
|
30420
|
-
|
|
30421
|
-
(userId) => {
|
|
30422
|
-
return this.userMap(userId);
|
|
30423
|
-
},
|
|
30424
|
-
this.getMap("pages"),
|
|
30425
|
-
this.hasPermission
|
|
30426
|
-
);
|
|
31197
|
+
this.pageModel = new PageModel(this.getMap("attrs"), this.userManager, (userId) => {
|
|
31198
|
+
return this.userMap(userId);
|
|
31199
|
+
}, this.getMap("pages"), this.hasPermission);
|
|
30427
31200
|
this.pageModel.on("pagesChange", this.handleLayersChange);
|
|
30428
31201
|
this.pageModel.on("switchPage", this.handlePageSwitch);
|
|
30429
31202
|
if (option.maxScaleRatio && option.maxScaleRatio < 1 && option.maxScaleRatio !== -1) {
|
|
30430
31203
|
throw new Error(`[@netless/forge-whiteboard] invalid maxScaleRatio ${option.maxScaleRatio}`);
|
|
30431
31204
|
}
|
|
30432
|
-
this.camera = new Camera(
|
|
30433
|
-
|
|
30434
|
-
|
|
30435
|
-
this.
|
|
30436
|
-
|
|
30437
|
-
this.
|
|
30438
|
-
|
|
30439
|
-
|
|
30440
|
-
(userId) => {
|
|
30441
|
-
return this.userMap(userId);
|
|
30442
|
-
},
|
|
30443
|
-
() => {
|
|
30444
|
-
return [this.paperScope.project.view.size.width, this.paperScope.project.view.size.height];
|
|
30445
|
-
},
|
|
30446
|
-
() => {
|
|
30447
|
-
const rect = this.canvasElement.getBoundingClientRect();
|
|
30448
|
-
return [rect.width, rect.height];
|
|
30449
|
-
}
|
|
30450
|
-
);
|
|
31205
|
+
this.camera = new Camera(new this.paperScope.Size(option.width, option.height), option.maxScaleRatio ?? -1, this.rootElement, this.userManager, this.paperScope, this.getMap("attrs"), this.hasPermission, (userId) => {
|
|
31206
|
+
return this.userMap(userId);
|
|
31207
|
+
}, () => {
|
|
31208
|
+
return [this.paperScope.project.view.size.width, this.paperScope.project.view.size.height];
|
|
31209
|
+
}, () => {
|
|
31210
|
+
const rect = this.canvasElement.getBoundingClientRect();
|
|
31211
|
+
return [rect.width, rect.height];
|
|
31212
|
+
});
|
|
30451
31213
|
this.camera.on("zoom", (matrix) => {
|
|
30452
31214
|
this.paperScope.project.view.matrix = matrix;
|
|
30453
31215
|
this.shadowScope.project.view.matrix = matrix;
|
|
@@ -30513,6 +31275,7 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30513
31275
|
this.canvasElement.style.top = "50%";
|
|
30514
31276
|
this.canvasElement.style.left = "50%";
|
|
30515
31277
|
this.canvasElement.style.transform = "translate(-50%, -50%)";
|
|
31278
|
+
this.canvasElement.setAttribute("id", `${this.appId}-main`);
|
|
30516
31279
|
this.paperScope.setup(this.canvasElement);
|
|
30517
31280
|
this.paperScope.settings.insertItems = false;
|
|
30518
31281
|
this.shadowCanvasElement.style.position = "absolute";
|
|
@@ -30520,36 +31283,23 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30520
31283
|
this.shadowCanvasElement.style.left = "50%";
|
|
30521
31284
|
this.shadowCanvasElement.style.transform = "translate(-50%, -50%)";
|
|
30522
31285
|
this.shadowCanvasElement.style.pointerEvents = "none";
|
|
31286
|
+
this.shadowCanvasElement.setAttribute("id", `${this.appId}-shadow`);
|
|
30523
31287
|
this.rootElement.appendChild(this.shadowCanvasElement);
|
|
30524
31288
|
this.shadowScope.setup(this.shadowCanvasElement);
|
|
30525
31289
|
this.shadowScope.settings.insertItems = false;
|
|
31290
|
+
this.snapshotCanvasElement.setAttribute("id", `${this.appId}-snapshot`);
|
|
30526
31291
|
this.snapshotScope.setup(this.snapshotCanvasElement);
|
|
30527
31292
|
this.resizeObserver = new ResizeObserver(() => {
|
|
30528
|
-
|
|
30529
|
-
|
|
30530
|
-
|
|
30531
|
-
|
|
30532
|
-
let height = width * this.option.height / this.option.width;
|
|
30533
|
-
if (height > minHeight) {
|
|
30534
|
-
height = minHeight;
|
|
30535
|
-
width = height * this.option.width / this.option.height;
|
|
30536
|
-
}
|
|
30537
|
-
this.camera.updateInherentScale(width / this.option.width);
|
|
30538
|
-
this.paperScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30539
|
-
this.shadowScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30540
|
-
this.userMap(this.userId).set("viewSize", `${width}.${height}`);
|
|
30541
|
-
this.camera.triggerZoom();
|
|
31293
|
+
if (this.internalResizeObserver) {
|
|
31294
|
+
const rootBounds = this.rootElement.getBoundingClientRect();
|
|
31295
|
+
this.adjustByOutFrame(rootBounds.width, rootBounds.height);
|
|
31296
|
+
}
|
|
30542
31297
|
});
|
|
30543
31298
|
this.resizeObserver.observe(this.rootElement);
|
|
30544
31299
|
if (!this.getMap("attrs").has(WhiteboardKeys.currentPage)) {
|
|
30545
31300
|
this.getMap("attrs").set(WhiteboardKeys.currentPage, "_i_");
|
|
30546
31301
|
}
|
|
30547
|
-
this.emitter.indexedNavigation = new IndexedNavigation(
|
|
30548
|
-
this.pageModel,
|
|
30549
|
-
this.userMap(this.userId),
|
|
30550
|
-
this.getMap("indexedNavigation"),
|
|
30551
|
-
this.hasPermission
|
|
30552
|
-
);
|
|
31302
|
+
this.emitter.indexedNavigation = new IndexedNavigation(this.pageModel, this.userMap(this.userId), this.getMap("indexedNavigation"), this.hasPermission);
|
|
30553
31303
|
this.emitter.indexedNavigation.initIndexed().then((inited) => {
|
|
30554
31304
|
if (!inited) {
|
|
30555
31305
|
this.handleLayersChange(this.pageModel.pageList());
|
|
@@ -30619,91 +31369,6 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30619
31369
|
});
|
|
30620
31370
|
this.clearElements();
|
|
30621
31371
|
}
|
|
30622
|
-
handlePageSwitch = (pageId) => {
|
|
30623
|
-
for (const editor of this.editors.values()) {
|
|
30624
|
-
editor.hidden();
|
|
30625
|
-
}
|
|
30626
|
-
this.selectElementsModel.clearSelectElementForSelf();
|
|
30627
|
-
waitUntil(() => this.layers.has(pageId), 3e3).then(() => {
|
|
30628
|
-
if (this.layers.has(pageId)) {
|
|
30629
|
-
for (const entry of this.layers.entries()) {
|
|
30630
|
-
entry[1].off("elementInsert", this.handleElementInsert);
|
|
30631
|
-
entry[1].off("elementRemove", this.handleElementRemove);
|
|
30632
|
-
entry[1].off("elementClear", this.handleElementClear);
|
|
30633
|
-
}
|
|
30634
|
-
const renderableModel = this.layers.get(pageId);
|
|
30635
|
-
renderableModel.on("elementInsert", this.handleElementInsert);
|
|
30636
|
-
renderableModel.on("elementRemove", this.handleElementRemove);
|
|
30637
|
-
renderableModel.on("elementClear", this.handleElementClear);
|
|
30638
|
-
renderableModel.flushRenderables();
|
|
30639
|
-
const others = this.userManager.userIdList().filter((v) => v !== this.userId);
|
|
30640
|
-
for (const other of others) {
|
|
30641
|
-
if (this.userMap(other).get(WhiteboardKeys.currentPage) === pageId) {
|
|
30642
|
-
const elementIds = Array.from(this.userMap(other).get(WhiteboardKeys.selectElements).keys()).filter((v) => v !== "inner-map-id");
|
|
30643
|
-
if (elementIds.length > 0) {
|
|
30644
|
-
this.handleElementsSelect(other, elementIds);
|
|
30645
|
-
}
|
|
30646
|
-
}
|
|
30647
|
-
}
|
|
30648
|
-
}
|
|
30649
|
-
});
|
|
30650
|
-
waitUntil(() => this.undoManagers.has(pageId), 3e3).then(() => {
|
|
30651
|
-
if (this.undoManagers.has(pageId)) {
|
|
30652
|
-
for (const entry of this.undoManagers.entries()) {
|
|
30653
|
-
entry[1].off("stack-item-added", this.handleStackItemAdded);
|
|
30654
|
-
entry[1].off("stack-item-popped", this.handleStackItemPopped);
|
|
30655
|
-
}
|
|
30656
|
-
this.undoManagers.get(pageId).on("stack-item-added", this.handleStackItemAdded);
|
|
30657
|
-
this.undoManagers.get(pageId).on("stack-item-popped", this.handleStackItemPopped);
|
|
30658
|
-
}
|
|
30659
|
-
});
|
|
30660
|
-
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30661
|
-
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30662
|
-
};
|
|
30663
|
-
hasPermission = (flag) => {
|
|
30664
|
-
return this.permissions.hasPermission(flag, this.userId);
|
|
30665
|
-
};
|
|
30666
|
-
handleStackItemAdded = () => {
|
|
30667
|
-
this.selectElementsModel.clearSelectElementForSelf();
|
|
30668
|
-
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30669
|
-
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30670
|
-
};
|
|
30671
|
-
handleStackItemPopped = () => {
|
|
30672
|
-
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30673
|
-
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30674
|
-
};
|
|
30675
|
-
handleLayersChange = (ids) => {
|
|
30676
|
-
for (let i = 0, len = ids.length; i < len; i++) {
|
|
30677
|
-
const id = ids[i];
|
|
30678
|
-
if (!this.layers.has(id)) {
|
|
30679
|
-
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30680
|
-
const renderableModel = new RenderableModel(id, this.shadowEmitter, elementsMap, this.paperScope, this.toolbarModel, this.userManager, this.hasPermission);
|
|
30681
|
-
this.layers.set(id, renderableModel);
|
|
30682
|
-
}
|
|
30683
|
-
if (!this.undoManagers.has(id)) {
|
|
30684
|
-
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30685
|
-
const undoManager = new Y15.UndoManager(elementsMap, {
|
|
30686
|
-
trackedOrigins: /* @__PURE__ */ new Set([elementsUndoOrigin])
|
|
30687
|
-
});
|
|
30688
|
-
this.undoManagers.set(id, undoManager);
|
|
30689
|
-
}
|
|
30690
|
-
}
|
|
30691
|
-
for (let entry of this.layers.entries()) {
|
|
30692
|
-
if (ids.indexOf(entry[0]) < 0) {
|
|
30693
|
-
const renderableModel = this.layers.get(entry[0]);
|
|
30694
|
-
this.layers.delete(entry[0]);
|
|
30695
|
-
if (renderableModel) {
|
|
30696
|
-
renderableModel.dispose();
|
|
30697
|
-
}
|
|
30698
|
-
const cameraMode = this.userMap(this.userId).get(WhiteboardKeys.cameraMode);
|
|
30699
|
-
const currentPage = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30700
|
-
if (cameraMode === "free" && entry[0] === currentPage) {
|
|
30701
|
-
this.userMap(this.userId).set(WhiteboardKeys.cameraMode, "main");
|
|
30702
|
-
this.userMap(this.userId).set(WhiteboardKeys.currentPage, this.getMap("attrs").get(WhiteboardKeys.currentPage));
|
|
30703
|
-
}
|
|
30704
|
-
}
|
|
30705
|
-
}
|
|
30706
|
-
};
|
|
30707
31372
|
clearElements() {
|
|
30708
31373
|
const userIds = this.userManager.userIdList();
|
|
30709
31374
|
const isContinue = userIds.every((userId) => {
|
|
@@ -30720,16 +31385,6 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30720
31385
|
}
|
|
30721
31386
|
setTimeout(() => this.clearElements(), 1e4);
|
|
30722
31387
|
}
|
|
30723
|
-
getCurrentRenderableModel = () => {
|
|
30724
|
-
let layerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30725
|
-
if (!this.layers.has(layerId)) {
|
|
30726
|
-
this.emitter.emit("error", 300002, `target page: ${layerId} not found`);
|
|
30727
|
-
}
|
|
30728
|
-
return this.layers.get(layerId);
|
|
30729
|
-
};
|
|
30730
|
-
handleElementClear = () => {
|
|
30731
|
-
this.paperScope.project.activeLayer.removeChildren();
|
|
30732
|
-
};
|
|
30733
31388
|
findElementIndex(target, parent) {
|
|
30734
31389
|
const children = parent.children;
|
|
30735
31390
|
let left = 0;
|
|
@@ -30746,18 +31401,6 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30746
31401
|
}
|
|
30747
31402
|
return result;
|
|
30748
31403
|
}
|
|
30749
|
-
handleElementInsert = (elements) => {
|
|
30750
|
-
for (const element of elements) {
|
|
30751
|
-
element.createPaperElement();
|
|
30752
|
-
const scope = element.shadow === "" ? this.paperScope : this.shadowScope;
|
|
30753
|
-
const children = scope.project.activeLayer.children;
|
|
30754
|
-
const oldPaperElement = children.find((v) => v.data.uuid === element.uuid);
|
|
30755
|
-
if (oldPaperElement) {
|
|
30756
|
-
oldPaperElement.remove();
|
|
30757
|
-
}
|
|
30758
|
-
this.insertElementToParent(element.item, scope.project.activeLayer);
|
|
30759
|
-
}
|
|
30760
|
-
};
|
|
30761
31404
|
insertElementToParent(element, parent) {
|
|
30762
31405
|
const children = parent.children;
|
|
30763
31406
|
const at = this.findElementIndex(element.data.index, parent);
|
|
@@ -30769,84 +31412,6 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30769
31412
|
}
|
|
30770
31413
|
}
|
|
30771
31414
|
}
|
|
30772
|
-
handleElementRemove = (elementId, layerId) => {
|
|
30773
|
-
const layerModel = this.layers.get(layerId);
|
|
30774
|
-
if (!layerModel) {
|
|
30775
|
-
return;
|
|
30776
|
-
}
|
|
30777
|
-
const target = layerModel.elementModels.get(elementId);
|
|
30778
|
-
if (target && target.item) {
|
|
30779
|
-
target.item.remove();
|
|
30780
|
-
}
|
|
30781
|
-
layerModel.elementModels.delete(elementId);
|
|
30782
|
-
};
|
|
30783
|
-
handleRemoveTrashedElementForSelf = (userId, elementId) => {
|
|
30784
|
-
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30785
|
-
this.layers.get(selfLayerId)?.removeElementItem(elementId);
|
|
30786
|
-
};
|
|
30787
|
-
handleElementsTrash = (userId, elements) => {
|
|
30788
|
-
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30789
|
-
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30790
|
-
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30791
|
-
return;
|
|
30792
|
-
}
|
|
30793
|
-
elements.forEach((id) => {
|
|
30794
|
-
const paperItem = this.layers.get(targetLayerId).elementModels.get(id);
|
|
30795
|
-
if (paperItem && paperItem.item) {
|
|
30796
|
-
paperItem.item.opacity = 0.3;
|
|
30797
|
-
}
|
|
30798
|
-
});
|
|
30799
|
-
};
|
|
30800
|
-
handleElementsSelect = (userId, elements) => {
|
|
30801
|
-
if (!this.editors.has(userId)) {
|
|
30802
|
-
const ctrl = this.userManager.getUser(userId);
|
|
30803
|
-
const editor2 = new Editor(this.paperScope, this.shadowScope, this.shadowEmitter, this.canvasElement, this.camera, {
|
|
30804
|
-
viewerId: this.userId,
|
|
30805
|
-
ctrlId: userId,
|
|
30806
|
-
ctrlNickName: ctrl?.nickName ?? "",
|
|
30807
|
-
ctrlUserMap: this.userMap(userId)
|
|
30808
|
-
});
|
|
30809
|
-
editor2.on("clear", () => {
|
|
30810
|
-
this.selectElementsModel.clearSelectElementForSelf();
|
|
30811
|
-
});
|
|
30812
|
-
this.editors.set(userId, editor2);
|
|
30813
|
-
this.rootElement.appendChild(editor2.rootView);
|
|
30814
|
-
}
|
|
30815
|
-
const editor = this.editors.get(userId);
|
|
30816
|
-
if (elements.length === 0) {
|
|
30817
|
-
editor.hidden();
|
|
30818
|
-
this.emitter.emit("elementDeselected", userId);
|
|
30819
|
-
return;
|
|
30820
|
-
}
|
|
30821
|
-
editor.show();
|
|
30822
|
-
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30823
|
-
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30824
|
-
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30825
|
-
return;
|
|
30826
|
-
}
|
|
30827
|
-
const elementModels = elements.map((id) => {
|
|
30828
|
-
return this.layers.get(targetLayerId).elementModels.get(id);
|
|
30829
|
-
}).filter((v) => !!v);
|
|
30830
|
-
editor.setTargets(elementModels);
|
|
30831
|
-
if (elementModels.length === 1) {
|
|
30832
|
-
let model = elementModels[0];
|
|
30833
|
-
if (model.item) {
|
|
30834
|
-
const topLeft = this.paperScope.project.view.projectToView(model.item.bounds.topLeft);
|
|
30835
|
-
const bottomRight = this.paperScope.project.view.projectToView(model.item.bounds.bottomRight);
|
|
30836
|
-
this.emitter.emit(
|
|
30837
|
-
"elementSelected",
|
|
30838
|
-
userId,
|
|
30839
|
-
targetLayerId,
|
|
30840
|
-
model.uuid,
|
|
30841
|
-
model.getStyleKeys(),
|
|
30842
|
-
[topLeft.x, topLeft.y, bottomRight.x - topLeft.x, bottomRight.y - topLeft.y]
|
|
30843
|
-
);
|
|
30844
|
-
}
|
|
30845
|
-
}
|
|
30846
|
-
if (elementModels.length > 1) {
|
|
30847
|
-
this.emitter.emit("elementDeselected", userId);
|
|
30848
|
-
}
|
|
30849
|
-
};
|
|
30850
31415
|
ensureScale(outputWidth, outputHeight, originSize) {
|
|
30851
31416
|
return Math.min(outputWidth / originSize.width, outputHeight / originSize.height);
|
|
30852
31417
|
}
|
|
@@ -30879,7 +31444,9 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30879
31444
|
elementModel.createPaperElement();
|
|
30880
31445
|
}
|
|
30881
31446
|
if (elementModel.item) {
|
|
30882
|
-
const paperItem = elementModel.item.clone({
|
|
31447
|
+
const paperItem = elementModel.item.clone({
|
|
31448
|
+
insert: false
|
|
31449
|
+
});
|
|
30883
31450
|
this.snapshotScope.project.activeLayer.addChild(paperItem);
|
|
30884
31451
|
}
|
|
30885
31452
|
}
|
|
@@ -30889,7 +31456,10 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30889
31456
|
const scale2 = this.ensureScale(outputMaxWidth, outputMaxHeight, bounds.size);
|
|
30890
31457
|
const matrix = new this.paperScope.Matrix();
|
|
30891
31458
|
matrix.scale(scale2);
|
|
30892
|
-
matrix.translate({
|
|
31459
|
+
matrix.translate({
|
|
31460
|
+
x: -bounds.x,
|
|
31461
|
+
y: -bounds.y
|
|
31462
|
+
});
|
|
30893
31463
|
this.snapshotScope.view.viewSize = bounds.size.multiply(scale2);
|
|
30894
31464
|
this.snapshotScope.view.matrix = matrix;
|
|
30895
31465
|
} else if (area === "maxScale" && this.option.maxScaleRatio && this.option.maxScaleRatio !== -1) {
|
|
@@ -30899,7 +31469,10 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30899
31469
|
const offsetY = this.option.height * (this.option.maxScaleRatio - 1) / 2;
|
|
30900
31470
|
const matrix = new this.paperScope.Matrix();
|
|
30901
31471
|
matrix.scale(scale);
|
|
30902
|
-
matrix.translate({
|
|
31472
|
+
matrix.translate({
|
|
31473
|
+
x: offsetX,
|
|
31474
|
+
y: offsetY
|
|
31475
|
+
});
|
|
30903
31476
|
this.snapshotScope.view.viewSize = new this.snapshotScope.Size(width, height).multiply(scale);
|
|
30904
31477
|
this.snapshotScope.view.matrix = matrix;
|
|
30905
31478
|
} else {
|
|
@@ -30913,6 +31486,44 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30913
31486
|
}, 32);
|
|
30914
31487
|
});
|
|
30915
31488
|
}
|
|
31489
|
+
disableViewModel() {
|
|
31490
|
+
this.disableViewModelUpdate = true;
|
|
31491
|
+
}
|
|
31492
|
+
linkToWhiteboard(targetId) {
|
|
31493
|
+
console.log("linkToWhiteboard, linkToWhiteboard, linkToWhiteboard");
|
|
31494
|
+
if (this.linkTarget) {
|
|
31495
|
+
this.unlink();
|
|
31496
|
+
}
|
|
31497
|
+
this.linkTarget = this.applicationManager.getInstances(targetId);
|
|
31498
|
+
if (this.linkTarget) {
|
|
31499
|
+
this.linkTarget.toolbarModel.on("update", this.onLinkTargetToolbarChange);
|
|
31500
|
+
this.linkTarget.permissions.on("change", this.onLinkTargetPermissionChange);
|
|
31501
|
+
} else {
|
|
31502
|
+
throw new Error(`[@netless/forge-whiteboard] link target ${targetId} not found`);
|
|
31503
|
+
}
|
|
31504
|
+
}
|
|
31505
|
+
unlink() {
|
|
31506
|
+
if (this.linkTarget) {
|
|
31507
|
+
this.linkTarget.toolbarModel.off("update", this.onLinkTargetToolbarChange);
|
|
31508
|
+
this.linkTarget.permissions.off("change", this.onLinkTargetPermissionChange);
|
|
31509
|
+
}
|
|
31510
|
+
}
|
|
31511
|
+
setViewSize(width, height) {
|
|
31512
|
+
this.paperScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
31513
|
+
this.shadowScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
31514
|
+
}
|
|
31515
|
+
getViewSize() {
|
|
31516
|
+
const size = this.paperScope.view.viewSize;
|
|
31517
|
+
return [size.width, size.height];
|
|
31518
|
+
}
|
|
31519
|
+
updateInternalResizeObserverStatus(value) {
|
|
31520
|
+
this.internalResizeObserver = value;
|
|
31521
|
+
}
|
|
31522
|
+
updateOptionSize(width, height) {
|
|
31523
|
+
this.option.width = width;
|
|
31524
|
+
this.option.height = height;
|
|
31525
|
+
this.camera.updateInitSize(new import_paper.default.Size(width, height));
|
|
31526
|
+
}
|
|
30916
31527
|
async dispose() {
|
|
30917
31528
|
this.selectElementsModel.dispose();
|
|
30918
31529
|
this.trashedElementsModel.dispose();
|
|
@@ -30929,6 +31540,7 @@ var WhiteboardApplication = class extends AbstractApplication {
|
|
|
30929
31540
|
this.resizeObserver.disconnect();
|
|
30930
31541
|
}
|
|
30931
31542
|
};
|
|
31543
|
+
_defineProperty40(WhiteboardApplication, "applicationName", WHITEBOARD_APP_NAME);
|
|
30932
31544
|
export {
|
|
30933
31545
|
Whiteboard,
|
|
30934
31546
|
WhiteboardApplication,
|