@netless/forge-whiteboard 0.1.9 → 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/README.md +22 -21
- package/changelog.md +16 -5
- 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 +22 -6
- package/dist/Whiteboard.d.ts.map +1 -1
- package/dist/WhiteboardApplication.d.ts +15 -1
- 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 +2031 -1372
- package/dist/whiteboard.esm.js.map +3 -3
- package/dist/whiteboard.js +2031 -1372
- 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.js
CHANGED
|
@@ -25536,23 +25536,26 @@ var import_lodash = __toESM(require_lodash(), 1);
|
|
|
25536
25536
|
|
|
25537
25537
|
// src/model/renderable/ElementModel.ts
|
|
25538
25538
|
var Y = __toESM(require("yjs"), 1);
|
|
25539
|
+
function _defineProperty(e, r, t) {
|
|
25540
|
+
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25541
|
+
}
|
|
25542
|
+
function _toPropertyKey(t) {
|
|
25543
|
+
var i = _toPrimitive(t, "string");
|
|
25544
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25545
|
+
}
|
|
25546
|
+
function _toPrimitive(t, r) {
|
|
25547
|
+
if ("object" != typeof t || !t) return t;
|
|
25548
|
+
var e = t[Symbol.toPrimitive];
|
|
25549
|
+
if (void 0 !== e) {
|
|
25550
|
+
var i = e.call(t, r || "default");
|
|
25551
|
+
if ("object" != typeof i) return i;
|
|
25552
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25553
|
+
}
|
|
25554
|
+
return ("string" === r ? String : Number)(t);
|
|
25555
|
+
}
|
|
25539
25556
|
var ElementModel = class _ElementModel {
|
|
25540
|
-
|
|
25541
|
-
|
|
25542
|
-
uuid: "uuid",
|
|
25543
|
-
strokeWidth: "strokeWidth",
|
|
25544
|
-
strokeColor: "strokeColor",
|
|
25545
|
-
fillColor: "fillColor",
|
|
25546
|
-
dashArray: "dashArray",
|
|
25547
|
-
pointsMatrix: "pointsMatrix",
|
|
25548
|
-
points: "points",
|
|
25549
|
-
ownerId: "ownerId",
|
|
25550
|
-
ctrlId: "ctrlId",
|
|
25551
|
-
shadow: "shadow"
|
|
25552
|
-
};
|
|
25553
|
-
shadowEmitter = null;
|
|
25554
|
-
root;
|
|
25555
|
-
scope;
|
|
25557
|
+
// 矢量数据发生变化后调用
|
|
25558
|
+
// 哪些属性变化后需要调用 onVectorUpdate
|
|
25556
25559
|
get index() {
|
|
25557
25560
|
return this.root.get(_ElementModel.KEYS.index);
|
|
25558
25561
|
}
|
|
@@ -25614,6 +25617,49 @@ var ElementModel = class _ElementModel {
|
|
|
25614
25617
|
this.root.set(_ElementModel.KEYS.shadow, value);
|
|
25615
25618
|
}
|
|
25616
25619
|
constructor(root, scope) {
|
|
25620
|
+
_defineProperty(this, "shadowEmitter", null);
|
|
25621
|
+
_defineProperty(this, "root", void 0);
|
|
25622
|
+
_defineProperty(this, "scope", void 0);
|
|
25623
|
+
_defineProperty(this, "item", void 0);
|
|
25624
|
+
_defineProperty(this, "handlePropChange", (events) => {
|
|
25625
|
+
if (!this.item) {
|
|
25626
|
+
return;
|
|
25627
|
+
}
|
|
25628
|
+
for (const event of events) {
|
|
25629
|
+
if (event.target === this.root) {
|
|
25630
|
+
const updatePaperItemKeys = this.vectorKeys().concat([_ElementModel.KEYS.pointsMatrix]);
|
|
25631
|
+
for (const [key, value] of event.changes.keys.entries()) {
|
|
25632
|
+
if (value.action === "update") {
|
|
25633
|
+
const includeKeys = this.styleKeys().include;
|
|
25634
|
+
if (includeKeys.indexOf(key) >= 0) {
|
|
25635
|
+
this.onStyleKeyUpdate(key);
|
|
25636
|
+
return;
|
|
25637
|
+
}
|
|
25638
|
+
if (updatePaperItemKeys.indexOf(key) >= 0) {
|
|
25639
|
+
this.onVectorUpdate();
|
|
25640
|
+
} else if (key === _ElementModel.KEYS.strokeColor) {
|
|
25641
|
+
this.item.strokeColor = new this.scope.Color(this.strokeColor);
|
|
25642
|
+
} else if (key === _ElementModel.KEYS.fillColor && this.fillColor) {
|
|
25643
|
+
this.item.fillColor = new this.scope.Color(this.fillColor);
|
|
25644
|
+
} else if (key === _ElementModel.KEYS.strokeWidth) {
|
|
25645
|
+
this.item.strokeWidth = this.strokeWidth;
|
|
25646
|
+
} else if (key === _ElementModel.KEYS.dashArray) {
|
|
25647
|
+
this.item.dashArray = this.dashArray;
|
|
25648
|
+
} else if (key === _ElementModel.KEYS.shadow) {
|
|
25649
|
+
if (this.shadow !== "") {
|
|
25650
|
+
this.shadowEmitter?.emit("translateIn", [this.uuid], this.shadow);
|
|
25651
|
+
} else {
|
|
25652
|
+
this.shadowEmitter?.emit("translateOut", [this.uuid], value.oldValue);
|
|
25653
|
+
}
|
|
25654
|
+
}
|
|
25655
|
+
}
|
|
25656
|
+
}
|
|
25657
|
+
} else if (event.target === this.root.get(_ElementModel.KEYS.points)) {
|
|
25658
|
+
this.onVectorUpdate();
|
|
25659
|
+
} else {
|
|
25660
|
+
}
|
|
25661
|
+
}
|
|
25662
|
+
});
|
|
25617
25663
|
this.scope = scope;
|
|
25618
25664
|
this.root = root;
|
|
25619
25665
|
if (!this.root.has(_ElementModel.KEYS.pointsMatrix)) {
|
|
@@ -25621,45 +25667,6 @@ var ElementModel = class _ElementModel {
|
|
|
25621
25667
|
}
|
|
25622
25668
|
this.root.observeDeep(this.handlePropChange);
|
|
25623
25669
|
}
|
|
25624
|
-
handlePropChange = (events) => {
|
|
25625
|
-
if (!this.item) {
|
|
25626
|
-
return;
|
|
25627
|
-
}
|
|
25628
|
-
for (const event of events) {
|
|
25629
|
-
if (event.target === this.root) {
|
|
25630
|
-
const updatePaperItemKeys = this.vectorKeys().concat([_ElementModel.KEYS.pointsMatrix]);
|
|
25631
|
-
for (const [key, value] of event.changes.keys.entries()) {
|
|
25632
|
-
if (value.action === "update") {
|
|
25633
|
-
const includeKeys = this.styleKeys().include;
|
|
25634
|
-
if (includeKeys.indexOf(key) >= 0) {
|
|
25635
|
-
this.onStyleKeyUpdate(key);
|
|
25636
|
-
return;
|
|
25637
|
-
}
|
|
25638
|
-
if (updatePaperItemKeys.indexOf(key) >= 0) {
|
|
25639
|
-
this.onVectorUpdate();
|
|
25640
|
-
} else if (key === _ElementModel.KEYS.strokeColor) {
|
|
25641
|
-
this.item.strokeColor = new this.scope.Color(this.strokeColor);
|
|
25642
|
-
} else if (key === _ElementModel.KEYS.fillColor) {
|
|
25643
|
-
this.item.fillColor = new this.scope.Color(this.fillColor);
|
|
25644
|
-
} else if (key === _ElementModel.KEYS.strokeWidth) {
|
|
25645
|
-
this.item.strokeWidth = this.strokeWidth;
|
|
25646
|
-
} else if (key === _ElementModel.KEYS.dashArray) {
|
|
25647
|
-
this.item.dashArray = this.dashArray;
|
|
25648
|
-
} else if (key === _ElementModel.KEYS.shadow) {
|
|
25649
|
-
if (this.shadow !== "") {
|
|
25650
|
-
this.shadowEmitter?.emit("translateIn", [this.uuid], this.shadow);
|
|
25651
|
-
} else {
|
|
25652
|
-
this.shadowEmitter?.emit("translateOut", [this.uuid], value.oldValue);
|
|
25653
|
-
}
|
|
25654
|
-
}
|
|
25655
|
-
}
|
|
25656
|
-
}
|
|
25657
|
-
} else if (event.target === this.root.get(_ElementModel.KEYS.points)) {
|
|
25658
|
-
this.onVectorUpdate();
|
|
25659
|
-
} else {
|
|
25660
|
-
}
|
|
25661
|
-
}
|
|
25662
|
-
};
|
|
25663
25670
|
createPaperElement() {
|
|
25664
25671
|
this.createPaperItem();
|
|
25665
25672
|
if (this.item) {
|
|
@@ -25712,16 +25719,45 @@ var ElementModel = class _ElementModel {
|
|
|
25712
25719
|
return Array.from(new Set(["dashArray", "strokeColor", "fillColor", "strokeWidth"].filter((v) => ext.exclude.indexOf(v) < 0).concat(ext.include)));
|
|
25713
25720
|
}
|
|
25714
25721
|
};
|
|
25722
|
+
_defineProperty(ElementModel, "KEYS", {
|
|
25723
|
+
index: "index",
|
|
25724
|
+
uuid: "uuid",
|
|
25725
|
+
strokeWidth: "strokeWidth",
|
|
25726
|
+
strokeColor: "strokeColor",
|
|
25727
|
+
fillColor: "fillColor",
|
|
25728
|
+
dashArray: "dashArray",
|
|
25729
|
+
pointsMatrix: "pointsMatrix",
|
|
25730
|
+
points: "points",
|
|
25731
|
+
ownerId: "ownerId",
|
|
25732
|
+
ctrlId: "ctrlId",
|
|
25733
|
+
shadow: "shadow"
|
|
25734
|
+
});
|
|
25715
25735
|
|
|
25716
25736
|
// src/edit/EditorConfig.ts
|
|
25737
|
+
function _defineProperty2(e, r, t) {
|
|
25738
|
+
return (r = _toPropertyKey2(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25739
|
+
}
|
|
25740
|
+
function _toPropertyKey2(t) {
|
|
25741
|
+
var i = _toPrimitive2(t, "string");
|
|
25742
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25743
|
+
}
|
|
25744
|
+
function _toPrimitive2(t, r) {
|
|
25745
|
+
if ("object" != typeof t || !t) return t;
|
|
25746
|
+
var e = t[Symbol.toPrimitive];
|
|
25747
|
+
if (void 0 !== e) {
|
|
25748
|
+
var i = e.call(t, r || "default");
|
|
25749
|
+
if ("object" != typeof i) return i;
|
|
25750
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25751
|
+
}
|
|
25752
|
+
return ("string" === r ? String : Number)(t);
|
|
25753
|
+
}
|
|
25717
25754
|
var RESIZE_MODEL_LEVEL = ["horizontal", "four-corner", "four", "eight"];
|
|
25718
25755
|
var EditorConfig = class _EditorConfig {
|
|
25719
|
-
|
|
25720
|
-
|
|
25721
|
-
|
|
25722
|
-
|
|
25723
|
-
|
|
25724
|
-
controlPoints = [];
|
|
25756
|
+
constructor() {
|
|
25757
|
+
_defineProperty2(this, "resizeModel", () => "eight");
|
|
25758
|
+
_defineProperty2(this, "uniformScale", () => false);
|
|
25759
|
+
_defineProperty2(this, "controlPoints", []);
|
|
25760
|
+
}
|
|
25725
25761
|
merge(other) {
|
|
25726
25762
|
const next = new _EditorConfig();
|
|
25727
25763
|
const i = RESIZE_MODEL_LEVEL.findIndex((v) => v === this.resizeModel());
|
|
@@ -25734,10 +25770,27 @@ var EditorConfig = class _EditorConfig {
|
|
|
25734
25770
|
};
|
|
25735
25771
|
|
|
25736
25772
|
// src/model/renderable/CurveModel.ts
|
|
25773
|
+
function _defineProperty3(e, r, t) {
|
|
25774
|
+
return (r = _toPropertyKey3(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25775
|
+
}
|
|
25776
|
+
function _toPropertyKey3(t) {
|
|
25777
|
+
var i = _toPrimitive3(t, "string");
|
|
25778
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25779
|
+
}
|
|
25780
|
+
function _toPrimitive3(t, r) {
|
|
25781
|
+
if ("object" != typeof t || !t) return t;
|
|
25782
|
+
var e = t[Symbol.toPrimitive];
|
|
25783
|
+
if (void 0 !== e) {
|
|
25784
|
+
var i = e.call(t, r || "default");
|
|
25785
|
+
if ("object" != typeof i) return i;
|
|
25786
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25787
|
+
}
|
|
25788
|
+
return ("string" === r ? String : Number)(t);
|
|
25789
|
+
}
|
|
25737
25790
|
var CurveModel = class extends ElementModel {
|
|
25738
|
-
item = null;
|
|
25739
25791
|
constructor(root, scope) {
|
|
25740
25792
|
super(root, scope);
|
|
25793
|
+
_defineProperty3(this, "item", null);
|
|
25741
25794
|
if (!this.root.has("type")) {
|
|
25742
25795
|
this.root.set("type", "curve");
|
|
25743
25796
|
}
|
|
@@ -25768,7 +25821,10 @@ var CurveModel = class extends ElementModel {
|
|
|
25768
25821
|
}
|
|
25769
25822
|
matrixedPoints() {
|
|
25770
25823
|
const groupPoints = (0, import_lodash.chunk)(this.points, 2);
|
|
25771
|
-
return groupPoints.map((
|
|
25824
|
+
return groupPoints.map((_ref) => {
|
|
25825
|
+
let [x, y] = _ref;
|
|
25826
|
+
return new this.scope.Point(x, y);
|
|
25827
|
+
}).map((p) => p.transform(new this.scope.Matrix(this.pointsMatrix))).reduce((result, next) => {
|
|
25772
25828
|
result.push(next.x);
|
|
25773
25829
|
result.push(next.y);
|
|
25774
25830
|
return result;
|
|
@@ -25846,10 +25902,27 @@ var CurveModel = class extends ElementModel {
|
|
|
25846
25902
|
|
|
25847
25903
|
// src/model/renderable/SelectorModel.ts
|
|
25848
25904
|
var Y3 = __toESM(require("yjs"), 1);
|
|
25905
|
+
function _defineProperty4(e, r, t) {
|
|
25906
|
+
return (r = _toPropertyKey4(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25907
|
+
}
|
|
25908
|
+
function _toPropertyKey4(t) {
|
|
25909
|
+
var i = _toPrimitive4(t, "string");
|
|
25910
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25911
|
+
}
|
|
25912
|
+
function _toPrimitive4(t, r) {
|
|
25913
|
+
if ("object" != typeof t || !t) return t;
|
|
25914
|
+
var e = t[Symbol.toPrimitive];
|
|
25915
|
+
if (void 0 !== e) {
|
|
25916
|
+
var i = e.call(t, r || "default");
|
|
25917
|
+
if ("object" != typeof i) return i;
|
|
25918
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25919
|
+
}
|
|
25920
|
+
return ("string" === r ? String : Number)(t);
|
|
25921
|
+
}
|
|
25849
25922
|
var SelectorModel = class extends ElementModel {
|
|
25850
|
-
item = null;
|
|
25851
25923
|
constructor(root, scope) {
|
|
25852
25924
|
super(root, scope);
|
|
25925
|
+
_defineProperty4(this, "item", null);
|
|
25853
25926
|
if (!this.root.has("type")) {
|
|
25854
25927
|
this.root.set("type", "selector");
|
|
25855
25928
|
}
|
|
@@ -25861,10 +25934,7 @@ var SelectorModel = class extends ElementModel {
|
|
|
25861
25934
|
}
|
|
25862
25935
|
createPaperRect() {
|
|
25863
25936
|
const scope = this.scope;
|
|
25864
|
-
const bounds = new scope.Rectangle(
|
|
25865
|
-
new scope.Point(this.points[0], this.points[1]),
|
|
25866
|
-
new scope.Size(this.points[2], this.points[3])
|
|
25867
|
-
);
|
|
25937
|
+
const bounds = new scope.Rectangle(new scope.Point(this.points[0], this.points[1]), new scope.Size(this.points[2], this.points[3]));
|
|
25868
25938
|
return new scope.Path.Rectangle(
|
|
25869
25939
|
bounds,
|
|
25870
25940
|
new scope.Point(this.points[4], this.points[4])
|
|
@@ -25904,22 +25974,28 @@ var Y4 = __toESM(require("yjs"), 1);
|
|
|
25904
25974
|
|
|
25905
25975
|
// src/utils/paperjs.ts
|
|
25906
25976
|
var import_lodash2 = __toESM(require_lodash(), 1);
|
|
25977
|
+
function _defineProperty5(e, r, t) {
|
|
25978
|
+
return (r = _toPropertyKey5(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
25979
|
+
}
|
|
25980
|
+
function _toPropertyKey5(t) {
|
|
25981
|
+
var i = _toPrimitive5(t, "string");
|
|
25982
|
+
return "symbol" == typeof i ? i : i + "";
|
|
25983
|
+
}
|
|
25984
|
+
function _toPrimitive5(t, r) {
|
|
25985
|
+
if ("object" != typeof t || !t) return t;
|
|
25986
|
+
var e = t[Symbol.toPrimitive];
|
|
25987
|
+
if (void 0 !== e) {
|
|
25988
|
+
var i = e.call(t, r || "default");
|
|
25989
|
+
if ("object" != typeof i) return i;
|
|
25990
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
25991
|
+
}
|
|
25992
|
+
return ("string" === r ? String : Number)(t);
|
|
25993
|
+
}
|
|
25907
25994
|
function serializeSegment(segment) {
|
|
25908
|
-
return [
|
|
25909
|
-
segment.point.x,
|
|
25910
|
-
segment.point.y,
|
|
25911
|
-
segment.handleIn.x,
|
|
25912
|
-
segment.handleIn.y,
|
|
25913
|
-
segment.handleOut.x,
|
|
25914
|
-
segment.handleOut.y
|
|
25915
|
-
];
|
|
25995
|
+
return [segment.point.x, segment.point.y, segment.handleIn.x, segment.handleIn.y, segment.handleOut.x, segment.handleOut.y];
|
|
25916
25996
|
}
|
|
25917
25997
|
function deserializeSegment(points, scope, matrix) {
|
|
25918
|
-
const segment = new scope.Segment(
|
|
25919
|
-
new scope.Point(points[0], points[1]),
|
|
25920
|
-
new scope.Point(points[2], points[3]),
|
|
25921
|
-
new scope.Point(points[4], points[5])
|
|
25922
|
-
);
|
|
25998
|
+
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]));
|
|
25923
25999
|
segment.transform(matrix);
|
|
25924
26000
|
return segment;
|
|
25925
26001
|
}
|
|
@@ -25936,29 +26012,29 @@ function deserializePath(points, scope, matrix) {
|
|
|
25936
26012
|
return path;
|
|
25937
26013
|
}
|
|
25938
26014
|
var AnimationFrame = class {
|
|
25939
|
-
callbacks = [];
|
|
25940
|
-
lastTime = 0;
|
|
25941
|
-
fps = 45;
|
|
25942
26015
|
constructor() {
|
|
26016
|
+
_defineProperty5(this, "callbacks", []);
|
|
26017
|
+
_defineProperty5(this, "lastTime", 0);
|
|
26018
|
+
_defineProperty5(this, "fps", 45);
|
|
26019
|
+
_defineProperty5(this, "handleCallbacks", () => {
|
|
26020
|
+
let functions = this.callbacks;
|
|
26021
|
+
this.callbacks = [];
|
|
26022
|
+
for (let i = 0, l2 = functions.length; i < l2; i++) {
|
|
26023
|
+
functions[i]();
|
|
26024
|
+
}
|
|
26025
|
+
});
|
|
26026
|
+
_defineProperty5(this, "addCallback", (callback) => {
|
|
26027
|
+
this.callbacks.push(callback);
|
|
26028
|
+
});
|
|
26029
|
+
_defineProperty5(this, "handleFrame", (time) => {
|
|
26030
|
+
if (time - this.lastTime > 1e3 / this.fps) {
|
|
26031
|
+
this.handleCallbacks();
|
|
26032
|
+
this.lastTime = time;
|
|
26033
|
+
}
|
|
26034
|
+
window.requestAnimationFrame(this.handleFrame);
|
|
26035
|
+
});
|
|
25943
26036
|
window.requestAnimationFrame(this.handleFrame);
|
|
25944
26037
|
}
|
|
25945
|
-
handleCallbacks = () => {
|
|
25946
|
-
let functions = this.callbacks;
|
|
25947
|
-
this.callbacks = [];
|
|
25948
|
-
for (let i = 0, l2 = functions.length; i < l2; i++) {
|
|
25949
|
-
functions[i]();
|
|
25950
|
-
}
|
|
25951
|
-
};
|
|
25952
|
-
addCallback = (callback) => {
|
|
25953
|
-
this.callbacks.push(callback);
|
|
25954
|
-
};
|
|
25955
|
-
handleFrame = (time) => {
|
|
25956
|
-
if (time - this.lastTime > 1e3 / this.fps) {
|
|
25957
|
-
this.handleCallbacks();
|
|
25958
|
-
this.lastTime = time;
|
|
25959
|
-
}
|
|
25960
|
-
window.requestAnimationFrame(this.handleFrame);
|
|
25961
|
-
};
|
|
25962
26038
|
};
|
|
25963
26039
|
function requestAnimationFrameHook(scope) {
|
|
25964
26040
|
const animationFrame = new AnimationFrame();
|
|
@@ -25966,10 +26042,27 @@ function requestAnimationFrameHook(scope) {
|
|
|
25966
26042
|
}
|
|
25967
26043
|
|
|
25968
26044
|
// src/model/renderable/SegmentsModel.ts
|
|
26045
|
+
function _defineProperty6(e, r, t) {
|
|
26046
|
+
return (r = _toPropertyKey6(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26047
|
+
}
|
|
26048
|
+
function _toPropertyKey6(t) {
|
|
26049
|
+
var i = _toPrimitive6(t, "string");
|
|
26050
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26051
|
+
}
|
|
26052
|
+
function _toPrimitive6(t, r) {
|
|
26053
|
+
if ("object" != typeof t || !t) return t;
|
|
26054
|
+
var e = t[Symbol.toPrimitive];
|
|
26055
|
+
if (void 0 !== e) {
|
|
26056
|
+
var i = e.call(t, r || "default");
|
|
26057
|
+
if ("object" != typeof i) return i;
|
|
26058
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26059
|
+
}
|
|
26060
|
+
return ("string" === r ? String : Number)(t);
|
|
26061
|
+
}
|
|
25969
26062
|
var SegmentsModel = class extends ElementModel {
|
|
25970
|
-
item = null;
|
|
25971
26063
|
constructor(root, scope, type) {
|
|
25972
26064
|
super(root, scope);
|
|
26065
|
+
_defineProperty6(this, "item", null);
|
|
25973
26066
|
if (!this.root.has("type")) {
|
|
25974
26067
|
this.root.set("type", type);
|
|
25975
26068
|
}
|
|
@@ -26020,14 +26113,52 @@ var Y5 = __toESM(require("yjs"), 1);
|
|
|
26020
26113
|
var import_lodash4 = __toESM(require_lodash(), 1);
|
|
26021
26114
|
|
|
26022
26115
|
// src/tool/WhiteboardTool.ts
|
|
26116
|
+
function _defineProperty7(e, r, t) {
|
|
26117
|
+
return (r = _toPropertyKey7(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26118
|
+
}
|
|
26119
|
+
function _toPropertyKey7(t) {
|
|
26120
|
+
var i = _toPrimitive7(t, "string");
|
|
26121
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26122
|
+
}
|
|
26123
|
+
function _toPrimitive7(t, r) {
|
|
26124
|
+
if ("object" != typeof t || !t) return t;
|
|
26125
|
+
var e = t[Symbol.toPrimitive];
|
|
26126
|
+
if (void 0 !== e) {
|
|
26127
|
+
var i = e.call(t, r || "default");
|
|
26128
|
+
if ("object" != typeof i) return i;
|
|
26129
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26130
|
+
}
|
|
26131
|
+
return ("string" === r ? String : Number)(t);
|
|
26132
|
+
}
|
|
26023
26133
|
var WhiteboardTool = class {
|
|
26024
|
-
modelGetter;
|
|
26025
|
-
scope;
|
|
26026
|
-
tool;
|
|
26027
|
-
shadowEmitter;
|
|
26028
|
-
enableToolEvent;
|
|
26029
|
-
eventAvailable = false;
|
|
26030
26134
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
26135
|
+
_defineProperty7(this, "modelGetter", void 0);
|
|
26136
|
+
_defineProperty7(this, "scope", void 0);
|
|
26137
|
+
_defineProperty7(this, "tool", void 0);
|
|
26138
|
+
_defineProperty7(this, "shadowEmitter", void 0);
|
|
26139
|
+
_defineProperty7(this, "enableToolEvent", void 0);
|
|
26140
|
+
_defineProperty7(this, "eventAvailable", false);
|
|
26141
|
+
_defineProperty7(this, "onMouseDownSelf", (event) => {
|
|
26142
|
+
this.eventAvailable = this.enableToolEvent();
|
|
26143
|
+
if (!this.eventAvailable) {
|
|
26144
|
+
return;
|
|
26145
|
+
}
|
|
26146
|
+
this.shadowEmitter.setActive(true);
|
|
26147
|
+
this.onMouseDown(event);
|
|
26148
|
+
});
|
|
26149
|
+
_defineProperty7(this, "onMouseDragSelf", (event) => {
|
|
26150
|
+
if (!this.eventAvailable) {
|
|
26151
|
+
return;
|
|
26152
|
+
}
|
|
26153
|
+
this.onMouseDrag(event);
|
|
26154
|
+
});
|
|
26155
|
+
_defineProperty7(this, "onMouseUpSelf", (event) => {
|
|
26156
|
+
if (!this.eventAvailable) {
|
|
26157
|
+
return;
|
|
26158
|
+
}
|
|
26159
|
+
this.onMouseUp(event);
|
|
26160
|
+
this.shadowEmitter.setActive(false);
|
|
26161
|
+
});
|
|
26031
26162
|
this.modelGetter = modelGetter;
|
|
26032
26163
|
this.enableToolEvent = enableToolEvent;
|
|
26033
26164
|
this.scope = scope;
|
|
@@ -26037,37 +26168,33 @@ var WhiteboardTool = class {
|
|
|
26037
26168
|
this.tool.onMouseDrag = this.onMouseDragSelf;
|
|
26038
26169
|
this.tool.onMouseUp = this.onMouseUpSelf;
|
|
26039
26170
|
}
|
|
26040
|
-
onMouseDownSelf = (event) => {
|
|
26041
|
-
this.eventAvailable = this.enableToolEvent();
|
|
26042
|
-
if (!this.eventAvailable) {
|
|
26043
|
-
return;
|
|
26044
|
-
}
|
|
26045
|
-
this.shadowEmitter.setActive(true);
|
|
26046
|
-
this.onMouseDown(event);
|
|
26047
|
-
};
|
|
26048
|
-
onMouseDragSelf = (event) => {
|
|
26049
|
-
if (!this.eventAvailable) {
|
|
26050
|
-
return;
|
|
26051
|
-
}
|
|
26052
|
-
this.onMouseDrag(event);
|
|
26053
|
-
};
|
|
26054
|
-
onMouseUpSelf = (event) => {
|
|
26055
|
-
if (!this.eventAvailable) {
|
|
26056
|
-
return;
|
|
26057
|
-
}
|
|
26058
|
-
this.onMouseUp(event);
|
|
26059
|
-
this.shadowEmitter.setActive(false);
|
|
26060
|
-
};
|
|
26061
26171
|
};
|
|
26062
26172
|
|
|
26063
26173
|
// src/tool/LineTool.ts
|
|
26064
26174
|
var import_lodash3 = __toESM(require_lodash(), 1);
|
|
26175
|
+
function _defineProperty8(e, r, t) {
|
|
26176
|
+
return (r = _toPropertyKey8(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26177
|
+
}
|
|
26178
|
+
function _toPropertyKey8(t) {
|
|
26179
|
+
var i = _toPrimitive8(t, "string");
|
|
26180
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26181
|
+
}
|
|
26182
|
+
function _toPrimitive8(t, r) {
|
|
26183
|
+
if ("object" != typeof t || !t) return t;
|
|
26184
|
+
var e = t[Symbol.toPrimitive];
|
|
26185
|
+
if (void 0 !== e) {
|
|
26186
|
+
var i = e.call(t, r || "default");
|
|
26187
|
+
if ("object" != typeof i) return i;
|
|
26188
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26189
|
+
}
|
|
26190
|
+
return ("string" === r ? String : Number)(t);
|
|
26191
|
+
}
|
|
26065
26192
|
var LineTool = class extends WhiteboardTool {
|
|
26066
|
-
elementModel = null;
|
|
26067
|
-
from = null;
|
|
26068
|
-
to = null;
|
|
26069
26193
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
26070
26194
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
26195
|
+
_defineProperty8(this, "elementModel", null);
|
|
26196
|
+
_defineProperty8(this, "from", null);
|
|
26197
|
+
_defineProperty8(this, "to", null);
|
|
26071
26198
|
this.tool.minDistance = 1;
|
|
26072
26199
|
}
|
|
26073
26200
|
onMouseDown(event) {
|
|
@@ -26096,9 +26223,24 @@ var LineTool = class extends WhiteboardTool {
|
|
|
26096
26223
|
var MAX_LINE_POINTS = 5;
|
|
26097
26224
|
|
|
26098
26225
|
// src/model/renderable/LineModel.ts
|
|
26226
|
+
function _defineProperty9(e, r, t) {
|
|
26227
|
+
return (r = _toPropertyKey9(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26228
|
+
}
|
|
26229
|
+
function _toPropertyKey9(t) {
|
|
26230
|
+
var i = _toPrimitive9(t, "string");
|
|
26231
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26232
|
+
}
|
|
26233
|
+
function _toPrimitive9(t, r) {
|
|
26234
|
+
if ("object" != typeof t || !t) return t;
|
|
26235
|
+
var e = t[Symbol.toPrimitive];
|
|
26236
|
+
if (void 0 !== e) {
|
|
26237
|
+
var i = e.call(t, r || "default");
|
|
26238
|
+
if ("object" != typeof i) return i;
|
|
26239
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26240
|
+
}
|
|
26241
|
+
return ("string" === r ? String : Number)(t);
|
|
26242
|
+
}
|
|
26099
26243
|
var LineModel = class extends ElementModel {
|
|
26100
|
-
controlledPoints = [];
|
|
26101
|
-
item = null;
|
|
26102
26244
|
get arrowSize() {
|
|
26103
26245
|
return this.strokeWidth * 5 + 15;
|
|
26104
26246
|
}
|
|
@@ -26116,6 +26258,8 @@ var LineModel = class extends ElementModel {
|
|
|
26116
26258
|
}
|
|
26117
26259
|
constructor(root, scope) {
|
|
26118
26260
|
super(root, scope);
|
|
26261
|
+
_defineProperty9(this, "controlledPoints", []);
|
|
26262
|
+
_defineProperty9(this, "item", null);
|
|
26119
26263
|
if (!this.root.has("type")) {
|
|
26120
26264
|
this.root.set("type", "arrow");
|
|
26121
26265
|
}
|
|
@@ -26199,7 +26343,10 @@ var LineModel = class extends ElementModel {
|
|
|
26199
26343
|
cfg.resizeModel = () => "horizontal";
|
|
26200
26344
|
if (this.controlledPoints.length === 0) {
|
|
26201
26345
|
this.controlledPoints.push(...new Array(MAX_LINE_POINTS).fill(0).map((_, index) => {
|
|
26202
|
-
return new LineControlPoint(`line-${index}`, this, {
|
|
26346
|
+
return new LineControlPoint(`line-${index}`, this, {
|
|
26347
|
+
index,
|
|
26348
|
+
total: MAX_LINE_POINTS
|
|
26349
|
+
}, this.scope);
|
|
26203
26350
|
}));
|
|
26204
26351
|
cfg.controlPoints = this.controlledPoints;
|
|
26205
26352
|
} else {
|
|
@@ -26221,12 +26368,12 @@ var LineModel = class extends ElementModel {
|
|
|
26221
26368
|
}
|
|
26222
26369
|
};
|
|
26223
26370
|
var LineControlPoint = class {
|
|
26224
|
-
position = null;
|
|
26225
|
-
name;
|
|
26226
|
-
model;
|
|
26227
|
-
options;
|
|
26228
|
-
scope;
|
|
26229
26371
|
constructor(name, model, options, scope) {
|
|
26372
|
+
_defineProperty9(this, "position", null);
|
|
26373
|
+
_defineProperty9(this, "name", void 0);
|
|
26374
|
+
_defineProperty9(this, "model", void 0);
|
|
26375
|
+
_defineProperty9(this, "options", void 0);
|
|
26376
|
+
_defineProperty9(this, "scope", void 0);
|
|
26230
26377
|
this.name = name;
|
|
26231
26378
|
this.model = model;
|
|
26232
26379
|
this.options = options;
|
|
@@ -26241,8 +26388,14 @@ var LineControlPoint = class {
|
|
|
26241
26388
|
if (this.position) {
|
|
26242
26389
|
return this.model.scope.project.view.projectToView(this.position.transform(matrix));
|
|
26243
26390
|
}
|
|
26244
|
-
const from = {
|
|
26245
|
-
|
|
26391
|
+
const from = {
|
|
26392
|
+
x: this.model.points[0],
|
|
26393
|
+
y: this.model.points[1]
|
|
26394
|
+
};
|
|
26395
|
+
const to = {
|
|
26396
|
+
x: this.model.points[this.model.points.length - 2],
|
|
26397
|
+
y: this.model.points[this.model.points.length - 1]
|
|
26398
|
+
};
|
|
26246
26399
|
const clonedPath = new this.scope.Path.Line(from, to);
|
|
26247
26400
|
this.position = clonedPath.getPointAt(clonedPath.length * distance);
|
|
26248
26401
|
return this.model.scope.project.view.projectToView(this.position.transform(matrix));
|
|
@@ -26265,8 +26418,24 @@ var LineControlPoint = class {
|
|
|
26265
26418
|
|
|
26266
26419
|
// src/model/renderable/PointTextModel.ts
|
|
26267
26420
|
var Y6 = __toESM(require("yjs"), 1);
|
|
26421
|
+
function _defineProperty10(e, r, t) {
|
|
26422
|
+
return (r = _toPropertyKey10(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26423
|
+
}
|
|
26424
|
+
function _toPropertyKey10(t) {
|
|
26425
|
+
var i = _toPrimitive10(t, "string");
|
|
26426
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26427
|
+
}
|
|
26428
|
+
function _toPrimitive10(t, r) {
|
|
26429
|
+
if ("object" != typeof t || !t) return t;
|
|
26430
|
+
var e = t[Symbol.toPrimitive];
|
|
26431
|
+
if (void 0 !== e) {
|
|
26432
|
+
var i = e.call(t, r || "default");
|
|
26433
|
+
if ("object" != typeof i) return i;
|
|
26434
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26435
|
+
}
|
|
26436
|
+
return ("string" === r ? String : Number)(t);
|
|
26437
|
+
}
|
|
26268
26438
|
var PointTextModel = class extends ElementModel {
|
|
26269
|
-
item = null;
|
|
26270
26439
|
set content(value) {
|
|
26271
26440
|
this.root.set("content", value);
|
|
26272
26441
|
}
|
|
@@ -26287,6 +26456,23 @@ var PointTextModel = class extends ElementModel {
|
|
|
26287
26456
|
}
|
|
26288
26457
|
constructor(root, scope) {
|
|
26289
26458
|
super(root, scope);
|
|
26459
|
+
_defineProperty10(this, "item", null);
|
|
26460
|
+
_defineProperty10(this, "handleTextPropChange", (event) => {
|
|
26461
|
+
if (!this.item) {
|
|
26462
|
+
return;
|
|
26463
|
+
}
|
|
26464
|
+
for (const [key, value] of event.changes.keys.entries()) {
|
|
26465
|
+
if (value.action === "update" || value.action === "add") {
|
|
26466
|
+
if (key === "content") {
|
|
26467
|
+
this.item.content = this.root.get("content") ?? "";
|
|
26468
|
+
this.updateTextPosition();
|
|
26469
|
+
} else if (key === "font-size") {
|
|
26470
|
+
this.item.fontSize = this.fontSize;
|
|
26471
|
+
this.updateTextPosition();
|
|
26472
|
+
}
|
|
26473
|
+
}
|
|
26474
|
+
}
|
|
26475
|
+
});
|
|
26290
26476
|
if (!this.root.has("type")) {
|
|
26291
26477
|
this.root.set("type", "point-text");
|
|
26292
26478
|
}
|
|
@@ -26300,22 +26486,6 @@ var PointTextModel = class extends ElementModel {
|
|
|
26300
26486
|
}, 60);
|
|
26301
26487
|
}
|
|
26302
26488
|
}
|
|
26303
|
-
handleTextPropChange = (event) => {
|
|
26304
|
-
if (!this.item) {
|
|
26305
|
-
return;
|
|
26306
|
-
}
|
|
26307
|
-
for (const [key, value] of event.changes.keys.entries()) {
|
|
26308
|
-
if (value.action === "update" || value.action === "add") {
|
|
26309
|
-
if (key === "content") {
|
|
26310
|
-
this.item.content = this.root.get("content") ?? "";
|
|
26311
|
-
this.updateTextPosition();
|
|
26312
|
-
} else if (key === "font-size") {
|
|
26313
|
-
this.item.fontSize = this.fontSize;
|
|
26314
|
-
this.updateTextPosition();
|
|
26315
|
-
}
|
|
26316
|
-
}
|
|
26317
|
-
}
|
|
26318
|
-
};
|
|
26319
26489
|
getInternalMeasurement() {
|
|
26320
26490
|
if (!this.item) {
|
|
26321
26491
|
return null;
|
|
@@ -26327,14 +26497,25 @@ var PointTextModel = class extends ElementModel {
|
|
|
26327
26497
|
let scaleX = topRight.getDistance(topLeft) / bounds.width;
|
|
26328
26498
|
scaleX = Number.isNaN(scaleX) ? 1 : scaleX;
|
|
26329
26499
|
const angle = topRight.subtract(topLeft).angle;
|
|
26330
|
-
return {
|
|
26500
|
+
return {
|
|
26501
|
+
scaleX,
|
|
26502
|
+
topLeft,
|
|
26503
|
+
topRight,
|
|
26504
|
+
angle,
|
|
26505
|
+
bounds
|
|
26506
|
+
};
|
|
26331
26507
|
}
|
|
26332
26508
|
updateTextPosition() {
|
|
26333
26509
|
const measurement = this.getInternalMeasurement();
|
|
26334
26510
|
if (!this.item || !measurement) {
|
|
26335
26511
|
return;
|
|
26336
26512
|
}
|
|
26337
|
-
const {
|
|
26513
|
+
const {
|
|
26514
|
+
scaleX,
|
|
26515
|
+
topLeft,
|
|
26516
|
+
angle,
|
|
26517
|
+
bounds
|
|
26518
|
+
} = measurement;
|
|
26338
26519
|
const fontSize = this.fontSize * scaleX;
|
|
26339
26520
|
this.item.position.x = topLeft.x + bounds.width / 2;
|
|
26340
26521
|
this.item.position.y = topLeft.y + bounds.height / 2;
|
|
@@ -26382,10 +26563,27 @@ var PointTextModel = class extends ElementModel {
|
|
|
26382
26563
|
|
|
26383
26564
|
// src/model/renderable/TriangleModel.ts
|
|
26384
26565
|
var Y7 = __toESM(require("yjs"), 1);
|
|
26566
|
+
function _defineProperty11(e, r, t) {
|
|
26567
|
+
return (r = _toPropertyKey11(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26568
|
+
}
|
|
26569
|
+
function _toPropertyKey11(t) {
|
|
26570
|
+
var i = _toPrimitive11(t, "string");
|
|
26571
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26572
|
+
}
|
|
26573
|
+
function _toPrimitive11(t, r) {
|
|
26574
|
+
if ("object" != typeof t || !t) return t;
|
|
26575
|
+
var e = t[Symbol.toPrimitive];
|
|
26576
|
+
if (void 0 !== e) {
|
|
26577
|
+
var i = e.call(t, r || "default");
|
|
26578
|
+
if ("object" != typeof i) return i;
|
|
26579
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26580
|
+
}
|
|
26581
|
+
return ("string" === r ? String : Number)(t);
|
|
26582
|
+
}
|
|
26385
26583
|
var TriangleModel = class extends ElementModel {
|
|
26386
|
-
item = null;
|
|
26387
26584
|
constructor(root, scope) {
|
|
26388
26585
|
super(root, scope);
|
|
26586
|
+
_defineProperty11(this, "item", null);
|
|
26389
26587
|
if (!this.root.has("type")) {
|
|
26390
26588
|
this.root.set("type", "triangle");
|
|
26391
26589
|
}
|
|
@@ -26435,14 +26633,7 @@ var TriangleModel = class extends ElementModel {
|
|
|
26435
26633
|
const pointsMatrix = new this.scope.Matrix(this.pointsMatrix);
|
|
26436
26634
|
const trPoint = point.transform(pointsMatrix.inverted());
|
|
26437
26635
|
const oldPoints = this.points;
|
|
26438
|
-
this.setPoints([
|
|
26439
|
-
trPoint.x,
|
|
26440
|
-
trPoint.y,
|
|
26441
|
-
oldPoints[2],
|
|
26442
|
-
oldPoints[3],
|
|
26443
|
-
oldPoints[4],
|
|
26444
|
-
oldPoints[5]
|
|
26445
|
-
]);
|
|
26636
|
+
this.setPoints([trPoint.x, trPoint.y, oldPoints[2], oldPoints[3], oldPoints[4], oldPoints[5]]);
|
|
26446
26637
|
}
|
|
26447
26638
|
});
|
|
26448
26639
|
return config;
|
|
@@ -26462,10 +26653,27 @@ var TriangleModel = class extends ElementModel {
|
|
|
26462
26653
|
|
|
26463
26654
|
// src/model/renderable/RectangleModel.ts
|
|
26464
26655
|
var Y8 = __toESM(require("yjs"), 1);
|
|
26656
|
+
function _defineProperty12(e, r, t) {
|
|
26657
|
+
return (r = _toPropertyKey12(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26658
|
+
}
|
|
26659
|
+
function _toPropertyKey12(t) {
|
|
26660
|
+
var i = _toPrimitive12(t, "string");
|
|
26661
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26662
|
+
}
|
|
26663
|
+
function _toPrimitive12(t, r) {
|
|
26664
|
+
if ("object" != typeof t || !t) return t;
|
|
26665
|
+
var e = t[Symbol.toPrimitive];
|
|
26666
|
+
if (void 0 !== e) {
|
|
26667
|
+
var i = e.call(t, r || "default");
|
|
26668
|
+
if ("object" != typeof i) return i;
|
|
26669
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26670
|
+
}
|
|
26671
|
+
return ("string" === r ? String : Number)(t);
|
|
26672
|
+
}
|
|
26465
26673
|
var RectangleModel = class extends ElementModel {
|
|
26466
|
-
item = null;
|
|
26467
26674
|
constructor(root, scope) {
|
|
26468
26675
|
super(root, scope);
|
|
26676
|
+
_defineProperty12(this, "item", null);
|
|
26469
26677
|
if (!this.root.has("type")) {
|
|
26470
26678
|
this.root.set("type", "rectangle");
|
|
26471
26679
|
}
|
|
@@ -26619,11 +26827,28 @@ var elementsUndoOrigin = "elementsUndoOrigin";
|
|
|
26619
26827
|
// src/model/renderable/EraserModel.ts
|
|
26620
26828
|
var Y9 = __toESM(require("yjs"), 1);
|
|
26621
26829
|
var import_lodash5 = __toESM(require_lodash(), 1);
|
|
26830
|
+
function _defineProperty13(e, r, t) {
|
|
26831
|
+
return (r = _toPropertyKey13(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26832
|
+
}
|
|
26833
|
+
function _toPropertyKey13(t) {
|
|
26834
|
+
var i = _toPrimitive13(t, "string");
|
|
26835
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26836
|
+
}
|
|
26837
|
+
function _toPrimitive13(t, r) {
|
|
26838
|
+
if ("object" != typeof t || !t) return t;
|
|
26839
|
+
var e = t[Symbol.toPrimitive];
|
|
26840
|
+
if (void 0 !== e) {
|
|
26841
|
+
var i = e.call(t, r || "default");
|
|
26842
|
+
if ("object" != typeof i) return i;
|
|
26843
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26844
|
+
}
|
|
26845
|
+
return ("string" === r ? String : Number)(t);
|
|
26846
|
+
}
|
|
26622
26847
|
var EraserModel = class extends ElementModel {
|
|
26623
|
-
item = null;
|
|
26624
|
-
sliceBegin = 0;
|
|
26625
26848
|
constructor(root, scope) {
|
|
26626
26849
|
super(root, scope);
|
|
26850
|
+
_defineProperty13(this, "item", null);
|
|
26851
|
+
_defineProperty13(this, "sliceBegin", 0);
|
|
26627
26852
|
if (!this.root.has("type")) {
|
|
26628
26853
|
this.root.set("type", "eraser");
|
|
26629
26854
|
}
|
|
@@ -26679,7 +26904,10 @@ var EraserModel = class extends ElementModel {
|
|
|
26679
26904
|
matrixedPoints() {
|
|
26680
26905
|
const matrix = new this.scope.Matrix(this.pointsMatrix);
|
|
26681
26906
|
const groupPoints = (0, import_lodash5.chunk)(this.points, 2).slice(this.sliceBegin);
|
|
26682
|
-
return groupPoints.map((
|
|
26907
|
+
return groupPoints.map((_ref) => {
|
|
26908
|
+
let [x, y] = _ref;
|
|
26909
|
+
return matrix.transform([x, y]);
|
|
26910
|
+
}).map((p) => [p.x, p.y]);
|
|
26683
26911
|
}
|
|
26684
26912
|
getNextSegments() {
|
|
26685
26913
|
const points = this.parsePoints(this.matrixedPoints());
|
|
@@ -26738,14 +26966,31 @@ var EraserModel = class extends ElementModel {
|
|
|
26738
26966
|
// src/model/renderable/LaserPointerModel.ts
|
|
26739
26967
|
var Y10 = __toESM(require("yjs"), 1);
|
|
26740
26968
|
var import_lodash6 = __toESM(require_lodash(), 1);
|
|
26969
|
+
function _defineProperty14(e, r, t) {
|
|
26970
|
+
return (r = _toPropertyKey14(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
26971
|
+
}
|
|
26972
|
+
function _toPropertyKey14(t) {
|
|
26973
|
+
var i = _toPrimitive14(t, "string");
|
|
26974
|
+
return "symbol" == typeof i ? i : i + "";
|
|
26975
|
+
}
|
|
26976
|
+
function _toPrimitive14(t, r) {
|
|
26977
|
+
if ("object" != typeof t || !t) return t;
|
|
26978
|
+
var e = t[Symbol.toPrimitive];
|
|
26979
|
+
if (void 0 !== e) {
|
|
26980
|
+
var i = e.call(t, r || "default");
|
|
26981
|
+
if ("object" != typeof i) return i;
|
|
26982
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
26983
|
+
}
|
|
26984
|
+
return ("string" === r ? String : Number)(t);
|
|
26985
|
+
}
|
|
26741
26986
|
var LaserPointerModel = class extends ElementModel {
|
|
26742
|
-
item = null;
|
|
26743
|
-
clientId;
|
|
26744
|
-
sliceBegin = 0;
|
|
26745
|
-
displayStrokeWidth = 8;
|
|
26746
|
-
cachedPoints = null;
|
|
26747
26987
|
constructor(clientId, root, scope, removeElement) {
|
|
26748
26988
|
super(root, scope);
|
|
26989
|
+
_defineProperty14(this, "item", null);
|
|
26990
|
+
_defineProperty14(this, "clientId", void 0);
|
|
26991
|
+
_defineProperty14(this, "sliceBegin", 0);
|
|
26992
|
+
_defineProperty14(this, "displayStrokeWidth", 8);
|
|
26993
|
+
_defineProperty14(this, "cachedPoints", null);
|
|
26749
26994
|
this.clientId = clientId;
|
|
26750
26995
|
if (!this.root.has("type")) {
|
|
26751
26996
|
this.root.set("type", "laser");
|
|
@@ -26834,7 +27079,10 @@ var LaserPointerModel = class extends ElementModel {
|
|
|
26834
27079
|
const matrix = new this.scope.Matrix(this.pointsMatrix);
|
|
26835
27080
|
const points = this.cachedPoints || this.points;
|
|
26836
27081
|
const groupPoints = (0, import_lodash6.chunk)(points, 2).slice(this.sliceBegin);
|
|
26837
|
-
return groupPoints.map((
|
|
27082
|
+
return groupPoints.map((_ref) => {
|
|
27083
|
+
let [x, y] = _ref;
|
|
27084
|
+
return matrix.transform([x, y]);
|
|
27085
|
+
}).map((p) => [p.x, p.y]);
|
|
26838
27086
|
}
|
|
26839
27087
|
getNextSegments() {
|
|
26840
27088
|
const points = this.parsePoints(this.matrixedPoints());
|
|
@@ -26876,7 +27124,24 @@ var LaserPointerModel = class extends ElementModel {
|
|
|
26876
27124
|
|
|
26877
27125
|
// src/WhitePermissions.ts
|
|
26878
27126
|
var import_eventemitter3 = __toESM(require("eventemitter3"), 1);
|
|
26879
|
-
|
|
27127
|
+
function _defineProperty15(e, r, t) {
|
|
27128
|
+
return (r = _toPropertyKey15(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27129
|
+
}
|
|
27130
|
+
function _toPropertyKey15(t) {
|
|
27131
|
+
var i = _toPrimitive15(t, "string");
|
|
27132
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27133
|
+
}
|
|
27134
|
+
function _toPrimitive15(t, r) {
|
|
27135
|
+
if ("object" != typeof t || !t) return t;
|
|
27136
|
+
var e = t[Symbol.toPrimitive];
|
|
27137
|
+
if (void 0 !== e) {
|
|
27138
|
+
var i = e.call(t, r || "default");
|
|
27139
|
+
if ("object" != typeof i) return i;
|
|
27140
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27141
|
+
}
|
|
27142
|
+
return ("string" === r ? String : Number)(t);
|
|
27143
|
+
}
|
|
27144
|
+
var WhiteboardPermissionFlag = function(WhiteboardPermissionFlag2) {
|
|
26880
27145
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["none"] = 0] = "none";
|
|
26881
27146
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["draw"] = 1] = "draw";
|
|
26882
27147
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["editSelf"] = 2] = "editSelf";
|
|
@@ -26885,15 +27150,24 @@ var WhiteboardPermissionFlag = /* @__PURE__ */ ((WhiteboardPermissionFlag2) => {
|
|
|
26885
27150
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["deleteOthers"] = 16] = "deleteOthers";
|
|
26886
27151
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["mainView"] = 32] = "mainView";
|
|
26887
27152
|
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["setOthersView"] = 64] = "setOthersView";
|
|
26888
|
-
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["all"] =
|
|
27153
|
+
WhiteboardPermissionFlag2[WhiteboardPermissionFlag2["all"] = WhiteboardPermissionFlag2.draw | WhiteboardPermissionFlag2.editSelf | WhiteboardPermissionFlag2.editOthers | WhiteboardPermissionFlag2.deleteSelf | WhiteboardPermissionFlag2.deleteOthers | WhiteboardPermissionFlag2.mainView | WhiteboardPermissionFlag2.setOthersView] = "all";
|
|
26889
27154
|
return WhiteboardPermissionFlag2;
|
|
26890
|
-
}
|
|
27155
|
+
}({});
|
|
26891
27156
|
var WhiteboardPermissions = class extends import_eventemitter3.default {
|
|
26892
|
-
requestUserMap;
|
|
26893
|
-
userManager;
|
|
26894
|
-
observers = /* @__PURE__ */ new Map();
|
|
26895
27157
|
constructor(userManager, requestUserMap) {
|
|
26896
27158
|
super();
|
|
27159
|
+
_defineProperty15(this, "requestUserMap", void 0);
|
|
27160
|
+
_defineProperty15(this, "userManager", void 0);
|
|
27161
|
+
_defineProperty15(this, "observers", /* @__PURE__ */ new Map());
|
|
27162
|
+
_defineProperty15(this, "handleUserLeave", (user) => {
|
|
27163
|
+
const cb = this.observers.get(user.id);
|
|
27164
|
+
if (cb) {
|
|
27165
|
+
this.requestUserMap(user.id).unobserve(cb);
|
|
27166
|
+
}
|
|
27167
|
+
});
|
|
27168
|
+
_defineProperty15(this, "handleUserJoin", (user) => {
|
|
27169
|
+
this.addObserve(user.id);
|
|
27170
|
+
});
|
|
26897
27171
|
this.userManager = userManager;
|
|
26898
27172
|
this.requestUserMap = requestUserMap;
|
|
26899
27173
|
this.createModel(this.userManager.selfId);
|
|
@@ -26903,16 +27177,10 @@ var WhiteboardPermissions = class extends import_eventemitter3.default {
|
|
|
26903
27177
|
this.userManager.on("join", this.handleUserJoin);
|
|
26904
27178
|
this.userManager.on("leave", this.handleUserLeave);
|
|
26905
27179
|
}
|
|
26906
|
-
handleUserLeave = (user) => {
|
|
26907
|
-
const cb = this.observers.get(user.id);
|
|
26908
|
-
if (cb) {
|
|
26909
|
-
this.requestUserMap(user.id).unobserve(cb);
|
|
26910
|
-
}
|
|
26911
|
-
};
|
|
26912
|
-
handleUserJoin = (user) => {
|
|
26913
|
-
this.addObserve(user.id);
|
|
26914
|
-
};
|
|
26915
27180
|
addObserve(userId) {
|
|
27181
|
+
if (this.observers.has(userId)) {
|
|
27182
|
+
return;
|
|
27183
|
+
}
|
|
26916
27184
|
const observer = (evt) => {
|
|
26917
27185
|
this.handleUserPermissionChange(userId, evt);
|
|
26918
27186
|
};
|
|
@@ -26941,14 +27209,7 @@ var WhiteboardPermissions = class extends import_eventemitter3.default {
|
|
|
26941
27209
|
* @return {WhiteboardPermissionFlag[]} - 权限列表
|
|
26942
27210
|
*/
|
|
26943
27211
|
resolveFlags(value) {
|
|
26944
|
-
return [
|
|
26945
|
-
4 /* editOthers */,
|
|
26946
|
-
2 /* editSelf */,
|
|
26947
|
-
16 /* deleteOthers */,
|
|
26948
|
-
8 /* deleteSelf */,
|
|
26949
|
-
32 /* mainView */,
|
|
26950
|
-
1 /* draw */
|
|
26951
|
-
].filter((v) => (v & value) !== 0);
|
|
27212
|
+
return [WhiteboardPermissionFlag.draw, WhiteboardPermissionFlag.editSelf, WhiteboardPermissionFlag.editOthers, WhiteboardPermissionFlag.deleteSelf, WhiteboardPermissionFlag.deleteOthers, WhiteboardPermissionFlag.mainView, WhiteboardPermissionFlag.setOthersView].filter((v) => (v & value) !== 0);
|
|
26952
27213
|
}
|
|
26953
27214
|
/**
|
|
26954
27215
|
* 获取权限列表组合对应的数值
|
|
@@ -26998,10 +27259,27 @@ var WhiteboardPermissions = class extends import_eventemitter3.default {
|
|
|
26998
27259
|
// src/model/renderable/StraightLineModel.ts
|
|
26999
27260
|
var Y11 = __toESM(require("yjs"), 1);
|
|
27000
27261
|
var import_lodash7 = __toESM(require_lodash(), 1);
|
|
27262
|
+
function _defineProperty16(e, r, t) {
|
|
27263
|
+
return (r = _toPropertyKey16(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27264
|
+
}
|
|
27265
|
+
function _toPropertyKey16(t) {
|
|
27266
|
+
var i = _toPrimitive16(t, "string");
|
|
27267
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27268
|
+
}
|
|
27269
|
+
function _toPrimitive16(t, r) {
|
|
27270
|
+
if ("object" != typeof t || !t) return t;
|
|
27271
|
+
var e = t[Symbol.toPrimitive];
|
|
27272
|
+
if (void 0 !== e) {
|
|
27273
|
+
var i = e.call(t, r || "default");
|
|
27274
|
+
if ("object" != typeof i) return i;
|
|
27275
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27276
|
+
}
|
|
27277
|
+
return ("string" === r ? String : Number)(t);
|
|
27278
|
+
}
|
|
27001
27279
|
var StraightLineModel = class extends ElementModel {
|
|
27002
|
-
item = null;
|
|
27003
27280
|
constructor(root, scope) {
|
|
27004
27281
|
super(root, scope);
|
|
27282
|
+
_defineProperty16(this, "item", null);
|
|
27005
27283
|
if (!this.root.has("type")) {
|
|
27006
27284
|
this.root.set("type", "line");
|
|
27007
27285
|
}
|
|
@@ -27051,12 +27329,7 @@ var StraightLineModel = class extends ElementModel {
|
|
|
27051
27329
|
}
|
|
27052
27330
|
const pointsMatrix = new this.scope.Matrix(this.pointsMatrix);
|
|
27053
27331
|
const trPoint = point.transform(pointsMatrix.inverted());
|
|
27054
|
-
this.setPoints([
|
|
27055
|
-
trPoint.x,
|
|
27056
|
-
trPoint.y,
|
|
27057
|
-
this.points[2],
|
|
27058
|
-
this.points[3]
|
|
27059
|
-
]);
|
|
27332
|
+
this.setPoints([trPoint.x, trPoint.y, this.points[2], this.points[3]]);
|
|
27060
27333
|
}
|
|
27061
27334
|
});
|
|
27062
27335
|
cfg.controlPoints.push({
|
|
@@ -27073,12 +27346,7 @@ var StraightLineModel = class extends ElementModel {
|
|
|
27073
27346
|
}
|
|
27074
27347
|
const pointsMatrix = new this.scope.Matrix(this.pointsMatrix);
|
|
27075
27348
|
const trPoint = point.transform(pointsMatrix.inverted());
|
|
27076
|
-
this.setPoints([
|
|
27077
|
-
this.points[0],
|
|
27078
|
-
this.points[1],
|
|
27079
|
-
trPoint.x,
|
|
27080
|
-
trPoint.y
|
|
27081
|
-
]);
|
|
27349
|
+
this.setPoints([this.points[0], this.points[1], trPoint.x, trPoint.y]);
|
|
27082
27350
|
}
|
|
27083
27351
|
});
|
|
27084
27352
|
return cfg;
|
|
@@ -27103,21 +27371,53 @@ var StraightLineModel = class extends ElementModel {
|
|
|
27103
27371
|
};
|
|
27104
27372
|
|
|
27105
27373
|
// src/model/RenderableModel.ts
|
|
27374
|
+
function _defineProperty17(e, r, t) {
|
|
27375
|
+
return (r = _toPropertyKey17(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27376
|
+
}
|
|
27377
|
+
function _toPropertyKey17(t) {
|
|
27378
|
+
var i = _toPrimitive17(t, "string");
|
|
27379
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27380
|
+
}
|
|
27381
|
+
function _toPrimitive17(t, r) {
|
|
27382
|
+
if ("object" != typeof t || !t) return t;
|
|
27383
|
+
var e = t[Symbol.toPrimitive];
|
|
27384
|
+
if (void 0 !== e) {
|
|
27385
|
+
var i = e.call(t, r || "default");
|
|
27386
|
+
if ("object" != typeof i) return i;
|
|
27387
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27388
|
+
}
|
|
27389
|
+
return ("string" === r ? String : Number)(t);
|
|
27390
|
+
}
|
|
27106
27391
|
var RenderableModel = class extends import_eventemitter32.default {
|
|
27107
|
-
scope;
|
|
27108
|
-
toolbarModel;
|
|
27109
|
-
userManager;
|
|
27110
|
-
elementModels;
|
|
27111
|
-
elements;
|
|
27112
|
-
layerId;
|
|
27113
|
-
maxIndex = -1;
|
|
27114
|
-
hasPermission;
|
|
27115
|
-
shadowEmitter;
|
|
27116
27392
|
get uuid() {
|
|
27117
27393
|
return (0, import_uuid.v4)();
|
|
27118
27394
|
}
|
|
27119
27395
|
constructor(layerId, shadowEmitter, elements, scope, toolbarModel, userManager, hasPermission) {
|
|
27120
27396
|
super();
|
|
27397
|
+
_defineProperty17(this, "scope", void 0);
|
|
27398
|
+
_defineProperty17(this, "toolbarModel", void 0);
|
|
27399
|
+
_defineProperty17(this, "userManager", void 0);
|
|
27400
|
+
_defineProperty17(this, "elementModels", void 0);
|
|
27401
|
+
_defineProperty17(this, "elements", void 0);
|
|
27402
|
+
_defineProperty17(this, "layerId", void 0);
|
|
27403
|
+
_defineProperty17(this, "maxIndex", -1);
|
|
27404
|
+
_defineProperty17(this, "hasPermission", void 0);
|
|
27405
|
+
_defineProperty17(this, "shadowEmitter", void 0);
|
|
27406
|
+
_defineProperty17(this, "onElementsChange", (event) => {
|
|
27407
|
+
for (const [key, value] of event.changes.keys.entries()) {
|
|
27408
|
+
if (value.action === "add") {
|
|
27409
|
+
const root = this.elements.get(key);
|
|
27410
|
+
if (root) {
|
|
27411
|
+
const model = this.convertToModel(root);
|
|
27412
|
+
if (model) {
|
|
27413
|
+
this.emit("elementInsert", [model]);
|
|
27414
|
+
}
|
|
27415
|
+
}
|
|
27416
|
+
} else if (value.action === "delete") {
|
|
27417
|
+
this.emit("elementRemove", key, this.layerId);
|
|
27418
|
+
}
|
|
27419
|
+
}
|
|
27420
|
+
});
|
|
27121
27421
|
this.hasPermission = hasPermission;
|
|
27122
27422
|
this.shadowEmitter = shadowEmitter;
|
|
27123
27423
|
this.layerId = layerId;
|
|
@@ -27152,21 +27452,6 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27152
27452
|
});
|
|
27153
27453
|
});
|
|
27154
27454
|
}
|
|
27155
|
-
onElementsChange = (event) => {
|
|
27156
|
-
for (const [key, value] of event.changes.keys.entries()) {
|
|
27157
|
-
if (value.action === "add") {
|
|
27158
|
-
const root = this.elements.get(key);
|
|
27159
|
-
if (root) {
|
|
27160
|
-
const model = this.convertToModel(root);
|
|
27161
|
-
if (model) {
|
|
27162
|
-
this.emit("elementInsert", [model]);
|
|
27163
|
-
}
|
|
27164
|
-
}
|
|
27165
|
-
} else if (value.action === "delete") {
|
|
27166
|
-
this.emit("elementRemove", key, this.layerId);
|
|
27167
|
-
}
|
|
27168
|
-
}
|
|
27169
|
-
};
|
|
27170
27455
|
convertToModel(yMap) {
|
|
27171
27456
|
const type = yMap.get("type");
|
|
27172
27457
|
let model = null;
|
|
@@ -27199,7 +27484,8 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27199
27484
|
}
|
|
27200
27485
|
return model;
|
|
27201
27486
|
}
|
|
27202
|
-
initElement(element
|
|
27487
|
+
initElement(element) {
|
|
27488
|
+
let shadow = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
|
|
27203
27489
|
if (shadow) {
|
|
27204
27490
|
element.shadow = "layer";
|
|
27205
27491
|
}
|
|
@@ -27220,8 +27506,16 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27220
27506
|
this.elements.set(uuid, map);
|
|
27221
27507
|
}, elementsUndoOrigin);
|
|
27222
27508
|
}
|
|
27223
|
-
|
|
27224
|
-
|
|
27509
|
+
confirmPermission() {
|
|
27510
|
+
const hasPermission = this.hasPermission(WhiteboardPermissionFlag.draw);
|
|
27511
|
+
if (!hasPermission) {
|
|
27512
|
+
console.warn("[@netless/forge-whiteboard] no permission to draw");
|
|
27513
|
+
}
|
|
27514
|
+
return hasPermission;
|
|
27515
|
+
}
|
|
27516
|
+
createCurve() {
|
|
27517
|
+
let shadow = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
|
|
27518
|
+
if (!this.confirmPermission()) {
|
|
27225
27519
|
return null;
|
|
27226
27520
|
}
|
|
27227
27521
|
const curveModel = new CurveModel(new Y12.Map(), this.scope);
|
|
@@ -27230,7 +27524,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27230
27524
|
return curveModel;
|
|
27231
27525
|
}
|
|
27232
27526
|
createLaserPointer() {
|
|
27233
|
-
if (!this.
|
|
27527
|
+
if (!this.confirmPermission()) {
|
|
27234
27528
|
return null;
|
|
27235
27529
|
}
|
|
27236
27530
|
const model = new LaserPointerModel(this.userManager.selfId, new Y12.Map(), this.scope, (uuid) => {
|
|
@@ -27245,7 +27539,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27245
27539
|
return model;
|
|
27246
27540
|
}
|
|
27247
27541
|
createEraser() {
|
|
27248
|
-
if (!this.hasPermission(
|
|
27542
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.deleteSelf) && !this.hasPermission(WhiteboardPermissionFlag.deleteOthers)) {
|
|
27249
27543
|
return null;
|
|
27250
27544
|
}
|
|
27251
27545
|
const model = new EraserModel(new Y12.Map(), this.scope);
|
|
@@ -27258,7 +27552,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27258
27552
|
return model;
|
|
27259
27553
|
}
|
|
27260
27554
|
createTriangle(shadow) {
|
|
27261
|
-
if (!this.
|
|
27555
|
+
if (!this.confirmPermission()) {
|
|
27262
27556
|
return null;
|
|
27263
27557
|
}
|
|
27264
27558
|
const triangle = new TriangleModel(new Y12.Map(), this.scope);
|
|
@@ -27268,7 +27562,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27268
27562
|
return triangle;
|
|
27269
27563
|
}
|
|
27270
27564
|
createRectangle(shadow) {
|
|
27271
|
-
if (!this.
|
|
27565
|
+
if (!this.confirmPermission()) {
|
|
27272
27566
|
return null;
|
|
27273
27567
|
}
|
|
27274
27568
|
const rect = new RectangleModel(new Y12.Map(), this.scope);
|
|
@@ -27278,7 +27572,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27278
27572
|
return rect;
|
|
27279
27573
|
}
|
|
27280
27574
|
createSegmentedPath(type, shadow) {
|
|
27281
|
-
if (!this.
|
|
27575
|
+
if (!this.confirmPermission()) {
|
|
27282
27576
|
return null;
|
|
27283
27577
|
}
|
|
27284
27578
|
const segmentsModel = new SegmentsModel(new Y12.Map(), this.scope, type);
|
|
@@ -27287,8 +27581,9 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27287
27581
|
this.addElementToDoc(segmentsModel.root);
|
|
27288
27582
|
return segmentsModel;
|
|
27289
27583
|
}
|
|
27290
|
-
createSelector(
|
|
27291
|
-
|
|
27584
|
+
createSelector() {
|
|
27585
|
+
let shadow = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
|
|
27586
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.editSelf) && !this.hasPermission(WhiteboardPermissionFlag.deleteOthers)) {
|
|
27292
27587
|
return null;
|
|
27293
27588
|
}
|
|
27294
27589
|
const selectorModel = new SelectorModel(new Y12.Map(), this.scope);
|
|
@@ -27297,7 +27592,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27297
27592
|
return selectorModel;
|
|
27298
27593
|
}
|
|
27299
27594
|
createStraightLine(shadow) {
|
|
27300
|
-
if (!this.
|
|
27595
|
+
if (!this.confirmPermission()) {
|
|
27301
27596
|
return null;
|
|
27302
27597
|
}
|
|
27303
27598
|
const straightLineModel = new StraightLineModel(new Y12.Map(), this.scope);
|
|
@@ -27307,7 +27602,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27307
27602
|
return straightLineModel;
|
|
27308
27603
|
}
|
|
27309
27604
|
createLinePath(shadow) {
|
|
27310
|
-
if (!this.
|
|
27605
|
+
if (!this.confirmPermission()) {
|
|
27311
27606
|
return null;
|
|
27312
27607
|
}
|
|
27313
27608
|
const lineModel = new LineModel(new Y12.Map(), this.scope);
|
|
@@ -27317,7 +27612,7 @@ var RenderableModel = class extends import_eventemitter32.default {
|
|
|
27317
27612
|
return lineModel;
|
|
27318
27613
|
}
|
|
27319
27614
|
createPointText(x, y, shadow) {
|
|
27320
|
-
if (!this.
|
|
27615
|
+
if (!this.confirmPermission()) {
|
|
27321
27616
|
return null;
|
|
27322
27617
|
}
|
|
27323
27618
|
const pointTextModel = new PointTextModel(new Y12.Map(), this.scope);
|
|
@@ -27570,8 +27865,27 @@ function Deg2Rad(d) {
|
|
|
27570
27865
|
}
|
|
27571
27866
|
|
|
27572
27867
|
// src/utils/Recognizer.ts
|
|
27868
|
+
function _defineProperty18(e, r, t) {
|
|
27869
|
+
return (r = _toPropertyKey18(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27870
|
+
}
|
|
27871
|
+
function _toPropertyKey18(t) {
|
|
27872
|
+
var i = _toPrimitive18(t, "string");
|
|
27873
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27874
|
+
}
|
|
27875
|
+
function _toPrimitive18(t, r) {
|
|
27876
|
+
if ("object" != typeof t || !t) return t;
|
|
27877
|
+
var e = t[Symbol.toPrimitive];
|
|
27878
|
+
if (void 0 !== e) {
|
|
27879
|
+
var i = e.call(t, r || "default");
|
|
27880
|
+
if ("object" != typeof i) return i;
|
|
27881
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27882
|
+
}
|
|
27883
|
+
return ("string" === r ? String : Number)(t);
|
|
27884
|
+
}
|
|
27573
27885
|
var Recognizer = class {
|
|
27574
|
-
|
|
27886
|
+
constructor() {
|
|
27887
|
+
_defineProperty18(this, "dollar", new DollarRecognizer());
|
|
27888
|
+
}
|
|
27575
27889
|
recognize(points) {
|
|
27576
27890
|
let minX = Number.MAX_VALUE;
|
|
27577
27891
|
let maxX = -Number.MAX_VALUE;
|
|
@@ -27598,12 +27912,29 @@ var Recognizer = class {
|
|
|
27598
27912
|
};
|
|
27599
27913
|
|
|
27600
27914
|
// src/tool/CurveTool.ts
|
|
27915
|
+
function _defineProperty19(e, r, t) {
|
|
27916
|
+
return (r = _toPropertyKey19(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27917
|
+
}
|
|
27918
|
+
function _toPropertyKey19(t) {
|
|
27919
|
+
var i = _toPrimitive19(t, "string");
|
|
27920
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27921
|
+
}
|
|
27922
|
+
function _toPrimitive19(t, r) {
|
|
27923
|
+
if ("object" != typeof t || !t) return t;
|
|
27924
|
+
var e = t[Symbol.toPrimitive];
|
|
27925
|
+
if (void 0 !== e) {
|
|
27926
|
+
var i = e.call(t, r || "default");
|
|
27927
|
+
if ("object" != typeof i) return i;
|
|
27928
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
27929
|
+
}
|
|
27930
|
+
return ("string" === r ? String : Number)(t);
|
|
27931
|
+
}
|
|
27601
27932
|
var CurveTool = class extends WhiteboardTool {
|
|
27602
|
-
elementModel = null;
|
|
27603
|
-
recognizer = new Recognizer();
|
|
27604
|
-
pointCount = 0;
|
|
27605
27933
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
27606
27934
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
27935
|
+
_defineProperty19(this, "elementModel", null);
|
|
27936
|
+
_defineProperty19(this, "recognizer", new Recognizer());
|
|
27937
|
+
_defineProperty19(this, "pointCount", 0);
|
|
27607
27938
|
this.tool.minDistance = 1;
|
|
27608
27939
|
}
|
|
27609
27940
|
onMouseDown(event) {
|
|
@@ -27635,31 +27966,16 @@ var CurveTool = class extends WhiteboardTool {
|
|
|
27635
27966
|
model?.setPoints([result.minX, result.minY, result.maxX, result.maxY]);
|
|
27636
27967
|
} else if (/^circle/.test(result.shape)) {
|
|
27637
27968
|
const model = this.modelGetter().createSegmentedPath("ellipse", false);
|
|
27638
|
-
const rect = new this.scope.Rectangle(
|
|
27639
|
-
new this.scope.Point(result.minX, result.minY),
|
|
27640
|
-
new this.scope.Point(result.maxX, result.maxY)
|
|
27641
|
-
);
|
|
27969
|
+
const rect = new this.scope.Rectangle(new this.scope.Point(result.minX, result.minY), new this.scope.Point(result.maxX, result.maxY));
|
|
27642
27970
|
const pathRect = new this.scope.Path.Ellipse(rect);
|
|
27643
27971
|
const points = serializePath(pathRect);
|
|
27644
27972
|
model?.setPoints(points);
|
|
27645
27973
|
} else if (/^triangle/.test(result.shape)) {
|
|
27646
27974
|
const model = this.modelGetter().createTriangle(false);
|
|
27647
|
-
model?.setPoints([
|
|
27648
|
-
result.minX + (result.maxX - result.minX) / 2,
|
|
27649
|
-
result.minY,
|
|
27650
|
-
result.minX,
|
|
27651
|
-
result.maxY,
|
|
27652
|
-
result.maxX,
|
|
27653
|
-
result.maxY
|
|
27654
|
-
]);
|
|
27975
|
+
model?.setPoints([result.minX + (result.maxX - result.minX) / 2, result.minY, result.minX, result.maxY, result.maxX, result.maxY]);
|
|
27655
27976
|
} else if (/^arrow/.test(result.shape)) {
|
|
27656
27977
|
const model = this.modelGetter().createLinePath(false);
|
|
27657
|
-
model?.setPoints([
|
|
27658
|
-
result.minX,
|
|
27659
|
-
(result.maxY + result.minY) / 2,
|
|
27660
|
-
result.maxX,
|
|
27661
|
-
(result.maxY + result.minY) / 2
|
|
27662
|
-
]);
|
|
27978
|
+
model?.setPoints([result.minX, (result.maxY + result.minY) / 2, result.maxX, (result.maxY + result.minY) / 2]);
|
|
27663
27979
|
}
|
|
27664
27980
|
}
|
|
27665
27981
|
}
|
|
@@ -27667,12 +27983,29 @@ var CurveTool = class extends WhiteboardTool {
|
|
|
27667
27983
|
};
|
|
27668
27984
|
|
|
27669
27985
|
// src/tool/RectangleTool.ts
|
|
27986
|
+
function _defineProperty20(e, r, t) {
|
|
27987
|
+
return (r = _toPropertyKey20(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
27988
|
+
}
|
|
27989
|
+
function _toPropertyKey20(t) {
|
|
27990
|
+
var i = _toPrimitive20(t, "string");
|
|
27991
|
+
return "symbol" == typeof i ? i : i + "";
|
|
27992
|
+
}
|
|
27993
|
+
function _toPrimitive20(t, r) {
|
|
27994
|
+
if ("object" != typeof t || !t) return t;
|
|
27995
|
+
var e = t[Symbol.toPrimitive];
|
|
27996
|
+
if (void 0 !== e) {
|
|
27997
|
+
var i = e.call(t, r || "default");
|
|
27998
|
+
if ("object" != typeof i) return i;
|
|
27999
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28000
|
+
}
|
|
28001
|
+
return ("string" === r ? String : Number)(t);
|
|
28002
|
+
}
|
|
27670
28003
|
var RectangleTool = class extends WhiteboardTool {
|
|
27671
|
-
elementModel = null;
|
|
27672
|
-
from = null;
|
|
27673
|
-
to = null;
|
|
27674
28004
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
27675
28005
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
28006
|
+
_defineProperty20(this, "elementModel", null);
|
|
28007
|
+
_defineProperty20(this, "from", null);
|
|
28008
|
+
_defineProperty20(this, "to", null);
|
|
27676
28009
|
this.tool.minDistance = 1;
|
|
27677
28010
|
}
|
|
27678
28011
|
onMouseDown(event) {
|
|
@@ -27683,12 +28016,7 @@ var RectangleTool = class extends WhiteboardTool {
|
|
|
27683
28016
|
onMouseDrag(event) {
|
|
27684
28017
|
if (this.from && this.elementModel) {
|
|
27685
28018
|
this.to = event.point.clone();
|
|
27686
|
-
this.elementModel.setPoints([
|
|
27687
|
-
this.from.x,
|
|
27688
|
-
this.from.y,
|
|
27689
|
-
this.to.x,
|
|
27690
|
-
this.to.y
|
|
27691
|
-
]);
|
|
28019
|
+
this.elementModel.setPoints([this.from.x, this.from.y, this.to.x, this.to.y]);
|
|
27692
28020
|
}
|
|
27693
28021
|
}
|
|
27694
28022
|
onMouseUp(event) {
|
|
@@ -27703,6 +28031,23 @@ var RectangleTool = class extends WhiteboardTool {
|
|
|
27703
28031
|
|
|
27704
28032
|
// src/model/ToolbarModel.ts
|
|
27705
28033
|
var import_eventemitter33 = __toESM(require("eventemitter3"), 1);
|
|
28034
|
+
function _defineProperty21(e, r, t) {
|
|
28035
|
+
return (r = _toPropertyKey21(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28036
|
+
}
|
|
28037
|
+
function _toPropertyKey21(t) {
|
|
28038
|
+
var i = _toPrimitive21(t, "string");
|
|
28039
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28040
|
+
}
|
|
28041
|
+
function _toPrimitive21(t, r) {
|
|
28042
|
+
if ("object" != typeof t || !t) return t;
|
|
28043
|
+
var e = t[Symbol.toPrimitive];
|
|
28044
|
+
if (void 0 !== e) {
|
|
28045
|
+
var i = e.call(t, r || "default");
|
|
28046
|
+
if ("object" != typeof i) return i;
|
|
28047
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28048
|
+
}
|
|
28049
|
+
return ("string" === r ? String : Number)(t);
|
|
28050
|
+
}
|
|
27706
28051
|
var TOOLBAR_KEYS = {
|
|
27707
28052
|
tool: "tool",
|
|
27708
28053
|
fontSize: "fontSize",
|
|
@@ -27713,7 +28058,6 @@ var TOOLBAR_KEYS = {
|
|
|
27713
28058
|
dashArray: "dashArray"
|
|
27714
28059
|
};
|
|
27715
28060
|
var ToolbarModel = class extends import_eventemitter33.default {
|
|
27716
|
-
root;
|
|
27717
28061
|
get currentTool() {
|
|
27718
28062
|
return this.root.get(TOOLBAR_KEYS.tool);
|
|
27719
28063
|
}
|
|
@@ -27758,6 +28102,22 @@ var ToolbarModel = class extends import_eventemitter33.default {
|
|
|
27758
28102
|
}
|
|
27759
28103
|
constructor(root, defaultStyle) {
|
|
27760
28104
|
super();
|
|
28105
|
+
_defineProperty21(this, "root", void 0);
|
|
28106
|
+
_defineProperty21(this, "handleRootUpdate", (evt) => {
|
|
28107
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
28108
|
+
if (Object.keys(TOOLBAR_KEYS).indexOf(key) >= 0 && (value.action === "add" || value.action === "update")) {
|
|
28109
|
+
this.emit("update", {
|
|
28110
|
+
tool: this.currentTool,
|
|
28111
|
+
fontSize: this.fontSize,
|
|
28112
|
+
fontFamily: this.fontFamily,
|
|
28113
|
+
strokeColor: this.strokeColor,
|
|
28114
|
+
fillColor: this.fillColor,
|
|
28115
|
+
strokeWidth: this.strokeWidth,
|
|
28116
|
+
dashArray: this.dashArray
|
|
28117
|
+
});
|
|
28118
|
+
}
|
|
28119
|
+
}
|
|
28120
|
+
});
|
|
27761
28121
|
this.root = root;
|
|
27762
28122
|
this.root.observe(this.handleRootUpdate);
|
|
27763
28123
|
Object.keys(defaultStyle).forEach((key) => {
|
|
@@ -27766,32 +28126,34 @@ var ToolbarModel = class extends import_eventemitter33.default {
|
|
|
27766
28126
|
}
|
|
27767
28127
|
});
|
|
27768
28128
|
}
|
|
27769
|
-
handleRootUpdate = (evt) => {
|
|
27770
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
27771
|
-
if (Object.keys(TOOLBAR_KEYS).indexOf(key) >= 0 && (value.action === "add" || value.action === "update")) {
|
|
27772
|
-
this.emit("update", {
|
|
27773
|
-
tool: this.currentTool,
|
|
27774
|
-
fontSize: this.fontSize,
|
|
27775
|
-
fontFamily: this.fontFamily,
|
|
27776
|
-
strokeColor: this.strokeColor,
|
|
27777
|
-
fillColor: this.fillColor,
|
|
27778
|
-
strokeWidth: this.strokeWidth,
|
|
27779
|
-
dashArray: this.dashArray
|
|
27780
|
-
});
|
|
27781
|
-
}
|
|
27782
|
-
}
|
|
27783
|
-
};
|
|
27784
28129
|
};
|
|
27785
28130
|
|
|
27786
28131
|
// src/tool/SelectorTool.ts
|
|
28132
|
+
function _defineProperty22(e, r, t) {
|
|
28133
|
+
return (r = _toPropertyKey22(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28134
|
+
}
|
|
28135
|
+
function _toPropertyKey22(t) {
|
|
28136
|
+
var i = _toPrimitive22(t, "string");
|
|
28137
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28138
|
+
}
|
|
28139
|
+
function _toPrimitive22(t, r) {
|
|
28140
|
+
if ("object" != typeof t || !t) return t;
|
|
28141
|
+
var e = t[Symbol.toPrimitive];
|
|
28142
|
+
if (void 0 !== e) {
|
|
28143
|
+
var i = e.call(t, r || "default");
|
|
28144
|
+
if ("object" != typeof i) return i;
|
|
28145
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28146
|
+
}
|
|
28147
|
+
return ("string" === r ? String : Number)(t);
|
|
28148
|
+
}
|
|
27787
28149
|
var SelectorTool = class extends WhiteboardTool {
|
|
27788
|
-
elementModel = null;
|
|
27789
|
-
from = null;
|
|
27790
|
-
to = null;
|
|
27791
|
-
selectElementsModel;
|
|
27792
|
-
selectElements = /* @__PURE__ */ new Map();
|
|
27793
28150
|
constructor(enableToolEvent, renderableModel, shadowEmitter, scope, selectElementsModel) {
|
|
27794
28151
|
super(enableToolEvent, renderableModel, shadowEmitter, scope);
|
|
28152
|
+
_defineProperty22(this, "elementModel", null);
|
|
28153
|
+
_defineProperty22(this, "from", null);
|
|
28154
|
+
_defineProperty22(this, "to", null);
|
|
28155
|
+
_defineProperty22(this, "selectElementsModel", void 0);
|
|
28156
|
+
_defineProperty22(this, "selectElements", /* @__PURE__ */ new Map());
|
|
27795
28157
|
this.selectElementsModel = selectElementsModel;
|
|
27796
28158
|
}
|
|
27797
28159
|
onMouseDown(event) {
|
|
@@ -27801,24 +28163,14 @@ var SelectorTool = class extends WhiteboardTool {
|
|
|
27801
28163
|
this.from = event.point.clone();
|
|
27802
28164
|
this.to = event.point.clone();
|
|
27803
28165
|
const rect = new this.scope.Rectangle(this.from, this.to);
|
|
27804
|
-
this.elementModel?.setPoints([
|
|
27805
|
-
rect.topLeft.x,
|
|
27806
|
-
rect.topLeft.y,
|
|
27807
|
-
rect.size.width,
|
|
27808
|
-
rect.size.height
|
|
27809
|
-
]);
|
|
28166
|
+
this.elementModel?.setPoints([rect.topLeft.x, rect.topLeft.y, rect.size.width, rect.size.height]);
|
|
27810
28167
|
this.selectElements.clear();
|
|
27811
28168
|
}
|
|
27812
28169
|
onMouseDrag(event) {
|
|
27813
28170
|
if (this.from && this.elementModel) {
|
|
27814
28171
|
this.to = event.point.clone();
|
|
27815
28172
|
const rect = new this.scope.Rectangle(this.from, this.to);
|
|
27816
|
-
this.elementModel.setPoints([
|
|
27817
|
-
rect.topLeft.x,
|
|
27818
|
-
rect.topLeft.y,
|
|
27819
|
-
rect.size.width,
|
|
27820
|
-
rect.size.height
|
|
27821
|
-
]);
|
|
28173
|
+
this.elementModel.setPoints([rect.topLeft.x, rect.topLeft.y, rect.size.width, rect.size.height]);
|
|
27822
28174
|
this.selectElementsModel.clearSelectElementForSelf();
|
|
27823
28175
|
this.scope.project.activeLayer.children.forEach((item) => {
|
|
27824
28176
|
if (item.data.type && ["selector", "eraser", "laser"].indexOf(item.data.type) < 0) {
|
|
@@ -27836,7 +28188,10 @@ var SelectorTool = class extends WhiteboardTool {
|
|
|
27836
28188
|
this.modelGetter().removeElementItem(this.elementModel.uuid);
|
|
27837
28189
|
}
|
|
27838
28190
|
const elements = Array.from(this.selectElements.keys()).reduce((result, next) => {
|
|
27839
|
-
result.push({
|
|
28191
|
+
result.push({
|
|
28192
|
+
elementId: next,
|
|
28193
|
+
ownerId: this.selectElements.get(next)
|
|
28194
|
+
});
|
|
27840
28195
|
return result;
|
|
27841
28196
|
}, []);
|
|
27842
28197
|
const hitResult = this.scope.project.hitTest(event.point);
|
|
@@ -27867,19 +28222,57 @@ var WhiteboardKeys = {
|
|
|
27867
28222
|
};
|
|
27868
28223
|
|
|
27869
28224
|
// src/model/SelectElementsModel.ts
|
|
28225
|
+
function _defineProperty23(e, r, t) {
|
|
28226
|
+
return (r = _toPropertyKey23(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28227
|
+
}
|
|
28228
|
+
function _toPropertyKey23(t) {
|
|
28229
|
+
var i = _toPrimitive23(t, "string");
|
|
28230
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28231
|
+
}
|
|
28232
|
+
function _toPrimitive23(t, r) {
|
|
28233
|
+
if ("object" != typeof t || !t) return t;
|
|
28234
|
+
var e = t[Symbol.toPrimitive];
|
|
28235
|
+
if (void 0 !== e) {
|
|
28236
|
+
var i = e.call(t, r || "default");
|
|
28237
|
+
if ("object" != typeof i) return i;
|
|
28238
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28239
|
+
}
|
|
28240
|
+
return ("string" === r ? String : Number)(t);
|
|
28241
|
+
}
|
|
27870
28242
|
var SelectElementsModel = class extends import_eventemitter34.default {
|
|
27871
|
-
requestUserMap;
|
|
27872
|
-
userManager;
|
|
27873
|
-
hasPermission;
|
|
27874
|
-
observers = /* @__PURE__ */ new Map();
|
|
27875
28243
|
get hasEditSelfPermission() {
|
|
27876
|
-
return this.hasPermission(
|
|
28244
|
+
return this.hasPermission(WhiteboardPermissionFlag.editSelf);
|
|
27877
28245
|
}
|
|
27878
28246
|
get hasEditOthersPermission() {
|
|
27879
|
-
return this.hasPermission(
|
|
28247
|
+
return this.hasPermission(WhiteboardPermissionFlag.editOthers);
|
|
27880
28248
|
}
|
|
27881
28249
|
constructor(userManager, requestUserMap, hasPermission) {
|
|
27882
28250
|
super();
|
|
28251
|
+
_defineProperty23(this, "requestUserMap", void 0);
|
|
28252
|
+
_defineProperty23(this, "userManager", void 0);
|
|
28253
|
+
_defineProperty23(this, "hasPermission", void 0);
|
|
28254
|
+
_defineProperty23(this, "observers", /* @__PURE__ */ new Map());
|
|
28255
|
+
_defineProperty23(this, "handleUserLeave", (user) => {
|
|
28256
|
+
const cb = this.observers.get(user.id);
|
|
28257
|
+
if (cb) {
|
|
28258
|
+
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
28259
|
+
}
|
|
28260
|
+
});
|
|
28261
|
+
_defineProperty23(this, "handleUserJoin", (user) => {
|
|
28262
|
+
const observer = (evts) => {
|
|
28263
|
+
this.handleUserSelectElementsChange(user.id, evts);
|
|
28264
|
+
};
|
|
28265
|
+
this.requestUserMap(user.id).observeDeep(observer);
|
|
28266
|
+
this.observers.set(user.id, observer);
|
|
28267
|
+
});
|
|
28268
|
+
_defineProperty23(this, "handleUserSelectElementsChange", (userId, evts) => {
|
|
28269
|
+
for (const evt of evts) {
|
|
28270
|
+
if (evt.target.get("inner-map-id") === WhiteboardKeys.selectElements) {
|
|
28271
|
+
const elementIds = Array.from(evt.target.keys()).filter((v) => v !== "inner-map-id");
|
|
28272
|
+
this.emit("elementsChange", userId, Array.from(elementIds));
|
|
28273
|
+
}
|
|
28274
|
+
}
|
|
28275
|
+
});
|
|
27883
28276
|
this.hasPermission = hasPermission;
|
|
27884
28277
|
this.userManager = userManager;
|
|
27885
28278
|
this.requestUserMap = requestUserMap;
|
|
@@ -27894,27 +28287,6 @@ var SelectElementsModel = class extends import_eventemitter34.default {
|
|
|
27894
28287
|
this.userManager.on("join", this.handleUserJoin);
|
|
27895
28288
|
this.userManager.on("leave", this.handleUserLeave);
|
|
27896
28289
|
}
|
|
27897
|
-
handleUserLeave = (user) => {
|
|
27898
|
-
const cb = this.observers.get(user.id);
|
|
27899
|
-
if (cb) {
|
|
27900
|
-
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
27901
|
-
}
|
|
27902
|
-
};
|
|
27903
|
-
handleUserJoin = (user) => {
|
|
27904
|
-
const observer = (evts) => {
|
|
27905
|
-
this.handleUserSelectElementsChange(user.id, evts);
|
|
27906
|
-
};
|
|
27907
|
-
this.requestUserMap(user.id).observeDeep(observer);
|
|
27908
|
-
this.observers.set(user.id, observer);
|
|
27909
|
-
};
|
|
27910
|
-
handleUserSelectElementsChange = (userId, evts) => {
|
|
27911
|
-
for (const evt of evts) {
|
|
27912
|
-
if (evt.target.get("inner-map-id") === WhiteboardKeys.selectElements) {
|
|
27913
|
-
const elementIds = Array.from(evt.target.keys()).filter((v) => v !== "inner-map-id");
|
|
27914
|
-
this.emit("elementsChange", userId, Array.from(elementIds));
|
|
27915
|
-
}
|
|
27916
|
-
}
|
|
27917
|
-
};
|
|
27918
28290
|
createModel(userId) {
|
|
27919
28291
|
const userMap = this.requestUserMap(userId);
|
|
27920
28292
|
if (!userMap.has(WhiteboardKeys.selectElements)) {
|
|
@@ -27924,7 +28296,10 @@ var SelectElementsModel = class extends import_eventemitter34.default {
|
|
|
27924
28296
|
}
|
|
27925
28297
|
}
|
|
27926
28298
|
addSelectElementForSelf(elements) {
|
|
27927
|
-
const {
|
|
28299
|
+
const {
|
|
28300
|
+
hasEditSelfPermission,
|
|
28301
|
+
hasEditOthersPermission
|
|
28302
|
+
} = this;
|
|
27928
28303
|
const ids = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.selectElements);
|
|
27929
28304
|
const ignoreIds = /* @__PURE__ */ new Set();
|
|
27930
28305
|
for (const userId of this.userManager.userIdList()) {
|
|
@@ -27977,16 +28352,54 @@ var import_eventemitter36 = __toESM(require("eventemitter3"), 1);
|
|
|
27977
28352
|
|
|
27978
28353
|
// src/edit/TextEditor.ts
|
|
27979
28354
|
var import_eventemitter35 = require("eventemitter3");
|
|
28355
|
+
function _defineProperty24(e, r, t) {
|
|
28356
|
+
return (r = _toPropertyKey24(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28357
|
+
}
|
|
28358
|
+
function _toPropertyKey24(t) {
|
|
28359
|
+
var i = _toPrimitive24(t, "string");
|
|
28360
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28361
|
+
}
|
|
28362
|
+
function _toPrimitive24(t, r) {
|
|
28363
|
+
if ("object" != typeof t || !t) return t;
|
|
28364
|
+
var e = t[Symbol.toPrimitive];
|
|
28365
|
+
if (void 0 !== e) {
|
|
28366
|
+
var i = e.call(t, r || "default");
|
|
28367
|
+
if ("object" != typeof i) return i;
|
|
28368
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28369
|
+
}
|
|
28370
|
+
return ("string" === r ? String : Number)(t);
|
|
28371
|
+
}
|
|
27980
28372
|
var TextEditor = class extends import_eventemitter35.EventEmitter {
|
|
27981
|
-
rootView;
|
|
27982
|
-
content;
|
|
27983
|
-
camera;
|
|
27984
|
-
originX = 0;
|
|
27985
|
-
originY = 0;
|
|
27986
|
-
rotation = 0;
|
|
27987
|
-
scale = 1;
|
|
27988
28373
|
constructor(camera) {
|
|
27989
28374
|
super();
|
|
28375
|
+
_defineProperty24(this, "rootView", void 0);
|
|
28376
|
+
_defineProperty24(this, "content", void 0);
|
|
28377
|
+
_defineProperty24(this, "camera", void 0);
|
|
28378
|
+
_defineProperty24(this, "originX", 0);
|
|
28379
|
+
_defineProperty24(this, "originY", 0);
|
|
28380
|
+
_defineProperty24(this, "rotation", 0);
|
|
28381
|
+
_defineProperty24(this, "scale", 1);
|
|
28382
|
+
_defineProperty24(this, "handleContentInput", () => {
|
|
28383
|
+
this.emit("change", this.content.textContent ?? "");
|
|
28384
|
+
this.translateCaretIntoView();
|
|
28385
|
+
});
|
|
28386
|
+
_defineProperty24(this, "handleContentKeydown", (evt) => {
|
|
28387
|
+
if (/^Arrow/.test(evt.key)) {
|
|
28388
|
+
setTimeout(() => {
|
|
28389
|
+
this.translateCaretIntoView();
|
|
28390
|
+
}, 50);
|
|
28391
|
+
}
|
|
28392
|
+
});
|
|
28393
|
+
_defineProperty24(this, "handleContentBlur", () => {
|
|
28394
|
+
this.emit("done", this.content.textContent ?? "");
|
|
28395
|
+
});
|
|
28396
|
+
_defineProperty24(this, "handleRootClick", (evt) => {
|
|
28397
|
+
if (evt.target === this.rootView) {
|
|
28398
|
+
evt.stopPropagation();
|
|
28399
|
+
evt.preventDefault();
|
|
28400
|
+
this.emit("done", this.content.textContent ?? "");
|
|
28401
|
+
}
|
|
28402
|
+
});
|
|
27990
28403
|
this.camera = camera;
|
|
27991
28404
|
this.rootView = document.createElement("div");
|
|
27992
28405
|
this.rootView.style.cssText = `position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;`;
|
|
@@ -28006,27 +28419,6 @@ var TextEditor = class extends import_eventemitter35.EventEmitter {
|
|
|
28006
28419
|
this.updateMatrixStyle();
|
|
28007
28420
|
});
|
|
28008
28421
|
}
|
|
28009
|
-
handleContentInput = () => {
|
|
28010
|
-
this.emit("change", this.content.textContent ?? "");
|
|
28011
|
-
this.translateCaretIntoView();
|
|
28012
|
-
};
|
|
28013
|
-
handleContentKeydown = (evt) => {
|
|
28014
|
-
if (/^Arrow/.test(evt.key)) {
|
|
28015
|
-
setTimeout(() => {
|
|
28016
|
-
this.translateCaretIntoView();
|
|
28017
|
-
}, 50);
|
|
28018
|
-
}
|
|
28019
|
-
};
|
|
28020
|
-
handleContentBlur = () => {
|
|
28021
|
-
this.emit("done", this.content.textContent ?? "");
|
|
28022
|
-
};
|
|
28023
|
-
handleRootClick = (evt) => {
|
|
28024
|
-
if (evt.target === this.rootView) {
|
|
28025
|
-
evt.stopPropagation();
|
|
28026
|
-
evt.preventDefault();
|
|
28027
|
-
this.emit("done", this.content.textContent ?? "");
|
|
28028
|
-
}
|
|
28029
|
-
};
|
|
28030
28422
|
// 通过移动相机, 使光标在可见区域内
|
|
28031
28423
|
translateCaretIntoView() {
|
|
28032
28424
|
const selection = window.getSelection();
|
|
@@ -28093,6 +28485,23 @@ var TextEditor = class extends import_eventemitter35.EventEmitter {
|
|
|
28093
28485
|
};
|
|
28094
28486
|
|
|
28095
28487
|
// src/edit/Editor.ts
|
|
28488
|
+
function _defineProperty25(e, r, t) {
|
|
28489
|
+
return (r = _toPropertyKey25(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
28490
|
+
}
|
|
28491
|
+
function _toPropertyKey25(t) {
|
|
28492
|
+
var i = _toPrimitive25(t, "string");
|
|
28493
|
+
return "symbol" == typeof i ? i : i + "";
|
|
28494
|
+
}
|
|
28495
|
+
function _toPrimitive25(t, r) {
|
|
28496
|
+
if ("object" != typeof t || !t) return t;
|
|
28497
|
+
var e = t[Symbol.toPrimitive];
|
|
28498
|
+
if (void 0 !== e) {
|
|
28499
|
+
var i = e.call(t, r || "default");
|
|
28500
|
+
if ("object" != typeof i) return i;
|
|
28501
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
28502
|
+
}
|
|
28503
|
+
return ("string" === r ? String : Number)(t);
|
|
28504
|
+
}
|
|
28096
28505
|
var ANCHOR_STYLE = {
|
|
28097
28506
|
tl: "cursor:nw-resize;top:-3px;left:-3px",
|
|
28098
28507
|
t: "cursor:n-resize;top:-3px;left:50%;translate:-50%;",
|
|
@@ -28104,12 +28513,6 @@ var ANCHOR_STYLE = {
|
|
|
28104
28513
|
br: "cursor:se-resize;bottom:-3px;right:-3px"
|
|
28105
28514
|
};
|
|
28106
28515
|
var Bounds = class extends import_eventemitter36.default {
|
|
28107
|
-
minX = 0;
|
|
28108
|
-
minY = 0;
|
|
28109
|
-
maxX = 0;
|
|
28110
|
-
maxY = 0;
|
|
28111
|
-
binding;
|
|
28112
|
-
scope;
|
|
28113
28516
|
get width() {
|
|
28114
28517
|
return this.maxX - this.minX;
|
|
28115
28518
|
}
|
|
@@ -28124,6 +28527,12 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28124
28527
|
}
|
|
28125
28528
|
constructor(binding, scope) {
|
|
28126
28529
|
super();
|
|
28530
|
+
_defineProperty25(this, "minX", 0);
|
|
28531
|
+
_defineProperty25(this, "minY", 0);
|
|
28532
|
+
_defineProperty25(this, "maxX", 0);
|
|
28533
|
+
_defineProperty25(this, "maxY", 0);
|
|
28534
|
+
_defineProperty25(this, "binding", void 0);
|
|
28535
|
+
_defineProperty25(this, "scope", void 0);
|
|
28127
28536
|
this.binding = binding;
|
|
28128
28537
|
this.scope = scope;
|
|
28129
28538
|
}
|
|
@@ -28169,11 +28578,7 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28169
28578
|
}
|
|
28170
28579
|
this.minY += offsetY;
|
|
28171
28580
|
this.minX += offsetX;
|
|
28172
|
-
matrix.scale(
|
|
28173
|
-
this.width / prevWidth,
|
|
28174
|
-
this.height / prevHeight,
|
|
28175
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY))
|
|
28176
|
-
);
|
|
28581
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY)));
|
|
28177
28582
|
} else if (anchor === "t") {
|
|
28178
28583
|
if (aspectRatio > 0) {
|
|
28179
28584
|
offsetX = offsetY * aspectRatio;
|
|
@@ -28182,22 +28587,14 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28182
28587
|
}
|
|
28183
28588
|
this.minX += offsetX;
|
|
28184
28589
|
this.minY += offsetY;
|
|
28185
|
-
matrix.scale(
|
|
28186
|
-
this.width / prevWidth,
|
|
28187
|
-
this.height / prevHeight,
|
|
28188
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY))
|
|
28189
|
-
);
|
|
28590
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY)));
|
|
28190
28591
|
} else if (anchor === "tr") {
|
|
28191
28592
|
if (aspectRatio > 0) {
|
|
28192
28593
|
offsetY = -1 * offsetX / aspectRatio;
|
|
28193
28594
|
}
|
|
28194
28595
|
this.minY += offsetY;
|
|
28195
28596
|
this.maxX += offsetX;
|
|
28196
|
-
matrix.scale(
|
|
28197
|
-
this.width / prevWidth,
|
|
28198
|
-
this.height / prevHeight,
|
|
28199
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY))
|
|
28200
|
-
);
|
|
28597
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY)));
|
|
28201
28598
|
} else if (anchor === "l") {
|
|
28202
28599
|
if (aspectRatio > 0) {
|
|
28203
28600
|
offsetY = offsetX / aspectRatio;
|
|
@@ -28206,11 +28603,7 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28206
28603
|
}
|
|
28207
28604
|
this.minY += offsetY;
|
|
28208
28605
|
this.minX += offsetX;
|
|
28209
|
-
matrix.scale(
|
|
28210
|
-
this.width / prevWidth,
|
|
28211
|
-
this.height / prevHeight,
|
|
28212
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY))
|
|
28213
|
-
);
|
|
28606
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.maxY)));
|
|
28214
28607
|
} else if (anchor === "r") {
|
|
28215
28608
|
if (aspectRatio > 0) {
|
|
28216
28609
|
offsetY = -1 * offsetX / aspectRatio;
|
|
@@ -28219,22 +28612,14 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28219
28612
|
}
|
|
28220
28613
|
this.maxX += offsetX;
|
|
28221
28614
|
this.minY += offsetY;
|
|
28222
|
-
matrix.scale(
|
|
28223
|
-
this.width / prevWidth,
|
|
28224
|
-
this.height / prevHeight,
|
|
28225
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY))
|
|
28226
|
-
);
|
|
28615
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.maxY)));
|
|
28227
28616
|
} else if (anchor === "bl") {
|
|
28228
28617
|
if (aspectRatio > 0) {
|
|
28229
28618
|
offsetY = -1 * offsetX / aspectRatio;
|
|
28230
28619
|
}
|
|
28231
28620
|
this.minX += offsetX;
|
|
28232
28621
|
this.maxY += offsetY;
|
|
28233
|
-
matrix.scale(
|
|
28234
|
-
this.width / prevWidth,
|
|
28235
|
-
this.height / prevHeight,
|
|
28236
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY))
|
|
28237
|
-
);
|
|
28622
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY)));
|
|
28238
28623
|
} else if (anchor === "b") {
|
|
28239
28624
|
if (aspectRatio > 0) {
|
|
28240
28625
|
offsetX = -1 * offsetY * aspectRatio;
|
|
@@ -28243,22 +28628,14 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28243
28628
|
}
|
|
28244
28629
|
this.minX += offsetX;
|
|
28245
28630
|
this.maxY += offsetY;
|
|
28246
|
-
matrix.scale(
|
|
28247
|
-
this.width / prevWidth,
|
|
28248
|
-
this.height / prevHeight,
|
|
28249
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY))
|
|
28250
|
-
);
|
|
28631
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.maxX, this.minY)));
|
|
28251
28632
|
} else if (anchor === "br") {
|
|
28252
28633
|
if (aspectRatio > 0) {
|
|
28253
28634
|
offsetY = offsetX / aspectRatio;
|
|
28254
28635
|
}
|
|
28255
28636
|
this.maxY += offsetY;
|
|
28256
28637
|
this.maxX += offsetX;
|
|
28257
|
-
matrix.scale(
|
|
28258
|
-
this.width / prevWidth,
|
|
28259
|
-
this.height / prevHeight,
|
|
28260
|
-
this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.minY))
|
|
28261
|
-
);
|
|
28638
|
+
matrix.scale(this.width / prevWidth, this.height / prevHeight, this.scope.project.view.viewToProject(new this.scope.Point(this.minX, this.minY)));
|
|
28262
28639
|
}
|
|
28263
28640
|
this.updateBinding();
|
|
28264
28641
|
this.emit("matrix", matrix);
|
|
@@ -28275,56 +28652,215 @@ var Bounds = class extends import_eventemitter36.default {
|
|
|
28275
28652
|
}
|
|
28276
28653
|
};
|
|
28277
28654
|
var Editor = class extends import_eventemitter36.default {
|
|
28278
|
-
rootView;
|
|
28279
|
-
frame;
|
|
28280
|
-
rotator;
|
|
28281
|
-
scope;
|
|
28282
|
-
shadowScope;
|
|
28283
|
-
shadowContainer;
|
|
28284
|
-
ctrlUserMap;
|
|
28285
|
-
// 当前是谁的视角
|
|
28286
|
-
viewerId;
|
|
28287
|
-
// 谁在操控 Editor
|
|
28288
|
-
ctrlId;
|
|
28289
|
-
ctrlNickName;
|
|
28290
|
-
editMode = null;
|
|
28291
|
-
editCtrlName = null;
|
|
28292
|
-
editAnchor = null;
|
|
28293
|
-
lastEditPoint = null;
|
|
28294
|
-
bounds;
|
|
28295
|
-
targets = [];
|
|
28296
|
-
editorConfig = null;
|
|
28297
|
-
aspectRatio = -1;
|
|
28298
|
-
// 是否等比缩放, 设置后只会应用一次, 即 pointerup 之后会恢复为 false
|
|
28299
|
-
uniformScale = false;
|
|
28300
|
-
camera;
|
|
28301
|
-
canvasElement;
|
|
28302
|
-
resizeObserver;
|
|
28303
|
-
anchors = [];
|
|
28304
|
-
title = null;
|
|
28305
|
-
shadowEmitter;
|
|
28306
28655
|
constructor(scope, shadowScope, shadowEmitter, canvasElement, camera, initConfig) {
|
|
28307
28656
|
super();
|
|
28308
|
-
this
|
|
28309
|
-
this
|
|
28310
|
-
this
|
|
28311
|
-
this
|
|
28312
|
-
this
|
|
28313
|
-
this
|
|
28314
|
-
this
|
|
28315
|
-
this
|
|
28316
|
-
this
|
|
28317
|
-
this
|
|
28318
|
-
this
|
|
28319
|
-
this
|
|
28320
|
-
this
|
|
28321
|
-
this
|
|
28322
|
-
this
|
|
28323
|
-
this
|
|
28324
|
-
this
|
|
28325
|
-
this
|
|
28326
|
-
|
|
28327
|
-
this
|
|
28657
|
+
_defineProperty25(this, "rootView", void 0);
|
|
28658
|
+
_defineProperty25(this, "frame", void 0);
|
|
28659
|
+
_defineProperty25(this, "rotator", void 0);
|
|
28660
|
+
_defineProperty25(this, "scope", void 0);
|
|
28661
|
+
_defineProperty25(this, "shadowScope", void 0);
|
|
28662
|
+
_defineProperty25(this, "shadowContainer", void 0);
|
|
28663
|
+
_defineProperty25(this, "ctrlUserMap", void 0);
|
|
28664
|
+
_defineProperty25(this, "viewerId", void 0);
|
|
28665
|
+
_defineProperty25(this, "ctrlId", void 0);
|
|
28666
|
+
_defineProperty25(this, "ctrlNickName", void 0);
|
|
28667
|
+
_defineProperty25(this, "editMode", null);
|
|
28668
|
+
_defineProperty25(this, "editCtrlName", null);
|
|
28669
|
+
_defineProperty25(this, "editAnchor", null);
|
|
28670
|
+
_defineProperty25(this, "lastEditPoint", null);
|
|
28671
|
+
_defineProperty25(this, "bounds", void 0);
|
|
28672
|
+
_defineProperty25(this, "targets", []);
|
|
28673
|
+
_defineProperty25(this, "editorConfig", null);
|
|
28674
|
+
_defineProperty25(this, "aspectRatio", -1);
|
|
28675
|
+
_defineProperty25(this, "uniformScale", false);
|
|
28676
|
+
_defineProperty25(this, "camera", void 0);
|
|
28677
|
+
_defineProperty25(this, "canvasElement", void 0);
|
|
28678
|
+
_defineProperty25(this, "resizeObserver", void 0);
|
|
28679
|
+
_defineProperty25(this, "anchors", []);
|
|
28680
|
+
_defineProperty25(this, "title", null);
|
|
28681
|
+
_defineProperty25(this, "shadowEmitter", void 0);
|
|
28682
|
+
_defineProperty25(this, "handleMatrix", (matrix) => {
|
|
28683
|
+
if (this.shadowContainer) {
|
|
28684
|
+
const next = matrix.appended(this.shadowContainer.data.shadowMatrix ?? new this.shadowScope.Matrix());
|
|
28685
|
+
this.shadowContainer.data.shadowMatrix = next;
|
|
28686
|
+
this.shadowContainer.transform(this.shadowContainer.matrix.inverted());
|
|
28687
|
+
this.shadowContainer.matrix = next;
|
|
28688
|
+
} else {
|
|
28689
|
+
this.targets.forEach((target) => target.appendPointsMatrix(matrix));
|
|
28690
|
+
}
|
|
28691
|
+
});
|
|
28692
|
+
_defineProperty25(this, "handlePointerDown", (evt) => {
|
|
28693
|
+
if (!evt.target) {
|
|
28694
|
+
return;
|
|
28695
|
+
}
|
|
28696
|
+
this.shadowEmitter.setActive(true);
|
|
28697
|
+
this.translateShadow();
|
|
28698
|
+
const target = evt.target;
|
|
28699
|
+
const anchorType = target.getAttribute("data-anchor");
|
|
28700
|
+
if (anchorType) {
|
|
28701
|
+
evt.preventDefault();
|
|
28702
|
+
if (evt.metaKey || this.editorConfig?.uniformScale()) {
|
|
28703
|
+
this.uniformScale = true;
|
|
28704
|
+
}
|
|
28705
|
+
if (this.uniformScale) {
|
|
28706
|
+
this.aspectRatio = this.bounds.width / this.bounds.height;
|
|
28707
|
+
}
|
|
28708
|
+
this.editMode = "matrix";
|
|
28709
|
+
this.editAnchor = anchorType;
|
|
28710
|
+
this.lastEditPoint = {
|
|
28711
|
+
x: evt.pageX,
|
|
28712
|
+
y: evt.pageY
|
|
28713
|
+
};
|
|
28714
|
+
this.hiddenCtrlPoints();
|
|
28715
|
+
}
|
|
28716
|
+
if (target.getAttribute("data-rotator")) {
|
|
28717
|
+
evt.preventDefault();
|
|
28718
|
+
this.editMode = "rotate";
|
|
28719
|
+
this.lastEditPoint = {
|
|
28720
|
+
x: evt.pageX,
|
|
28721
|
+
y: evt.pageY
|
|
28722
|
+
};
|
|
28723
|
+
this.rootView.style.opacity = "0";
|
|
28724
|
+
}
|
|
28725
|
+
if (target === this.frame) {
|
|
28726
|
+
evt.preventDefault();
|
|
28727
|
+
this.editMode = "translate";
|
|
28728
|
+
this.lastEditPoint = {
|
|
28729
|
+
x: evt.pageX,
|
|
28730
|
+
y: evt.pageY
|
|
28731
|
+
};
|
|
28732
|
+
this.hiddenCtrlPoints();
|
|
28733
|
+
}
|
|
28734
|
+
if (target === this.rootView) {
|
|
28735
|
+
this.emit("clear");
|
|
28736
|
+
}
|
|
28737
|
+
const ctrlName = target.getAttribute("data-ctrl-name");
|
|
28738
|
+
if (ctrlName) {
|
|
28739
|
+
evt.preventDefault();
|
|
28740
|
+
this.editMode = "ctrl-point";
|
|
28741
|
+
this.editCtrlName = ctrlName;
|
|
28742
|
+
this.lastEditPoint = {
|
|
28743
|
+
x: evt.offsetX,
|
|
28744
|
+
y: evt.offsetY
|
|
28745
|
+
};
|
|
28746
|
+
}
|
|
28747
|
+
});
|
|
28748
|
+
_defineProperty25(this, "handlePointerMove", (evt) => {
|
|
28749
|
+
evt.preventDefault();
|
|
28750
|
+
if (!evt.target) {
|
|
28751
|
+
return;
|
|
28752
|
+
}
|
|
28753
|
+
if (this.editMode === "matrix" && this.editAnchor && this.lastEditPoint) {
|
|
28754
|
+
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28755
|
+
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28756
|
+
this.bounds.offsetBy(this.editAnchor, offsetX, offsetY, this.uniformScale ? this.aspectRatio : -1);
|
|
28757
|
+
this.lastEditPoint = {
|
|
28758
|
+
x: evt.pageX,
|
|
28759
|
+
y: evt.pageY
|
|
28760
|
+
};
|
|
28761
|
+
}
|
|
28762
|
+
if (this.editMode === "rotate" && this.lastEditPoint) {
|
|
28763
|
+
const pageCenter = this.bounds.pageCenter();
|
|
28764
|
+
const vector1 = new this.scope.Point(this.lastEditPoint.x, this.lastEditPoint.y).subtract(new this.scope.Point(pageCenter));
|
|
28765
|
+
const vector2 = new this.scope.Point(evt.pageX, evt.pageY).subtract(new this.scope.Point(pageCenter));
|
|
28766
|
+
const viewPoint = new this.scope.Point(this.bounds.midX, this.bounds.midY);
|
|
28767
|
+
const projectPoint = this.scope.project.view.viewToProject(viewPoint);
|
|
28768
|
+
this.targets.forEach((target) => {
|
|
28769
|
+
if (target.item) {
|
|
28770
|
+
target.rotateByOffset(vector2.angle - vector1.angle, projectPoint.x, projectPoint.y);
|
|
28771
|
+
}
|
|
28772
|
+
});
|
|
28773
|
+
this.lastEditPoint = {
|
|
28774
|
+
x: evt.pageX,
|
|
28775
|
+
y: evt.pageY
|
|
28776
|
+
};
|
|
28777
|
+
}
|
|
28778
|
+
if (this.editMode === "translate" && this.lastEditPoint) {
|
|
28779
|
+
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28780
|
+
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28781
|
+
this.bounds.translate(offsetX, offsetY);
|
|
28782
|
+
this.updateBoundsByShadow();
|
|
28783
|
+
this.lastEditPoint = {
|
|
28784
|
+
x: evt.pageX,
|
|
28785
|
+
y: evt.pageY
|
|
28786
|
+
};
|
|
28787
|
+
}
|
|
28788
|
+
if (this.editMode === "ctrl-point" && this.editorConfig) {
|
|
28789
|
+
const ctrlPoint = this.editorConfig.controlPoints.find((v) => v.name === this.editCtrlName);
|
|
28790
|
+
const ctrlElement = this.rootView.querySelector(`[data-ctrl-name="${this.editCtrlName}"]`);
|
|
28791
|
+
if (ctrlPoint && ctrlElement) {
|
|
28792
|
+
const projectPoint = this.scope.project.view.getEventPoint(evt);
|
|
28793
|
+
ctrlPoint.onPositionChange(projectPoint);
|
|
28794
|
+
this.updateBoundsByShadow();
|
|
28795
|
+
this.updateControlPointsPosition();
|
|
28796
|
+
}
|
|
28797
|
+
}
|
|
28798
|
+
});
|
|
28799
|
+
_defineProperty25(this, "handlePointerUp", (evt) => {
|
|
28800
|
+
evt.preventDefault();
|
|
28801
|
+
this.resetShadow();
|
|
28802
|
+
this.shadowEmitter.setActive(false);
|
|
28803
|
+
this.updateBounds();
|
|
28804
|
+
if (this.editMode === "rotate") {
|
|
28805
|
+
this.applyConfig(this.editorConfig);
|
|
28806
|
+
this.rootView.style.opacity = "1";
|
|
28807
|
+
}
|
|
28808
|
+
if (this.editMode === "matrix") {
|
|
28809
|
+
this.bounds.reset();
|
|
28810
|
+
}
|
|
28811
|
+
this.editMode = null;
|
|
28812
|
+
this.editAnchor = null;
|
|
28813
|
+
this.lastEditPoint = null;
|
|
28814
|
+
this.uniformScale = false;
|
|
28815
|
+
});
|
|
28816
|
+
_defineProperty25(this, "handleFrameDBClick", (evt) => {
|
|
28817
|
+
if (evt.target === this.frame && this.targets.length === 1) {
|
|
28818
|
+
if (this.targets[0].type === "point-text") {
|
|
28819
|
+
this.frame.style.display = "none";
|
|
28820
|
+
this.createTextEditor(this.targets[0]);
|
|
28821
|
+
}
|
|
28822
|
+
}
|
|
28823
|
+
});
|
|
28824
|
+
_defineProperty25(this, "updateBounds", () => {
|
|
28825
|
+
let minX = Number.MAX_VALUE;
|
|
28826
|
+
let maxX = -Number.MAX_VALUE;
|
|
28827
|
+
let minY = Number.MAX_VALUE;
|
|
28828
|
+
let maxY = -Number.MAX_VALUE;
|
|
28829
|
+
for (const model of this.targets) {
|
|
28830
|
+
if (!model.item) {
|
|
28831
|
+
continue;
|
|
28832
|
+
}
|
|
28833
|
+
const bound = model.item.bounds;
|
|
28834
|
+
minX = Math.min(bound.topLeft.x, minX);
|
|
28835
|
+
maxX = Math.max(bound.bottomRight.x, maxX);
|
|
28836
|
+
minY = Math.min(bound.topLeft.y, minY);
|
|
28837
|
+
maxY = Math.max(bound.bottomRight.y, maxY);
|
|
28838
|
+
}
|
|
28839
|
+
const fromPoint = new this.scope.Point(minX, minY).transform(this.scope.project.view.matrix);
|
|
28840
|
+
const toPoint = new this.scope.Point(maxX, maxY).transform(this.scope.project.view.matrix);
|
|
28841
|
+
this.bounds.update(fromPoint.x, fromPoint.y, toPoint.x, toPoint.y);
|
|
28842
|
+
this.updateControlPointsPosition();
|
|
28843
|
+
});
|
|
28844
|
+
this.shadowEmitter = shadowEmitter;
|
|
28845
|
+
this.shadowScope = shadowScope;
|
|
28846
|
+
this.shadowContainer = new shadowScope.Group();
|
|
28847
|
+
this.shadowContainer.applyMatrix = false;
|
|
28848
|
+
this.shadowContainer.data.uuid = `shadow-container-${initConfig.ctrlId}`;
|
|
28849
|
+
this.canvasElement = canvasElement;
|
|
28850
|
+
this.camera = camera;
|
|
28851
|
+
this.scope = scope;
|
|
28852
|
+
this.ctrlUserMap = initConfig.ctrlUserMap;
|
|
28853
|
+
this.viewerId = initConfig.viewerId;
|
|
28854
|
+
this.ctrlId = initConfig.ctrlId;
|
|
28855
|
+
this.ctrlNickName = initConfig.ctrlNickName;
|
|
28856
|
+
this.rootView = document.createElement("div");
|
|
28857
|
+
this.rootView.style.cssText = `position:absolute;display:none;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%,-50%);`;
|
|
28858
|
+
this.frame = document.createElement("div");
|
|
28859
|
+
this.frame.style.position = "absolute";
|
|
28860
|
+
this.frame.style.padding = "8px";
|
|
28861
|
+
this.frame.style.transform = "translate(-8px, -8px)";
|
|
28862
|
+
this.rootView.appendChild(this.frame);
|
|
28863
|
+
this.bounds = new Bounds(this.frame, this.scope);
|
|
28328
28864
|
this.bounds.on("matrix", this.handleMatrix);
|
|
28329
28865
|
this.rotator = document.createElement("div");
|
|
28330
28866
|
this.rotator.setAttribute("data-rotator", "true");
|
|
@@ -28354,104 +28890,6 @@ var Editor = class extends import_eventemitter36.default {
|
|
|
28354
28890
|
this.rootView.style.width = `${rect.width}px`;
|
|
28355
28891
|
this.rootView.style.height = `${rect.height}px`;
|
|
28356
28892
|
}
|
|
28357
|
-
handleMatrix = (matrix) => {
|
|
28358
|
-
if (this.shadowContainer) {
|
|
28359
|
-
const next = matrix.appended(
|
|
28360
|
-
this.shadowContainer.data.shadowMatrix ?? new this.shadowScope.Matrix()
|
|
28361
|
-
);
|
|
28362
|
-
this.shadowContainer.data.shadowMatrix = next;
|
|
28363
|
-
this.shadowContainer.transform(this.shadowContainer.matrix.inverted());
|
|
28364
|
-
this.shadowContainer.matrix = next;
|
|
28365
|
-
} else {
|
|
28366
|
-
this.targets.forEach((target) => target.appendPointsMatrix(matrix));
|
|
28367
|
-
}
|
|
28368
|
-
};
|
|
28369
|
-
handlePointerDown = (evt) => {
|
|
28370
|
-
if (!evt.target) {
|
|
28371
|
-
return;
|
|
28372
|
-
}
|
|
28373
|
-
this.shadowEmitter.setActive(true);
|
|
28374
|
-
this.translateShadow();
|
|
28375
|
-
const target = evt.target;
|
|
28376
|
-
const anchorType = target.getAttribute("data-anchor");
|
|
28377
|
-
if (anchorType) {
|
|
28378
|
-
evt.preventDefault();
|
|
28379
|
-
if (evt.metaKey || this.editorConfig?.uniformScale()) {
|
|
28380
|
-
this.uniformScale = true;
|
|
28381
|
-
}
|
|
28382
|
-
if (this.uniformScale) {
|
|
28383
|
-
this.aspectRatio = this.bounds.width / this.bounds.height;
|
|
28384
|
-
}
|
|
28385
|
-
this.editMode = "matrix";
|
|
28386
|
-
this.editAnchor = anchorType;
|
|
28387
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28388
|
-
this.hiddenCtrlPoints();
|
|
28389
|
-
}
|
|
28390
|
-
if (target.getAttribute("data-rotator")) {
|
|
28391
|
-
evt.preventDefault();
|
|
28392
|
-
this.editMode = "rotate";
|
|
28393
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28394
|
-
this.rootView.style.opacity = "0";
|
|
28395
|
-
}
|
|
28396
|
-
if (target === this.frame) {
|
|
28397
|
-
evt.preventDefault();
|
|
28398
|
-
this.editMode = "translate";
|
|
28399
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28400
|
-
this.hiddenCtrlPoints();
|
|
28401
|
-
}
|
|
28402
|
-
if (target === this.rootView) {
|
|
28403
|
-
this.emit("clear");
|
|
28404
|
-
}
|
|
28405
|
-
const ctrlName = target.getAttribute("data-ctrl-name");
|
|
28406
|
-
if (ctrlName) {
|
|
28407
|
-
evt.preventDefault();
|
|
28408
|
-
this.editMode = "ctrl-point";
|
|
28409
|
-
this.editCtrlName = ctrlName;
|
|
28410
|
-
this.lastEditPoint = { x: evt.offsetX, y: evt.offsetY };
|
|
28411
|
-
}
|
|
28412
|
-
};
|
|
28413
|
-
handlePointerMove = (evt) => {
|
|
28414
|
-
evt.preventDefault();
|
|
28415
|
-
if (!evt.target) {
|
|
28416
|
-
return;
|
|
28417
|
-
}
|
|
28418
|
-
if (this.editMode === "matrix" && this.editAnchor && this.lastEditPoint) {
|
|
28419
|
-
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28420
|
-
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28421
|
-
this.bounds.offsetBy(this.editAnchor, offsetX, offsetY, this.uniformScale ? this.aspectRatio : -1);
|
|
28422
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28423
|
-
}
|
|
28424
|
-
if (this.editMode === "rotate" && this.lastEditPoint) {
|
|
28425
|
-
const pageCenter = this.bounds.pageCenter();
|
|
28426
|
-
const vector1 = new this.scope.Point(this.lastEditPoint.x, this.lastEditPoint.y).subtract(new this.scope.Point(pageCenter));
|
|
28427
|
-
const vector2 = new this.scope.Point(evt.pageX, evt.pageY).subtract(new this.scope.Point(pageCenter));
|
|
28428
|
-
const viewPoint = new this.scope.Point(this.bounds.midX, this.bounds.midY);
|
|
28429
|
-
const projectPoint = this.scope.project.view.viewToProject(viewPoint);
|
|
28430
|
-
this.targets.forEach((target) => {
|
|
28431
|
-
if (target.item) {
|
|
28432
|
-
target.rotateByOffset(vector2.angle - vector1.angle, projectPoint.x, projectPoint.y);
|
|
28433
|
-
}
|
|
28434
|
-
});
|
|
28435
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28436
|
-
}
|
|
28437
|
-
if (this.editMode === "translate" && this.lastEditPoint) {
|
|
28438
|
-
const offsetX = evt.pageX - this.lastEditPoint.x;
|
|
28439
|
-
let offsetY = evt.pageY - this.lastEditPoint.y;
|
|
28440
|
-
this.bounds.translate(offsetX, offsetY);
|
|
28441
|
-
this.updateBoundsByShadow();
|
|
28442
|
-
this.lastEditPoint = { x: evt.pageX, y: evt.pageY };
|
|
28443
|
-
}
|
|
28444
|
-
if (this.editMode === "ctrl-point" && this.editorConfig) {
|
|
28445
|
-
const ctrlPoint = this.editorConfig.controlPoints.find((v) => v.name === this.editCtrlName);
|
|
28446
|
-
const ctrlElement = this.rootView.querySelector(`[data-ctrl-name="${this.editCtrlName}"]`);
|
|
28447
|
-
if (ctrlPoint && ctrlElement) {
|
|
28448
|
-
const projectPoint = this.scope.project.view.getEventPoint(evt);
|
|
28449
|
-
ctrlPoint.onPositionChange(projectPoint);
|
|
28450
|
-
this.updateBoundsByShadow();
|
|
28451
|
-
this.updateControlPointsPosition();
|
|
28452
|
-
}
|
|
28453
|
-
}
|
|
28454
|
-
};
|
|
28455
28893
|
hiddenCtrlPoints() {
|
|
28456
28894
|
this.editorConfig?.controlPoints.forEach((ctrl) => {
|
|
28457
28895
|
const ctrlElement = this.rootView.querySelector(`[data-ctrl-name="${ctrl.name}"]`);
|
|
@@ -28460,31 +28898,6 @@ var Editor = class extends import_eventemitter36.default {
|
|
|
28460
28898
|
}
|
|
28461
28899
|
});
|
|
28462
28900
|
}
|
|
28463
|
-
handlePointerUp = (evt) => {
|
|
28464
|
-
evt.preventDefault();
|
|
28465
|
-
this.resetShadow();
|
|
28466
|
-
this.shadowEmitter.setActive(false);
|
|
28467
|
-
this.updateBounds();
|
|
28468
|
-
if (this.editMode === "rotate") {
|
|
28469
|
-
this.applyConfig(this.editorConfig);
|
|
28470
|
-
this.rootView.style.opacity = "1";
|
|
28471
|
-
}
|
|
28472
|
-
if (this.editMode === "matrix") {
|
|
28473
|
-
this.bounds.reset();
|
|
28474
|
-
}
|
|
28475
|
-
this.editMode = null;
|
|
28476
|
-
this.editAnchor = null;
|
|
28477
|
-
this.lastEditPoint = null;
|
|
28478
|
-
this.uniformScale = false;
|
|
28479
|
-
};
|
|
28480
|
-
handleFrameDBClick = (evt) => {
|
|
28481
|
-
if (evt.target === this.frame && this.targets.length === 1) {
|
|
28482
|
-
if (this.targets[0].type === "point-text") {
|
|
28483
|
-
this.frame.style.display = "none";
|
|
28484
|
-
this.createTextEditor(this.targets[0]);
|
|
28485
|
-
}
|
|
28486
|
-
}
|
|
28487
|
-
};
|
|
28488
28901
|
createTextEditor(target) {
|
|
28489
28902
|
const measurement = target.getInternalMeasurement();
|
|
28490
28903
|
if (!measurement) {
|
|
@@ -28605,38 +29018,10 @@ var Editor = class extends import_eventemitter36.default {
|
|
|
28605
29018
|
maxX = Math.max(bounds.bottomRight.x, maxX);
|
|
28606
29019
|
minY = Math.min(bounds.topLeft.y, minY);
|
|
28607
29020
|
maxY = Math.max(bounds.bottomRight.y, maxY);
|
|
28608
|
-
const fromPoint = new this.shadowScope.Point(minX, minY).transform(
|
|
28609
|
-
|
|
28610
|
-
);
|
|
28611
|
-
const toPoint = new this.shadowScope.Point(maxX, maxY).transform(
|
|
28612
|
-
this.shadowScope.project.view.matrix
|
|
28613
|
-
);
|
|
29021
|
+
const fromPoint = new this.shadowScope.Point(minX, minY).transform(this.shadowScope.project.view.matrix);
|
|
29022
|
+
const toPoint = new this.shadowScope.Point(maxX, maxY).transform(this.shadowScope.project.view.matrix);
|
|
28614
29023
|
this.bounds.update(fromPoint.x, fromPoint.y, toPoint.x, toPoint.y);
|
|
28615
29024
|
}
|
|
28616
|
-
updateBounds = () => {
|
|
28617
|
-
let minX = Number.MAX_VALUE;
|
|
28618
|
-
let maxX = -Number.MAX_VALUE;
|
|
28619
|
-
let minY = Number.MAX_VALUE;
|
|
28620
|
-
let maxY = -Number.MAX_VALUE;
|
|
28621
|
-
for (const model of this.targets) {
|
|
28622
|
-
if (!model.item) {
|
|
28623
|
-
continue;
|
|
28624
|
-
}
|
|
28625
|
-
const bound = model.item.bounds;
|
|
28626
|
-
minX = Math.min(bound.topLeft.x, minX);
|
|
28627
|
-
maxX = Math.max(bound.bottomRight.x, maxX);
|
|
28628
|
-
minY = Math.min(bound.topLeft.y, minY);
|
|
28629
|
-
maxY = Math.max(bound.bottomRight.y, maxY);
|
|
28630
|
-
}
|
|
28631
|
-
const fromPoint = new this.scope.Point(minX, minY).transform(
|
|
28632
|
-
this.scope.project.view.matrix
|
|
28633
|
-
);
|
|
28634
|
-
const toPoint = new this.scope.Point(maxX, maxY).transform(
|
|
28635
|
-
this.scope.project.view.matrix
|
|
28636
|
-
);
|
|
28637
|
-
this.bounds.update(fromPoint.x, fromPoint.y, toPoint.x, toPoint.y);
|
|
28638
|
-
this.updateControlPointsPosition();
|
|
28639
|
-
};
|
|
28640
29025
|
translateShadow() {
|
|
28641
29026
|
this.shadowContainer.removeChildren();
|
|
28642
29027
|
this.shadowContainer.remove();
|
|
@@ -28686,16 +29071,33 @@ var Editor = class extends import_eventemitter36.default {
|
|
|
28686
29071
|
};
|
|
28687
29072
|
|
|
28688
29073
|
// src/tool/TextTool.ts
|
|
29074
|
+
function _defineProperty26(e, r, t) {
|
|
29075
|
+
return (r = _toPropertyKey26(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29076
|
+
}
|
|
29077
|
+
function _toPropertyKey26(t) {
|
|
29078
|
+
var i = _toPrimitive26(t, "string");
|
|
29079
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29080
|
+
}
|
|
29081
|
+
function _toPrimitive26(t, r) {
|
|
29082
|
+
if ("object" != typeof t || !t) return t;
|
|
29083
|
+
var e = t[Symbol.toPrimitive];
|
|
29084
|
+
if (void 0 !== e) {
|
|
29085
|
+
var i = e.call(t, r || "default");
|
|
29086
|
+
if ("object" != typeof i) return i;
|
|
29087
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29088
|
+
}
|
|
29089
|
+
return ("string" === r ? String : Number)(t);
|
|
29090
|
+
}
|
|
28689
29091
|
var TextTool = class extends WhiteboardTool {
|
|
28690
|
-
from = null;
|
|
28691
|
-
to = null;
|
|
28692
|
-
rootView;
|
|
28693
|
-
canvasElement;
|
|
28694
|
-
elementModel = null;
|
|
28695
|
-
toolbarModel;
|
|
28696
|
-
camera;
|
|
28697
29092
|
constructor(enableToolEvent, model, shadowEmitter, scope, rootView, canvasElement, toolbarModel, camera) {
|
|
28698
29093
|
super(enableToolEvent, model, shadowEmitter, scope);
|
|
29094
|
+
_defineProperty26(this, "from", null);
|
|
29095
|
+
_defineProperty26(this, "to", null);
|
|
29096
|
+
_defineProperty26(this, "rootView", void 0);
|
|
29097
|
+
_defineProperty26(this, "canvasElement", void 0);
|
|
29098
|
+
_defineProperty26(this, "elementModel", null);
|
|
29099
|
+
_defineProperty26(this, "toolbarModel", void 0);
|
|
29100
|
+
_defineProperty26(this, "camera", void 0);
|
|
28699
29101
|
this.rootView = rootView;
|
|
28700
29102
|
this.canvasElement = canvasElement;
|
|
28701
29103
|
this.toolbarModel = toolbarModel;
|
|
@@ -28760,92 +29162,105 @@ var import_eventemitter38 = __toESM(require("eventemitter3"), 1);
|
|
|
28760
29162
|
|
|
28761
29163
|
// src/Gesture.ts
|
|
28762
29164
|
var import_eventemitter37 = __toESM(require("eventemitter3"), 1);
|
|
29165
|
+
function _defineProperty27(e, r, t) {
|
|
29166
|
+
return (r = _toPropertyKey27(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29167
|
+
}
|
|
29168
|
+
function _toPropertyKey27(t) {
|
|
29169
|
+
var i = _toPrimitive27(t, "string");
|
|
29170
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29171
|
+
}
|
|
29172
|
+
function _toPrimitive27(t, r) {
|
|
29173
|
+
if ("object" != typeof t || !t) return t;
|
|
29174
|
+
var e = t[Symbol.toPrimitive];
|
|
29175
|
+
if (void 0 !== e) {
|
|
29176
|
+
var i = e.call(t, r || "default");
|
|
29177
|
+
if ("object" != typeof i) return i;
|
|
29178
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29179
|
+
}
|
|
29180
|
+
return ("string" === r ? String : Number)(t);
|
|
29181
|
+
}
|
|
28763
29182
|
var Gesture = class extends import_eventemitter37.default {
|
|
28764
|
-
element;
|
|
28765
|
-
scope;
|
|
28766
|
-
lastVector = null;
|
|
28767
|
-
lastPoint = null;
|
|
28768
29183
|
constructor(element, scope) {
|
|
28769
29184
|
super();
|
|
28770
|
-
this
|
|
28771
|
-
this
|
|
28772
|
-
this
|
|
28773
|
-
this
|
|
28774
|
-
this
|
|
28775
|
-
|
|
28776
|
-
|
|
28777
|
-
|
|
28778
|
-
|
|
28779
|
-
evt.stopPropagation();
|
|
28780
|
-
evt.stopImmediatePropagation();
|
|
28781
|
-
} else {
|
|
28782
|
-
return;
|
|
28783
|
-
}
|
|
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
|
-
this.lastVector = p2.subtract(p1);
|
|
28787
|
-
this.lastPoint = p1;
|
|
28788
|
-
};
|
|
28789
|
-
onTouchMove = (evt) => {
|
|
28790
|
-
if (this.lastVector && this.lastPoint && evt.touches.length === 2) {
|
|
28791
|
-
evt.preventDefault();
|
|
28792
|
-
evt.stopPropagation();
|
|
28793
|
-
evt.stopImmediatePropagation();
|
|
28794
|
-
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
28795
|
-
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
28796
|
-
const currentVector = p2.subtract(p1);
|
|
28797
|
-
if (Math.abs(this.lastVector.length - currentVector.length) < 5) {
|
|
28798
|
-
this.emit("offset", p1.x - this.lastPoint.x, p1.y - this.lastPoint.y);
|
|
29185
|
+
_defineProperty27(this, "element", void 0);
|
|
29186
|
+
_defineProperty27(this, "scope", void 0);
|
|
29187
|
+
_defineProperty27(this, "lastVector", null);
|
|
29188
|
+
_defineProperty27(this, "lastPoint", null);
|
|
29189
|
+
_defineProperty27(this, "onTouchStart", (evt) => {
|
|
29190
|
+
if (evt.touches.length > 1) {
|
|
29191
|
+
evt.preventDefault();
|
|
29192
|
+
evt.stopPropagation();
|
|
29193
|
+
evt.stopImmediatePropagation();
|
|
28799
29194
|
} else {
|
|
28800
|
-
|
|
28801
|
-
x: (p2.x + p1.x) / 2,
|
|
28802
|
-
y: (p2.y + p1.y) / 2
|
|
28803
|
-
}));
|
|
29195
|
+
return;
|
|
28804
29196
|
}
|
|
28805
|
-
this.lastPoint = p1;
|
|
28806
|
-
this.lastVector = currentVector;
|
|
28807
|
-
} else if (evt.touches.length === 2) {
|
|
28808
|
-
evt.preventDefault();
|
|
28809
|
-
evt.stopPropagation();
|
|
28810
|
-
evt.stopImmediatePropagation();
|
|
28811
29197
|
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
28812
29198
|
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
28813
29199
|
this.lastVector = p2.subtract(p1);
|
|
28814
29200
|
this.lastPoint = p1;
|
|
28815
|
-
}
|
|
29201
|
+
});
|
|
29202
|
+
_defineProperty27(this, "onTouchMove", (evt) => {
|
|
29203
|
+
if (this.lastVector && this.lastPoint && evt.touches.length === 2) {
|
|
29204
|
+
evt.preventDefault();
|
|
29205
|
+
evt.stopPropagation();
|
|
29206
|
+
evt.stopImmediatePropagation();
|
|
29207
|
+
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
29208
|
+
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
29209
|
+
const currentVector = p2.subtract(p1);
|
|
29210
|
+
if (Math.abs(this.lastVector.length - currentVector.length) < 5) {
|
|
29211
|
+
this.emit("offset", p1.x - this.lastPoint.x, p1.y - this.lastPoint.y);
|
|
29212
|
+
} else {
|
|
29213
|
+
this.emit("scale", currentVector.length / this.lastVector.length, new this.scope.Point({
|
|
29214
|
+
x: (p2.x + p1.x) / 2,
|
|
29215
|
+
y: (p2.y + p1.y) / 2
|
|
29216
|
+
}));
|
|
29217
|
+
}
|
|
29218
|
+
this.lastPoint = p1;
|
|
29219
|
+
this.lastVector = currentVector;
|
|
29220
|
+
} else if (evt.touches.length === 2) {
|
|
29221
|
+
evt.preventDefault();
|
|
29222
|
+
evt.stopPropagation();
|
|
29223
|
+
evt.stopImmediatePropagation();
|
|
29224
|
+
const p1 = new this.scope.Point(evt.touches[0].pageX, evt.touches[0].pageY);
|
|
29225
|
+
const p2 = new this.scope.Point(evt.touches[1].pageX, evt.touches[1].pageY);
|
|
29226
|
+
this.lastVector = p2.subtract(p1);
|
|
29227
|
+
this.lastPoint = p1;
|
|
29228
|
+
} else {
|
|
29229
|
+
this.lastVector = null;
|
|
29230
|
+
this.lastPoint = null;
|
|
29231
|
+
}
|
|
29232
|
+
});
|
|
29233
|
+
_defineProperty27(this, "onTouchEnd", () => {
|
|
28816
29234
|
this.lastVector = null;
|
|
28817
29235
|
this.lastPoint = null;
|
|
28818
|
-
}
|
|
28819
|
-
|
|
28820
|
-
|
|
28821
|
-
this.
|
|
28822
|
-
this.
|
|
28823
|
-
|
|
29236
|
+
});
|
|
29237
|
+
this.element = element;
|
|
29238
|
+
this.scope = scope;
|
|
29239
|
+
this.element.addEventListener("touchstart", this.onTouchStart);
|
|
29240
|
+
this.element.addEventListener("touchmove", this.onTouchMove);
|
|
29241
|
+
this.element.addEventListener("touchend", this.onTouchEnd);
|
|
29242
|
+
}
|
|
28824
29243
|
};
|
|
28825
29244
|
|
|
28826
29245
|
// src/Camera.ts
|
|
29246
|
+
function _defineProperty28(e, r, t) {
|
|
29247
|
+
return (r = _toPropertyKey28(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29248
|
+
}
|
|
29249
|
+
function _toPropertyKey28(t) {
|
|
29250
|
+
var i = _toPrimitive28(t, "string");
|
|
29251
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29252
|
+
}
|
|
29253
|
+
function _toPrimitive28(t, r) {
|
|
29254
|
+
if ("object" != typeof t || !t) return t;
|
|
29255
|
+
var e = t[Symbol.toPrimitive];
|
|
29256
|
+
if (void 0 !== e) {
|
|
29257
|
+
var i = e.call(t, r || "default");
|
|
29258
|
+
if ("object" != typeof i) return i;
|
|
29259
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29260
|
+
}
|
|
29261
|
+
return ("string" === r ? String : Number)(t);
|
|
29262
|
+
}
|
|
28827
29263
|
var Camera = class extends import_eventemitter38.default {
|
|
28828
|
-
scope;
|
|
28829
|
-
dom;
|
|
28830
|
-
lastTriggerTime = 0;
|
|
28831
|
-
lastDelta = { x: 0, y: 0 };
|
|
28832
|
-
requestUserMap;
|
|
28833
|
-
userManager;
|
|
28834
|
-
observers = /* @__PURE__ */ new Map();
|
|
28835
|
-
whiteboardAttrsMap;
|
|
28836
|
-
paperSize;
|
|
28837
|
-
domSize;
|
|
28838
|
-
hasPermission;
|
|
28839
|
-
gesture;
|
|
28840
|
-
inherentScale = 1;
|
|
28841
|
-
maxScale;
|
|
28842
|
-
initSize;
|
|
28843
|
-
bound;
|
|
28844
|
-
boundTiemoutId;
|
|
28845
|
-
enableByMouse = true;
|
|
28846
|
-
enableByTouch = true;
|
|
28847
|
-
boundaryColor = "#F44336";
|
|
28848
|
-
enableBoundaryHighlight = true;
|
|
28849
29264
|
get inherentMatrix() {
|
|
28850
29265
|
const inherentMatrix = new this.scope.Matrix();
|
|
28851
29266
|
inherentMatrix.scale(this.inherentScale, [0, 0]);
|
|
@@ -28855,25 +29270,158 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
28855
29270
|
const view = this.scope.project.view;
|
|
28856
29271
|
return 1 / view.matrix.scaling.x;
|
|
28857
29272
|
}
|
|
28858
|
-
constructor(initSize, maxScale, dom, userManager, scope, whiteboardAttrsMap, hasPermission, requestUserMap,
|
|
29273
|
+
constructor(initSize, maxScale, dom, userManager, scope, whiteboardAttrsMap, hasPermission, requestUserMap, _paperSize, _domSize) {
|
|
28859
29274
|
super();
|
|
29275
|
+
_defineProperty28(this, "scope", void 0);
|
|
29276
|
+
_defineProperty28(this, "dom", void 0);
|
|
29277
|
+
_defineProperty28(this, "lastTriggerTime", 0);
|
|
29278
|
+
_defineProperty28(this, "lastDelta", {
|
|
29279
|
+
x: 0,
|
|
29280
|
+
y: 0
|
|
29281
|
+
});
|
|
29282
|
+
_defineProperty28(this, "requestUserMap", void 0);
|
|
29283
|
+
_defineProperty28(this, "userManager", void 0);
|
|
29284
|
+
_defineProperty28(this, "observers", /* @__PURE__ */ new Map());
|
|
29285
|
+
_defineProperty28(this, "whiteboardAttrsMap", void 0);
|
|
29286
|
+
_defineProperty28(this, "paperSize", void 0);
|
|
29287
|
+
_defineProperty28(this, "domSize", void 0);
|
|
29288
|
+
_defineProperty28(this, "hasPermission", void 0);
|
|
29289
|
+
_defineProperty28(this, "gesture", void 0);
|
|
29290
|
+
_defineProperty28(this, "inherentScale", 1);
|
|
29291
|
+
_defineProperty28(this, "maxScale", void 0);
|
|
29292
|
+
_defineProperty28(this, "initSize", void 0);
|
|
29293
|
+
_defineProperty28(this, "bound", void 0);
|
|
29294
|
+
_defineProperty28(this, "boundTiemoutId", void 0);
|
|
29295
|
+
_defineProperty28(this, "enableByMouse", true);
|
|
29296
|
+
_defineProperty28(this, "enableByTouch", true);
|
|
29297
|
+
_defineProperty28(this, "boundaryColor", "#F44336");
|
|
29298
|
+
_defineProperty28(this, "enableBoundaryHighlight", true);
|
|
29299
|
+
_defineProperty28(this, "handleMainCameraChange", (evt) => {
|
|
29300
|
+
const userMap = this.requestUserMap(this.userManager.selfId);
|
|
29301
|
+
const cameraMode = userMap.get(WhiteboardKeys.cameraMode);
|
|
29302
|
+
if (cameraMode !== "main") {
|
|
29303
|
+
return;
|
|
29304
|
+
}
|
|
29305
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29306
|
+
if (key === WhiteboardKeys.viewMatrix) {
|
|
29307
|
+
if (value.action === "add" || value.action === "update") {
|
|
29308
|
+
const matrixValue = this.whiteboardAttrsMap.get(WhiteboardKeys.viewMatrix);
|
|
29309
|
+
const matrix = new this.scope.Matrix(matrixValue);
|
|
29310
|
+
userMap.set(WhiteboardKeys.viewMatrix, matrixValue);
|
|
29311
|
+
this.emit("zoom", this.inherentMatrix.appended(matrix));
|
|
29312
|
+
}
|
|
29313
|
+
}
|
|
29314
|
+
}
|
|
29315
|
+
});
|
|
29316
|
+
_defineProperty28(this, "handleUserLeave", (user) => {
|
|
29317
|
+
const cb = this.observers.get(user.id);
|
|
29318
|
+
if (cb) {
|
|
29319
|
+
this.requestUserMap(user.id).unobserve(cb);
|
|
29320
|
+
}
|
|
29321
|
+
});
|
|
29322
|
+
_defineProperty28(this, "handleUserJoin", (user) => {
|
|
29323
|
+
const observer = (evt) => {
|
|
29324
|
+
this.handleViewMatrixUpdate(user.id, evt);
|
|
29325
|
+
};
|
|
29326
|
+
this.requestUserMap(user.id).observe(observer);
|
|
29327
|
+
this.observers.set(user.id, observer);
|
|
29328
|
+
});
|
|
29329
|
+
_defineProperty28(this, "handleViewMatrixUpdate", (userId, evt) => {
|
|
29330
|
+
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
29331
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29332
|
+
if (value.action === "update") {
|
|
29333
|
+
if (key === WhiteboardKeys.viewMatrix) {
|
|
29334
|
+
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
29335
|
+
const targetMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
29336
|
+
const target = new this.scope.Matrix(targetMatrixValue);
|
|
29337
|
+
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.viewMatrix, targetMatrixValue);
|
|
29338
|
+
this.emit("zoom", this.inherentMatrix.appended(target));
|
|
29339
|
+
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
29340
|
+
const currentMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
29341
|
+
const current = new this.scope.Matrix(currentMatrixValue);
|
|
29342
|
+
this.emit("zoom", this.inherentMatrix.appended(current));
|
|
29343
|
+
}
|
|
29344
|
+
} else if (key === WhiteboardKeys.currentPage) {
|
|
29345
|
+
if (value.action === "update" || value.action === "add") {
|
|
29346
|
+
this.emit("userPageChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.currentPage));
|
|
29347
|
+
}
|
|
29348
|
+
} else if (key === WhiteboardKeys.cameraMode) {
|
|
29349
|
+
if (value.action === "update" || value.action === "add") {
|
|
29350
|
+
this.emit("userViewModeChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.cameraMode));
|
|
29351
|
+
}
|
|
29352
|
+
}
|
|
29353
|
+
}
|
|
29354
|
+
}
|
|
29355
|
+
});
|
|
29356
|
+
_defineProperty28(this, "handleWheel", (evt) => {
|
|
29357
|
+
if (!this.enableByMouse) {
|
|
29358
|
+
return;
|
|
29359
|
+
}
|
|
29360
|
+
evt.preventDefault();
|
|
29361
|
+
evt.stopImmediatePropagation();
|
|
29362
|
+
evt.stopPropagation();
|
|
29363
|
+
const domSize = this.domSize();
|
|
29364
|
+
const paperSize = this.paperSize();
|
|
29365
|
+
const inherentDeltaY = evt.deltaY / domSize[1] * paperSize[1];
|
|
29366
|
+
const inherentDeltaX = evt.deltaX / domSize[0] * paperSize[0];
|
|
29367
|
+
if (Date.now() - this.lastTriggerTime < 32) {
|
|
29368
|
+
this.lastDelta.y += inherentDeltaY;
|
|
29369
|
+
this.lastDelta.x += inherentDeltaX;
|
|
29370
|
+
return;
|
|
29371
|
+
}
|
|
29372
|
+
if (evt.ctrlKey) {
|
|
29373
|
+
const wheelDelta = Math.sign(evt.wheelDelta || 100) * 120;
|
|
29374
|
+
const paperPoint = this.scope.project.view.getEventPoint(evt);
|
|
29375
|
+
const deltaY = inherentDeltaY + this.lastDelta.y;
|
|
29376
|
+
const matrix = new this.scope.Matrix();
|
|
29377
|
+
let scale = 1;
|
|
29378
|
+
if (deltaY > 0) {
|
|
29379
|
+
scale = Math.max(1 - Math.abs(deltaY / wheelDelta), 1e-8);
|
|
29380
|
+
} else {
|
|
29381
|
+
scale = 1 + Math.abs(deltaY / wheelDelta);
|
|
29382
|
+
}
|
|
29383
|
+
scale = Math.max(0.9, scale);
|
|
29384
|
+
scale = Math.min(1.1, scale);
|
|
29385
|
+
matrix.scale(scale, paperPoint);
|
|
29386
|
+
this.updateViewMatrix(matrix);
|
|
29387
|
+
} else {
|
|
29388
|
+
const deltaX = this.lastDelta.x + evt.deltaX;
|
|
29389
|
+
const deltaY = this.lastDelta.y + evt.deltaY;
|
|
29390
|
+
const matrix = new this.scope.Matrix();
|
|
29391
|
+
matrix.translate({
|
|
29392
|
+
x: -deltaX * window.devicePixelRatio,
|
|
29393
|
+
y: -deltaY * window.devicePixelRatio
|
|
29394
|
+
});
|
|
29395
|
+
this.updateViewMatrix(matrix);
|
|
29396
|
+
}
|
|
29397
|
+
this.lastTriggerTime = Date.now();
|
|
29398
|
+
this.lastDelta = {
|
|
29399
|
+
x: 0,
|
|
29400
|
+
y: 0
|
|
29401
|
+
};
|
|
29402
|
+
});
|
|
28860
29403
|
this.maxScale = maxScale;
|
|
28861
29404
|
this.bound = window.document.createElement("div");
|
|
28862
29405
|
this.bound.style.cssText = `transition: box-shadow 100ms;pointer-events:none;z-index:99;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);`;
|
|
28863
29406
|
this.initSize = initSize;
|
|
28864
29407
|
this.hasPermission = hasPermission;
|
|
28865
|
-
this.paperSize =
|
|
28866
|
-
this.domSize =
|
|
29408
|
+
this.paperSize = _paperSize;
|
|
29409
|
+
this.domSize = _domSize;
|
|
28867
29410
|
this.whiteboardAttrsMap = whiteboardAttrsMap;
|
|
28868
29411
|
this.scope = scope;
|
|
28869
29412
|
this.requestUserMap = requestUserMap;
|
|
28870
29413
|
this.userManager = userManager;
|
|
28871
29414
|
this.dom = dom;
|
|
28872
29415
|
this.dom.appendChild(this.bound);
|
|
28873
|
-
this.dom.addEventListener("wheel", this.handleWheel, {
|
|
29416
|
+
this.dom.addEventListener("wheel", this.handleWheel, {
|
|
29417
|
+
passive: false,
|
|
29418
|
+
capture: true
|
|
29419
|
+
});
|
|
28874
29420
|
this.dom.addEventListener("touchstart", (e) => {
|
|
28875
29421
|
e.preventDefault();
|
|
28876
|
-
}, {
|
|
29422
|
+
}, {
|
|
29423
|
+
passive: false
|
|
29424
|
+
});
|
|
28877
29425
|
this.createModel(this.userManager.selfId);
|
|
28878
29426
|
this.userManager.userIdList().forEach((userId) => {
|
|
28879
29427
|
const observer = (evt) => {
|
|
@@ -28894,7 +29442,10 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
28894
29442
|
return;
|
|
28895
29443
|
}
|
|
28896
29444
|
const matrix = new this.scope.Matrix();
|
|
28897
|
-
matrix.translate({
|
|
29445
|
+
matrix.translate({
|
|
29446
|
+
x: x * this.translateScale,
|
|
29447
|
+
y: y * this.translateScale
|
|
29448
|
+
});
|
|
28898
29449
|
this.updateViewMatrix(matrix);
|
|
28899
29450
|
});
|
|
28900
29451
|
this.gesture.on("scale", (scale, center) => {
|
|
@@ -28916,6 +29467,9 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
28916
29467
|
}, 100);
|
|
28917
29468
|
}
|
|
28918
29469
|
}
|
|
29470
|
+
updateInitSize(size) {
|
|
29471
|
+
this.initSize = size;
|
|
29472
|
+
}
|
|
28919
29473
|
updateInherentScale(scale) {
|
|
28920
29474
|
this.inherentScale = scale;
|
|
28921
29475
|
}
|
|
@@ -28947,36 +29501,6 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
28947
29501
|
const matrix = new this.scope.Matrix(matrixValue);
|
|
28948
29502
|
this.emit("zoom", this.inherentMatrix.appended(matrix));
|
|
28949
29503
|
}
|
|
28950
|
-
handleMainCameraChange = (evt) => {
|
|
28951
|
-
const userMap = this.requestUserMap(this.userManager.selfId);
|
|
28952
|
-
const cameraMode = userMap.get(WhiteboardKeys.cameraMode);
|
|
28953
|
-
if (cameraMode !== "main") {
|
|
28954
|
-
return;
|
|
28955
|
-
}
|
|
28956
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
28957
|
-
if (key === WhiteboardKeys.viewMatrix) {
|
|
28958
|
-
if (value.action === "add" || value.action === "update") {
|
|
28959
|
-
const matrixValue = this.whiteboardAttrsMap.get(WhiteboardKeys.viewMatrix);
|
|
28960
|
-
const matrix = new this.scope.Matrix(matrixValue);
|
|
28961
|
-
userMap.set(WhiteboardKeys.viewMatrix, matrixValue);
|
|
28962
|
-
this.emit("zoom", this.inherentMatrix.appended(matrix));
|
|
28963
|
-
}
|
|
28964
|
-
}
|
|
28965
|
-
}
|
|
28966
|
-
};
|
|
28967
|
-
handleUserLeave = (user) => {
|
|
28968
|
-
const cb = this.observers.get(user.id);
|
|
28969
|
-
if (cb) {
|
|
28970
|
-
this.requestUserMap(user.id).unobserve(cb);
|
|
28971
|
-
}
|
|
28972
|
-
};
|
|
28973
|
-
handleUserJoin = (user) => {
|
|
28974
|
-
const observer = (evt) => {
|
|
28975
|
-
this.handleViewMatrixUpdate(user.id, evt);
|
|
28976
|
-
};
|
|
28977
|
-
this.requestUserMap(user.id).observe(observer);
|
|
28978
|
-
this.observers.set(user.id, observer);
|
|
28979
|
-
};
|
|
28980
29504
|
createModel(userId) {
|
|
28981
29505
|
const userMap = this.requestUserMap(userId);
|
|
28982
29506
|
if (!userMap.has(WhiteboardKeys.viewMatrix)) {
|
|
@@ -28986,33 +29510,6 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
28986
29510
|
userMap.set(WhiteboardKeys.cameraMode, "main");
|
|
28987
29511
|
}
|
|
28988
29512
|
}
|
|
28989
|
-
handleViewMatrixUpdate = (userId, evt) => {
|
|
28990
|
-
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
28991
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
28992
|
-
if (value.action === "update") {
|
|
28993
|
-
if (key === WhiteboardKeys.viewMatrix) {
|
|
28994
|
-
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
28995
|
-
const targetMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
28996
|
-
const target = new this.scope.Matrix(targetMatrixValue);
|
|
28997
|
-
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.viewMatrix, targetMatrixValue);
|
|
28998
|
-
this.emit("zoom", this.inherentMatrix.appended(target));
|
|
28999
|
-
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
29000
|
-
const currentMatrixValue = this.requestUserMap(userId).get(WhiteboardKeys.viewMatrix);
|
|
29001
|
-
const current = new this.scope.Matrix(currentMatrixValue);
|
|
29002
|
-
this.emit("zoom", this.inherentMatrix.appended(current));
|
|
29003
|
-
}
|
|
29004
|
-
} else if (key === WhiteboardKeys.currentPage) {
|
|
29005
|
-
if (value.action === "update" || value.action === "add") {
|
|
29006
|
-
this.emit("userPageChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.currentPage));
|
|
29007
|
-
}
|
|
29008
|
-
} else if (key === WhiteboardKeys.cameraMode) {
|
|
29009
|
-
if (value.action === "update" || value.action === "add") {
|
|
29010
|
-
this.emit("userViewModeChange", userId, this.requestUserMap(userId).get(WhiteboardKeys.cameraMode));
|
|
29011
|
-
}
|
|
29012
|
-
}
|
|
29013
|
-
}
|
|
29014
|
-
}
|
|
29015
|
-
};
|
|
29016
29513
|
validNextMatrix(next) {
|
|
29017
29514
|
let shouldHighlightBound = false;
|
|
29018
29515
|
const maxTranslate = (this.maxScale - 1) / 2;
|
|
@@ -29067,7 +29564,8 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
29067
29564
|
}
|
|
29068
29565
|
return next;
|
|
29069
29566
|
}
|
|
29070
|
-
updateViewMatrix(matrix
|
|
29567
|
+
updateViewMatrix(matrix) {
|
|
29568
|
+
let append = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
|
|
29071
29569
|
const userMap = this.requestUserMap(this.userManager.selfId);
|
|
29072
29570
|
const cameraMode = userMap.get(WhiteboardKeys.cameraMode);
|
|
29073
29571
|
let next = matrix;
|
|
@@ -29087,75 +29585,62 @@ var Camera = class extends import_eventemitter38.default {
|
|
|
29087
29585
|
userMap.set(WhiteboardKeys.viewMatrix, [next.a, next.b, next.c, next.d, next.tx, next.ty]);
|
|
29088
29586
|
}
|
|
29089
29587
|
if (cameraMode === "main") {
|
|
29090
|
-
if (this.hasPermission(
|
|
29588
|
+
if (this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29091
29589
|
this.whiteboardAttrsMap.set(WhiteboardKeys.viewMatrix, [next.a, next.b, next.c, next.d, next.tx, next.ty]);
|
|
29092
29590
|
}
|
|
29093
29591
|
}
|
|
29094
29592
|
}
|
|
29095
|
-
handleWheel = (evt) => {
|
|
29096
|
-
if (!this.enableByMouse) {
|
|
29097
|
-
return;
|
|
29098
|
-
}
|
|
29099
|
-
evt.preventDefault();
|
|
29100
|
-
evt.stopImmediatePropagation();
|
|
29101
|
-
evt.stopPropagation();
|
|
29102
|
-
const domSize = this.domSize();
|
|
29103
|
-
const paperSize = this.paperSize();
|
|
29104
|
-
const inherentDeltaY = evt.deltaY / domSize[1] * paperSize[1];
|
|
29105
|
-
const inherentDeltaX = evt.deltaX / domSize[0] * paperSize[0];
|
|
29106
|
-
if (Date.now() - this.lastTriggerTime < 32) {
|
|
29107
|
-
this.lastDelta.y += inherentDeltaY;
|
|
29108
|
-
this.lastDelta.x += inherentDeltaX;
|
|
29109
|
-
return;
|
|
29110
|
-
}
|
|
29111
|
-
if (evt.ctrlKey) {
|
|
29112
|
-
const wheelDelta = Math.sign(evt.wheelDelta || 100) * 120;
|
|
29113
|
-
const paperPoint = this.scope.project.view.getEventPoint(evt);
|
|
29114
|
-
const deltaY = inherentDeltaY + this.lastDelta.y;
|
|
29115
|
-
const matrix = new this.scope.Matrix();
|
|
29116
|
-
let scale = 1;
|
|
29117
|
-
if (deltaY > 0) {
|
|
29118
|
-
scale = Math.max(1 - Math.abs(deltaY / wheelDelta), 1e-8);
|
|
29119
|
-
} else {
|
|
29120
|
-
scale = 1 + Math.abs(deltaY / wheelDelta);
|
|
29121
|
-
}
|
|
29122
|
-
scale = Math.max(0.9, scale);
|
|
29123
|
-
scale = Math.min(1.1, scale);
|
|
29124
|
-
matrix.scale(scale, paperPoint);
|
|
29125
|
-
this.updateViewMatrix(matrix);
|
|
29126
|
-
} else {
|
|
29127
|
-
const deltaX = this.lastDelta.x + evt.deltaX;
|
|
29128
|
-
const deltaY = this.lastDelta.y + evt.deltaY;
|
|
29129
|
-
const matrix = new this.scope.Matrix();
|
|
29130
|
-
matrix.translate({ x: -deltaX * window.devicePixelRatio, y: -deltaY * window.devicePixelRatio });
|
|
29131
|
-
this.updateViewMatrix(matrix);
|
|
29132
|
-
}
|
|
29133
|
-
this.lastTriggerTime = Date.now();
|
|
29134
|
-
this.lastDelta = { x: 0, y: 0 };
|
|
29135
|
-
};
|
|
29136
29593
|
scale(value) {
|
|
29594
|
+
let origin = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "center";
|
|
29137
29595
|
const matrix = new this.scope.Matrix();
|
|
29138
|
-
|
|
29596
|
+
if (origin === "center") {
|
|
29597
|
+
matrix.scale(value, this.scope.project.view.bounds.center);
|
|
29598
|
+
} else if (origin === "top-left") {
|
|
29599
|
+
matrix.scale(value, [0, 0]);
|
|
29600
|
+
}
|
|
29139
29601
|
this.updateViewMatrix(matrix);
|
|
29140
29602
|
}
|
|
29141
29603
|
translate(offsetX, offsetY) {
|
|
29142
29604
|
const matrix = new this.scope.Matrix();
|
|
29143
|
-
matrix.translate({
|
|
29605
|
+
matrix.translate({
|
|
29606
|
+
x: offsetX,
|
|
29607
|
+
y: offsetY
|
|
29608
|
+
});
|
|
29144
29609
|
this.updateViewMatrix(matrix);
|
|
29145
29610
|
}
|
|
29146
29611
|
reset() {
|
|
29147
29612
|
this.updateViewMatrix(new this.scope.Matrix(), false);
|
|
29148
|
-
this.lastDelta = {
|
|
29613
|
+
this.lastDelta = {
|
|
29614
|
+
x: 0,
|
|
29615
|
+
y: 0
|
|
29616
|
+
};
|
|
29149
29617
|
}
|
|
29150
29618
|
};
|
|
29151
29619
|
|
|
29152
29620
|
// src/tool/EllipseTool.ts
|
|
29621
|
+
function _defineProperty29(e, r, t) {
|
|
29622
|
+
return (r = _toPropertyKey29(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29623
|
+
}
|
|
29624
|
+
function _toPropertyKey29(t) {
|
|
29625
|
+
var i = _toPrimitive29(t, "string");
|
|
29626
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29627
|
+
}
|
|
29628
|
+
function _toPrimitive29(t, r) {
|
|
29629
|
+
if ("object" != typeof t || !t) return t;
|
|
29630
|
+
var e = t[Symbol.toPrimitive];
|
|
29631
|
+
if (void 0 !== e) {
|
|
29632
|
+
var i = e.call(t, r || "default");
|
|
29633
|
+
if ("object" != typeof i) return i;
|
|
29634
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29635
|
+
}
|
|
29636
|
+
return ("string" === r ? String : Number)(t);
|
|
29637
|
+
}
|
|
29153
29638
|
var EllipseTool = class extends WhiteboardTool {
|
|
29154
|
-
elementModel = null;
|
|
29155
|
-
from = null;
|
|
29156
|
-
to = null;
|
|
29157
29639
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
29158
29640
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
29641
|
+
_defineProperty29(this, "elementModel", null);
|
|
29642
|
+
_defineProperty29(this, "from", null);
|
|
29643
|
+
_defineProperty29(this, "to", null);
|
|
29159
29644
|
this.tool.minDistance = 1;
|
|
29160
29645
|
}
|
|
29161
29646
|
onMouseDown(event) {
|
|
@@ -29184,209 +29669,145 @@ var EllipseTool = class extends WhiteboardTool {
|
|
|
29184
29669
|
};
|
|
29185
29670
|
|
|
29186
29671
|
// src/tool/TriangleTool.ts
|
|
29672
|
+
function _defineProperty30(e, r, t) {
|
|
29673
|
+
return (r = _toPropertyKey30(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29674
|
+
}
|
|
29675
|
+
function _toPropertyKey30(t) {
|
|
29676
|
+
var i = _toPrimitive30(t, "string");
|
|
29677
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29678
|
+
}
|
|
29679
|
+
function _toPrimitive30(t, r) {
|
|
29680
|
+
if ("object" != typeof t || !t) return t;
|
|
29681
|
+
var e = t[Symbol.toPrimitive];
|
|
29682
|
+
if (void 0 !== e) {
|
|
29683
|
+
var i = e.call(t, r || "default");
|
|
29684
|
+
if ("object" != typeof i) return i;
|
|
29685
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29686
|
+
}
|
|
29687
|
+
return ("string" === r ? String : Number)(t);
|
|
29688
|
+
}
|
|
29187
29689
|
var TriangleTool = class extends WhiteboardTool {
|
|
29188
|
-
elementModel = null;
|
|
29189
|
-
from = null;
|
|
29190
|
-
to = null;
|
|
29191
29690
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
29192
29691
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
29692
|
+
_defineProperty30(this, "elementModel", null);
|
|
29693
|
+
_defineProperty30(this, "from", null);
|
|
29694
|
+
_defineProperty30(this, "to", null);
|
|
29193
29695
|
this.tool.minDistance = 1;
|
|
29194
29696
|
}
|
|
29195
29697
|
onMouseDown(event) {
|
|
29196
29698
|
this.elementModel = this.modelGetter().createTriangle(true);
|
|
29197
29699
|
this.from = event.point.clone();
|
|
29198
|
-
this.to = event.point.clone();
|
|
29199
|
-
}
|
|
29200
|
-
onMouseDrag(event) {
|
|
29201
|
-
if (this.from && this.elementModel) {
|
|
29202
|
-
this.to = event.point.clone();
|
|
29203
|
-
this.elementModel.setPoints([
|
|
29204
|
-
|
|
29205
|
-
|
|
29206
|
-
|
|
29207
|
-
|
|
29208
|
-
|
|
29209
|
-
|
|
29210
|
-
|
|
29211
|
-
|
|
29212
|
-
|
|
29213
|
-
|
|
29214
|
-
|
|
29215
|
-
|
|
29216
|
-
|
|
29217
|
-
|
|
29218
|
-
|
|
29219
|
-
|
|
29220
|
-
|
|
29221
|
-
|
|
29222
|
-
|
|
29223
|
-
|
|
29224
|
-
|
|
29225
|
-
|
|
29226
|
-
|
|
29227
|
-
|
|
29228
|
-
|
|
29229
|
-
|
|
29230
|
-
|
|
29231
|
-
|
|
29232
|
-
|
|
29233
|
-
|
|
29234
|
-
|
|
29235
|
-
|
|
29236
|
-
|
|
29237
|
-
/**
|
|
29238
|
-
* 虚线配置
|
|
29239
|
-
*/
|
|
29240
|
-
dashArray;
|
|
29241
|
-
/**
|
|
29242
|
-
* 字体名称
|
|
29243
|
-
*/
|
|
29244
|
-
fontFamily;
|
|
29245
|
-
/**
|
|
29246
|
-
* 描边颜色
|
|
29247
|
-
*/
|
|
29248
|
-
strokeColor;
|
|
29249
|
-
/**
|
|
29250
|
-
* 填充颜色
|
|
29251
|
-
*/
|
|
29252
|
-
fillColor;
|
|
29253
|
-
/**
|
|
29254
|
-
* 描边宽度
|
|
29255
|
-
*/
|
|
29256
|
-
strokeWidth;
|
|
29257
|
-
/**
|
|
29258
|
-
* 是否允许用鼠标/触控板进行缩放和拖动画布
|
|
29259
|
-
*/
|
|
29260
|
-
enableCameraByMouse;
|
|
29261
|
-
/**
|
|
29262
|
-
* 是否允许触摸屏上触摸事件进行缩放和拖动画布
|
|
29263
|
-
*/
|
|
29264
|
-
enableCameraByTouch;
|
|
29265
|
-
/**
|
|
29266
|
-
* 相机超出边界时, 警示阴影的颜色, 默认 "#F44336"
|
|
29267
|
-
*/
|
|
29268
|
-
cameraBoundaryColor;
|
|
29269
|
-
/**
|
|
29270
|
-
* 是否允许相机超出边界时, 警示高亮阴影, 默认 true
|
|
29271
|
-
*/
|
|
29272
|
-
enableCameraBoundaryHighlight;
|
|
29273
|
-
getElementAttribute;
|
|
29274
|
-
setElementAttribute;
|
|
29275
|
-
getCurrentTool;
|
|
29276
|
-
setCurrentTool;
|
|
29277
|
-
/**
|
|
29278
|
-
* 设置画布区域背景色
|
|
29279
|
-
* @param {string} color - css 颜色值
|
|
29280
|
-
*/
|
|
29281
|
-
setCanvasBackgroundColor;
|
|
29282
|
-
/**
|
|
29283
|
-
* 设置主题色, 主题色影响选中框和昵称的背景色
|
|
29284
|
-
* @param {string} color - css 颜色值
|
|
29285
|
-
*/
|
|
29286
|
-
setThemeColor;
|
|
29287
|
-
/**
|
|
29288
|
-
* 切换到指定页面, 调用端需要有页面切换权限
|
|
29289
|
-
* @param {string} id - 指定要切换到的页面 id
|
|
29290
|
-
*/
|
|
29291
|
-
gotoPage;
|
|
29292
|
-
/**
|
|
29293
|
-
* 添加页面, 如果页面已经存在则不做任何修改
|
|
29294
|
-
* @param {string} id - 指定要添加到的页面 id
|
|
29295
|
-
*/
|
|
29296
|
-
addPage;
|
|
29297
|
-
deletePage;
|
|
29298
|
-
pageList;
|
|
29299
|
-
/**
|
|
29300
|
-
* 获取当前页面 id
|
|
29301
|
-
* @param {string=} userId - 指定要获取对应用户的当前页面 id, 不传 userId 参数则获取自己的当前页面 id
|
|
29302
|
-
*/
|
|
29303
|
-
currentPageId;
|
|
29304
|
-
/**
|
|
29305
|
-
* 复制页面
|
|
29306
|
-
* @param {string} sourceId - 指定要复制的页面, string 类型指定 id
|
|
29307
|
-
* @param {string} targetId - 指定要复制到的页面, string 类型指定 id
|
|
29308
|
-
*/
|
|
29309
|
-
clonePage;
|
|
29310
|
-
/**
|
|
29311
|
-
* 清空当前页面
|
|
29312
|
-
*/
|
|
29313
|
-
clearPage;
|
|
29314
|
-
/**
|
|
29315
|
-
* 平移画布
|
|
29316
|
-
* @param {number} offsetX - x 轴偏移量
|
|
29317
|
-
* @param {number} offsetY - y 轴偏移量
|
|
29318
|
-
*/
|
|
29319
|
-
translateCamera;
|
|
29320
|
-
/**
|
|
29321
|
-
* 以画布中心为固定点缩放画布
|
|
29322
|
-
* @param {number} scale - 缩放比例
|
|
29323
|
-
*/
|
|
29324
|
-
scaleCamera;
|
|
29325
|
-
/**
|
|
29326
|
-
* 重置画布, 将画布缩放比例重置为 1, 平移量重置为 [0, 0]
|
|
29327
|
-
*/
|
|
29328
|
-
resetCamera;
|
|
29329
|
-
/**
|
|
29330
|
-
* 为 userId 指定的用户设置页面, 调用需要有 `WhiteboardPermissionFlag.setOthersView` 权限,
|
|
29331
|
-
* userId 指定的用户的视角模式应为 `free`, 否则调用无效
|
|
29332
|
-
*/
|
|
29333
|
-
setFreeModelUserPage;
|
|
29334
|
-
indexedNavigation;
|
|
29335
|
-
/**
|
|
29336
|
-
* 设置视角模式为自由模式, 可以修改自己或者他人视角, 修改他人视角需要 `WhiteboardPermissionFlag.setOthersView` 权限
|
|
29337
|
-
* @param {string=} userId 可选, 指定要修改视角的 userId, 默认修改自己的视角
|
|
29338
|
-
*/
|
|
29339
|
-
setViewModeToFree;
|
|
29340
|
-
/**
|
|
29341
|
-
* 设置视角模式为跟随其他用户, 可以修改自己或者他人视角, 修改他人视角需要 `WhiteboardPermissionFlag.setOthersView` 权限
|
|
29342
|
-
* @param {string} flowId 指定要跟随的用户 id
|
|
29343
|
-
* @param {string=} userId 可选, 指定要修改视角的 userId, 默认修改自己的视角
|
|
29344
|
-
*/
|
|
29345
|
-
setViewModeToFlow;
|
|
29346
|
-
/**
|
|
29347
|
-
* 设置视角模式为跟随白板主视角, 可以修改自己或者他人视角, 修改他人视角需要 `WhiteboardPermissionFlag.setOthersView` 权限
|
|
29348
|
-
* @param {string=} userId 可选, 指定要修改视角的 userId, 默认修改自己的视角
|
|
29349
|
-
*/
|
|
29350
|
-
setViewModeToMain;
|
|
29351
|
-
/**
|
|
29352
|
-
* 获取视角模式
|
|
29353
|
-
* @param {string=} userId 可选, 默认获取自己的视角模式
|
|
29354
|
-
* @return {'free' | 'main' | string} `free` 表示自由视角, `main` 表示主视角, 其他 string 类型代表跟随视角, string 值为跟随的 userId
|
|
29355
|
-
*/
|
|
29356
|
-
getViewModel;
|
|
29357
|
-
/**
|
|
29358
|
-
* 撤销
|
|
29359
|
-
*/
|
|
29360
|
-
undo;
|
|
29361
|
-
/**
|
|
29362
|
-
* 重做
|
|
29363
|
-
*/
|
|
29364
|
-
redo;
|
|
29365
|
-
/**
|
|
29366
|
-
* 光栅化指定页面
|
|
29367
|
-
* @param {string | number | undefined} page 指定页码, string 指示页码 id, number 指示 IndexedNavigation 页面索引, undefined 指示光栅化当前页
|
|
29368
|
-
* @return {Promise<string>} 异步返回光栅化结果, 图片 png 对应的 base64 url, 如果页面不存在返回 null
|
|
29369
|
-
*/
|
|
29370
|
-
rasterize;
|
|
29371
|
-
/**
|
|
29372
|
-
* 设置输入类型, "pen" 仅接受手写笔输入, "any" 接受任意输入, 当首次侦测到手写笔输入时, 将自动切换为 "pen"
|
|
29373
|
-
* @param {"pen" | "any"} type 输入类型
|
|
29374
|
-
*/
|
|
29375
|
-
setInputType;
|
|
29376
|
-
insertImage;
|
|
29700
|
+
this.to = event.point.clone();
|
|
29701
|
+
}
|
|
29702
|
+
onMouseDrag(event) {
|
|
29703
|
+
if (this.from && this.elementModel) {
|
|
29704
|
+
this.to = event.point.clone();
|
|
29705
|
+
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]);
|
|
29706
|
+
}
|
|
29707
|
+
}
|
|
29708
|
+
onMouseUp(event) {
|
|
29709
|
+
if (this.elementModel && this.from && this.from.getDistance(event.point) < 3) {
|
|
29710
|
+
this.modelGetter().removeElementItem(this.elementModel.uuid);
|
|
29711
|
+
}
|
|
29712
|
+
if (this.elementModel) {
|
|
29713
|
+
this.elementModel.shadow = "";
|
|
29714
|
+
}
|
|
29715
|
+
}
|
|
29716
|
+
};
|
|
29717
|
+
|
|
29718
|
+
// src/Whiteboard.ts
|
|
29719
|
+
var import_eventemitter39 = __toESM(require("eventemitter3"), 1);
|
|
29720
|
+
function _defineProperty31(e, r, t) {
|
|
29721
|
+
return (r = _toPropertyKey31(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29722
|
+
}
|
|
29723
|
+
function _toPropertyKey31(t) {
|
|
29724
|
+
var i = _toPrimitive31(t, "string");
|
|
29725
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29726
|
+
}
|
|
29727
|
+
function _toPrimitive31(t, r) {
|
|
29728
|
+
if ("object" != typeof t || !t) return t;
|
|
29729
|
+
var e = t[Symbol.toPrimitive];
|
|
29730
|
+
if (void 0 !== e) {
|
|
29731
|
+
var i = e.call(t, r || "default");
|
|
29732
|
+
if ("object" != typeof i) return i;
|
|
29733
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29734
|
+
}
|
|
29735
|
+
return ("string" === r ? String : Number)(t);
|
|
29736
|
+
}
|
|
29737
|
+
var Whiteboard = class extends import_eventemitter39.default {
|
|
29738
|
+
// public insertImage!: (src: string) => void;
|
|
29377
29739
|
constructor(view) {
|
|
29378
29740
|
super();
|
|
29741
|
+
_defineProperty31(this, "view", void 0);
|
|
29742
|
+
_defineProperty31(this, "selfUserId", void 0);
|
|
29743
|
+
_defineProperty31(this, "permissions", void 0);
|
|
29744
|
+
_defineProperty31(this, "tool", void 0);
|
|
29745
|
+
_defineProperty31(this, "fontSize", void 0);
|
|
29746
|
+
_defineProperty31(this, "dashArray", void 0);
|
|
29747
|
+
_defineProperty31(this, "fontFamily", void 0);
|
|
29748
|
+
_defineProperty31(this, "strokeColor", void 0);
|
|
29749
|
+
_defineProperty31(this, "fillColor", void 0);
|
|
29750
|
+
_defineProperty31(this, "strokeWidth", void 0);
|
|
29751
|
+
_defineProperty31(this, "enableCameraByMouse", void 0);
|
|
29752
|
+
_defineProperty31(this, "enableCameraByTouch", void 0);
|
|
29753
|
+
_defineProperty31(this, "cameraBoundaryColor", void 0);
|
|
29754
|
+
_defineProperty31(this, "enableCameraBoundaryHighlight", void 0);
|
|
29755
|
+
_defineProperty31(this, "getElementAttribute", void 0);
|
|
29756
|
+
_defineProperty31(this, "setElementAttribute", void 0);
|
|
29757
|
+
_defineProperty31(this, "getCurrentTool", void 0);
|
|
29758
|
+
_defineProperty31(this, "setCurrentTool", void 0);
|
|
29759
|
+
_defineProperty31(this, "setCanvasBackgroundColor", void 0);
|
|
29760
|
+
_defineProperty31(this, "setThemeColor", void 0);
|
|
29761
|
+
_defineProperty31(this, "gotoPage", void 0);
|
|
29762
|
+
_defineProperty31(this, "addPage", void 0);
|
|
29763
|
+
_defineProperty31(this, "deletePage", void 0);
|
|
29764
|
+
_defineProperty31(this, "pageList", void 0);
|
|
29765
|
+
_defineProperty31(this, "currentPageId", void 0);
|
|
29766
|
+
_defineProperty31(this, "clonePage", void 0);
|
|
29767
|
+
_defineProperty31(this, "clearPage", void 0);
|
|
29768
|
+
_defineProperty31(this, "translateCamera", void 0);
|
|
29769
|
+
_defineProperty31(this, "scaleCamera", void 0);
|
|
29770
|
+
_defineProperty31(this, "resetCamera", void 0);
|
|
29771
|
+
_defineProperty31(this, "setFreeModelUserPage", void 0);
|
|
29772
|
+
_defineProperty31(this, "indexedNavigation", void 0);
|
|
29773
|
+
_defineProperty31(this, "setViewModeToFree", void 0);
|
|
29774
|
+
_defineProperty31(this, "setViewModeToFlow", void 0);
|
|
29775
|
+
_defineProperty31(this, "setViewModeToMain", void 0);
|
|
29776
|
+
_defineProperty31(this, "getViewModel", void 0);
|
|
29777
|
+
_defineProperty31(this, "undo", void 0);
|
|
29778
|
+
_defineProperty31(this, "redo", void 0);
|
|
29779
|
+
_defineProperty31(this, "rasterizeViewport", void 0);
|
|
29780
|
+
_defineProperty31(this, "rasterizeElementsBounds", void 0);
|
|
29781
|
+
_defineProperty31(this, "rasterizeMaxBounds", void 0);
|
|
29782
|
+
_defineProperty31(this, "setInputType", void 0);
|
|
29379
29783
|
this.view = view;
|
|
29380
29784
|
}
|
|
29381
29785
|
};
|
|
29382
29786
|
|
|
29383
29787
|
// src/tool/EraserTool.ts
|
|
29788
|
+
function _defineProperty32(e, r, t) {
|
|
29789
|
+
return (r = _toPropertyKey32(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29790
|
+
}
|
|
29791
|
+
function _toPropertyKey32(t) {
|
|
29792
|
+
var i = _toPrimitive32(t, "string");
|
|
29793
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29794
|
+
}
|
|
29795
|
+
function _toPrimitive32(t, r) {
|
|
29796
|
+
if ("object" != typeof t || !t) return t;
|
|
29797
|
+
var e = t[Symbol.toPrimitive];
|
|
29798
|
+
if (void 0 !== e) {
|
|
29799
|
+
var i = e.call(t, r || "default");
|
|
29800
|
+
if ("object" != typeof i) return i;
|
|
29801
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29802
|
+
}
|
|
29803
|
+
return ("string" === r ? String : Number)(t);
|
|
29804
|
+
}
|
|
29384
29805
|
var EraserTool = class extends WhiteboardTool {
|
|
29385
|
-
elementModel = null;
|
|
29386
|
-
trashedElementsModel;
|
|
29387
|
-
pointCount = 0;
|
|
29388
29806
|
constructor(enableToolEvent, renderableModel, shadowEmitter, scope, trashedElementsModel) {
|
|
29389
29807
|
super(enableToolEvent, renderableModel, shadowEmitter, scope);
|
|
29808
|
+
_defineProperty32(this, "elementModel", null);
|
|
29809
|
+
_defineProperty32(this, "trashedElementsModel", void 0);
|
|
29810
|
+
_defineProperty32(this, "pointCount", 0);
|
|
29390
29811
|
this.trashedElementsModel = trashedElementsModel;
|
|
29391
29812
|
this.tool.minDistance = 1;
|
|
29392
29813
|
}
|
|
@@ -29424,19 +29845,49 @@ var EraserTool = class extends WhiteboardTool {
|
|
|
29424
29845
|
// src/model/TrashedElementsModel.ts
|
|
29425
29846
|
var Y14 = __toESM(require("yjs"), 1);
|
|
29426
29847
|
var import_eventemitter310 = __toESM(require("eventemitter3"), 1);
|
|
29848
|
+
function _defineProperty33(e, r, t) {
|
|
29849
|
+
return (r = _toPropertyKey33(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29850
|
+
}
|
|
29851
|
+
function _toPropertyKey33(t) {
|
|
29852
|
+
var i = _toPrimitive33(t, "string");
|
|
29853
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29854
|
+
}
|
|
29855
|
+
function _toPrimitive33(t, r) {
|
|
29856
|
+
if ("object" != typeof t || !t) return t;
|
|
29857
|
+
var e = t[Symbol.toPrimitive];
|
|
29858
|
+
if (void 0 !== e) {
|
|
29859
|
+
var i = e.call(t, r || "default");
|
|
29860
|
+
if ("object" != typeof i) return i;
|
|
29861
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29862
|
+
}
|
|
29863
|
+
return ("string" === r ? String : Number)(t);
|
|
29864
|
+
}
|
|
29427
29865
|
var TrashedElementsModel = class extends import_eventemitter310.default {
|
|
29428
|
-
requestUserMap;
|
|
29429
|
-
userManager;
|
|
29430
|
-
hasPermission;
|
|
29431
|
-
observers = /* @__PURE__ */ new Map();
|
|
29432
29866
|
get hasDeleteSelfPermission() {
|
|
29433
|
-
return this.hasPermission(
|
|
29867
|
+
return this.hasPermission(WhiteboardPermissionFlag.deleteSelf);
|
|
29434
29868
|
}
|
|
29435
29869
|
get hasDeleteOthersPermission() {
|
|
29436
|
-
return this.hasPermission(
|
|
29870
|
+
return this.hasPermission(WhiteboardPermissionFlag.deleteOthers);
|
|
29437
29871
|
}
|
|
29438
29872
|
constructor(userManager, requestUserMap, hasPermission) {
|
|
29439
29873
|
super();
|
|
29874
|
+
_defineProperty33(this, "requestUserMap", void 0);
|
|
29875
|
+
_defineProperty33(this, "userManager", void 0);
|
|
29876
|
+
_defineProperty33(this, "hasPermission", void 0);
|
|
29877
|
+
_defineProperty33(this, "observers", /* @__PURE__ */ new Map());
|
|
29878
|
+
_defineProperty33(this, "handleUserLeave", (user) => {
|
|
29879
|
+
const cb = this.observers.get(user.id);
|
|
29880
|
+
if (cb) {
|
|
29881
|
+
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
29882
|
+
}
|
|
29883
|
+
});
|
|
29884
|
+
_defineProperty33(this, "handleUserJoin", (user) => {
|
|
29885
|
+
const observer = (evts) => {
|
|
29886
|
+
this.handleUserTrashElementsChange(user.id, evts);
|
|
29887
|
+
};
|
|
29888
|
+
this.requestUserMap(user.id).observeDeep(observer);
|
|
29889
|
+
this.observers.set(user.id, observer);
|
|
29890
|
+
});
|
|
29440
29891
|
this.hasPermission = hasPermission;
|
|
29441
29892
|
this.userManager = userManager;
|
|
29442
29893
|
this.requestUserMap = requestUserMap;
|
|
@@ -29451,19 +29902,6 @@ var TrashedElementsModel = class extends import_eventemitter310.default {
|
|
|
29451
29902
|
this.userManager.on("join", this.handleUserJoin);
|
|
29452
29903
|
this.userManager.on("leave", this.handleUserLeave);
|
|
29453
29904
|
}
|
|
29454
|
-
handleUserLeave = (user) => {
|
|
29455
|
-
const cb = this.observers.get(user.id);
|
|
29456
|
-
if (cb) {
|
|
29457
|
-
this.requestUserMap(user.id).unobserveDeep(cb);
|
|
29458
|
-
}
|
|
29459
|
-
};
|
|
29460
|
-
handleUserJoin = (user) => {
|
|
29461
|
-
const observer = (evts) => {
|
|
29462
|
-
this.handleUserTrashElementsChange(user.id, evts);
|
|
29463
|
-
};
|
|
29464
|
-
this.requestUserMap(user.id).observeDeep(observer);
|
|
29465
|
-
this.observers.set(user.id, observer);
|
|
29466
|
-
};
|
|
29467
29905
|
handleUserTrashElementsChange(userId, evts) {
|
|
29468
29906
|
for (const evt of evts) {
|
|
29469
29907
|
if (evt.target.get("inner-map-id") === "trashedElements") {
|
|
@@ -29525,11 +29963,28 @@ var TrashedElementsModel = class extends import_eventemitter310.default {
|
|
|
29525
29963
|
};
|
|
29526
29964
|
|
|
29527
29965
|
// src/tool/LaserPointerTool.ts
|
|
29966
|
+
function _defineProperty34(e, r, t) {
|
|
29967
|
+
return (r = _toPropertyKey34(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
29968
|
+
}
|
|
29969
|
+
function _toPropertyKey34(t) {
|
|
29970
|
+
var i = _toPrimitive34(t, "string");
|
|
29971
|
+
return "symbol" == typeof i ? i : i + "";
|
|
29972
|
+
}
|
|
29973
|
+
function _toPrimitive34(t, r) {
|
|
29974
|
+
if ("object" != typeof t || !t) return t;
|
|
29975
|
+
var e = t[Symbol.toPrimitive];
|
|
29976
|
+
if (void 0 !== e) {
|
|
29977
|
+
var i = e.call(t, r || "default");
|
|
29978
|
+
if ("object" != typeof i) return i;
|
|
29979
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
29980
|
+
}
|
|
29981
|
+
return ("string" === r ? String : Number)(t);
|
|
29982
|
+
}
|
|
29528
29983
|
var LaserPointerTool = class extends WhiteboardTool {
|
|
29529
|
-
elementModel = null;
|
|
29530
|
-
pointCount = 0;
|
|
29531
29984
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
29532
29985
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
29986
|
+
_defineProperty34(this, "elementModel", null);
|
|
29987
|
+
_defineProperty34(this, "pointCount", 0);
|
|
29533
29988
|
this.tool.minDistance = 5;
|
|
29534
29989
|
}
|
|
29535
29990
|
onMouseDown(event) {
|
|
@@ -29555,15 +30010,79 @@ var LaserPointerTool = class extends WhiteboardTool {
|
|
|
29555
30010
|
// src/model/PageModel.ts
|
|
29556
30011
|
var import_eventemitter311 = __toESM(require("eventemitter3"), 1);
|
|
29557
30012
|
var import_forge_room = require("@netless/forge-room");
|
|
30013
|
+
function _defineProperty35(e, r, t) {
|
|
30014
|
+
return (r = _toPropertyKey35(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30015
|
+
}
|
|
30016
|
+
function _toPropertyKey35(t) {
|
|
30017
|
+
var i = _toPrimitive35(t, "string");
|
|
30018
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30019
|
+
}
|
|
30020
|
+
function _toPrimitive35(t, r) {
|
|
30021
|
+
if ("object" != typeof t || !t) return t;
|
|
30022
|
+
var e = t[Symbol.toPrimitive];
|
|
30023
|
+
if (void 0 !== e) {
|
|
30024
|
+
var i = e.call(t, r || "default");
|
|
30025
|
+
if ("object" != typeof i) return i;
|
|
30026
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30027
|
+
}
|
|
30028
|
+
return ("string" === r ? String : Number)(t);
|
|
30029
|
+
}
|
|
29558
30030
|
var PageModel = class extends import_eventemitter311.default {
|
|
29559
|
-
whiteboardAttrsMap;
|
|
29560
|
-
pageMap;
|
|
29561
|
-
requestUserMap;
|
|
29562
|
-
userManager;
|
|
29563
|
-
observers = /* @__PURE__ */ new Map();
|
|
29564
|
-
hasPermission;
|
|
29565
30031
|
constructor(whiteboardAttrsMap, userManager, requestUserMap, pageMap, hasPermission) {
|
|
29566
30032
|
super();
|
|
30033
|
+
_defineProperty35(this, "whiteboardAttrsMap", void 0);
|
|
30034
|
+
_defineProperty35(this, "pageMap", void 0);
|
|
30035
|
+
_defineProperty35(this, "requestUserMap", void 0);
|
|
30036
|
+
_defineProperty35(this, "userManager", void 0);
|
|
30037
|
+
_defineProperty35(this, "observers", /* @__PURE__ */ new Map());
|
|
30038
|
+
_defineProperty35(this, "hasPermission", void 0);
|
|
30039
|
+
_defineProperty35(this, "handleUserLeave", (user) => {
|
|
30040
|
+
const cb = this.observers.get(user.id);
|
|
30041
|
+
if (cb) {
|
|
30042
|
+
this.requestUserMap(user.id).unobserve(cb);
|
|
30043
|
+
}
|
|
30044
|
+
});
|
|
30045
|
+
_defineProperty35(this, "handleUserJoin", (user) => {
|
|
30046
|
+
this.createCurrentPageObserver(user.id);
|
|
30047
|
+
});
|
|
30048
|
+
_defineProperty35(this, "handleMainPageChange", (evt) => {
|
|
30049
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
30050
|
+
if (key === WhiteboardKeys.currentPage) {
|
|
30051
|
+
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
30052
|
+
if (value.action === "update" || value.action === "add") {
|
|
30053
|
+
if (cameraMode === "main") {
|
|
30054
|
+
const targetPage = this.whiteboardAttrsMap.get(WhiteboardKeys.currentPage);
|
|
30055
|
+
if (!this.pageMap.has(targetPage) && targetPage !== "_i_") {
|
|
30056
|
+
(0, import_forge_room.log)(`main page {${targetPage}} not found.`, {}, "error");
|
|
30057
|
+
return;
|
|
30058
|
+
}
|
|
30059
|
+
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
30060
|
+
this.emit("switchPage", targetPage);
|
|
30061
|
+
}
|
|
30062
|
+
}
|
|
30063
|
+
}
|
|
30064
|
+
}
|
|
30065
|
+
});
|
|
30066
|
+
_defineProperty35(this, "handleUserCurrentPageChange", (userId, evt) => {
|
|
30067
|
+
for (const [key, value] of evt.changes.keys.entries()) {
|
|
30068
|
+
if (key === WhiteboardKeys.currentPage) {
|
|
30069
|
+
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
30070
|
+
if (value.action === "update" || value.action === "add") {
|
|
30071
|
+
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
30072
|
+
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
30073
|
+
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
30074
|
+
this.emit("switchPage", targetPage);
|
|
30075
|
+
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
30076
|
+
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
30077
|
+
this.emit("switchPage", targetPage);
|
|
30078
|
+
}
|
|
30079
|
+
}
|
|
30080
|
+
}
|
|
30081
|
+
}
|
|
30082
|
+
});
|
|
30083
|
+
_defineProperty35(this, "handlePageMapChange", () => {
|
|
30084
|
+
this.emit("pagesChange", Array.from(this.pageMap.keys()));
|
|
30085
|
+
});
|
|
29567
30086
|
this.hasPermission = hasPermission;
|
|
29568
30087
|
this.pageMap = pageMap;
|
|
29569
30088
|
this.userManager = userManager;
|
|
@@ -29584,53 +30103,6 @@ var PageModel = class extends import_eventemitter311.default {
|
|
|
29584
30103
|
this.requestUserMap(userId).observe(observer);
|
|
29585
30104
|
this.observers.set(userId, observer);
|
|
29586
30105
|
}
|
|
29587
|
-
handleUserLeave = (user) => {
|
|
29588
|
-
const cb = this.observers.get(user.id);
|
|
29589
|
-
if (cb) {
|
|
29590
|
-
this.requestUserMap(user.id).unobserve(cb);
|
|
29591
|
-
}
|
|
29592
|
-
};
|
|
29593
|
-
handleUserJoin = (user) => {
|
|
29594
|
-
this.createCurrentPageObserver(user.id);
|
|
29595
|
-
};
|
|
29596
|
-
handleMainPageChange = (evt) => {
|
|
29597
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29598
|
-
if (key === WhiteboardKeys.currentPage) {
|
|
29599
|
-
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
29600
|
-
if (value.action === "update" || value.action === "add") {
|
|
29601
|
-
if (cameraMode === "main") {
|
|
29602
|
-
const targetPage = this.whiteboardAttrsMap.get(WhiteboardKeys.currentPage);
|
|
29603
|
-
if (!this.pageMap.has(targetPage) && targetPage !== "_i_") {
|
|
29604
|
-
(0, import_forge_room.log)(`main page {${targetPage}} not found.`, {}, "error");
|
|
29605
|
-
return;
|
|
29606
|
-
}
|
|
29607
|
-
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
29608
|
-
this.emit("switchPage", targetPage);
|
|
29609
|
-
}
|
|
29610
|
-
}
|
|
29611
|
-
}
|
|
29612
|
-
}
|
|
29613
|
-
};
|
|
29614
|
-
handleUserCurrentPageChange = (userId, evt) => {
|
|
29615
|
-
for (const [key, value] of evt.changes.keys.entries()) {
|
|
29616
|
-
if (key === WhiteboardKeys.currentPage) {
|
|
29617
|
-
const cameraMode = this.requestUserMap(this.userManager.selfId).get(WhiteboardKeys.cameraMode);
|
|
29618
|
-
if (value.action === "update" || value.action === "add") {
|
|
29619
|
-
if (userId !== this.userManager.selfId && cameraMode === userId) {
|
|
29620
|
-
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
29621
|
-
this.requestUserMap(this.userManager.selfId).set(WhiteboardKeys.currentPage, targetPage);
|
|
29622
|
-
this.emit("switchPage", targetPage);
|
|
29623
|
-
} else if (userId === this.userManager.selfId && cameraMode === "free") {
|
|
29624
|
-
const targetPage = this.requestUserMap(userId).get(WhiteboardKeys.currentPage);
|
|
29625
|
-
this.emit("switchPage", targetPage);
|
|
29626
|
-
}
|
|
29627
|
-
}
|
|
29628
|
-
}
|
|
29629
|
-
}
|
|
29630
|
-
};
|
|
29631
|
-
handlePageMapChange = () => {
|
|
29632
|
-
this.emit("pagesChange", Array.from(this.pageMap.keys()));
|
|
29633
|
-
};
|
|
29634
30106
|
getCurrentPage(userId) {
|
|
29635
30107
|
const cameraMode = this.requestUserMap(userId).get(WhiteboardKeys.cameraMode);
|
|
29636
30108
|
if (cameraMode === "main") {
|
|
@@ -29653,7 +30125,7 @@ var PageModel = class extends import_eventemitter311.default {
|
|
|
29653
30125
|
console.warn(`cannot modify pages in non-main view mode.`);
|
|
29654
30126
|
return false;
|
|
29655
30127
|
}
|
|
29656
|
-
if (!this.hasPermission(
|
|
30128
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29657
30129
|
console.warn(`cannot modify pages without WhiteboardPermissionFlag.mainView.`);
|
|
29658
30130
|
return false;
|
|
29659
30131
|
}
|
|
@@ -29682,7 +30154,7 @@ var PageModel = class extends import_eventemitter311.default {
|
|
|
29682
30154
|
}
|
|
29683
30155
|
}
|
|
29684
30156
|
setUserPage(id, userId) {
|
|
29685
|
-
if (this.pageList().indexOf(id) < 0 || !this.hasPermission(
|
|
30157
|
+
if (this.pageList().indexOf(id) < 0 || !this.hasPermission(WhiteboardPermissionFlag.setOthersView)) {
|
|
29686
30158
|
return;
|
|
29687
30159
|
}
|
|
29688
30160
|
const userMap = this.requestUserMap(userId);
|
|
@@ -29701,7 +30173,7 @@ var PageModel = class extends import_eventemitter311.default {
|
|
|
29701
30173
|
userMap.set(WhiteboardKeys.currentPage, id);
|
|
29702
30174
|
}
|
|
29703
30175
|
if (cameraMode === "main") {
|
|
29704
|
-
if (this.hasPermission(
|
|
30176
|
+
if (this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29705
30177
|
this.whiteboardAttrsMap.set(WhiteboardKeys.currentPage, id);
|
|
29706
30178
|
}
|
|
29707
30179
|
}
|
|
@@ -29721,13 +30193,24 @@ async function waitUntil(fn, timeout) {
|
|
|
29721
30193
|
// src/IndexedNavigation.ts
|
|
29722
30194
|
var import_eventemitter312 = __toESM(require("eventemitter3"), 1);
|
|
29723
30195
|
var import_forge_room2 = require("@netless/forge-room");
|
|
30196
|
+
function _defineProperty36(e, r, t) {
|
|
30197
|
+
return (r = _toPropertyKey36(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30198
|
+
}
|
|
30199
|
+
function _toPropertyKey36(t) {
|
|
30200
|
+
var i = _toPrimitive36(t, "string");
|
|
30201
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30202
|
+
}
|
|
30203
|
+
function _toPrimitive36(t, r) {
|
|
30204
|
+
if ("object" != typeof t || !t) return t;
|
|
30205
|
+
var e = t[Symbol.toPrimitive];
|
|
30206
|
+
if (void 0 !== e) {
|
|
30207
|
+
var i = e.call(t, r || "default");
|
|
30208
|
+
if ("object" != typeof i) return i;
|
|
30209
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30210
|
+
}
|
|
30211
|
+
return ("string" === r ? String : Number)(t);
|
|
30212
|
+
}
|
|
29724
30213
|
var IndexedNavigation = class extends import_eventemitter312.default {
|
|
29725
|
-
idPool = /* @__PURE__ */ new Set();
|
|
29726
|
-
pageModel;
|
|
29727
|
-
userMap;
|
|
29728
|
-
indexedPageMap;
|
|
29729
|
-
list = {};
|
|
29730
|
-
hasPermission;
|
|
29731
30214
|
get idList() {
|
|
29732
30215
|
return this.pageModel.pageList().filter((id) => /^_i_/.test(id));
|
|
29733
30216
|
}
|
|
@@ -29754,6 +30237,21 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
29754
30237
|
}
|
|
29755
30238
|
constructor(pageModel, userMap, indexedPageMap, hasPermission) {
|
|
29756
30239
|
super();
|
|
30240
|
+
_defineProperty36(this, "idPool", /* @__PURE__ */ new Set());
|
|
30241
|
+
_defineProperty36(this, "pageModel", void 0);
|
|
30242
|
+
_defineProperty36(this, "userMap", void 0);
|
|
30243
|
+
_defineProperty36(this, "indexedPageMap", void 0);
|
|
30244
|
+
_defineProperty36(this, "list", {});
|
|
30245
|
+
_defineProperty36(this, "hasPermission", void 0);
|
|
30246
|
+
_defineProperty36(this, "handleIndexedPageMapUpdate", (evt) => {
|
|
30247
|
+
this.list = this.indexedPageMap.get("list");
|
|
30248
|
+
const needRemoveList = this.pageModel.pageList().filter((v) => /^_i_/.test(v) && Object.keys(this.list).indexOf(v) < 0);
|
|
30249
|
+
const needAddList = Object.keys(this.list).filter((v) => this.pageModel.pageList().indexOf(v) < 0);
|
|
30250
|
+
this.indexedPageMap.doc.transact(() => {
|
|
30251
|
+
needAddList.forEach((id) => this.pageModel.addPage(id));
|
|
30252
|
+
needRemoveList.forEach((id) => this.pageModel.deletePage(id));
|
|
30253
|
+
});
|
|
30254
|
+
});
|
|
29757
30255
|
this.hasPermission = hasPermission;
|
|
29758
30256
|
this.pageModel = pageModel;
|
|
29759
30257
|
this.userMap = userMap;
|
|
@@ -29770,7 +30268,12 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
29770
30268
|
this.emit("pageCountChange", this.pageCount);
|
|
29771
30269
|
});
|
|
29772
30270
|
if (!this.indexedPageMap.has("list")) {
|
|
29773
|
-
this.list = {
|
|
30271
|
+
this.list = {
|
|
30272
|
+
"_i_": {
|
|
30273
|
+
prev: "",
|
|
30274
|
+
next: ""
|
|
30275
|
+
}
|
|
30276
|
+
};
|
|
29774
30277
|
this.indexedPageMap.set("list", this.list);
|
|
29775
30278
|
this.idPool.add("_i_");
|
|
29776
30279
|
} else {
|
|
@@ -29804,15 +30307,6 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
29804
30307
|
});
|
|
29805
30308
|
});
|
|
29806
30309
|
}
|
|
29807
|
-
handleIndexedPageMapUpdate = (evt) => {
|
|
29808
|
-
this.list = this.indexedPageMap.get("list");
|
|
29809
|
-
const needRemoveList = this.pageModel.pageList().filter((v) => /^_i_/.test(v) && Object.keys(this.list).indexOf(v) < 0);
|
|
29810
|
-
const needAddList = Object.keys(this.list).filter((v) => this.pageModel.pageList().indexOf(v) < 0);
|
|
29811
|
-
this.indexedPageMap.doc.transact(() => {
|
|
29812
|
-
needAddList.forEach((id) => this.pageModel.addPage(id));
|
|
29813
|
-
needRemoveList.forEach((id) => this.pageModel.deletePage(id));
|
|
29814
|
-
});
|
|
29815
|
-
};
|
|
29816
30310
|
/**
|
|
29817
30311
|
* 获取总页数
|
|
29818
30312
|
* @returns {number}
|
|
@@ -29869,7 +30363,7 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
29869
30363
|
console.warn(`cannot modify pages in non-main view mode.`);
|
|
29870
30364
|
return false;
|
|
29871
30365
|
}
|
|
29872
|
-
if (!this.hasPermission(
|
|
30366
|
+
if (!this.hasPermission(WhiteboardPermissionFlag.mainView)) {
|
|
29873
30367
|
console.warn(`cannot modify pages without WhiteboardPermissionFlag.mainView.`);
|
|
29874
30368
|
return false;
|
|
29875
30369
|
}
|
|
@@ -29880,7 +30374,8 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
29880
30374
|
* @param {boolean=} goto 是否跳转到新页面, 默认 true
|
|
29881
30375
|
* @return 总页数
|
|
29882
30376
|
*/
|
|
29883
|
-
pushPage(
|
|
30377
|
+
pushPage() {
|
|
30378
|
+
let goto = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
|
|
29884
30379
|
this.indexedPageMap.doc.transact(() => {
|
|
29885
30380
|
const id = this.getNextId();
|
|
29886
30381
|
if (!this.pageModel.addPage(id)) {
|
|
@@ -29912,7 +30407,8 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
29912
30407
|
* @param {boolean=} goto 是否跳转到新页面, 默认 true
|
|
29913
30408
|
* @return 总页数
|
|
29914
30409
|
*/
|
|
29915
|
-
insertPage(after
|
|
30410
|
+
insertPage(after) {
|
|
30411
|
+
let goto = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
|
|
29916
30412
|
const afterPageId = this.getPageId(after);
|
|
29917
30413
|
if (!afterPageId) {
|
|
29918
30414
|
return this.pageCount;
|
|
@@ -30041,10 +30537,27 @@ var IndexedNavigation = class extends import_eventemitter312.default {
|
|
|
30041
30537
|
|
|
30042
30538
|
// src/utils/ShadowEmitter.ts
|
|
30043
30539
|
var import_eventemitter313 = __toESM(require("eventemitter3"), 1);
|
|
30540
|
+
function _defineProperty37(e, r, t) {
|
|
30541
|
+
return (r = _toPropertyKey37(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30542
|
+
}
|
|
30543
|
+
function _toPropertyKey37(t) {
|
|
30544
|
+
var i = _toPrimitive37(t, "string");
|
|
30545
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30546
|
+
}
|
|
30547
|
+
function _toPrimitive37(t, r) {
|
|
30548
|
+
if ("object" != typeof t || !t) return t;
|
|
30549
|
+
var e = t[Symbol.toPrimitive];
|
|
30550
|
+
if (void 0 !== e) {
|
|
30551
|
+
var i = e.call(t, r || "default");
|
|
30552
|
+
if ("object" != typeof i) return i;
|
|
30553
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30554
|
+
}
|
|
30555
|
+
return ("string" === r ? String : Number)(t);
|
|
30556
|
+
}
|
|
30044
30557
|
var ShadowEmitter = class extends import_eventemitter313.default {
|
|
30045
|
-
userMap;
|
|
30046
30558
|
constructor(userMap) {
|
|
30047
30559
|
super();
|
|
30560
|
+
_defineProperty37(this, "userMap", void 0);
|
|
30048
30561
|
this.userMap = userMap;
|
|
30049
30562
|
}
|
|
30050
30563
|
getActive() {
|
|
@@ -30056,12 +30569,29 @@ var ShadowEmitter = class extends import_eventemitter313.default {
|
|
|
30056
30569
|
};
|
|
30057
30570
|
|
|
30058
30571
|
// src/tool/StraightLineTool.ts
|
|
30572
|
+
function _defineProperty38(e, r, t) {
|
|
30573
|
+
return (r = _toPropertyKey38(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30574
|
+
}
|
|
30575
|
+
function _toPropertyKey38(t) {
|
|
30576
|
+
var i = _toPrimitive38(t, "string");
|
|
30577
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30578
|
+
}
|
|
30579
|
+
function _toPrimitive38(t, r) {
|
|
30580
|
+
if ("object" != typeof t || !t) return t;
|
|
30581
|
+
var e = t[Symbol.toPrimitive];
|
|
30582
|
+
if (void 0 !== e) {
|
|
30583
|
+
var i = e.call(t, r || "default");
|
|
30584
|
+
if ("object" != typeof i) return i;
|
|
30585
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30586
|
+
}
|
|
30587
|
+
return ("string" === r ? String : Number)(t);
|
|
30588
|
+
}
|
|
30059
30589
|
var StraightLineTool = class extends WhiteboardTool {
|
|
30060
|
-
elementModel = null;
|
|
30061
|
-
from = null;
|
|
30062
|
-
to = null;
|
|
30063
30590
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope) {
|
|
30064
30591
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
30592
|
+
_defineProperty38(this, "elementModel", null);
|
|
30593
|
+
_defineProperty38(this, "from", null);
|
|
30594
|
+
_defineProperty38(this, "to", null);
|
|
30065
30595
|
this.tool.minDistance = 1;
|
|
30066
30596
|
}
|
|
30067
30597
|
onMouseDown(event) {
|
|
@@ -30086,11 +30616,28 @@ var StraightLineTool = class extends WhiteboardTool {
|
|
|
30086
30616
|
};
|
|
30087
30617
|
|
|
30088
30618
|
// src/tool/GrabTool.ts
|
|
30619
|
+
function _defineProperty39(e, r, t) {
|
|
30620
|
+
return (r = _toPropertyKey39(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30621
|
+
}
|
|
30622
|
+
function _toPropertyKey39(t) {
|
|
30623
|
+
var i = _toPrimitive39(t, "string");
|
|
30624
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30625
|
+
}
|
|
30626
|
+
function _toPrimitive39(t, r) {
|
|
30627
|
+
if ("object" != typeof t || !t) return t;
|
|
30628
|
+
var e = t[Symbol.toPrimitive];
|
|
30629
|
+
if (void 0 !== e) {
|
|
30630
|
+
var i = e.call(t, r || "default");
|
|
30631
|
+
if ("object" != typeof i) return i;
|
|
30632
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30633
|
+
}
|
|
30634
|
+
return ("string" === r ? String : Number)(t);
|
|
30635
|
+
}
|
|
30089
30636
|
var GrabTool = class extends WhiteboardTool {
|
|
30090
|
-
camera;
|
|
30091
|
-
downPoint = null;
|
|
30092
30637
|
constructor(enableToolEvent, modelGetter, shadowEmitter, scope, camera) {
|
|
30093
30638
|
super(enableToolEvent, modelGetter, shadowEmitter, scope);
|
|
30639
|
+
_defineProperty39(this, "camera", void 0);
|
|
30640
|
+
_defineProperty39(this, "downPoint", null);
|
|
30094
30641
|
this.camera = camera;
|
|
30095
30642
|
}
|
|
30096
30643
|
onMouseDown(event) {
|
|
@@ -30111,34 +30658,25 @@ var GrabTool = class extends WhiteboardTool {
|
|
|
30111
30658
|
};
|
|
30112
30659
|
|
|
30113
30660
|
// src/WhiteboardApplication.ts
|
|
30661
|
+
function _defineProperty40(e, r, t) {
|
|
30662
|
+
return (r = _toPropertyKey40(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e;
|
|
30663
|
+
}
|
|
30664
|
+
function _toPropertyKey40(t) {
|
|
30665
|
+
var i = _toPrimitive40(t, "string");
|
|
30666
|
+
return "symbol" == typeof i ? i : i + "";
|
|
30667
|
+
}
|
|
30668
|
+
function _toPrimitive40(t, r) {
|
|
30669
|
+
if ("object" != typeof t || !t) return t;
|
|
30670
|
+
var e = t[Symbol.toPrimitive];
|
|
30671
|
+
if (void 0 !== e) {
|
|
30672
|
+
var i = e.call(t, r || "default");
|
|
30673
|
+
if ("object" != typeof i) return i;
|
|
30674
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
30675
|
+
}
|
|
30676
|
+
return ("string" === r ? String : Number)(t);
|
|
30677
|
+
}
|
|
30114
30678
|
var WHITEBOARD_APP_NAME = "whiteboard";
|
|
30115
30679
|
var WhiteboardApplication = class extends import_forge_room3.AbstractApplication {
|
|
30116
|
-
static applicationName = WHITEBOARD_APP_NAME;
|
|
30117
|
-
name = WHITEBOARD_APP_NAME;
|
|
30118
|
-
emitter;
|
|
30119
|
-
toolbarModel;
|
|
30120
|
-
selectElementsModel;
|
|
30121
|
-
trashedElementsModel;
|
|
30122
|
-
pageModel;
|
|
30123
|
-
layers = /* @__PURE__ */ new Map();
|
|
30124
|
-
undoManagers = /* @__PURE__ */ new Map();
|
|
30125
|
-
rootElement = document.createElement("div");
|
|
30126
|
-
paperScope = new import_paper.default.PaperScope();
|
|
30127
|
-
canvasElement = document.createElement("canvas");
|
|
30128
|
-
shadowScope = new import_paper.default.PaperScope();
|
|
30129
|
-
snapshotCanvasElement = document.createElement("canvas");
|
|
30130
|
-
snapshotScope = new import_paper.default.PaperScope();
|
|
30131
|
-
shadowCanvasElement = document.createElement("canvas");
|
|
30132
|
-
shadowEmitter;
|
|
30133
|
-
tools;
|
|
30134
|
-
editors = /* @__PURE__ */ new Map();
|
|
30135
|
-
camera;
|
|
30136
|
-
resizeObserver;
|
|
30137
|
-
option;
|
|
30138
|
-
permissions;
|
|
30139
|
-
inputType = "any";
|
|
30140
|
-
isPenEvent = false;
|
|
30141
|
-
hasPenInput = null;
|
|
30142
30680
|
get undoManager() {
|
|
30143
30681
|
const page = this.pageModel.getCurrentPage(this.userId);
|
|
30144
30682
|
if (page) {
|
|
@@ -30147,7 +30685,250 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30147
30685
|
return null;
|
|
30148
30686
|
}
|
|
30149
30687
|
constructor() {
|
|
30688
|
+
var _this;
|
|
30150
30689
|
super();
|
|
30690
|
+
_this = this;
|
|
30691
|
+
_defineProperty40(this, "name", WHITEBOARD_APP_NAME);
|
|
30692
|
+
_defineProperty40(this, "emitter", void 0);
|
|
30693
|
+
_defineProperty40(this, "toolbarModel", void 0);
|
|
30694
|
+
_defineProperty40(this, "selectElementsModel", void 0);
|
|
30695
|
+
_defineProperty40(this, "trashedElementsModel", void 0);
|
|
30696
|
+
_defineProperty40(this, "pageModel", void 0);
|
|
30697
|
+
_defineProperty40(this, "layers", /* @__PURE__ */ new Map());
|
|
30698
|
+
_defineProperty40(this, "undoManagers", /* @__PURE__ */ new Map());
|
|
30699
|
+
_defineProperty40(this, "rootElement", document.createElement("div"));
|
|
30700
|
+
_defineProperty40(this, "paperScope", new import_paper.default.PaperScope());
|
|
30701
|
+
_defineProperty40(this, "canvasElement", document.createElement("canvas"));
|
|
30702
|
+
_defineProperty40(this, "shadowScope", new import_paper.default.PaperScope());
|
|
30703
|
+
_defineProperty40(this, "snapshotCanvasElement", document.createElement("canvas"));
|
|
30704
|
+
_defineProperty40(this, "snapshotScope", new import_paper.default.PaperScope());
|
|
30705
|
+
_defineProperty40(this, "shadowCanvasElement", document.createElement("canvas"));
|
|
30706
|
+
_defineProperty40(this, "shadowEmitter", void 0);
|
|
30707
|
+
_defineProperty40(this, "tools", void 0);
|
|
30708
|
+
_defineProperty40(this, "editors", /* @__PURE__ */ new Map());
|
|
30709
|
+
_defineProperty40(this, "camera", void 0);
|
|
30710
|
+
_defineProperty40(this, "resizeObserver", void 0);
|
|
30711
|
+
_defineProperty40(this, "option", void 0);
|
|
30712
|
+
_defineProperty40(this, "permissions", void 0);
|
|
30713
|
+
_defineProperty40(this, "linkTarget", null);
|
|
30714
|
+
_defineProperty40(this, "inputType", "any");
|
|
30715
|
+
_defineProperty40(this, "isPenEvent", false);
|
|
30716
|
+
_defineProperty40(this, "hasPenInput", null);
|
|
30717
|
+
_defineProperty40(this, "disableViewModelUpdate", false);
|
|
30718
|
+
_defineProperty40(this, "internalResizeObserver", true);
|
|
30719
|
+
_defineProperty40(this, "enableToolEvent", () => {
|
|
30720
|
+
return !(this.inputType === "pen" && !this.isPenEvent);
|
|
30721
|
+
});
|
|
30722
|
+
_defineProperty40(this, "handlePageSwitch", (pageId) => {
|
|
30723
|
+
for (const editor of this.editors.values()) {
|
|
30724
|
+
editor.hidden();
|
|
30725
|
+
}
|
|
30726
|
+
this.selectElementsModel.clearSelectElementForSelf();
|
|
30727
|
+
waitUntil(() => this.layers.has(pageId), 3e3).then(() => {
|
|
30728
|
+
if (this.layers.has(pageId)) {
|
|
30729
|
+
for (const entry of this.layers.entries()) {
|
|
30730
|
+
entry[1].off("elementInsert", this.handleElementInsert);
|
|
30731
|
+
entry[1].off("elementRemove", this.handleElementRemove);
|
|
30732
|
+
entry[1].off("elementClear", this.handleElementClear);
|
|
30733
|
+
}
|
|
30734
|
+
const renderableModel = this.layers.get(pageId);
|
|
30735
|
+
renderableModel.on("elementInsert", this.handleElementInsert);
|
|
30736
|
+
renderableModel.on("elementRemove", this.handleElementRemove);
|
|
30737
|
+
renderableModel.on("elementClear", this.handleElementClear);
|
|
30738
|
+
renderableModel.flushRenderables();
|
|
30739
|
+
const others = this.userManager.userIdList().filter((v) => v !== this.userId);
|
|
30740
|
+
for (const other of others) {
|
|
30741
|
+
if (this.userMap(other).get(WhiteboardKeys.currentPage) === pageId) {
|
|
30742
|
+
const elementIds = Array.from(this.userMap(other).get(WhiteboardKeys.selectElements).keys()).filter((v) => v !== "inner-map-id");
|
|
30743
|
+
if (elementIds.length > 0) {
|
|
30744
|
+
this.handleElementsSelect(other, elementIds);
|
|
30745
|
+
}
|
|
30746
|
+
}
|
|
30747
|
+
}
|
|
30748
|
+
}
|
|
30749
|
+
});
|
|
30750
|
+
waitUntil(() => this.undoManagers.has(pageId), 3e3).then(() => {
|
|
30751
|
+
if (this.undoManagers.has(pageId)) {
|
|
30752
|
+
for (const entry of this.undoManagers.entries()) {
|
|
30753
|
+
entry[1].off("stack-item-added", this.handleStackItemAdded);
|
|
30754
|
+
entry[1].off("stack-item-popped", this.handleStackItemPopped);
|
|
30755
|
+
}
|
|
30756
|
+
this.undoManagers.get(pageId).on("stack-item-added", this.handleStackItemAdded);
|
|
30757
|
+
this.undoManagers.get(pageId).on("stack-item-popped", this.handleStackItemPopped);
|
|
30758
|
+
}
|
|
30759
|
+
});
|
|
30760
|
+
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30761
|
+
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30762
|
+
});
|
|
30763
|
+
_defineProperty40(this, "hasPermission", (flag) => {
|
|
30764
|
+
return this.permissions.hasPermission(flag, this.userId);
|
|
30765
|
+
});
|
|
30766
|
+
_defineProperty40(this, "handleStackItemAdded", () => {
|
|
30767
|
+
this.selectElementsModel.clearSelectElementForSelf();
|
|
30768
|
+
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30769
|
+
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30770
|
+
});
|
|
30771
|
+
_defineProperty40(this, "handleStackItemPopped", () => {
|
|
30772
|
+
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30773
|
+
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30774
|
+
});
|
|
30775
|
+
_defineProperty40(this, "handleLayersChange", (ids) => {
|
|
30776
|
+
for (let i = 0, len = ids.length; i < len; i++) {
|
|
30777
|
+
const id = ids[i];
|
|
30778
|
+
if (!this.layers.has(id)) {
|
|
30779
|
+
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30780
|
+
const renderableModel = new RenderableModel(id, this.shadowEmitter, elementsMap, this.paperScope, this.toolbarModel, this.userManager, this.hasPermission);
|
|
30781
|
+
this.layers.set(id, renderableModel);
|
|
30782
|
+
}
|
|
30783
|
+
if (!this.undoManagers.has(id)) {
|
|
30784
|
+
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30785
|
+
const undoManager = new Y15.UndoManager(elementsMap, {
|
|
30786
|
+
trackedOrigins: /* @__PURE__ */ new Set([elementsUndoOrigin])
|
|
30787
|
+
});
|
|
30788
|
+
this.undoManagers.set(id, undoManager);
|
|
30789
|
+
}
|
|
30790
|
+
}
|
|
30791
|
+
for (let entry of this.layers.entries()) {
|
|
30792
|
+
if (ids.indexOf(entry[0]) < 0) {
|
|
30793
|
+
const renderableModel = this.layers.get(entry[0]);
|
|
30794
|
+
this.layers.delete(entry[0]);
|
|
30795
|
+
if (renderableModel) {
|
|
30796
|
+
renderableModel.dispose();
|
|
30797
|
+
}
|
|
30798
|
+
const cameraMode = this.userMap(this.userId).get(WhiteboardKeys.cameraMode);
|
|
30799
|
+
const currentPage = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30800
|
+
if (cameraMode === "free" && entry[0] === currentPage) {
|
|
30801
|
+
this.userMap(this.userId).set(WhiteboardKeys.cameraMode, "main");
|
|
30802
|
+
this.userMap(this.userId).set(WhiteboardKeys.currentPage, this.getMap("attrs").get(WhiteboardKeys.currentPage));
|
|
30803
|
+
}
|
|
30804
|
+
}
|
|
30805
|
+
}
|
|
30806
|
+
});
|
|
30807
|
+
_defineProperty40(this, "getCurrentRenderableModel", () => {
|
|
30808
|
+
let layerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30809
|
+
if (!this.layers.has(layerId)) {
|
|
30810
|
+
this.emitter.emit("error", 300002, `target page: ${layerId} not found`);
|
|
30811
|
+
}
|
|
30812
|
+
return this.layers.get(layerId);
|
|
30813
|
+
});
|
|
30814
|
+
_defineProperty40(this, "handleElementClear", () => {
|
|
30815
|
+
this.paperScope.project.activeLayer.removeChildren();
|
|
30816
|
+
});
|
|
30817
|
+
_defineProperty40(this, "handleElementInsert", (elements) => {
|
|
30818
|
+
for (const element of elements) {
|
|
30819
|
+
element.createPaperElement();
|
|
30820
|
+
const scope = element.shadow === "" ? this.paperScope : this.shadowScope;
|
|
30821
|
+
const children = scope.project.activeLayer.children;
|
|
30822
|
+
const oldPaperElement = children.find((v) => v.data.uuid === element.uuid);
|
|
30823
|
+
if (oldPaperElement) {
|
|
30824
|
+
oldPaperElement.remove();
|
|
30825
|
+
}
|
|
30826
|
+
this.insertElementToParent(element.item, scope.project.activeLayer);
|
|
30827
|
+
}
|
|
30828
|
+
});
|
|
30829
|
+
_defineProperty40(this, "handleElementRemove", (elementId, layerId) => {
|
|
30830
|
+
const layerModel = this.layers.get(layerId);
|
|
30831
|
+
if (!layerModel) {
|
|
30832
|
+
return;
|
|
30833
|
+
}
|
|
30834
|
+
const target = layerModel.elementModels.get(elementId);
|
|
30835
|
+
if (target && target.item) {
|
|
30836
|
+
target.item.remove();
|
|
30837
|
+
}
|
|
30838
|
+
layerModel.elementModels.delete(elementId);
|
|
30839
|
+
});
|
|
30840
|
+
_defineProperty40(this, "handleRemoveTrashedElementForSelf", (userId, elementId) => {
|
|
30841
|
+
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30842
|
+
this.layers.get(selfLayerId)?.removeElementItem(elementId);
|
|
30843
|
+
});
|
|
30844
|
+
_defineProperty40(this, "handleElementsTrash", (userId, elements) => {
|
|
30845
|
+
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30846
|
+
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30847
|
+
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30848
|
+
return;
|
|
30849
|
+
}
|
|
30850
|
+
elements.forEach((id) => {
|
|
30851
|
+
const paperItem = this.layers.get(targetLayerId).elementModels.get(id);
|
|
30852
|
+
if (paperItem && paperItem.item) {
|
|
30853
|
+
paperItem.item.opacity = 0.3;
|
|
30854
|
+
}
|
|
30855
|
+
});
|
|
30856
|
+
});
|
|
30857
|
+
_defineProperty40(this, "handleElementsSelect", (userId, elements) => {
|
|
30858
|
+
if (!this.editors.has(userId)) {
|
|
30859
|
+
const ctrl = this.userManager.getUser(userId);
|
|
30860
|
+
const editor2 = new Editor(this.paperScope, this.shadowScope, this.shadowEmitter, this.canvasElement, this.camera, {
|
|
30861
|
+
viewerId: this.userId,
|
|
30862
|
+
ctrlId: userId,
|
|
30863
|
+
ctrlNickName: ctrl?.nickName ?? "",
|
|
30864
|
+
ctrlUserMap: this.userMap(userId)
|
|
30865
|
+
});
|
|
30866
|
+
editor2.on("clear", () => {
|
|
30867
|
+
this.selectElementsModel.clearSelectElementForSelf();
|
|
30868
|
+
});
|
|
30869
|
+
this.editors.set(userId, editor2);
|
|
30870
|
+
this.rootElement.appendChild(editor2.rootView);
|
|
30871
|
+
}
|
|
30872
|
+
const editor = this.editors.get(userId);
|
|
30873
|
+
if (elements.length === 0) {
|
|
30874
|
+
editor.hidden();
|
|
30875
|
+
this.emitter.emit("elementDeselected", userId);
|
|
30876
|
+
return;
|
|
30877
|
+
}
|
|
30878
|
+
editor.show();
|
|
30879
|
+
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30880
|
+
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30881
|
+
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30882
|
+
return;
|
|
30883
|
+
}
|
|
30884
|
+
const elementModels = elements.map((id) => {
|
|
30885
|
+
return this.layers.get(targetLayerId).elementModels.get(id);
|
|
30886
|
+
}).filter((v) => !!v);
|
|
30887
|
+
editor.setTargets(elementModels);
|
|
30888
|
+
if (elementModels.length === 1) {
|
|
30889
|
+
let model = elementModels[0];
|
|
30890
|
+
if (model.item) {
|
|
30891
|
+
const topLeft = this.paperScope.project.view.projectToView(model.item.bounds.topLeft);
|
|
30892
|
+
const bottomRight = this.paperScope.project.view.projectToView(model.item.bounds.bottomRight);
|
|
30893
|
+
this.emitter.emit("elementSelected", userId, targetLayerId, model.uuid, model.getStyleKeys(), [topLeft.x, topLeft.y, bottomRight.x - topLeft.x, bottomRight.y - topLeft.y]);
|
|
30894
|
+
}
|
|
30895
|
+
}
|
|
30896
|
+
if (elementModels.length > 1) {
|
|
30897
|
+
this.emitter.emit("elementDeselected", userId);
|
|
30898
|
+
}
|
|
30899
|
+
});
|
|
30900
|
+
_defineProperty40(this, "onLinkTargetToolbarChange", (style) => {
|
|
30901
|
+
this.toolbarModel.currentTool = style.tool;
|
|
30902
|
+
this.toolbarModel.strokeColor = style.strokeColor;
|
|
30903
|
+
this.toolbarModel.fillColor = style.fillColor;
|
|
30904
|
+
this.toolbarModel.fontSize = style.fontSize;
|
|
30905
|
+
this.toolbarModel.fontFamily = style.fontFamily;
|
|
30906
|
+
this.toolbarModel.strokeWidth = style.strokeWidth;
|
|
30907
|
+
this.toolbarModel.dashArray = style.dashArray;
|
|
30908
|
+
});
|
|
30909
|
+
_defineProperty40(this, "onLinkTargetPermissionChange", (userId, flags) => {
|
|
30910
|
+
if (userId == this.userId) {
|
|
30911
|
+
flags.forEach((flag) => {
|
|
30912
|
+
this.permissions.addPermission(flag, this.userId);
|
|
30913
|
+
});
|
|
30914
|
+
}
|
|
30915
|
+
});
|
|
30916
|
+
_defineProperty40(this, "adjustByOutFrame", (frameWidth, frameHeight) => {
|
|
30917
|
+
if (this.option.width > 0 && this.option.height > 0) {
|
|
30918
|
+
const minWidth = Math.max(frameWidth, 10);
|
|
30919
|
+
const minHeight = Math.max(frameHeight, 10);
|
|
30920
|
+
let width = minWidth;
|
|
30921
|
+
let height = width * this.option.height / this.option.width;
|
|
30922
|
+
if (height > minHeight) {
|
|
30923
|
+
height = minHeight;
|
|
30924
|
+
width = height * this.option.width / this.option.height;
|
|
30925
|
+
}
|
|
30926
|
+
this.camera.updateInherentScale(width / this.option.width);
|
|
30927
|
+
this.paperScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30928
|
+
this.shadowScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30929
|
+
this.camera.triggerZoom();
|
|
30930
|
+
}
|
|
30931
|
+
});
|
|
30151
30932
|
requestAnimationFrameHook(this.paperScope);
|
|
30152
30933
|
requestAnimationFrameHook(this.shadowScope);
|
|
30153
30934
|
this.rootElement.setAttribute("data-forge-app", "whiteboard");
|
|
@@ -30158,7 +30939,9 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30158
30939
|
this.inputType = "pen";
|
|
30159
30940
|
this.emitter.emit("inputTypeChange", this.inputType);
|
|
30160
30941
|
}
|
|
30161
|
-
}, {
|
|
30942
|
+
}, {
|
|
30943
|
+
capture: true
|
|
30944
|
+
});
|
|
30162
30945
|
this.emitter = new Whiteboard(this.rootElement);
|
|
30163
30946
|
this.emitter.getElementAttribute = (layerId, elementId, attribute) => {
|
|
30164
30947
|
const layerModel = this.layers.get(layerId);
|
|
@@ -30208,13 +30991,23 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30208
30991
|
return this.userMap(targetId).get(WhiteboardKeys.currentPage);
|
|
30209
30992
|
};
|
|
30210
30993
|
this.emitter.setViewModeToFree = (userId) => {
|
|
30211
|
-
|
|
30994
|
+
if (that.disableViewModelUpdate) {
|
|
30995
|
+
console.warn("Operation failed. Perspective mode switching is disabled in the current environment.");
|
|
30996
|
+
(0, import_forge_room3.log)("Operation failed. Perspective mode switching is disabled in the current environment.", {}, "warning");
|
|
30997
|
+
return;
|
|
30998
|
+
}
|
|
30999
|
+
const targetId = userId ? this.hasPermission(WhiteboardPermissionFlag.setOthersView) ? userId : null : this.userId;
|
|
30212
31000
|
if (targetId) {
|
|
30213
31001
|
this.userMap(targetId).set(WhiteboardKeys.cameraMode, "free");
|
|
30214
31002
|
}
|
|
30215
31003
|
};
|
|
30216
31004
|
this.emitter.setViewModeToFlow = (flowId, userId) => {
|
|
30217
|
-
|
|
31005
|
+
if (that.disableViewModelUpdate) {
|
|
31006
|
+
console.warn("Operation failed. Perspective mode switching is disabled in the current environment.");
|
|
31007
|
+
(0, import_forge_room3.log)("Operation failed. Perspective mode switching is disabled in the current environment.", {}, "warning");
|
|
31008
|
+
return;
|
|
31009
|
+
}
|
|
31010
|
+
const targetId = userId ? this.hasPermission(WhiteboardPermissionFlag.setOthersView) ? userId : null : this.userId;
|
|
30218
31011
|
if (targetId && this.userManager.getUser(flowId)) {
|
|
30219
31012
|
this.userMap(targetId).set(WhiteboardKeys.cameraMode, flowId);
|
|
30220
31013
|
const flowPage = this.userMap(flowId).get(WhiteboardKeys.currentPage);
|
|
@@ -30224,7 +31017,12 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30224
31017
|
}
|
|
30225
31018
|
};
|
|
30226
31019
|
this.emitter.setViewModeToMain = (userId) => {
|
|
30227
|
-
|
|
31020
|
+
if (that.disableViewModelUpdate) {
|
|
31021
|
+
console.warn("Operation failed. Perspective mode switching is disabled in the current environment.");
|
|
31022
|
+
(0, import_forge_room3.log)("Operation failed. Perspective mode switching is disabled in the current environment.", {}, "warning");
|
|
31023
|
+
return;
|
|
31024
|
+
}
|
|
31025
|
+
const targetId = userId ? this.hasPermission(WhiteboardPermissionFlag.setOthersView) ? userId : null : this.userId;
|
|
30228
31026
|
if (targetId) {
|
|
30229
31027
|
this.userMap(targetId).set(WhiteboardKeys.cameraMode, "main");
|
|
30230
31028
|
const mainPage = this.getMap("attrs").get(WhiteboardKeys.currentPage);
|
|
@@ -30275,8 +31073,14 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30275
31073
|
this.emitter.redo = () => {
|
|
30276
31074
|
this.undoManager?.redo();
|
|
30277
31075
|
};
|
|
30278
|
-
this.emitter.
|
|
30279
|
-
return this.rasterize(page);
|
|
31076
|
+
this.emitter.rasterizeViewport = (scale, page) => {
|
|
31077
|
+
return this.rasterize(1, 1, scale, "viewport", page);
|
|
31078
|
+
};
|
|
31079
|
+
this.emitter.rasterizeElementsBounds = (outputMaxWidth, outputMaxHeight, page) => {
|
|
31080
|
+
return this.rasterize(outputMaxWidth, outputMaxHeight, 1, "bounds", page);
|
|
31081
|
+
};
|
|
31082
|
+
this.emitter.rasterizeMaxBounds = (scale, page) => {
|
|
31083
|
+
return this.rasterize(1, 1, scale, "maxScale", page);
|
|
30280
31084
|
};
|
|
30281
31085
|
this.emitter.setInputType = (type) => {
|
|
30282
31086
|
this.inputType = type;
|
|
@@ -30285,8 +31089,9 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30285
31089
|
this.emitter.translateCamera = (offsetX, offsetY) => {
|
|
30286
31090
|
this.camera.translate(offsetX, offsetY);
|
|
30287
31091
|
};
|
|
30288
|
-
this.emitter.scaleCamera = (scale)
|
|
30289
|
-
|
|
31092
|
+
this.emitter.scaleCamera = function(scale) {
|
|
31093
|
+
let origin = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "center";
|
|
31094
|
+
_this.camera.scale(scale, origin);
|
|
30290
31095
|
};
|
|
30291
31096
|
this.emitter.resetCamera = () => {
|
|
30292
31097
|
this.camera.reset();
|
|
@@ -30390,9 +31195,6 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30390
31195
|
userMap(userId) {
|
|
30391
31196
|
return this.getMap(`user/${userId}`);
|
|
30392
31197
|
}
|
|
30393
|
-
enableToolEvent = () => {
|
|
30394
|
-
return !(this.inputType === "pen" && !this.isPenEvent);
|
|
30395
|
-
};
|
|
30396
31198
|
async initialize(option) {
|
|
30397
31199
|
this.permissions = new WhiteboardPermissions(this.userManager, (userId) => {
|
|
30398
31200
|
return this.userMap(userId);
|
|
@@ -30402,39 +31204,22 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30402
31204
|
this.option = option;
|
|
30403
31205
|
this.userMap(this.userId).set(WhiteboardKeys.themeColor, "#009688");
|
|
30404
31206
|
this.shadowEmitter = new ShadowEmitter(this.userMap(this.userId));
|
|
30405
|
-
this.pageModel = new PageModel(
|
|
30406
|
-
this.
|
|
30407
|
-
|
|
30408
|
-
(userId) => {
|
|
30409
|
-
return this.userMap(userId);
|
|
30410
|
-
},
|
|
30411
|
-
this.getMap("pages"),
|
|
30412
|
-
this.hasPermission
|
|
30413
|
-
);
|
|
31207
|
+
this.pageModel = new PageModel(this.getMap("attrs"), this.userManager, (userId) => {
|
|
31208
|
+
return this.userMap(userId);
|
|
31209
|
+
}, this.getMap("pages"), this.hasPermission);
|
|
30414
31210
|
this.pageModel.on("pagesChange", this.handleLayersChange);
|
|
30415
31211
|
this.pageModel.on("switchPage", this.handlePageSwitch);
|
|
30416
31212
|
if (option.maxScaleRatio && option.maxScaleRatio < 1 && option.maxScaleRatio !== -1) {
|
|
30417
31213
|
throw new Error(`[@netless/forge-whiteboard] invalid maxScaleRatio ${option.maxScaleRatio}`);
|
|
30418
31214
|
}
|
|
30419
|
-
this.camera = new Camera(
|
|
30420
|
-
|
|
30421
|
-
|
|
30422
|
-
this.
|
|
30423
|
-
|
|
30424
|
-
this.
|
|
30425
|
-
|
|
30426
|
-
|
|
30427
|
-
(userId) => {
|
|
30428
|
-
return this.userMap(userId);
|
|
30429
|
-
},
|
|
30430
|
-
() => {
|
|
30431
|
-
return [this.paperScope.project.view.size.width, this.paperScope.project.view.size.height];
|
|
30432
|
-
},
|
|
30433
|
-
() => {
|
|
30434
|
-
const rect = this.canvasElement.getBoundingClientRect();
|
|
30435
|
-
return [rect.width, rect.height];
|
|
30436
|
-
}
|
|
30437
|
-
);
|
|
31215
|
+
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) => {
|
|
31216
|
+
return this.userMap(userId);
|
|
31217
|
+
}, () => {
|
|
31218
|
+
return [this.paperScope.project.view.size.width, this.paperScope.project.view.size.height];
|
|
31219
|
+
}, () => {
|
|
31220
|
+
const rect = this.canvasElement.getBoundingClientRect();
|
|
31221
|
+
return [rect.width, rect.height];
|
|
31222
|
+
});
|
|
30438
31223
|
this.camera.on("zoom", (matrix) => {
|
|
30439
31224
|
this.paperScope.project.view.matrix = matrix;
|
|
30440
31225
|
this.shadowScope.project.view.matrix = matrix;
|
|
@@ -30500,6 +31285,7 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30500
31285
|
this.canvasElement.style.top = "50%";
|
|
30501
31286
|
this.canvasElement.style.left = "50%";
|
|
30502
31287
|
this.canvasElement.style.transform = "translate(-50%, -50%)";
|
|
31288
|
+
this.canvasElement.setAttribute("id", `${this.appId}-main`);
|
|
30503
31289
|
this.paperScope.setup(this.canvasElement);
|
|
30504
31290
|
this.paperScope.settings.insertItems = false;
|
|
30505
31291
|
this.shadowCanvasElement.style.position = "absolute";
|
|
@@ -30507,36 +31293,23 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30507
31293
|
this.shadowCanvasElement.style.left = "50%";
|
|
30508
31294
|
this.shadowCanvasElement.style.transform = "translate(-50%, -50%)";
|
|
30509
31295
|
this.shadowCanvasElement.style.pointerEvents = "none";
|
|
31296
|
+
this.shadowCanvasElement.setAttribute("id", `${this.appId}-shadow`);
|
|
30510
31297
|
this.rootElement.appendChild(this.shadowCanvasElement);
|
|
30511
31298
|
this.shadowScope.setup(this.shadowCanvasElement);
|
|
30512
31299
|
this.shadowScope.settings.insertItems = false;
|
|
31300
|
+
this.snapshotCanvasElement.setAttribute("id", `${this.appId}-snapshot`);
|
|
30513
31301
|
this.snapshotScope.setup(this.snapshotCanvasElement);
|
|
30514
31302
|
this.resizeObserver = new ResizeObserver(() => {
|
|
30515
|
-
|
|
30516
|
-
|
|
30517
|
-
|
|
30518
|
-
|
|
30519
|
-
let height = width * this.option.height / this.option.width;
|
|
30520
|
-
if (height > minHeight) {
|
|
30521
|
-
height = minHeight;
|
|
30522
|
-
width = height * this.option.width / this.option.height;
|
|
30523
|
-
}
|
|
30524
|
-
this.camera.updateInherentScale(width / this.option.width);
|
|
30525
|
-
this.paperScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30526
|
-
this.shadowScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
30527
|
-
this.userMap(this.userId).set("viewSize", `${width}.${height}`);
|
|
30528
|
-
this.camera.triggerZoom();
|
|
31303
|
+
if (this.internalResizeObserver) {
|
|
31304
|
+
const rootBounds = this.rootElement.getBoundingClientRect();
|
|
31305
|
+
this.adjustByOutFrame(rootBounds.width, rootBounds.height);
|
|
31306
|
+
}
|
|
30529
31307
|
});
|
|
30530
31308
|
this.resizeObserver.observe(this.rootElement);
|
|
30531
31309
|
if (!this.getMap("attrs").has(WhiteboardKeys.currentPage)) {
|
|
30532
31310
|
this.getMap("attrs").set(WhiteboardKeys.currentPage, "_i_");
|
|
30533
31311
|
}
|
|
30534
|
-
this.emitter.indexedNavigation = new IndexedNavigation(
|
|
30535
|
-
this.pageModel,
|
|
30536
|
-
this.userMap(this.userId),
|
|
30537
|
-
this.getMap("indexedNavigation"),
|
|
30538
|
-
this.hasPermission
|
|
30539
|
-
);
|
|
31312
|
+
this.emitter.indexedNavigation = new IndexedNavigation(this.pageModel, this.userMap(this.userId), this.getMap("indexedNavigation"), this.hasPermission);
|
|
30540
31313
|
this.emitter.indexedNavigation.initIndexed().then((inited) => {
|
|
30541
31314
|
if (!inited) {
|
|
30542
31315
|
this.handleLayersChange(this.pageModel.pageList());
|
|
@@ -30606,91 +31379,6 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30606
31379
|
});
|
|
30607
31380
|
this.clearElements();
|
|
30608
31381
|
}
|
|
30609
|
-
handlePageSwitch = (pageId) => {
|
|
30610
|
-
for (const editor of this.editors.values()) {
|
|
30611
|
-
editor.hidden();
|
|
30612
|
-
}
|
|
30613
|
-
this.selectElementsModel.clearSelectElementForSelf();
|
|
30614
|
-
waitUntil(() => this.layers.has(pageId), 3e3).then(() => {
|
|
30615
|
-
if (this.layers.has(pageId)) {
|
|
30616
|
-
for (const entry of this.layers.entries()) {
|
|
30617
|
-
entry[1].off("elementInsert", this.handleElementInsert);
|
|
30618
|
-
entry[1].off("elementRemove", this.handleElementRemove);
|
|
30619
|
-
entry[1].off("elementClear", this.handleElementClear);
|
|
30620
|
-
}
|
|
30621
|
-
const renderableModel = this.layers.get(pageId);
|
|
30622
|
-
renderableModel.on("elementInsert", this.handleElementInsert);
|
|
30623
|
-
renderableModel.on("elementRemove", this.handleElementRemove);
|
|
30624
|
-
renderableModel.on("elementClear", this.handleElementClear);
|
|
30625
|
-
renderableModel.flushRenderables();
|
|
30626
|
-
const others = this.userManager.userIdList().filter((v) => v !== this.userId);
|
|
30627
|
-
for (const other of others) {
|
|
30628
|
-
if (this.userMap(other).get(WhiteboardKeys.currentPage) === pageId) {
|
|
30629
|
-
const elementIds = Array.from(this.userMap(other).get(WhiteboardKeys.selectElements).keys()).filter((v) => v !== "inner-map-id");
|
|
30630
|
-
if (elementIds.length > 0) {
|
|
30631
|
-
this.handleElementsSelect(other, elementIds);
|
|
30632
|
-
}
|
|
30633
|
-
}
|
|
30634
|
-
}
|
|
30635
|
-
}
|
|
30636
|
-
});
|
|
30637
|
-
waitUntil(() => this.undoManagers.has(pageId), 3e3).then(() => {
|
|
30638
|
-
if (this.undoManagers.has(pageId)) {
|
|
30639
|
-
for (const entry of this.undoManagers.entries()) {
|
|
30640
|
-
entry[1].off("stack-item-added", this.handleStackItemAdded);
|
|
30641
|
-
entry[1].off("stack-item-popped", this.handleStackItemPopped);
|
|
30642
|
-
}
|
|
30643
|
-
this.undoManagers.get(pageId).on("stack-item-added", this.handleStackItemAdded);
|
|
30644
|
-
this.undoManagers.get(pageId).on("stack-item-popped", this.handleStackItemPopped);
|
|
30645
|
-
}
|
|
30646
|
-
});
|
|
30647
|
-
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30648
|
-
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30649
|
-
};
|
|
30650
|
-
hasPermission = (flag) => {
|
|
30651
|
-
return this.permissions.hasPermission(flag, this.userId);
|
|
30652
|
-
};
|
|
30653
|
-
handleStackItemAdded = () => {
|
|
30654
|
-
this.selectElementsModel.clearSelectElementForSelf();
|
|
30655
|
-
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30656
|
-
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30657
|
-
};
|
|
30658
|
-
handleStackItemPopped = () => {
|
|
30659
|
-
this.emitter.emit("redoStackLength", this.undoManager?.redoStack.length ?? 0);
|
|
30660
|
-
this.emitter.emit("undoStackLength", this.undoManager?.undoStack.length ?? 0);
|
|
30661
|
-
};
|
|
30662
|
-
handleLayersChange = (ids) => {
|
|
30663
|
-
for (let i = 0, len = ids.length; i < len; i++) {
|
|
30664
|
-
const id = ids[i];
|
|
30665
|
-
if (!this.layers.has(id)) {
|
|
30666
|
-
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30667
|
-
const renderableModel = new RenderableModel(id, this.shadowEmitter, elementsMap, this.paperScope, this.toolbarModel, this.userManager, this.hasPermission);
|
|
30668
|
-
this.layers.set(id, renderableModel);
|
|
30669
|
-
}
|
|
30670
|
-
if (!this.undoManagers.has(id)) {
|
|
30671
|
-
const elementsMap = this.getMap(`layer/${id}/elements`);
|
|
30672
|
-
const undoManager = new Y15.UndoManager(elementsMap, {
|
|
30673
|
-
trackedOrigins: /* @__PURE__ */ new Set([elementsUndoOrigin])
|
|
30674
|
-
});
|
|
30675
|
-
this.undoManagers.set(id, undoManager);
|
|
30676
|
-
}
|
|
30677
|
-
}
|
|
30678
|
-
for (let entry of this.layers.entries()) {
|
|
30679
|
-
if (ids.indexOf(entry[0]) < 0) {
|
|
30680
|
-
const renderableModel = this.layers.get(entry[0]);
|
|
30681
|
-
this.layers.delete(entry[0]);
|
|
30682
|
-
if (renderableModel) {
|
|
30683
|
-
renderableModel.dispose();
|
|
30684
|
-
}
|
|
30685
|
-
const cameraMode = this.userMap(this.userId).get(WhiteboardKeys.cameraMode);
|
|
30686
|
-
const currentPage = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30687
|
-
if (cameraMode === "free" && entry[0] === currentPage) {
|
|
30688
|
-
this.userMap(this.userId).set(WhiteboardKeys.cameraMode, "main");
|
|
30689
|
-
this.userMap(this.userId).set(WhiteboardKeys.currentPage, this.getMap("attrs").get(WhiteboardKeys.currentPage));
|
|
30690
|
-
}
|
|
30691
|
-
}
|
|
30692
|
-
}
|
|
30693
|
-
};
|
|
30694
31382
|
clearElements() {
|
|
30695
31383
|
const userIds = this.userManager.userIdList();
|
|
30696
31384
|
const isContinue = userIds.every((userId) => {
|
|
@@ -30707,16 +31395,6 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30707
31395
|
}
|
|
30708
31396
|
setTimeout(() => this.clearElements(), 1e4);
|
|
30709
31397
|
}
|
|
30710
|
-
getCurrentRenderableModel = () => {
|
|
30711
|
-
let layerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30712
|
-
if (!this.layers.has(layerId)) {
|
|
30713
|
-
this.emitter.emit("error", 300002, `target page: ${layerId} not found`);
|
|
30714
|
-
}
|
|
30715
|
-
return this.layers.get(layerId);
|
|
30716
|
-
};
|
|
30717
|
-
handleElementClear = () => {
|
|
30718
|
-
this.paperScope.project.activeLayer.removeChildren();
|
|
30719
|
-
};
|
|
30720
31398
|
findElementIndex(target, parent) {
|
|
30721
31399
|
const children = parent.children;
|
|
30722
31400
|
let left = 0;
|
|
@@ -30733,18 +31411,6 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30733
31411
|
}
|
|
30734
31412
|
return result;
|
|
30735
31413
|
}
|
|
30736
|
-
handleElementInsert = (elements) => {
|
|
30737
|
-
for (const element of elements) {
|
|
30738
|
-
element.createPaperElement();
|
|
30739
|
-
const scope = element.shadow === "" ? this.paperScope : this.shadowScope;
|
|
30740
|
-
const children = scope.project.activeLayer.children;
|
|
30741
|
-
const oldPaperElement = children.find((v) => v.data.uuid === element.uuid);
|
|
30742
|
-
if (oldPaperElement) {
|
|
30743
|
-
oldPaperElement.remove();
|
|
30744
|
-
}
|
|
30745
|
-
this.insertElementToParent(element.item, scope.project.activeLayer);
|
|
30746
|
-
}
|
|
30747
|
-
};
|
|
30748
31414
|
insertElementToParent(element, parent) {
|
|
30749
31415
|
const children = parent.children;
|
|
30750
31416
|
const at = this.findElementIndex(element.data.index, parent);
|
|
@@ -30756,85 +31422,10 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30756
31422
|
}
|
|
30757
31423
|
}
|
|
30758
31424
|
}
|
|
30759
|
-
|
|
30760
|
-
|
|
30761
|
-
|
|
30762
|
-
|
|
30763
|
-
}
|
|
30764
|
-
const target = layerModel.elementModels.get(elementId);
|
|
30765
|
-
if (target && target.item) {
|
|
30766
|
-
target.item.remove();
|
|
30767
|
-
}
|
|
30768
|
-
layerModel.elementModels.delete(elementId);
|
|
30769
|
-
};
|
|
30770
|
-
handleRemoveTrashedElementForSelf = (userId, elementId) => {
|
|
30771
|
-
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30772
|
-
this.layers.get(selfLayerId)?.removeElementItem(elementId);
|
|
30773
|
-
};
|
|
30774
|
-
handleElementsTrash = (userId, elements) => {
|
|
30775
|
-
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30776
|
-
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30777
|
-
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30778
|
-
return;
|
|
30779
|
-
}
|
|
30780
|
-
elements.forEach((id) => {
|
|
30781
|
-
const paperItem = this.layers.get(targetLayerId).elementModels.get(id);
|
|
30782
|
-
if (paperItem && paperItem.item) {
|
|
30783
|
-
paperItem.item.opacity = 0.3;
|
|
30784
|
-
}
|
|
30785
|
-
});
|
|
30786
|
-
};
|
|
30787
|
-
handleElementsSelect = (userId, elements) => {
|
|
30788
|
-
if (!this.editors.has(userId)) {
|
|
30789
|
-
const ctrl = this.userManager.getUser(userId);
|
|
30790
|
-
const editor2 = new Editor(this.paperScope, this.shadowScope, this.shadowEmitter, this.canvasElement, this.camera, {
|
|
30791
|
-
viewerId: this.userId,
|
|
30792
|
-
ctrlId: userId,
|
|
30793
|
-
ctrlNickName: ctrl?.nickName ?? "",
|
|
30794
|
-
ctrlUserMap: this.userMap(userId)
|
|
30795
|
-
});
|
|
30796
|
-
editor2.on("clear", () => {
|
|
30797
|
-
this.selectElementsModel.clearSelectElementForSelf();
|
|
30798
|
-
});
|
|
30799
|
-
this.editors.set(userId, editor2);
|
|
30800
|
-
this.rootElement.appendChild(editor2.rootView);
|
|
30801
|
-
}
|
|
30802
|
-
const editor = this.editors.get(userId);
|
|
30803
|
-
if (elements.length === 0) {
|
|
30804
|
-
editor.hidden();
|
|
30805
|
-
this.emitter.emit("elementDeselected", userId);
|
|
30806
|
-
return;
|
|
30807
|
-
}
|
|
30808
|
-
editor.show();
|
|
30809
|
-
const targetLayerId = this.userMap(userId).get(WhiteboardKeys.currentPage);
|
|
30810
|
-
const selfLayerId = this.userMap(this.userId).get(WhiteboardKeys.currentPage);
|
|
30811
|
-
if (targetLayerId !== selfLayerId || !this.layers.has(targetLayerId)) {
|
|
30812
|
-
return;
|
|
30813
|
-
}
|
|
30814
|
-
const elementModels = elements.map((id) => {
|
|
30815
|
-
return this.layers.get(targetLayerId).elementModels.get(id);
|
|
30816
|
-
}).filter((v) => !!v);
|
|
30817
|
-
editor.setTargets(elementModels);
|
|
30818
|
-
if (elementModels.length === 1) {
|
|
30819
|
-
let model = elementModels[0];
|
|
30820
|
-
if (model.item) {
|
|
30821
|
-
const topLeft = this.paperScope.project.view.projectToView(model.item.bounds.topLeft);
|
|
30822
|
-
const bottomRight = this.paperScope.project.view.projectToView(model.item.bounds.bottomRight);
|
|
30823
|
-
this.emitter.emit(
|
|
30824
|
-
"elementSelected",
|
|
30825
|
-
userId,
|
|
30826
|
-
targetLayerId,
|
|
30827
|
-
model.uuid,
|
|
30828
|
-
model.getStyleKeys(),
|
|
30829
|
-
[topLeft.x, topLeft.y, bottomRight.x - topLeft.x, bottomRight.y - topLeft.y]
|
|
30830
|
-
);
|
|
30831
|
-
}
|
|
30832
|
-
}
|
|
30833
|
-
if (elementModels.length > 1) {
|
|
30834
|
-
this.emitter.emit("elementDeselected", userId);
|
|
30835
|
-
}
|
|
30836
|
-
};
|
|
30837
|
-
rasterize(page) {
|
|
31425
|
+
ensureScale(outputWidth, outputHeight, originSize) {
|
|
31426
|
+
return Math.min(outputWidth / originSize.width, outputHeight / originSize.height);
|
|
31427
|
+
}
|
|
31428
|
+
rasterize(outputMaxWidth, outputMaxHeight, scale, area, page) {
|
|
30838
31429
|
let pageId;
|
|
30839
31430
|
if (typeof page === "string") {
|
|
30840
31431
|
pageId = page;
|
|
@@ -30848,8 +31439,6 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30848
31439
|
return Promise.resolve(null);
|
|
30849
31440
|
}
|
|
30850
31441
|
this.snapshotScope.project.activeLayer.removeChildren();
|
|
30851
|
-
this.snapshotScope.view.matrix = this.paperScope.project.view.matrix.clone();
|
|
30852
|
-
this.snapshotScope.view.viewSize = this.paperScope.project.view.viewSize.clone();
|
|
30853
31442
|
for (const key of Array.from(renderableModel.elements.keys())) {
|
|
30854
31443
|
let elementModel = null;
|
|
30855
31444
|
if (renderableModel.elementModels.has(key)) {
|
|
@@ -30865,17 +31454,86 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30865
31454
|
elementModel.createPaperElement();
|
|
30866
31455
|
}
|
|
30867
31456
|
if (elementModel.item) {
|
|
30868
|
-
const paperItem = elementModel.item.clone({
|
|
31457
|
+
const paperItem = elementModel.item.clone({
|
|
31458
|
+
insert: false
|
|
31459
|
+
});
|
|
30869
31460
|
this.snapshotScope.project.activeLayer.addChild(paperItem);
|
|
30870
31461
|
}
|
|
30871
31462
|
}
|
|
30872
31463
|
}
|
|
31464
|
+
if (area === "bounds") {
|
|
31465
|
+
const bounds = this.snapshotScope.project.activeLayer.bounds;
|
|
31466
|
+
const scale2 = this.ensureScale(outputMaxWidth, outputMaxHeight, bounds.size);
|
|
31467
|
+
const matrix = new this.paperScope.Matrix();
|
|
31468
|
+
matrix.scale(scale2);
|
|
31469
|
+
matrix.translate({
|
|
31470
|
+
x: -bounds.x,
|
|
31471
|
+
y: -bounds.y
|
|
31472
|
+
});
|
|
31473
|
+
this.snapshotScope.view.viewSize = bounds.size.multiply(scale2);
|
|
31474
|
+
this.snapshotScope.view.matrix = matrix;
|
|
31475
|
+
} else if (area === "maxScale" && this.option.maxScaleRatio && this.option.maxScaleRatio !== -1) {
|
|
31476
|
+
const width = this.option.width * this.option.maxScaleRatio;
|
|
31477
|
+
const height = this.option.height * this.option.maxScaleRatio;
|
|
31478
|
+
const offsetX = this.option.width * (this.option.maxScaleRatio - 1) / 2;
|
|
31479
|
+
const offsetY = this.option.height * (this.option.maxScaleRatio - 1) / 2;
|
|
31480
|
+
const matrix = new this.paperScope.Matrix();
|
|
31481
|
+
matrix.scale(scale);
|
|
31482
|
+
matrix.translate({
|
|
31483
|
+
x: offsetX,
|
|
31484
|
+
y: offsetY
|
|
31485
|
+
});
|
|
31486
|
+
this.snapshotScope.view.viewSize = new this.snapshotScope.Size(width, height).multiply(scale);
|
|
31487
|
+
this.snapshotScope.view.matrix = matrix;
|
|
31488
|
+
} else {
|
|
31489
|
+
this.snapshotScope.view.matrix = this.paperScope.project.view.matrix.clone();
|
|
31490
|
+
this.snapshotScope.view.matrix.scale(scale, this.paperScope.project.view.bounds.topLeft);
|
|
31491
|
+
this.snapshotScope.view.viewSize = this.paperScope.project.view.viewSize.clone().multiply(scale);
|
|
31492
|
+
}
|
|
30873
31493
|
return new Promise((resolve) => {
|
|
30874
31494
|
setTimeout(() => {
|
|
30875
31495
|
resolve(this.snapshotScope.view.element.toDataURL("image/png"));
|
|
30876
31496
|
}, 32);
|
|
30877
31497
|
});
|
|
30878
31498
|
}
|
|
31499
|
+
disableViewModel() {
|
|
31500
|
+
this.disableViewModelUpdate = true;
|
|
31501
|
+
}
|
|
31502
|
+
linkToWhiteboard(targetId) {
|
|
31503
|
+
console.log("linkToWhiteboard, linkToWhiteboard, linkToWhiteboard");
|
|
31504
|
+
if (this.linkTarget) {
|
|
31505
|
+
this.unlink();
|
|
31506
|
+
}
|
|
31507
|
+
this.linkTarget = this.applicationManager.getInstances(targetId);
|
|
31508
|
+
if (this.linkTarget) {
|
|
31509
|
+
this.linkTarget.toolbarModel.on("update", this.onLinkTargetToolbarChange);
|
|
31510
|
+
this.linkTarget.permissions.on("change", this.onLinkTargetPermissionChange);
|
|
31511
|
+
} else {
|
|
31512
|
+
throw new Error(`[@netless/forge-whiteboard] link target ${targetId} not found`);
|
|
31513
|
+
}
|
|
31514
|
+
}
|
|
31515
|
+
unlink() {
|
|
31516
|
+
if (this.linkTarget) {
|
|
31517
|
+
this.linkTarget.toolbarModel.off("update", this.onLinkTargetToolbarChange);
|
|
31518
|
+
this.linkTarget.permissions.off("change", this.onLinkTargetPermissionChange);
|
|
31519
|
+
}
|
|
31520
|
+
}
|
|
31521
|
+
setViewSize(width, height) {
|
|
31522
|
+
this.paperScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
31523
|
+
this.shadowScope.project.view.viewSize = new this.paperScope.Size(width, height);
|
|
31524
|
+
}
|
|
31525
|
+
getViewSize() {
|
|
31526
|
+
const size = this.paperScope.view.viewSize;
|
|
31527
|
+
return [size.width, size.height];
|
|
31528
|
+
}
|
|
31529
|
+
updateInternalResizeObserverStatus(value) {
|
|
31530
|
+
this.internalResizeObserver = value;
|
|
31531
|
+
}
|
|
31532
|
+
updateOptionSize(width, height) {
|
|
31533
|
+
this.option.width = width;
|
|
31534
|
+
this.option.height = height;
|
|
31535
|
+
this.camera.updateInitSize(new import_paper.default.Size(width, height));
|
|
31536
|
+
}
|
|
30879
31537
|
async dispose() {
|
|
30880
31538
|
this.selectElementsModel.dispose();
|
|
30881
31539
|
this.trashedElementsModel.dispose();
|
|
@@ -30892,6 +31550,7 @@ var WhiteboardApplication = class extends import_forge_room3.AbstractApplication
|
|
|
30892
31550
|
this.resizeObserver.disconnect();
|
|
30893
31551
|
}
|
|
30894
31552
|
};
|
|
31553
|
+
_defineProperty40(WhiteboardApplication, "applicationName", WHITEBOARD_APP_NAME);
|
|
30895
31554
|
/*! Bundled license information:
|
|
30896
31555
|
|
|
30897
31556
|
paper/dist/paper-full.js:
|