microboard-temp 0.1.22 → 0.1.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/browser.js +580 -264
- package/dist/cjs/index.js +568 -252
- package/dist/cjs/node.js +576 -260
- package/dist/esm/browser.js +580 -264
- package/dist/esm/index.js +568 -252
- package/dist/esm/node.js +576 -260
- package/package.json +1 -1
package/dist/cjs/browser.js
CHANGED
|
@@ -2160,7 +2160,7 @@ __export(exports_browser, {
|
|
|
2160
2160
|
cursors: () => defaultCursors,
|
|
2161
2161
|
createVideoItem: () => createVideoItem,
|
|
2162
2162
|
createEvents: () => createEvents,
|
|
2163
|
-
conf: () =>
|
|
2163
|
+
conf: () => conf,
|
|
2164
2164
|
checkHotkeys: () => checkHotkeys,
|
|
2165
2165
|
catmullRomInterpolate: () => catmullRomInterpolate,
|
|
2166
2166
|
catchErrorResponse: () => catchErrorResponse,
|
|
@@ -8163,20 +8163,20 @@ var resources = {
|
|
|
8163
8163
|
};
|
|
8164
8164
|
function initDefaultI18N() {
|
|
8165
8165
|
instance.use(Browser).init({
|
|
8166
|
-
debug:
|
|
8166
|
+
debug: conf.debug,
|
|
8167
8167
|
detection: {
|
|
8168
8168
|
order: ["navigator"]
|
|
8169
8169
|
},
|
|
8170
8170
|
supportedLngs: ["en", "ru"],
|
|
8171
8171
|
defaultNS,
|
|
8172
8172
|
resources,
|
|
8173
|
-
fallbackLng:
|
|
8173
|
+
fallbackLng: conf.FALLBACK_LNG,
|
|
8174
8174
|
interpolation: {
|
|
8175
8175
|
escapeValue: false
|
|
8176
8176
|
}
|
|
8177
8177
|
});
|
|
8178
|
-
|
|
8179
|
-
|
|
8178
|
+
conf.i18n = instance;
|
|
8179
|
+
conf.planNames = {
|
|
8180
8180
|
basic: instance.t("userPlan.plans.basic.name"),
|
|
8181
8181
|
plus: instance.t("userPlan.plans.plus.name")
|
|
8182
8182
|
};
|
|
@@ -8191,7 +8191,7 @@ var ExportQuality;
|
|
|
8191
8191
|
ExportQuality2[ExportQuality2["STANDARD"] = 2] = "STANDARD";
|
|
8192
8192
|
ExportQuality2[ExportQuality2["LOW"] = 3] = "LOW";
|
|
8193
8193
|
})(ExportQuality ||= {});
|
|
8194
|
-
var
|
|
8194
|
+
var conf = {
|
|
8195
8195
|
connection: undefined,
|
|
8196
8196
|
path2DFactory: typeof Path2D !== "undefined" ? BrowserPath2D : MockPath2D,
|
|
8197
8197
|
documentFactory: typeof document !== "undefined" ? new BrowserDocumentFactory : new MockDocumentFactory,
|
|
@@ -9239,7 +9239,7 @@ class DrawingContext {
|
|
|
9239
9239
|
this.setCamera(camera);
|
|
9240
9240
|
}
|
|
9241
9241
|
dpi() {
|
|
9242
|
-
return
|
|
9242
|
+
return conf.getDPI();
|
|
9243
9243
|
}
|
|
9244
9244
|
setCamera(camera) {
|
|
9245
9245
|
this.camera = camera;
|
|
@@ -9249,7 +9249,7 @@ class DrawingContext {
|
|
|
9249
9249
|
}
|
|
9250
9250
|
clear() {
|
|
9251
9251
|
this.ctx.setTransform(1 * this.dpi(), 0, 0, 1 * this.dpi(), 0, 0);
|
|
9252
|
-
this.ctx.clearRect(0, 0,
|
|
9252
|
+
this.ctx.clearRect(0, 0, conf.getDocumentWidth(), conf.getDocumentHeight());
|
|
9253
9253
|
this.matrix.applyToContext(this.ctx);
|
|
9254
9254
|
}
|
|
9255
9255
|
clearCursor() {
|
|
@@ -9257,7 +9257,7 @@ class DrawingContext {
|
|
|
9257
9257
|
return;
|
|
9258
9258
|
}
|
|
9259
9259
|
this.cursorCtx.setTransform(1 * this.dpi(), 0, 0, 1 * this.dpi(), 0, 0);
|
|
9260
|
-
this.cursorCtx.clearRect(0, 0,
|
|
9260
|
+
this.cursorCtx.clearRect(0, 0, conf.getDocumentWidth(), conf.getDocumentHeight());
|
|
9261
9261
|
this.matrix.applyToContext(this.cursorCtx);
|
|
9262
9262
|
}
|
|
9263
9263
|
applyChanges() {
|
|
@@ -9360,7 +9360,7 @@ class Path {
|
|
|
9360
9360
|
this.width = this.getMbr().getWidth();
|
|
9361
9361
|
this.height = this.getMbr().getHeight();
|
|
9362
9362
|
this.maxDimension = Math.max(mbr.getWidth(), mbr.getHeight());
|
|
9363
|
-
this.path2d = new
|
|
9363
|
+
this.path2d = new conf.path2DFactory;
|
|
9364
9364
|
this.updateCache();
|
|
9365
9365
|
}
|
|
9366
9366
|
getBackgroundColor() {
|
|
@@ -9437,7 +9437,7 @@ class Path {
|
|
|
9437
9437
|
this.y = top - this.paddingTop;
|
|
9438
9438
|
this.width = right - left + this.paddingLeft + this.paddingRight;
|
|
9439
9439
|
this.height = bottom - top + this.paddingTop + this.paddingBottom;
|
|
9440
|
-
const path2d = new
|
|
9440
|
+
const path2d = new conf.path2DFactory;
|
|
9441
9441
|
if (this.segments.length === 0) {
|
|
9442
9442
|
return;
|
|
9443
9443
|
}
|
|
@@ -10481,7 +10481,7 @@ var parsersHTML = {
|
|
|
10481
10481
|
"comment-item": parseHTMLComment
|
|
10482
10482
|
};
|
|
10483
10483
|
var decodeHtml = (htmlString) => {
|
|
10484
|
-
const parser =
|
|
10484
|
+
const parser = conf.getDOMParser();
|
|
10485
10485
|
const doc = parser.parseFromString(htmlString, "text/html");
|
|
10486
10486
|
return doc.documentElement.textContent || "";
|
|
10487
10487
|
};
|
|
@@ -10510,10 +10510,10 @@ function parseHTMLRichText(el, options) {
|
|
|
10510
10510
|
italic: node.style.fontStyle === "italic",
|
|
10511
10511
|
underline: node.style.textDecoration.includes("underline"),
|
|
10512
10512
|
"line-through": node.style.textDecoration.includes("line-through"),
|
|
10513
|
-
fontColor: node.style.color ||
|
|
10514
|
-
fontHighlight: node.style.backgroundColor ||
|
|
10515
|
-
fontSize: parseFloat(node.style.fontSize) ||
|
|
10516
|
-
fontFamily: node.style.fontFamily ||
|
|
10513
|
+
fontColor: node.style.color || conf.DEFAULT_TEXT_STYLES.fontColor,
|
|
10514
|
+
fontHighlight: node.style.backgroundColor || conf.DEFAULT_TEXT_STYLES.fontHighlight,
|
|
10515
|
+
fontSize: parseFloat(node.style.fontSize) || conf.DEFAULT_TEXT_STYLES.fontSize,
|
|
10516
|
+
fontFamily: node.style.fontFamily || conf.DEFAULT_TEXT_STYLES.fontFamily,
|
|
10517
10517
|
overline: false,
|
|
10518
10518
|
subscript: false,
|
|
10519
10519
|
superscript: false
|
|
@@ -10578,7 +10578,7 @@ function parseHTMLRichText(el, options) {
|
|
|
10578
10578
|
return {
|
|
10579
10579
|
type: "paragraph",
|
|
10580
10580
|
...extractCommonProps(),
|
|
10581
|
-
lineHeight: parseFloat(node.style.lineHeight) ||
|
|
10581
|
+
lineHeight: parseFloat(node.style.lineHeight) || conf.DEFAULT_TEXT_STYLES.lineHeight,
|
|
10582
10582
|
children: children2
|
|
10583
10583
|
};
|
|
10584
10584
|
default:
|
|
@@ -17058,8 +17058,8 @@ class LinkTo {
|
|
|
17058
17058
|
const ctx = context.ctx;
|
|
17059
17059
|
ctx.save();
|
|
17060
17060
|
ctx.globalCompositeOperation = "destination-out";
|
|
17061
|
-
const size =
|
|
17062
|
-
const offset =
|
|
17061
|
+
const size = conf.LINK_BTN_SIZE / scale;
|
|
17062
|
+
const offset = conf.LINK_BTN_OFFSET / scale;
|
|
17063
17063
|
ctx.fillRect(right - size - offset, top + offset, size, size);
|
|
17064
17064
|
ctx.restore();
|
|
17065
17065
|
}
|
|
@@ -17210,7 +17210,7 @@ function getBlockNode(data, maxWidth, isFrame, listData, listMark, newLine = fal
|
|
|
17210
17210
|
} else if (node3.type === "ul_list" && !listData) {
|
|
17211
17211
|
listData = { level: 0, isNumberedList: false };
|
|
17212
17212
|
}
|
|
17213
|
-
const listMarks =
|
|
17213
|
+
const listMarks = conf[getListMarkType((listData?.level || 0) + 1)];
|
|
17214
17214
|
for (let i = 0;i < data.children.length; i++) {
|
|
17215
17215
|
const child = structuredClone(data.children[i]);
|
|
17216
17216
|
switch (child.type) {
|
|
@@ -17615,8 +17615,8 @@ function measureText(text, style, paddingTop = 0, marginLeft = 0) {
|
|
|
17615
17615
|
rect2.height += paddingTop;
|
|
17616
17616
|
}
|
|
17617
17617
|
}
|
|
17618
|
-
|
|
17619
|
-
const measure =
|
|
17618
|
+
conf.measureCtx.font = style.font;
|
|
17619
|
+
const measure = conf.measureCtx.measureText(text);
|
|
17620
17620
|
const actualBoundingBoxAscent = toFiniteNumber2(measure.actualBoundingBoxAscent);
|
|
17621
17621
|
const actualBoundingBoxDescent = toFiniteNumber2(measure.actualBoundingBoxDescent);
|
|
17622
17622
|
const actualBoundingBoxLeft = toFiniteNumber2(measure.actualBoundingBoxLeft);
|
|
@@ -19346,7 +19346,7 @@ var create2 = (key) => {
|
|
|
19346
19346
|
return false;
|
|
19347
19347
|
};
|
|
19348
19348
|
};
|
|
19349
|
-
var
|
|
19349
|
+
var hotkeys = {
|
|
19350
19350
|
isBold: create2("bold"),
|
|
19351
19351
|
isCompose: create2("compose"),
|
|
19352
19352
|
isMoveBackward: create2("moveBackward"),
|
|
@@ -26738,7 +26738,7 @@ var convertLinkNodeToTextNode = (node4) => {
|
|
|
26738
26738
|
const link = node4.link;
|
|
26739
26739
|
const text3 = node4.children.map((child) => child.text).join("");
|
|
26740
26740
|
return {
|
|
26741
|
-
...
|
|
26741
|
+
...conf.DEFAULT_TEXT_STYLES,
|
|
26742
26742
|
type: "text",
|
|
26743
26743
|
text: text3,
|
|
26744
26744
|
link,
|
|
@@ -26754,9 +26754,9 @@ function setNodeChildrenStyles({
|
|
|
26754
26754
|
horisontalAlignment,
|
|
26755
26755
|
node: node4
|
|
26756
26756
|
}) {
|
|
26757
|
-
let fontStyles =
|
|
26757
|
+
let fontStyles = conf.DEFAULT_TEXT_STYLES;
|
|
26758
26758
|
if (editor) {
|
|
26759
|
-
fontStyles = Editor.marks(editor) ||
|
|
26759
|
+
fontStyles = Editor.marks(editor) || conf.DEFAULT_TEXT_STYLES;
|
|
26760
26760
|
}
|
|
26761
26761
|
switch (node4.type) {
|
|
26762
26762
|
case "heading_one":
|
|
@@ -26788,7 +26788,7 @@ function setNodeChildrenStyles({
|
|
|
26788
26788
|
children.text += " ";
|
|
26789
26789
|
}
|
|
26790
26790
|
let fontColor = fontStyles.fontColor;
|
|
26791
|
-
if (fontColor ===
|
|
26791
|
+
if (fontColor === conf.DEFAULT_TEXT_STYLES.fontColor && children.link) {
|
|
26792
26792
|
fontColor = "rgba(71, 120, 245, 1)";
|
|
26793
26793
|
}
|
|
26794
26794
|
return {
|
|
@@ -26858,7 +26858,7 @@ class MarkdownProcessor {
|
|
|
26858
26858
|
this.subject.publish(this);
|
|
26859
26859
|
return true;
|
|
26860
26860
|
}
|
|
26861
|
-
if (text3.startsWith(
|
|
26861
|
+
if (text3.startsWith(conf.i18n.t("AIInput.generatingResponse"))) {
|
|
26862
26862
|
return true;
|
|
26863
26863
|
}
|
|
26864
26864
|
const isPrevTextEmpty = isTextEmpty(this.editor.children);
|
|
@@ -26916,7 +26916,7 @@ class MarkdownProcessor {
|
|
|
26916
26916
|
return;
|
|
26917
26917
|
}
|
|
26918
26918
|
const prevText = this.getText()?.[this.getText().length - 1]?.children[0]?.text;
|
|
26919
|
-
if (prevText?.startsWith(
|
|
26919
|
+
if (prevText?.startsWith(conf.i18n.t("AIInput.generatingResponse"))) {
|
|
26920
26920
|
clearText(this.editor);
|
|
26921
26921
|
}
|
|
26922
26922
|
if (chunk.includes(`
|
|
@@ -27942,7 +27942,7 @@ class RichTextCommand {
|
|
|
27942
27942
|
item: id,
|
|
27943
27943
|
operation: {
|
|
27944
27944
|
...this.operation,
|
|
27945
|
-
fontColor: this.board.items.getById(id)?.getRichText()?.getFontColor() ||
|
|
27945
|
+
fontColor: this.board.items.getById(id)?.getRichText()?.getFontColor() || conf.DEFAULT_TEXT_STYLES.fontColor
|
|
27946
27946
|
}
|
|
27947
27947
|
}));
|
|
27948
27948
|
case "setBlockType":
|
|
@@ -27966,7 +27966,7 @@ class RichTextCommand {
|
|
|
27966
27966
|
item: id,
|
|
27967
27967
|
operation: {
|
|
27968
27968
|
...this.operation,
|
|
27969
|
-
fontFamily: this.board.items.getById(id)?.getRichText()?.getFontFamily() ||
|
|
27969
|
+
fontFamily: this.board.items.getById(id)?.getRichText()?.getFontFamily() || conf.DEFAULT_TEXT_STYLES.fontFamily
|
|
27970
27970
|
}
|
|
27971
27971
|
}));
|
|
27972
27972
|
case "setFontSize":
|
|
@@ -27974,7 +27974,7 @@ class RichTextCommand {
|
|
|
27974
27974
|
item: id,
|
|
27975
27975
|
operation: {
|
|
27976
27976
|
...this.operation,
|
|
27977
|
-
fontSize: this.board.items.getById(id)?.getRichText()?.getFontSize() ||
|
|
27977
|
+
fontSize: this.board.items.getById(id)?.getRichText()?.getFontSize() || conf.DEFAULT_TEXT_STYLES.fontSize
|
|
27978
27978
|
}
|
|
27979
27979
|
}));
|
|
27980
27980
|
case "setFontHighlight":
|
|
@@ -27982,7 +27982,7 @@ class RichTextCommand {
|
|
|
27982
27982
|
item: id,
|
|
27983
27983
|
operation: {
|
|
27984
27984
|
...this.operation,
|
|
27985
|
-
fontHighlight: this.board.items.getById(id)?.getRichText()?.getFontHighlight() ||
|
|
27985
|
+
fontHighlight: this.board.items.getById(id)?.getRichText()?.getFontHighlight() || conf.DEFAULT_TEXT_STYLES.fontHighlight
|
|
27986
27986
|
}
|
|
27987
27987
|
}));
|
|
27988
27988
|
case "setHorisontalAlignment":
|
|
@@ -29130,8 +29130,8 @@ class BaseItem extends Mbr {
|
|
|
29130
29130
|
this[key] = value;
|
|
29131
29131
|
});
|
|
29132
29132
|
}
|
|
29133
|
-
this.linkTo = new LinkTo(this.id,
|
|
29134
|
-
this.transformation = new Transformation(this.id,
|
|
29133
|
+
this.linkTo = new LinkTo(this.id, board.events);
|
|
29134
|
+
this.transformation = new Transformation(this.id, board.events);
|
|
29135
29135
|
}
|
|
29136
29136
|
getId() {
|
|
29137
29137
|
return this.id;
|
|
@@ -29221,7 +29221,7 @@ class RichText extends BaseItem {
|
|
|
29221
29221
|
isContainerSet = false;
|
|
29222
29222
|
isRenderEnabled = true;
|
|
29223
29223
|
layoutNodes;
|
|
29224
|
-
clipPath = new
|
|
29224
|
+
clipPath = new conf.path2DFactory;
|
|
29225
29225
|
updateRequired = false;
|
|
29226
29226
|
autoSizeScale = 1;
|
|
29227
29227
|
containerMaxWidth;
|
|
@@ -29236,7 +29236,7 @@ class RichText extends BaseItem {
|
|
|
29236
29236
|
shrinkWidth = false;
|
|
29237
29237
|
prevMbr = null;
|
|
29238
29238
|
rtCounter = 0;
|
|
29239
|
-
constructor(board, container, id = "", transformation = new Transformation(id, board.events), linkTo, placeholderText =
|
|
29239
|
+
constructor(board, container, id = "", transformation = new Transformation(id, board.events), linkTo, placeholderText = conf.i18n?.t("board.textPlaceholder"), isInShape = false, autoSize = false, insideOf, initialTextStyles = conf.DEFAULT_TEXT_STYLES) {
|
|
29240
29240
|
super(board, id);
|
|
29241
29241
|
this.container = container;
|
|
29242
29242
|
this.transformation = transformation;
|
|
@@ -29370,11 +29370,11 @@ class RichText extends BaseItem {
|
|
|
29370
29370
|
return;
|
|
29371
29371
|
}
|
|
29372
29372
|
try {
|
|
29373
|
-
|
|
29373
|
+
conf.reactEditorFocus(this.editor.editor);
|
|
29374
29374
|
} catch {}
|
|
29375
29375
|
};
|
|
29376
29376
|
updateElement = () => {
|
|
29377
|
-
if (
|
|
29377
|
+
if (conf.isNode()) {
|
|
29378
29378
|
return;
|
|
29379
29379
|
}
|
|
29380
29380
|
if (this.updateRequired) {
|
|
@@ -29503,7 +29503,7 @@ class RichText extends BaseItem {
|
|
|
29503
29503
|
const container = this.getTransformedContainer();
|
|
29504
29504
|
const width = container.getWidth();
|
|
29505
29505
|
const height = container.getHeight();
|
|
29506
|
-
this.clipPath = new
|
|
29506
|
+
this.clipPath = new conf.path2DFactory;
|
|
29507
29507
|
this.clipPath.rect(0, 0, width, height);
|
|
29508
29508
|
}
|
|
29509
29509
|
setContainer(container) {
|
|
@@ -29780,24 +29780,24 @@ class RichText extends BaseItem {
|
|
|
29780
29780
|
this.clearLastClickPoint();
|
|
29781
29781
|
const domMbr = ref.getBoundingClientRect();
|
|
29782
29782
|
const refMbr = new Mbr(domMbr.left, domMbr.top, domMbr.right, domMbr.bottom);
|
|
29783
|
-
if (refMbr.isInside(point5) && (
|
|
29784
|
-
const domRange =
|
|
29785
|
-
const textNode =
|
|
29786
|
-
const offset =
|
|
29787
|
-
const slatePoint =
|
|
29783
|
+
if (refMbr.isInside(point5) && (conf.documentFactory.caretPositionFromPoint || conf.documentFactory.caretRangeFromPoint)) {
|
|
29784
|
+
const domRange = conf.documentFactory.caretPositionFromPoint ? conf.documentFactory.caretPositionFromPoint(point5.x, point5.y) : conf.documentFactory.caretRangeFromPoint(point5.x, point5.y);
|
|
29785
|
+
const textNode = conf.documentFactory.caretPositionFromPoint ? domRange.offsetNode : domRange.startContainer;
|
|
29786
|
+
const offset = conf.documentFactory.caretPositionFromPoint ? domRange.offset : domRange.startOffset;
|
|
29787
|
+
const slatePoint = conf.reactEditorToSlatePoint(this.editor.editor, textNode, offset, {
|
|
29788
29788
|
exactMatch: false,
|
|
29789
29789
|
suppressThrow: false
|
|
29790
29790
|
});
|
|
29791
29791
|
if (slatePoint) {
|
|
29792
29792
|
const nRange = { anchor: slatePoint, focus: slatePoint };
|
|
29793
29793
|
this.editorTransforms.select(this.editor.editor, nRange);
|
|
29794
|
-
|
|
29794
|
+
conf.reactEditorFocus(this.editor.editor);
|
|
29795
29795
|
}
|
|
29796
29796
|
} else {
|
|
29797
|
-
if (!(
|
|
29797
|
+
if (!(conf.documentFactory.caretPositionFromPoint || conf.documentFactory.caretRangeFromPoint)) {
|
|
29798
29798
|
console.error("document.caretPositionFromPoint and document.caretRangeFromPoint are not available!");
|
|
29799
29799
|
}
|
|
29800
|
-
|
|
29800
|
+
conf.reactEditorFocus(this.editor.editor);
|
|
29801
29801
|
}
|
|
29802
29802
|
}
|
|
29803
29803
|
}
|
|
@@ -29904,11 +29904,11 @@ class RichText extends BaseItem {
|
|
|
29904
29904
|
if (node4.type === "text" || "text" in node4) {
|
|
29905
29905
|
node4 = node4;
|
|
29906
29906
|
const text3 = node4.text.trim() !== "" ? decodeHtml(escapeHtml2(node4.text)) : " ";
|
|
29907
|
-
const textElement = node4.link ? Object.assign(
|
|
29907
|
+
const textElement = node4.link ? Object.assign(conf.documentFactory.createElement("a"), {
|
|
29908
29908
|
href: node4.link,
|
|
29909
29909
|
target: "_blank",
|
|
29910
29910
|
rel: "noreferrer"
|
|
29911
|
-
}) :
|
|
29911
|
+
}) : conf.documentFactory.createElement("span");
|
|
29912
29912
|
Object.assign(textElement.style, {
|
|
29913
29913
|
fontWeight: node4.bold ? "700" : "400",
|
|
29914
29914
|
fontStyle: node4.italic ? "italic" : "",
|
|
@@ -29916,10 +29916,10 @@ class RichText extends BaseItem {
|
|
|
29916
29916
|
node4.underline ? "underline" : "",
|
|
29917
29917
|
node4["line-through"] ? "line-through" : ""
|
|
29918
29918
|
].filter(Boolean).join(" "),
|
|
29919
|
-
color: node4.fontColor ||
|
|
29920
|
-
backgroundColor: node4.fontHighlight ||
|
|
29921
|
-
fontSize: node4.fontSize ? `${node4.fontSize}px` : `${
|
|
29922
|
-
fontFamily: node4.fontFamily ||
|
|
29919
|
+
color: node4.fontColor || conf.DEFAULT_TEXT_STYLES.fontColor,
|
|
29920
|
+
backgroundColor: node4.fontHighlight || conf.DEFAULT_TEXT_STYLES.fontHighlight,
|
|
29921
|
+
fontSize: node4.fontSize ? `${node4.fontSize}px` : `${conf.DEFAULT_TEXT_STYLES.fontSize}px`,
|
|
29922
|
+
fontFamily: node4.fontFamily || conf.DEFAULT_TEXT_STYLES.fontFamily
|
|
29923
29923
|
});
|
|
29924
29924
|
if (this.insideOf === "Frame") {
|
|
29925
29925
|
Object.assign(textElement.style, {
|
|
@@ -29954,14 +29954,14 @@ class RichText extends BaseItem {
|
|
|
29954
29954
|
four: 4,
|
|
29955
29955
|
five: 5
|
|
29956
29956
|
};
|
|
29957
|
-
const header =
|
|
29957
|
+
const header = conf.documentFactory.createElement(`h${levels2[level]}`);
|
|
29958
29958
|
applyCommonStyles(header);
|
|
29959
29959
|
header.append(...children);
|
|
29960
29960
|
return header;
|
|
29961
29961
|
}
|
|
29962
29962
|
case "code_block": {
|
|
29963
|
-
const pre =
|
|
29964
|
-
const code =
|
|
29963
|
+
const pre = conf.documentFactory.createElement("pre");
|
|
29964
|
+
const code = conf.documentFactory.createElement("code");
|
|
29965
29965
|
applyCommonStyles(pre);
|
|
29966
29966
|
if (node4.language) {
|
|
29967
29967
|
code.classList.add(`language-${node4.language}`);
|
|
@@ -29975,35 +29975,35 @@ class RichText extends BaseItem {
|
|
|
29975
29975
|
return pre;
|
|
29976
29976
|
}
|
|
29977
29977
|
case "block-quote": {
|
|
29978
|
-
const blockquote =
|
|
29978
|
+
const blockquote = conf.documentFactory.createElement("blockquote");
|
|
29979
29979
|
applyCommonStyles(blockquote);
|
|
29980
29980
|
blockquote.append(...children);
|
|
29981
29981
|
return blockquote;
|
|
29982
29982
|
}
|
|
29983
29983
|
case "ul_list": {
|
|
29984
|
-
const ul =
|
|
29984
|
+
const ul = conf.documentFactory.createElement("ul");
|
|
29985
29985
|
applyCommonStyles(ul);
|
|
29986
29986
|
ul.append(...children);
|
|
29987
29987
|
return ul;
|
|
29988
29988
|
}
|
|
29989
29989
|
case "ol_list": {
|
|
29990
|
-
const ol =
|
|
29990
|
+
const ol = conf.documentFactory.createElement("ol");
|
|
29991
29991
|
applyCommonStyles(ol);
|
|
29992
29992
|
ol.append(...children);
|
|
29993
29993
|
return ol;
|
|
29994
29994
|
}
|
|
29995
29995
|
case "list_item": {
|
|
29996
|
-
const li =
|
|
29996
|
+
const li = conf.documentFactory.createElement("li");
|
|
29997
29997
|
applyCommonStyles(li);
|
|
29998
29998
|
li.append(...children);
|
|
29999
29999
|
return li;
|
|
30000
30000
|
}
|
|
30001
30001
|
case "paragraph":
|
|
30002
30002
|
default: {
|
|
30003
|
-
const par =
|
|
30003
|
+
const par = conf.documentFactory.createElement("p");
|
|
30004
30004
|
applyCommonStyles(par);
|
|
30005
30005
|
Object.assign(par.style, {
|
|
30006
|
-
lineHeight: node4.lineHeight ? `${node4.lineHeight}` :
|
|
30006
|
+
lineHeight: node4.lineHeight ? `${node4.lineHeight}` : conf.DEFAULT_TEXT_STYLES.lineHeight,
|
|
30007
30007
|
margin: "0"
|
|
30008
30008
|
});
|
|
30009
30009
|
par.append(...children);
|
|
@@ -30011,7 +30011,7 @@ class RichText extends BaseItem {
|
|
|
30011
30011
|
}
|
|
30012
30012
|
}
|
|
30013
30013
|
}
|
|
30014
|
-
return
|
|
30014
|
+
return conf.documentFactory.createElement("div");
|
|
30015
30015
|
};
|
|
30016
30016
|
const escapeHtml2 = (unsafe) => {
|
|
30017
30017
|
return unsafe.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
@@ -43074,7 +43074,7 @@ var transformHtmlOrTextToMarkdown = async (text5, html4) => {
|
|
|
43074
43074
|
markdownString = String(file).trim();
|
|
43075
43075
|
}
|
|
43076
43076
|
let slateNodes = [];
|
|
43077
|
-
if (
|
|
43077
|
+
if (conf.URL_REGEX.test(text5)) {
|
|
43078
43078
|
slateNodes = [createLinkNode(text5)];
|
|
43079
43079
|
} else {
|
|
43080
43080
|
slateNodes = await convertMarkdownToSlate(markdownString.replace(/<!--(Start|End)Fragment-->/g, ""));
|
|
@@ -43090,7 +43090,7 @@ function createLinkNode(link2) {
|
|
|
43090
43090
|
type: "text",
|
|
43091
43091
|
link: link2,
|
|
43092
43092
|
text: link2,
|
|
43093
|
-
...
|
|
43093
|
+
...conf.DEFAULT_TEXT_STYLES,
|
|
43094
43094
|
fontColor: "rgba(71, 120, 245, 1)"
|
|
43095
43095
|
};
|
|
43096
43096
|
}
|
|
@@ -43201,7 +43201,7 @@ class AINode extends BaseItem {
|
|
|
43201
43201
|
constructor(board, isUserRequest = false, parentNodeId, contextItems = [], threadDirection, id = "") {
|
|
43202
43202
|
super(board, id);
|
|
43203
43203
|
this.id = id;
|
|
43204
|
-
this.buttonIcon =
|
|
43204
|
+
this.buttonIcon = conf.documentFactory.createElement("img");
|
|
43205
43205
|
this.buttonIcon.src = ICON_SRC;
|
|
43206
43206
|
this.contextItems = contextItems;
|
|
43207
43207
|
this.isUserRequest = isUserRequest;
|
|
@@ -44426,12 +44426,12 @@ class Connector2 extends BaseItem {
|
|
|
44426
44426
|
this.lineColor = lineColor ?? CONNECTOR_COLOR;
|
|
44427
44427
|
this.lineWidth = lineWidth ?? CONNECTOR_LINE_WIDTH;
|
|
44428
44428
|
this.borderStyle = strokeStyle ?? CONNECTOR_BORDER_STYLE;
|
|
44429
|
-
this.text = new RichText(board, this.getMbr(), this.id, new Transformation, this.linkTo,
|
|
44429
|
+
this.text = new RichText(board, this.getMbr(), this.id, new Transformation, this.linkTo, conf.i18n.t("connector.textPlaceholder", {
|
|
44430
44430
|
ns: "default"
|
|
44431
44431
|
}), true, false, "Connector", {
|
|
44432
|
-
...
|
|
44433
|
-
fontSize: typeof window !== "undefined" && localStorage.getItem("lastConnectorTextSize") ? Number(localStorage.getItem("lastConnectorTextSize")) :
|
|
44434
|
-
fontColor: typeof window !== "undefined" && localStorage.getItem("lastConnectorTextColor") ? localStorage.getItem("lastConnectorTextColor") :
|
|
44432
|
+
...conf.DEFAULT_TEXT_STYLES,
|
|
44433
|
+
fontSize: typeof window !== "undefined" && localStorage.getItem("lastConnectorTextSize") ? Number(localStorage.getItem("lastConnectorTextSize")) : conf.DEFAULT_TEXT_STYLES.fontSize,
|
|
44434
|
+
fontColor: typeof window !== "undefined" && localStorage.getItem("lastConnectorTextColor") ? localStorage.getItem("lastConnectorTextColor") : conf.DEFAULT_TEXT_STYLES.fontColor
|
|
44435
44435
|
});
|
|
44436
44436
|
this.startPointer = getStartPointer(this.startPoint, this.startPointerStyle, this.lineStyle, this.lines, this.lineWidth * 0.1 + 0.3);
|
|
44437
44437
|
this.endPointer = getEndPointer(this.endPoint, this.endPointerStyle, this.lineStyle, this.lines, this.lineWidth * 0.1 + 0.3);
|
|
@@ -44881,7 +44881,7 @@ class Connector2 extends BaseItem {
|
|
|
44881
44881
|
this.text.transformation.applyTranslateTo(x - textWidth / 2, y - textHeight / 2);
|
|
44882
44882
|
this.text.render(context);
|
|
44883
44883
|
if (DRAW_TEXT_BORDER && (selectionContext === "EditUnderPointer" || selectionContext === "EditTextUnderPointer") && this.board.selection.items.list().includes(this)) {
|
|
44884
|
-
ctx.strokeStyle =
|
|
44884
|
+
ctx.strokeStyle = conf.SELECTION_COLOR;
|
|
44885
44885
|
ctx.lineWidth = 1;
|
|
44886
44886
|
ctx.beginPath();
|
|
44887
44887
|
ctx.rect(textMbr.left - TEXT_BORDER_PADDING, textMbr.top - TEXT_BORDER_PADDING, textMbr.getWidth() + TEXT_BORDER_PADDING * 2, textMbr.getHeight() + TEXT_BORDER_PADDING * 2);
|
|
@@ -45108,7 +45108,7 @@ class Connector2 extends BaseItem {
|
|
|
45108
45108
|
}
|
|
45109
45109
|
}
|
|
45110
45110
|
updatePaths() {
|
|
45111
|
-
if (
|
|
45111
|
+
if (conf.isNode()) {
|
|
45112
45112
|
return;
|
|
45113
45113
|
}
|
|
45114
45114
|
const startPoint = this.startPoint;
|
|
@@ -45919,7 +45919,7 @@ class DefaultShapeData {
|
|
|
45919
45919
|
text;
|
|
45920
45920
|
linkTo;
|
|
45921
45921
|
itemType = "Shape";
|
|
45922
|
-
constructor(shapeType = "Rectangle", backgroundColor = "none", backgroundOpacity = 1, borderColor =
|
|
45922
|
+
constructor(shapeType = "Rectangle", backgroundColor = "none", backgroundOpacity = 1, borderColor = conf.SHAPE_DEFAULT_STROKE_COLOR, borderOpacity = 1, borderStyle = "solid", borderWidth = 1, transformation = new DefaultTransformationData, text5 = new DefaultRichTextData, linkTo) {
|
|
45923
45923
|
this.shapeType = shapeType;
|
|
45924
45924
|
this.backgroundColor = backgroundColor;
|
|
45925
45925
|
this.backgroundOpacity = backgroundOpacity;
|
|
@@ -47117,7 +47117,7 @@ class Shape extends BaseItem {
|
|
|
47117
47117
|
this.text.updateElement();
|
|
47118
47118
|
}
|
|
47119
47119
|
transformPath() {
|
|
47120
|
-
if (
|
|
47120
|
+
if (conf.isNode()) {
|
|
47121
47121
|
return;
|
|
47122
47122
|
}
|
|
47123
47123
|
this.path = Shapes[this.shapeType].createPath(this.mbr);
|
|
@@ -47310,7 +47310,7 @@ class Sticker extends BaseItem {
|
|
|
47310
47310
|
return this;
|
|
47311
47311
|
}
|
|
47312
47312
|
transformPath() {
|
|
47313
|
-
if (
|
|
47313
|
+
if (conf.isNode()) {
|
|
47314
47314
|
return;
|
|
47315
47315
|
}
|
|
47316
47316
|
this.stickerPath = StickerShape.stickerPath.copy();
|
|
@@ -47796,7 +47796,7 @@ class Frame extends BaseItem {
|
|
|
47796
47796
|
this.path = Frames[this.shapeType].path.copy();
|
|
47797
47797
|
this.transformation = new Transformation(this.id, this.board.events);
|
|
47798
47798
|
this.linkTo = new LinkTo(this.id, this.board.events);
|
|
47799
|
-
this.text = new RichText(board, this.textContainer, this.id, this.transformation, this.linkTo, this.name, true, false, "Frame", { ...
|
|
47799
|
+
this.text = new RichText(board, this.textContainer, this.id, this.transformation, this.linkTo, this.name, true, false, "Frame", { ...conf.DEFAULT_TEXT_STYLES, fontColor: FRAME_TITLE_COLOR });
|
|
47800
47800
|
this.text.setSelectionHorisontalAlignment("left");
|
|
47801
47801
|
this.transformation.subject.subscribe(() => {
|
|
47802
47802
|
this.transformPath();
|
|
@@ -48342,10 +48342,10 @@ class Frame extends BaseItem {
|
|
|
48342
48342
|
}
|
|
48343
48343
|
// src/Items/Video/Video.ts
|
|
48344
48344
|
var VIDEO_ICON_SRC = "data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 22 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 0C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V5.2L21.213 1.55C21.288 1.49746 21.3759 1.4665 21.4672 1.4605C21.5586 1.4545 21.6498 1.4737 21.731 1.51599C21.8122 1.55829 21.8802 1.62206 21.9276 1.70035C21.9751 1.77865 22.0001 1.86846 22 1.96V14.04C22.0001 14.1315 21.9751 14.2214 21.9276 14.2996C21.8802 14.3779 21.8122 14.4417 21.731 14.484C21.6498 14.5263 21.5586 14.5455 21.4672 14.5395C21.3759 14.5335 21.288 14.5025 21.213 14.45L16 10.8V15C16 15.2652 15.8946 15.5196 15.7071 15.7071C15.5196 15.8946 15.2652 16 15 16H1C0.734784 16 0.48043 15.8946 0.292893 15.7071C0.105357 15.5196 0 15.2652 0 15V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0H15ZM14 2H2V14H14V2ZM6.4 4.829C6.47611 4.82879 6.55069 4.8503 6.615 4.891L10.97 7.663C11.0266 7.69917 11.0731 7.749 11.1054 7.80789C11.1376 7.86679 11.1545 7.93285 11.1545 8C11.1545 8.06715 11.1376 8.13321 11.1054 8.19211C11.0731 8.251 11.0266 8.30083 10.97 8.337L6.615 11.11C6.55434 11.1487 6.48438 11.1703 6.41248 11.1725C6.34059 11.1748 6.26941 11.1576 6.20646 11.1228C6.14351 11.088 6.0911 11.0368 6.05477 10.9747C6.01844 10.9127 5.99951 10.8419 6 10.77V5.23C6 5.009 6.18 4.83 6.4 4.83V4.829ZM20 4.84L16 7.64V8.358L20 11.158V4.84Z' fill='%23FFFFFF'/%3E%3C/svg%3E";
|
|
48345
|
-
var videoIcon =
|
|
48345
|
+
var videoIcon = conf.documentFactory.createElement("img");
|
|
48346
48346
|
videoIcon.src = VIDEO_ICON_SRC;
|
|
48347
48347
|
var createPlaceholderImage = (width2, height2) => {
|
|
48348
|
-
const canvas =
|
|
48348
|
+
const canvas = conf.documentFactory.createElement("canvas");
|
|
48349
48349
|
canvas.width = width2;
|
|
48350
48350
|
canvas.height = height2;
|
|
48351
48351
|
const ctx = canvas.getContext("2d");
|
|
@@ -48387,7 +48387,7 @@ class VideoItem extends BaseItem {
|
|
|
48387
48387
|
super(board, id);
|
|
48388
48388
|
this.events = events2;
|
|
48389
48389
|
this.extension = extension2;
|
|
48390
|
-
this.isStorageUrl = !
|
|
48390
|
+
this.isStorageUrl = !conf.getYouTubeId(url);
|
|
48391
48391
|
this.preview = createPlaceholderImage(videoDimension.width, videoDimension.height);
|
|
48392
48392
|
this.linkTo = new LinkTo(this.id, events2);
|
|
48393
48393
|
this.board = board;
|
|
@@ -48757,59 +48757,59 @@ async function fileTosha256(file) {
|
|
|
48757
48757
|
var catchErrorResponse = async (response, mediaType) => {
|
|
48758
48758
|
if (response.status === 403) {
|
|
48759
48759
|
const data = await response.json();
|
|
48760
|
-
let errorBody =
|
|
48760
|
+
let errorBody = conf.i18n.t("toolsPanel.addMedia.limitReached.bodyWithoutLimit");
|
|
48761
48761
|
if (!data.isOwnerRequest) {
|
|
48762
|
-
errorBody =
|
|
48762
|
+
errorBody = conf.i18n.t("toolsPanel.addMedia.limitReached.bodyOwner");
|
|
48763
48763
|
} else if (data.currentUsage && data.storageLimit) {
|
|
48764
|
-
errorBody =
|
|
48764
|
+
errorBody = conf.i18n.t(`toolsPanel.addMedia.limitReached.body.${parseInt(data.storageLimit) < 1e5 ? "basic" : "plus"}`);
|
|
48765
48765
|
}
|
|
48766
|
-
|
|
48766
|
+
conf.notify({
|
|
48767
48767
|
variant: "warning",
|
|
48768
|
-
header:
|
|
48768
|
+
header: conf.i18n.t("toolsPanel.addMedia.limitReached.header"),
|
|
48769
48769
|
body: errorBody,
|
|
48770
48770
|
button: data.isOwnerRequest && data.storageLimit <= 100 ? {
|
|
48771
|
-
text:
|
|
48772
|
-
onClick: () =>
|
|
48771
|
+
text: conf.i18n.t("toolsPanel.addMedia.upgradeToPlus"),
|
|
48772
|
+
onClick: () => conf.openModal("USER_PLAN_MODAL_ID")
|
|
48773
48773
|
} : undefined,
|
|
48774
48774
|
duration: 8000
|
|
48775
48775
|
});
|
|
48776
48776
|
} else if (response.status === 413) {
|
|
48777
48777
|
const data = await response.json();
|
|
48778
|
-
let errorBody =
|
|
48778
|
+
let errorBody = conf.i18n.t("toolsPanel.addMedia.tooLarge.bodyWithoutLimit");
|
|
48779
48779
|
let isBasicPlan = false;
|
|
48780
48780
|
if (data.fileSizeLimit && data.fileSize) {
|
|
48781
48781
|
if (mediaType === "image") {
|
|
48782
48782
|
isBasicPlan = parseInt(data.fileSizeLimit) < 20;
|
|
48783
|
-
errorBody =
|
|
48783
|
+
errorBody = conf.i18n.t(`toolsPanel.addMedia.tooLarge.imageBody.${isBasicPlan ? "basic" : "plus"}`);
|
|
48784
48784
|
} else {
|
|
48785
48785
|
isBasicPlan = parseInt(data.fileSizeLimit) < 1000;
|
|
48786
|
-
errorBody =
|
|
48786
|
+
errorBody = conf.i18n.t(`toolsPanel.addMedia.tooLarge.audioOrVideoBody.${isBasicPlan ? "basic" : "plus"}`);
|
|
48787
48787
|
}
|
|
48788
48788
|
}
|
|
48789
|
-
|
|
48789
|
+
conf.notify({
|
|
48790
48790
|
variant: "warning",
|
|
48791
|
-
header:
|
|
48791
|
+
header: conf.i18n.t("toolsPanel.addMedia.tooLarge.header"),
|
|
48792
48792
|
body: errorBody,
|
|
48793
48793
|
button: isBasicPlan ? {
|
|
48794
|
-
text:
|
|
48795
|
-
onClick: () =>
|
|
48794
|
+
text: conf.i18n.t("toolsPanel.addMedia.upgradeToPlus"),
|
|
48795
|
+
onClick: () => conf.openModal("USER_PLAN_MODAL_ID")
|
|
48796
48796
|
} : undefined,
|
|
48797
48797
|
duration: 4000
|
|
48798
48798
|
});
|
|
48799
48799
|
} else if (response.status === 401) {
|
|
48800
|
-
|
|
48800
|
+
conf.openModal("MEDIA_UNAVAILABLE_MODAL_ID");
|
|
48801
48801
|
} else if (response.status === 415) {
|
|
48802
|
-
|
|
48802
|
+
conf.notify({
|
|
48803
48803
|
variant: "warning",
|
|
48804
|
-
header:
|
|
48805
|
-
body:
|
|
48804
|
+
header: conf.i18n.t("toolsPanel.addMedia.unsupportedFormat.header"),
|
|
48805
|
+
body: conf.i18n.t("toolsPanel.addMedia.unsupportedFormat.body"),
|
|
48806
48806
|
duration: 4000
|
|
48807
48807
|
});
|
|
48808
48808
|
} else {
|
|
48809
|
-
|
|
48809
|
+
conf.notify({
|
|
48810
48810
|
variant: "error",
|
|
48811
|
-
header:
|
|
48812
|
-
body:
|
|
48811
|
+
header: conf.i18n.t("toolsPanel.addMedia.unhandled.header"),
|
|
48812
|
+
body: conf.i18n.t("toolsPanel.addMedia.unhandled.body"),
|
|
48813
48813
|
duration: 4000
|
|
48814
48814
|
});
|
|
48815
48815
|
}
|
|
@@ -48817,17 +48817,17 @@ var catchErrorResponse = async (response, mediaType) => {
|
|
|
48817
48817
|
};
|
|
48818
48818
|
var catchDuplicateErrorResponse = async (response) => {
|
|
48819
48819
|
if (response.status === 403) {
|
|
48820
|
-
|
|
48820
|
+
conf.notify({
|
|
48821
48821
|
variant: "warning",
|
|
48822
|
-
header:
|
|
48823
|
-
body:
|
|
48822
|
+
header: conf.i18n.t("toolsPanel.addMedia.limitReached.header"),
|
|
48823
|
+
body: conf.i18n.t("toolsPanel.addMedia.limitReached.duplicateBody"),
|
|
48824
48824
|
duration: 4000
|
|
48825
48825
|
});
|
|
48826
48826
|
} else {
|
|
48827
|
-
|
|
48827
|
+
conf.notify({
|
|
48828
48828
|
variant: "error",
|
|
48829
|
-
header:
|
|
48830
|
-
body:
|
|
48829
|
+
header: conf.i18n.t("toolsPanel.addMedia.unhandled.header"),
|
|
48830
|
+
body: conf.i18n.t("toolsPanel.addMedia.unhandled.body"),
|
|
48831
48831
|
duration: 4000
|
|
48832
48832
|
});
|
|
48833
48833
|
}
|
|
@@ -48835,40 +48835,40 @@ var catchDuplicateErrorResponse = async (response) => {
|
|
|
48835
48835
|
};
|
|
48836
48836
|
var validateMediaFile = (file, account2) => {
|
|
48837
48837
|
const fileExtension = file.name.split(".").pop()?.toLowerCase() || "";
|
|
48838
|
-
if (!file.type.startsWith("image") && !
|
|
48839
|
-
|
|
48838
|
+
if (!file.type.startsWith("image") && !conf.AUDIO_FORMATS.includes(fileExtension) && !conf.VIDEO_FORMATS.includes(fileExtension)) {
|
|
48839
|
+
conf.notify({
|
|
48840
48840
|
variant: "warning",
|
|
48841
|
-
header:
|
|
48842
|
-
body:
|
|
48841
|
+
header: conf.i18n.t("toolsPanel.addMedia.unsupportedFormat.header"),
|
|
48842
|
+
body: conf.i18n.t("toolsPanel.addMedia.unsupportedFormat.body"),
|
|
48843
48843
|
duration: 4000
|
|
48844
48844
|
});
|
|
48845
48845
|
return false;
|
|
48846
48846
|
}
|
|
48847
48847
|
const isBasicPlan = account2.billingInfo?.plan.name === "basic";
|
|
48848
|
-
let errorBody =
|
|
48849
|
-
if (
|
|
48850
|
-
errorBody =
|
|
48848
|
+
let errorBody = conf.i18n.t(`toolsPanel.addMedia.tooLarge.imageBody.${isBasicPlan ? "basic" : "plus"}`);
|
|
48849
|
+
if (conf.AUDIO_FORMATS.includes(fileExtension) || conf.VIDEO_FORMATS.includes(fileExtension)) {
|
|
48850
|
+
errorBody = conf.i18n.t(`toolsPanel.addMedia.tooLarge.audioOrVideoBody.${isBasicPlan ? "basic" : "plus"}`);
|
|
48851
48851
|
if (file.size / 1024 ** 2 > (account2.billingInfo?.storage.maxMediaSize || Infinity)) {
|
|
48852
|
-
|
|
48852
|
+
conf.notify({
|
|
48853
48853
|
variant: "warning",
|
|
48854
|
-
header:
|
|
48854
|
+
header: conf.i18n.t("toolsPanel.addMedia.tooLarge.header"),
|
|
48855
48855
|
body: errorBody,
|
|
48856
48856
|
button: isBasicPlan ? {
|
|
48857
|
-
text:
|
|
48858
|
-
onClick: () =>
|
|
48857
|
+
text: conf.i18n.t("toolsPanel.addMedia.upgradeToPlus"),
|
|
48858
|
+
onClick: () => conf.openModal("USER_PLAN_MODAL_ID")
|
|
48859
48859
|
} : undefined,
|
|
48860
48860
|
duration: 4000
|
|
48861
48861
|
});
|
|
48862
48862
|
return false;
|
|
48863
48863
|
}
|
|
48864
48864
|
} else if (file.size / 1024 ** 2 > (account2.billingInfo?.storage.maxImageSize || Infinity)) {
|
|
48865
|
-
|
|
48865
|
+
conf.notify({
|
|
48866
48866
|
variant: "warning",
|
|
48867
|
-
header:
|
|
48867
|
+
header: conf.i18n.t("toolsPanel.addMedia.tooLarge.header"),
|
|
48868
48868
|
body: errorBody,
|
|
48869
48869
|
button: isBasicPlan ? {
|
|
48870
|
-
text:
|
|
48871
|
-
onClick: () =>
|
|
48870
|
+
text: conf.i18n.t("toolsPanel.addMedia.upgradeToPlus"),
|
|
48871
|
+
onClick: () => conf.openModal("USER_PLAN_MODAL_ID")
|
|
48872
48872
|
} : undefined,
|
|
48873
48873
|
duration: 4000
|
|
48874
48874
|
});
|
|
@@ -48947,7 +48947,7 @@ var resizeAndConvertToPng = async (inp) => {
|
|
|
48947
48947
|
};
|
|
48948
48948
|
if (base64String.startsWith("data:image/svg+xml")) {
|
|
48949
48949
|
image2.onload = async () => {
|
|
48950
|
-
const parser =
|
|
48950
|
+
const parser = conf.getDOMParser();
|
|
48951
48951
|
const svgDoc = parser.parseFromString(atob(base64String.split(",")[1]), "image/svg+xml");
|
|
48952
48952
|
const svgElement = svgDoc.documentElement;
|
|
48953
48953
|
svgElement.removeAttribute("width");
|
|
@@ -49159,8 +49159,8 @@ class AudioItem extends BaseItem {
|
|
|
49159
49159
|
this.subject.publish(this);
|
|
49160
49160
|
});
|
|
49161
49161
|
this.transformation.subject.subscribe(this.onTransform);
|
|
49162
|
-
this.right = this.left +
|
|
49163
|
-
this.bottom = this.top +
|
|
49162
|
+
this.right = this.left + conf.AUDIO_DIMENSIONS.width;
|
|
49163
|
+
this.bottom = this.top + conf.AUDIO_DIMENSIONS.height;
|
|
49164
49164
|
this.shouldUseCustomRender = true;
|
|
49165
49165
|
}
|
|
49166
49166
|
setCurrentTime(time2) {
|
|
@@ -49229,8 +49229,8 @@ class AudioItem extends BaseItem {
|
|
|
49229
49229
|
const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
|
|
49230
49230
|
this.left = translateX;
|
|
49231
49231
|
this.top = translateY;
|
|
49232
|
-
this.right = this.left +
|
|
49233
|
-
this.bottom = this.top +
|
|
49232
|
+
this.right = this.left + conf.AUDIO_DIMENSIONS.width * scaleX;
|
|
49233
|
+
this.bottom = this.top + conf.AUDIO_DIMENSIONS.height * scaleY;
|
|
49234
49234
|
}
|
|
49235
49235
|
render(context) {
|
|
49236
49236
|
if (this.transformationRenderBlock) {
|
|
@@ -49259,8 +49259,8 @@ class AudioItem extends BaseItem {
|
|
|
49259
49259
|
const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
|
|
49260
49260
|
const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
|
|
49261
49261
|
div.id = this.getId();
|
|
49262
|
-
div.style.width = `${
|
|
49263
|
-
div.style.height = `${
|
|
49262
|
+
div.style.width = `${conf.AUDIO_DIMENSIONS.width}px`;
|
|
49263
|
+
div.style.height = `${conf.AUDIO_DIMENSIONS.height}px`;
|
|
49264
49264
|
div.style.transformOrigin = "top left";
|
|
49265
49265
|
div.style.transform = transform;
|
|
49266
49266
|
div.style.position = "absolute";
|
|
@@ -49379,7 +49379,7 @@ class AudioItem extends BaseItem {
|
|
|
49379
49379
|
}
|
|
49380
49380
|
download() {
|
|
49381
49381
|
if (this.extension) {
|
|
49382
|
-
const linkElem =
|
|
49382
|
+
const linkElem = conf.documentFactory.createElement("a");
|
|
49383
49383
|
linkElem.href = this.url;
|
|
49384
49384
|
linkElem.setAttribute("download", `${this.board.getBoardId()}.${this.extension}`);
|
|
49385
49385
|
linkElem.click();
|
|
@@ -49720,7 +49720,7 @@ class Placeholder extends BaseItem {
|
|
|
49720
49720
|
}
|
|
49721
49721
|
// src/Items/Image/Image.ts
|
|
49722
49722
|
function getPlaceholderImage(board, imageDimension) {
|
|
49723
|
-
const placeholderCanvas =
|
|
49723
|
+
const placeholderCanvas = conf.documentFactory.createElement("canvas");
|
|
49724
49724
|
const placeholderContext = placeholderCanvas.getContext("2d");
|
|
49725
49725
|
const context = new DrawingContext(board.camera, placeholderContext);
|
|
49726
49726
|
const placeholder = new Placeholder;
|
|
@@ -50001,7 +50001,7 @@ class Drawing extends BaseItem {
|
|
|
50001
50001
|
itemType = "Drawing";
|
|
50002
50002
|
parent = "Board";
|
|
50003
50003
|
transformation;
|
|
50004
|
-
path2d = new
|
|
50004
|
+
path2d = new conf.path2DFactory;
|
|
50005
50005
|
subject = new Subject;
|
|
50006
50006
|
untransformedMbr = new Mbr;
|
|
50007
50007
|
lines = [];
|
|
@@ -50076,7 +50076,7 @@ class Drawing extends BaseItem {
|
|
|
50076
50076
|
this.bottom = mbr.bottom;
|
|
50077
50077
|
}
|
|
50078
50078
|
updatePath2d() {
|
|
50079
|
-
this.path2d = new
|
|
50079
|
+
this.path2d = new conf.path2DFactory;
|
|
50080
50080
|
const context = this.path2d;
|
|
50081
50081
|
const points = this.points;
|
|
50082
50082
|
if (points.length < 3) {
|
|
@@ -51328,14 +51328,14 @@ class AddConnector extends BoardTool {
|
|
|
51328
51328
|
class AddDrawing extends BoardTool {
|
|
51329
51329
|
drawing = null;
|
|
51330
51330
|
isDown = false;
|
|
51331
|
-
strokeWidth =
|
|
51332
|
-
strokeColor =
|
|
51333
|
-
strokeStyle =
|
|
51331
|
+
strokeWidth = conf.PEN_INITIAL_STROKE_WIDTH;
|
|
51332
|
+
strokeColor = conf.PEN_DEFAULT_COLOR;
|
|
51333
|
+
strokeStyle = conf.PEN_STROKE_STYLE;
|
|
51334
51334
|
constructor(board) {
|
|
51335
51335
|
super(board);
|
|
51336
51336
|
this.setCursor();
|
|
51337
|
-
if (
|
|
51338
|
-
const drawingSettings = localStorage.getItem(
|
|
51337
|
+
if (conf.PEN_SETTINGS_KEY) {
|
|
51338
|
+
const drawingSettings = localStorage.getItem(conf.PEN_SETTINGS_KEY);
|
|
51339
51339
|
if (drawingSettings) {
|
|
51340
51340
|
const { strokeWidth, strokeColor, strokeStyle } = JSON.parse(drawingSettings);
|
|
51341
51341
|
this.strokeWidth = strokeWidth;
|
|
@@ -51345,7 +51345,7 @@ class AddDrawing extends BoardTool {
|
|
|
51345
51345
|
}
|
|
51346
51346
|
}
|
|
51347
51347
|
updateSettings() {
|
|
51348
|
-
localStorage.setItem(
|
|
51348
|
+
localStorage.setItem(conf.PEN_SETTINGS_KEY, JSON.stringify({
|
|
51349
51349
|
strokeWidth: this.strokeWidth,
|
|
51350
51350
|
strokeColor: this.strokeColor,
|
|
51351
51351
|
strokeStyle: this.strokeStyle
|
|
@@ -51375,7 +51375,7 @@ class AddDrawing extends BoardTool {
|
|
|
51375
51375
|
ctx.beginPath();
|
|
51376
51376
|
ctx.arc(point7.x, point7.y, this.strokeWidth / 2, 0, 2 * Math.PI, false);
|
|
51377
51377
|
ctx.lineWidth = 1;
|
|
51378
|
-
ctx.strokeStyle =
|
|
51378
|
+
ctx.strokeStyle = conf.PEN_POINTER_CIRCLE_COLOR;
|
|
51379
51379
|
ctx.stroke();
|
|
51380
51380
|
}
|
|
51381
51381
|
setCursor() {
|
|
@@ -51457,7 +51457,7 @@ class AddDrawing extends BoardTool {
|
|
|
51457
51457
|
this.setCursor();
|
|
51458
51458
|
};
|
|
51459
51459
|
render(context) {
|
|
51460
|
-
if (
|
|
51460
|
+
if (conf.PEN_RENDER_POINTER_CIRCLE) {
|
|
51461
51461
|
this.renderPointerCircle(this.board.pointer.point, context);
|
|
51462
51462
|
}
|
|
51463
51463
|
if (!this.drawing) {
|
|
@@ -51472,14 +51472,14 @@ class AddDrawing extends BoardTool {
|
|
|
51472
51472
|
}
|
|
51473
51473
|
// src/Tools/AddDrawing/AddHighlighter.ts
|
|
51474
51474
|
class AddHighlighter extends AddDrawing {
|
|
51475
|
-
strokeWidth =
|
|
51476
|
-
strokeColor =
|
|
51477
|
-
strokeStyle =
|
|
51475
|
+
strokeWidth = conf.HIGHLIGHTER_INITIAL_STROKE_WIDTH;
|
|
51476
|
+
strokeColor = conf.HIGHLIGHTER_DEFAULT_COLOR;
|
|
51477
|
+
strokeStyle = conf.PEN_STROKE_STYLE;
|
|
51478
51478
|
constructor(board) {
|
|
51479
51479
|
super(board);
|
|
51480
51480
|
this.setCursor();
|
|
51481
|
-
if (
|
|
51482
|
-
const highlighterSettings = localStorage.getItem(
|
|
51481
|
+
if (conf.HIGHLIGHTER_SETTINGS_KEY) {
|
|
51482
|
+
const highlighterSettings = localStorage.getItem(conf.HIGHLIGHTER_SETTINGS_KEY);
|
|
51483
51483
|
if (highlighterSettings) {
|
|
51484
51484
|
const { strokeWidth, strokeColor, strokeStyle } = JSON.parse(highlighterSettings);
|
|
51485
51485
|
this.strokeWidth = strokeWidth;
|
|
@@ -51492,7 +51492,7 @@ class AddHighlighter extends AddDrawing {
|
|
|
51492
51492
|
return true;
|
|
51493
51493
|
}
|
|
51494
51494
|
updateSettings() {
|
|
51495
|
-
localStorage.setItem(
|
|
51495
|
+
localStorage.setItem(conf.HIGHLIGHTER_SETTINGS_KEY, JSON.stringify({
|
|
51496
51496
|
strokeWidth: this.strokeWidth,
|
|
51497
51497
|
strokeColor: this.strokeColor,
|
|
51498
51498
|
strokeStyle: this.strokeStyle
|
|
@@ -51816,7 +51816,7 @@ class AddShape extends BoardTool {
|
|
|
51816
51816
|
const point7 = this.board.pointer.point;
|
|
51817
51817
|
this.line = new Line(point7.copy(), point7.copy());
|
|
51818
51818
|
this.bounds = this.line.getMbr();
|
|
51819
|
-
this.bounds.borderColor =
|
|
51819
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
51820
51820
|
this.shape.apply({
|
|
51821
51821
|
class: "Shape",
|
|
51822
51822
|
method: "setShapeType",
|
|
@@ -51840,7 +51840,7 @@ class AddShape extends BoardTool {
|
|
|
51840
51840
|
}
|
|
51841
51841
|
this.line = new Line(startPoint, endPoint);
|
|
51842
51842
|
this.bounds = this.line.getMbr();
|
|
51843
|
-
this.bounds.borderColor =
|
|
51843
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
51844
51844
|
this.initTransformation();
|
|
51845
51845
|
this.board.tools.publish();
|
|
51846
51846
|
return true;
|
|
@@ -51912,7 +51912,7 @@ class AddShape extends BoardTool {
|
|
|
51912
51912
|
const y = (top + bottom) / 2 - 50;
|
|
51913
51913
|
this.bounds = new Mbr(x, y, x, y);
|
|
51914
51914
|
this.line = new Line(new Point(x, y), new Point(x, y));
|
|
51915
|
-
this.bounds.borderColor =
|
|
51915
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
51916
51916
|
this.shape.apply({
|
|
51917
51917
|
class: "Shape",
|
|
51918
51918
|
method: "setShapeType",
|
|
@@ -51945,8 +51945,8 @@ class AddSticker extends BoardTool {
|
|
|
51945
51945
|
this.setCursor(this.sticker.getBackgroundColor());
|
|
51946
51946
|
}
|
|
51947
51947
|
setCursor(color2) {
|
|
51948
|
-
if (
|
|
51949
|
-
const colorName = color2 ?
|
|
51948
|
+
if (conf.STICKER_COLOR_NAMES) {
|
|
51949
|
+
const colorName = color2 ? conf.STICKER_COLOR_NAMES[conf.STICKER_COLORS.indexOf(color2)] : undefined;
|
|
51950
51950
|
this.board.pointer.setCursor(colorName ? `sticker-${colorName}` : "crosshair");
|
|
51951
51951
|
} else {
|
|
51952
51952
|
this.board.pointer.setCursor("crosshair");
|
|
@@ -51970,7 +51970,7 @@ class AddSticker extends BoardTool {
|
|
|
51970
51970
|
const point7 = this.board.pointer.point;
|
|
51971
51971
|
this.line = new Line(point7.copy(), point7.copy());
|
|
51972
51972
|
this.bounds = this.line.getMbr();
|
|
51973
|
-
this.bounds.borderColor =
|
|
51973
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
51974
51974
|
this.board.tools.publish();
|
|
51975
51975
|
return true;
|
|
51976
51976
|
}
|
|
@@ -51979,7 +51979,7 @@ class AddSticker extends BoardTool {
|
|
|
51979
51979
|
this.line = new Line(this.line.start.copy(), this.board.pointer.point.copy());
|
|
51980
51980
|
this.sticker.applyDiagonal(this.line);
|
|
51981
51981
|
this.bounds = this.sticker.getMbr();
|
|
51982
|
-
this.bounds.borderColor =
|
|
51982
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
51983
51983
|
this.board.tools.publish();
|
|
51984
51984
|
return true;
|
|
51985
51985
|
}
|
|
@@ -52079,7 +52079,7 @@ class AddText extends BoardTool {
|
|
|
52079
52079
|
const point7 = this.board.pointer.point;
|
|
52080
52080
|
this.line = new Line(point7.copy(), point7.copy());
|
|
52081
52081
|
this.bounds = this.line.getMbr();
|
|
52082
|
-
this.bounds.borderColor =
|
|
52082
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
52083
52083
|
this.board.tools.publish();
|
|
52084
52084
|
return true;
|
|
52085
52085
|
}
|
|
@@ -52090,7 +52090,7 @@ class AddText extends BoardTool {
|
|
|
52090
52090
|
const end2 = new Point(cursorPoint.x, start2.y + height2);
|
|
52091
52091
|
this.line = new Line(start2, end2);
|
|
52092
52092
|
this.bounds = this.line.getMbr();
|
|
52093
|
-
this.bounds.borderColor =
|
|
52093
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
52094
52094
|
this.board.tools.publish();
|
|
52095
52095
|
return true;
|
|
52096
52096
|
}
|
|
@@ -52155,11 +52155,11 @@ class AddText extends BoardTool {
|
|
|
52155
52155
|
class Eraser extends BoardTool {
|
|
52156
52156
|
itemType = "Eraser";
|
|
52157
52157
|
isDown = false;
|
|
52158
|
-
strokeWidth =
|
|
52159
|
-
strokeColor =
|
|
52160
|
-
strokeStyle =
|
|
52158
|
+
strokeWidth = conf.ERASER_STROKE_WIDTH;
|
|
52159
|
+
strokeColor = conf.ERASER_DEFAULT_COLOR;
|
|
52160
|
+
strokeStyle = conf.PEN_STROKE_STYLE;
|
|
52161
52161
|
drawing = new Drawing(this.board, []);
|
|
52162
|
-
maxPointsInLine =
|
|
52162
|
+
maxPointsInLine = conf.ERASER_MAX_LINE_LENGTH;
|
|
52163
52163
|
constructor(board) {
|
|
52164
52164
|
super(board);
|
|
52165
52165
|
this.setCursor();
|
|
@@ -52295,8 +52295,8 @@ function getResizeType(cursorPoint, cameraScale, mbr, anchorDistance = 5) {
|
|
|
52295
52295
|
|
|
52296
52296
|
// src/Tools/ExportSnapshot/getDecorationResizeType.ts
|
|
52297
52297
|
function getDecorationResizeType(point7, mbr, tolerance = 10) {
|
|
52298
|
-
for (const key in
|
|
52299
|
-
const decoration =
|
|
52298
|
+
for (const key in conf.EXPORT_FRAME_DECORATIONS) {
|
|
52299
|
+
const decoration = conf.EXPORT_FRAME_DECORATIONS[key];
|
|
52300
52300
|
const decorationBounds = {
|
|
52301
52301
|
left: mbr.left + (decoration.offsetX ?? 0),
|
|
52302
52302
|
top: mbr.top + (decoration.offsetY ?? 0),
|
|
@@ -52337,7 +52337,7 @@ class ExportSnapshot extends Tool {
|
|
|
52337
52337
|
super();
|
|
52338
52338
|
this.board = board;
|
|
52339
52339
|
const cameraCenter = this.board.camera.getMbr().getCenter();
|
|
52340
|
-
this.mbr = new Mbr(cameraCenter.x -
|
|
52340
|
+
this.mbr = new Mbr(cameraCenter.x - conf.EXPORT_SELECTION_BOX_WIDTH / 2, cameraCenter.y - conf.EXPORT_SELECTION_BOX_HEIGHT / 2, cameraCenter.x + conf.EXPORT_SELECTION_BOX_WIDTH / 2, cameraCenter.y + conf.EXPORT_SELECTION_BOX_HEIGHT / 2, "transparent", "transparent", 1);
|
|
52341
52341
|
this.board.selection.disable();
|
|
52342
52342
|
this.tempDrawingContext = new DrawingContext(board.camera, this.tempCtx);
|
|
52343
52343
|
}
|
|
@@ -52349,11 +52349,11 @@ class ExportSnapshot extends Tool {
|
|
|
52349
52349
|
resize() {
|
|
52350
52350
|
if (this.resizeType && this.mbr && this.oppositePoint) {
|
|
52351
52351
|
const resize = getResize(this.resizeType, this.board.pointer.point, this.mbr, this.oppositePoint);
|
|
52352
|
-
if (resize.mbr.getWidth() >
|
|
52352
|
+
if (resize.mbr.getWidth() > conf.EXPORT_MIN_WIDTH) {
|
|
52353
52353
|
this.mbr.left = resize.mbr.left;
|
|
52354
52354
|
this.mbr.right = resize.mbr.right;
|
|
52355
52355
|
}
|
|
52356
|
-
if (resize.mbr.getHeight() >
|
|
52356
|
+
if (resize.mbr.getHeight() > conf.EXPORT_MIN_HEIGHT) {
|
|
52357
52357
|
this.mbr.top = resize.mbr.top;
|
|
52358
52358
|
this.mbr.bottom = resize.mbr.bottom;
|
|
52359
52359
|
}
|
|
@@ -52442,7 +52442,7 @@ class ExportSnapshot extends Tool {
|
|
|
52442
52442
|
}
|
|
52443
52443
|
const res = await exportBoardSnapshot({
|
|
52444
52444
|
board: this.board,
|
|
52445
|
-
bgColor:
|
|
52445
|
+
bgColor: conf.CANVAS_BG_COLOR,
|
|
52446
52446
|
selection: this.mbr,
|
|
52447
52447
|
upscaleTo: 4000,
|
|
52448
52448
|
nameToExport: this.board.getName()
|
|
@@ -52466,18 +52466,18 @@ class ExportSnapshot extends Tool {
|
|
|
52466
52466
|
const cameraMbr = context.camera.getMbr();
|
|
52467
52467
|
this.tempDrawingContext.setCamera(this.board.camera);
|
|
52468
52468
|
this.tempDrawingContext.clear();
|
|
52469
|
-
cameraMbr.backgroundColor =
|
|
52469
|
+
cameraMbr.backgroundColor = conf.EXPORT_BLUR_BACKGROUND_COLOR;
|
|
52470
52470
|
cameraMbr.strokeWidth = 0;
|
|
52471
52471
|
cameraMbr.render(this.tempDrawingContext);
|
|
52472
52472
|
this.tempCtx.clearRect(this.mbr.left, this.mbr.top, this.mbr.getWidth(), this.mbr.getHeight());
|
|
52473
|
-
if (
|
|
52474
|
-
const topLeft =
|
|
52473
|
+
if (conf.EXPORT_FRAME_DECORATIONS) {
|
|
52474
|
+
const topLeft = conf.EXPORT_FRAME_DECORATIONS["top-left"];
|
|
52475
52475
|
this.renderDecoration(this.tempDrawingContext, topLeft.path, this.mbr.left + (topLeft.offsetX ?? 0), this.mbr.top + (topLeft.offsetY ?? 0), topLeft.color, topLeft.lineWidth);
|
|
52476
|
-
const topRight =
|
|
52476
|
+
const topRight = conf.EXPORT_FRAME_DECORATIONS["top-right"];
|
|
52477
52477
|
this.renderDecoration(this.tempDrawingContext, topRight.path, this.mbr.right + (topRight.offsetX ?? 0), this.mbr.top + (topRight.offsetY ?? 0), topRight.color, topRight.lineWidth);
|
|
52478
|
-
const bottomLeft =
|
|
52478
|
+
const bottomLeft = conf.EXPORT_FRAME_DECORATIONS["bottom-left"];
|
|
52479
52479
|
this.renderDecoration(this.tempDrawingContext, bottomLeft.path, this.mbr.left + (bottomLeft.offsetX ?? 0), this.mbr.bottom + (bottomLeft.offsetY ?? 0), bottomLeft.color, bottomLeft.lineWidth);
|
|
52480
|
-
const bottomRight =
|
|
52480
|
+
const bottomRight = conf.EXPORT_FRAME_DECORATIONS["bottom-right"];
|
|
52481
52481
|
this.renderDecoration(this.tempDrawingContext, bottomRight.path, this.mbr.left + this.mbr.getWidth() - bottomRight.width, this.mbr.top + this.mbr.getHeight() - bottomRight.width, bottomRight.color, bottomRight.lineWidth);
|
|
52482
52482
|
}
|
|
52483
52483
|
}
|
|
@@ -52579,7 +52579,7 @@ function createCanvasDrawer(board) {
|
|
|
52579
52579
|
borderDiv.id = "canvasBorder";
|
|
52580
52580
|
borderDiv.style.position = "absolute";
|
|
52581
52581
|
borderDiv.style.transformOrigin = "left top";
|
|
52582
|
-
borderDiv.style.border = `1px solid ${
|
|
52582
|
+
borderDiv.style.border = `1px solid ${conf.SELECTION_COLOR}`;
|
|
52583
52583
|
borderDiv.style.boxSizing = "border-box";
|
|
52584
52584
|
borderDiv.style.left = `${leftOffset}px`;
|
|
52585
52585
|
borderDiv.style.top = `${topOffset}px`;
|
|
@@ -52589,7 +52589,7 @@ function createCanvasDrawer(board) {
|
|
|
52589
52589
|
canvas.style.boxSizing = "border-box";
|
|
52590
52590
|
container.appendChild(borderDiv);
|
|
52591
52591
|
} else {
|
|
52592
|
-
canvas.style.border = `1px solid ${
|
|
52592
|
+
canvas.style.border = `1px solid ${conf.SELECTION_COLOR}`;
|
|
52593
52593
|
canvas.style.boxSizing = "border-box";
|
|
52594
52594
|
}
|
|
52595
52595
|
const createAnchorDiv = (left, top, radius) => {
|
|
@@ -52597,8 +52597,8 @@ function createCanvasDrawer(board) {
|
|
|
52597
52597
|
anchorDiv.style.position = "absolute";
|
|
52598
52598
|
anchorDiv.style.width = `${2 * radius}px`;
|
|
52599
52599
|
anchorDiv.style.height = `${2 * radius}px`;
|
|
52600
|
-
anchorDiv.style.backgroundColor = `${
|
|
52601
|
-
anchorDiv.style.border = `${
|
|
52600
|
+
anchorDiv.style.backgroundColor = `${conf.SELECTION_ANCHOR_COLOR}`;
|
|
52601
|
+
anchorDiv.style.border = `${conf.SELECTION_ANCHOR_WIDTH}px solid ${conf.SELECTION_COLOR}`;
|
|
52602
52602
|
anchorDiv.style.borderRadius = "2px";
|
|
52603
52603
|
anchorDiv.style.left = `calc(${left} - ${radius}px)`;
|
|
52604
52604
|
anchorDiv.style.top = `calc(${top} - ${radius}px)`;
|
|
@@ -52606,10 +52606,10 @@ function createCanvasDrawer(board) {
|
|
|
52606
52606
|
return anchorDiv;
|
|
52607
52607
|
};
|
|
52608
52608
|
const anchors = [
|
|
52609
|
-
createAnchorDiv("0%", "0%",
|
|
52610
|
-
createAnchorDiv("100% + 1px", "0%",
|
|
52611
|
-
createAnchorDiv("0%", "100% + 1px",
|
|
52612
|
-
createAnchorDiv("100% + 1px", "100% + 1px",
|
|
52609
|
+
createAnchorDiv("0%", "0%", conf.SELECTION_ANCHOR_RADIUS),
|
|
52610
|
+
createAnchorDiv("100% + 1px", "0%", conf.SELECTION_ANCHOR_RADIUS),
|
|
52611
|
+
createAnchorDiv("0%", "100% + 1px", conf.SELECTION_ANCHOR_RADIUS),
|
|
52612
|
+
createAnchorDiv("100% + 1px", "100% + 1px", conf.SELECTION_ANCHOR_RADIUS)
|
|
52613
52613
|
];
|
|
52614
52614
|
const canvasBorder = Array.from(container.children).find((child) => child.id === "canvasBorder");
|
|
52615
52615
|
for (const anchor of anchors) {
|
|
@@ -53962,8 +53962,8 @@ class Select extends Tool {
|
|
|
53962
53962
|
const { x, y } = pointer.point;
|
|
53963
53963
|
this.line = new Line(new Point(x, y), new Point(x, y));
|
|
53964
53964
|
this.rect = this.line.getMbr();
|
|
53965
|
-
this.rect.borderColor =
|
|
53966
|
-
this.rect.backgroundColor =
|
|
53965
|
+
this.rect.borderColor = conf.SELECTION_COLOR;
|
|
53966
|
+
this.rect.backgroundColor = conf.SELECTION_BACKGROUND;
|
|
53967
53967
|
this.board.tools.publish();
|
|
53968
53968
|
this.board.presence.throttledEmit({
|
|
53969
53969
|
method: "DrawSelect",
|
|
@@ -54048,8 +54048,8 @@ class Select extends Tool {
|
|
|
54048
54048
|
const point7 = this.board.pointer.point.copy();
|
|
54049
54049
|
this.line = new Line(this.line.start, point7);
|
|
54050
54050
|
this.rect = this.line.getMbr();
|
|
54051
|
-
this.rect.borderColor =
|
|
54052
|
-
this.rect.backgroundColor =
|
|
54051
|
+
this.rect.borderColor = conf.SELECTION_COLOR;
|
|
54052
|
+
this.rect.backgroundColor = conf.SELECTION_BACKGROUND;
|
|
54053
54053
|
this.board.tools.publish();
|
|
54054
54054
|
this.board.presence.throttledEmit({
|
|
54055
54055
|
method: "DrawSelect",
|
|
@@ -54560,7 +54560,7 @@ class ShapeTool extends CustomTool {
|
|
|
54560
54560
|
const point7 = this.board.pointer.point;
|
|
54561
54561
|
this.line = new Line(point7.copy(), point7.copy());
|
|
54562
54562
|
this.bounds = this.line.getMbr();
|
|
54563
|
-
this.bounds.borderColor =
|
|
54563
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
54564
54564
|
this.initTransformation();
|
|
54565
54565
|
this.board.tools.publish();
|
|
54566
54566
|
return true;
|
|
@@ -54578,7 +54578,7 @@ class ShapeTool extends CustomTool {
|
|
|
54578
54578
|
}
|
|
54579
54579
|
this.line = new Line(startPoint, endPoint);
|
|
54580
54580
|
this.bounds = this.line.getMbr();
|
|
54581
|
-
this.bounds.borderColor =
|
|
54581
|
+
this.bounds.borderColor = conf.SELECTION_COLOR;
|
|
54582
54582
|
this.initTransformation();
|
|
54583
54583
|
this.board.tools.publish();
|
|
54584
54584
|
return true;
|
|
@@ -55547,9 +55547,9 @@ class Camera {
|
|
|
55547
55547
|
matrix = new Matrix2;
|
|
55548
55548
|
pointer = new Point;
|
|
55549
55549
|
window = {
|
|
55550
|
-
width:
|
|
55551
|
-
height:
|
|
55552
|
-
dpi:
|
|
55550
|
+
width: conf.getDocumentWidth(),
|
|
55551
|
+
height: conf.getDocumentHeight(),
|
|
55552
|
+
dpi: conf.getDPI(),
|
|
55553
55553
|
getMbr: () => {
|
|
55554
55554
|
return new Mbr(0, 0, this.window.width, this.window.height);
|
|
55555
55555
|
}
|
|
@@ -55925,9 +55925,9 @@ class Camera {
|
|
|
55925
55925
|
this.updateBoardPointer();
|
|
55926
55926
|
}
|
|
55927
55927
|
onWindowResize() {
|
|
55928
|
-
this.window.width =
|
|
55929
|
-
this.window.height =
|
|
55930
|
-
this.window.dpi =
|
|
55928
|
+
this.window.width = conf.getDocumentWidth();
|
|
55929
|
+
this.window.height = conf.getDocumentHeight();
|
|
55930
|
+
this.window.dpi = conf.getDPI();
|
|
55931
55931
|
this.resizeSubject.publish(this);
|
|
55932
55932
|
this.subject.publish(this);
|
|
55933
55933
|
}
|
|
@@ -55940,10 +55940,10 @@ class Camera {
|
|
|
55940
55940
|
let y = 0;
|
|
55941
55941
|
const { activeKeys } = keyboard;
|
|
55942
55942
|
const directions = {
|
|
55943
|
-
ArrowRight: [-
|
|
55944
|
-
ArrowLeft: [
|
|
55945
|
-
ArrowDown: [0, -
|
|
55946
|
-
ArrowUp: [0,
|
|
55943
|
+
ArrowRight: [-conf.NAVIGATION_STEP, 0],
|
|
55944
|
+
ArrowLeft: [conf.NAVIGATION_STEP, 0],
|
|
55945
|
+
ArrowDown: [0, -conf.NAVIGATION_STEP],
|
|
55946
|
+
ArrowUp: [0, conf.NAVIGATION_STEP]
|
|
55947
55947
|
};
|
|
55948
55948
|
const activeArrowKeys = Array.from(activeKeys).filter((key) => (key in directions)).sort();
|
|
55949
55949
|
if (activeArrowKeys.length === 2) {
|
|
@@ -56326,6 +56326,322 @@ function isHotkeyPushed(hotkey, event) {
|
|
|
56326
56326
|
}
|
|
56327
56327
|
// src/isMacos.ts
|
|
56328
56328
|
var isMacos = () => navigator.platform.toUpperCase().includes("MAC");
|
|
56329
|
+
// src/Keyboard/hotkeys.json
|
|
56330
|
+
var hotkeys_default2 = {
|
|
56331
|
+
select: {
|
|
56332
|
+
key: {
|
|
56333
|
+
button: "KeyV"
|
|
56334
|
+
},
|
|
56335
|
+
label: {
|
|
56336
|
+
windows: "V",
|
|
56337
|
+
mac: "V"
|
|
56338
|
+
}
|
|
56339
|
+
},
|
|
56340
|
+
navigateMode: {
|
|
56341
|
+
key: {
|
|
56342
|
+
button: "Space"
|
|
56343
|
+
},
|
|
56344
|
+
label: {
|
|
56345
|
+
windows: "Space",
|
|
56346
|
+
mac: "Space"
|
|
56347
|
+
}
|
|
56348
|
+
},
|
|
56349
|
+
text: {
|
|
56350
|
+
key: {
|
|
56351
|
+
button: "KeyT"
|
|
56352
|
+
},
|
|
56353
|
+
label: {
|
|
56354
|
+
windows: "T",
|
|
56355
|
+
mac: "T"
|
|
56356
|
+
}
|
|
56357
|
+
},
|
|
56358
|
+
sticker: {
|
|
56359
|
+
key: {
|
|
56360
|
+
button: "KeyN"
|
|
56361
|
+
},
|
|
56362
|
+
label: {
|
|
56363
|
+
mac: "N",
|
|
56364
|
+
windows: "N"
|
|
56365
|
+
}
|
|
56366
|
+
},
|
|
56367
|
+
shape: {
|
|
56368
|
+
key: {
|
|
56369
|
+
button: "KeyS"
|
|
56370
|
+
},
|
|
56371
|
+
label: {
|
|
56372
|
+
mac: "S",
|
|
56373
|
+
windows: "S"
|
|
56374
|
+
}
|
|
56375
|
+
},
|
|
56376
|
+
connector: {
|
|
56377
|
+
key: {
|
|
56378
|
+
button: "KeyL"
|
|
56379
|
+
},
|
|
56380
|
+
label: {
|
|
56381
|
+
mac: "L",
|
|
56382
|
+
windows: "L"
|
|
56383
|
+
}
|
|
56384
|
+
},
|
|
56385
|
+
pen: {
|
|
56386
|
+
key: {
|
|
56387
|
+
button: "KeyP"
|
|
56388
|
+
},
|
|
56389
|
+
label: {
|
|
56390
|
+
mac: "P",
|
|
56391
|
+
windows: "P"
|
|
56392
|
+
}
|
|
56393
|
+
},
|
|
56394
|
+
eraser: {
|
|
56395
|
+
key: {
|
|
56396
|
+
button: "KeyE"
|
|
56397
|
+
},
|
|
56398
|
+
label: {
|
|
56399
|
+
mac: "E",
|
|
56400
|
+
windows: "E"
|
|
56401
|
+
}
|
|
56402
|
+
},
|
|
56403
|
+
frame: {
|
|
56404
|
+
key: {
|
|
56405
|
+
button: "KeyF"
|
|
56406
|
+
},
|
|
56407
|
+
label: {
|
|
56408
|
+
mac: "F",
|
|
56409
|
+
windows: "F"
|
|
56410
|
+
}
|
|
56411
|
+
},
|
|
56412
|
+
undo: {
|
|
56413
|
+
key: {
|
|
56414
|
+
button: "KeyZ",
|
|
56415
|
+
ctrl: true
|
|
56416
|
+
},
|
|
56417
|
+
label: {
|
|
56418
|
+
mac: "⌘Z",
|
|
56419
|
+
windows: "Ctrl + Z"
|
|
56420
|
+
}
|
|
56421
|
+
},
|
|
56422
|
+
redo: {
|
|
56423
|
+
key: {
|
|
56424
|
+
button: "KeyZ",
|
|
56425
|
+
ctrl: true,
|
|
56426
|
+
shift: true
|
|
56427
|
+
},
|
|
56428
|
+
label: {
|
|
56429
|
+
mac: "⌘⇧Z",
|
|
56430
|
+
windows: "Ctrl + Shift + Z"
|
|
56431
|
+
}
|
|
56432
|
+
},
|
|
56433
|
+
textBold: {
|
|
56434
|
+
key: {
|
|
56435
|
+
button: "KeyB",
|
|
56436
|
+
ctrl: true
|
|
56437
|
+
},
|
|
56438
|
+
label: {
|
|
56439
|
+
mac: "⌘B",
|
|
56440
|
+
windows: "Ctrl + B"
|
|
56441
|
+
}
|
|
56442
|
+
},
|
|
56443
|
+
textStrike: {
|
|
56444
|
+
key: {
|
|
56445
|
+
button: "KeyS",
|
|
56446
|
+
ctrl: true
|
|
56447
|
+
},
|
|
56448
|
+
label: {
|
|
56449
|
+
mac: "⌘S",
|
|
56450
|
+
windows: "Ctrl + S"
|
|
56451
|
+
}
|
|
56452
|
+
},
|
|
56453
|
+
textUnderline: {
|
|
56454
|
+
key: {
|
|
56455
|
+
button: "KeyU",
|
|
56456
|
+
ctrl: true
|
|
56457
|
+
},
|
|
56458
|
+
label: {
|
|
56459
|
+
mac: "⌘U",
|
|
56460
|
+
windows: "Ctrl + U"
|
|
56461
|
+
}
|
|
56462
|
+
},
|
|
56463
|
+
textItalic: {
|
|
56464
|
+
key: {
|
|
56465
|
+
button: "KeyI",
|
|
56466
|
+
ctrl: true
|
|
56467
|
+
},
|
|
56468
|
+
label: {
|
|
56469
|
+
mac: "⌘I",
|
|
56470
|
+
windows: "Ctrl + I"
|
|
56471
|
+
}
|
|
56472
|
+
},
|
|
56473
|
+
zoomOut: {
|
|
56474
|
+
key: {
|
|
56475
|
+
button: "Minus",
|
|
56476
|
+
ctrl: true
|
|
56477
|
+
},
|
|
56478
|
+
label: {
|
|
56479
|
+
mac: "⌘-",
|
|
56480
|
+
windows: "Ctrl + -"
|
|
56481
|
+
}
|
|
56482
|
+
},
|
|
56483
|
+
zoomIn: {
|
|
56484
|
+
key: {
|
|
56485
|
+
button: "Equal",
|
|
56486
|
+
ctrl: true
|
|
56487
|
+
},
|
|
56488
|
+
label: {
|
|
56489
|
+
mac: "⌘+",
|
|
56490
|
+
windows: "Ctrl + +"
|
|
56491
|
+
}
|
|
56492
|
+
},
|
|
56493
|
+
zoomDefault: {
|
|
56494
|
+
key: {
|
|
56495
|
+
button: "Digit0",
|
|
56496
|
+
ctrl: true
|
|
56497
|
+
},
|
|
56498
|
+
label: {
|
|
56499
|
+
mac: "⌘0",
|
|
56500
|
+
windows: "Ctrl + 0"
|
|
56501
|
+
}
|
|
56502
|
+
},
|
|
56503
|
+
duplicate: {
|
|
56504
|
+
key: {
|
|
56505
|
+
button: "KeyD",
|
|
56506
|
+
ctrl: true
|
|
56507
|
+
},
|
|
56508
|
+
label: {
|
|
56509
|
+
mac: "⌘D",
|
|
56510
|
+
windows: "Ctrl + D"
|
|
56511
|
+
}
|
|
56512
|
+
},
|
|
56513
|
+
bringToFront: {
|
|
56514
|
+
key: {
|
|
56515
|
+
button: "PageUp"
|
|
56516
|
+
},
|
|
56517
|
+
label: {
|
|
56518
|
+
mac: "fn↑ (PgUp)",
|
|
56519
|
+
windows: "PgUp"
|
|
56520
|
+
}
|
|
56521
|
+
},
|
|
56522
|
+
sendToBack: {
|
|
56523
|
+
key: {
|
|
56524
|
+
button: "PageDown"
|
|
56525
|
+
},
|
|
56526
|
+
label: {
|
|
56527
|
+
mac: "fn↓ (PgDn)",
|
|
56528
|
+
windows: "PgDn"
|
|
56529
|
+
}
|
|
56530
|
+
},
|
|
56531
|
+
delete: {
|
|
56532
|
+
key: {
|
|
56533
|
+
button: ["Delete", "Backspace"]
|
|
56534
|
+
},
|
|
56535
|
+
label: {
|
|
56536
|
+
mac: "Delete",
|
|
56537
|
+
windows: "Delete"
|
|
56538
|
+
}
|
|
56539
|
+
},
|
|
56540
|
+
cancel: {
|
|
56541
|
+
key: {
|
|
56542
|
+
button: "Escape"
|
|
56543
|
+
},
|
|
56544
|
+
label: {
|
|
56545
|
+
mac: "Esc",
|
|
56546
|
+
windows: "Esc"
|
|
56547
|
+
}
|
|
56548
|
+
},
|
|
56549
|
+
selectAll: {
|
|
56550
|
+
key: {
|
|
56551
|
+
button: "KeyA",
|
|
56552
|
+
ctrl: true
|
|
56553
|
+
},
|
|
56554
|
+
label: {
|
|
56555
|
+
mac: "⌘A",
|
|
56556
|
+
windows: "Ctrl + A"
|
|
56557
|
+
}
|
|
56558
|
+
},
|
|
56559
|
+
copy: {
|
|
56560
|
+
key: {
|
|
56561
|
+
button: "KeyC",
|
|
56562
|
+
ctrl: true
|
|
56563
|
+
},
|
|
56564
|
+
label: {
|
|
56565
|
+
mac: "⌘C",
|
|
56566
|
+
windows: "Ctrl + C"
|
|
56567
|
+
}
|
|
56568
|
+
},
|
|
56569
|
+
paste: {
|
|
56570
|
+
key: {
|
|
56571
|
+
button: "KeyV",
|
|
56572
|
+
ctrl: true
|
|
56573
|
+
},
|
|
56574
|
+
label: {
|
|
56575
|
+
mac: "⌘V",
|
|
56576
|
+
windows: "Ctrl + V"
|
|
56577
|
+
}
|
|
56578
|
+
},
|
|
56579
|
+
confirm: {
|
|
56580
|
+
key: {
|
|
56581
|
+
button: "Enter"
|
|
56582
|
+
},
|
|
56583
|
+
label: {
|
|
56584
|
+
mac: "⏎",
|
|
56585
|
+
windows: "⏎"
|
|
56586
|
+
}
|
|
56587
|
+
},
|
|
56588
|
+
frameNavigationNext: {
|
|
56589
|
+
key: {
|
|
56590
|
+
button: "ArrowRight",
|
|
56591
|
+
ctrl: true
|
|
56592
|
+
},
|
|
56593
|
+
label: {
|
|
56594
|
+
mac: "⌘→",
|
|
56595
|
+
windows: "Ctrl→"
|
|
56596
|
+
}
|
|
56597
|
+
},
|
|
56598
|
+
frameNavigationPrev: {
|
|
56599
|
+
key: {
|
|
56600
|
+
button: "ArrowLeft",
|
|
56601
|
+
ctrl: true
|
|
56602
|
+
},
|
|
56603
|
+
label: {
|
|
56604
|
+
mac: "⌘←",
|
|
56605
|
+
windows: "Ctrl←"
|
|
56606
|
+
}
|
|
56607
|
+
},
|
|
56608
|
+
navigationRight: {
|
|
56609
|
+
key: {
|
|
56610
|
+
button: "ArrowRight"
|
|
56611
|
+
},
|
|
56612
|
+
label: {
|
|
56613
|
+
mac: "→",
|
|
56614
|
+
windows: "→"
|
|
56615
|
+
}
|
|
56616
|
+
},
|
|
56617
|
+
navigationLeft: {
|
|
56618
|
+
key: {
|
|
56619
|
+
button: "ArrowLeft"
|
|
56620
|
+
},
|
|
56621
|
+
label: {
|
|
56622
|
+
mac: "←",
|
|
56623
|
+
windows: "←"
|
|
56624
|
+
}
|
|
56625
|
+
},
|
|
56626
|
+
navigationUp: {
|
|
56627
|
+
key: {
|
|
56628
|
+
button: "ArrowUp"
|
|
56629
|
+
},
|
|
56630
|
+
label: {
|
|
56631
|
+
mac: "↑",
|
|
56632
|
+
windows: "↑"
|
|
56633
|
+
}
|
|
56634
|
+
},
|
|
56635
|
+
navigationDown: {
|
|
56636
|
+
key: {
|
|
56637
|
+
button: "ArrowDown"
|
|
56638
|
+
},
|
|
56639
|
+
label: {
|
|
56640
|
+
mac: "↓",
|
|
56641
|
+
windows: "↓"
|
|
56642
|
+
}
|
|
56643
|
+
}
|
|
56644
|
+
};
|
|
56329
56645
|
|
|
56330
56646
|
// src/Keyboard/logHotkey.ts
|
|
56331
56647
|
function logHotkey(hotkeyConfig, hotkeyName, status, context) {
|
|
@@ -56333,7 +56649,7 @@ function logHotkey(hotkeyConfig, hotkeyName, status, context) {
|
|
|
56333
56649
|
return;
|
|
56334
56650
|
}
|
|
56335
56651
|
const isFunction = typeof hotkeyConfig === "function";
|
|
56336
|
-
const hotkeyData =
|
|
56652
|
+
const hotkeyData = hotkeys_default2[hotkeyName];
|
|
56337
56653
|
switch (status) {
|
|
56338
56654
|
case "triggered":
|
|
56339
56655
|
console.groupCollapsed(`%cDebug%c Triggered hotkey%c ${hotkeyName}`, "color: #00f; font-size: 16px; display: inline-block; padding: 2px 5px; border-radius: 5px; background-color: #f0f0f0; margin-left: 8px", "font-size: 14px; display: inline-block; color: #808080; font-weight: 500;", "font-size: 14px; display: inline-block; color: #ffd800; font-weight: 700;");
|
|
@@ -56421,7 +56737,7 @@ function checkHotkeys(hotkeyMap, event, board) {
|
|
|
56421
56737
|
// src/Keyboard/getHotkeyLabel.ts
|
|
56422
56738
|
function getHotkeyLabel(hotkey) {
|
|
56423
56739
|
const hotkeyLabel = hotkeys_default[hotkey].label;
|
|
56424
|
-
switch (
|
|
56740
|
+
switch (conf.FORCE_HOTKEYS || "auto") {
|
|
56425
56741
|
case "windows":
|
|
56426
56742
|
return hotkeyLabel.windows;
|
|
56427
56743
|
case "macos":
|
|
@@ -58398,7 +58714,7 @@ class SpatialIndex {
|
|
|
58398
58714
|
this.itemsArray.push(item);
|
|
58399
58715
|
this.itemsIndex.insert(item);
|
|
58400
58716
|
}
|
|
58401
|
-
if (
|
|
58717
|
+
if (conf.isNode()) {
|
|
58402
58718
|
return;
|
|
58403
58719
|
}
|
|
58404
58720
|
if (this.Mbr.getWidth() === 0 && this.Mbr.getHeight() === 0) {
|
|
@@ -59927,7 +60243,7 @@ class Transformer extends Tool {
|
|
|
59927
60243
|
const isLockedItems = this.selection.getIsLockedSelection();
|
|
59928
60244
|
if (mbr) {
|
|
59929
60245
|
mbr.strokeWidth = 1 / context.matrix.scaleX;
|
|
59930
|
-
const selectionColor = isLockedItems ?
|
|
60246
|
+
const selectionColor = isLockedItems ? conf.SELECTION_LOCKED_COLOR : conf.SELECTION_COLOR;
|
|
59931
60247
|
mbr.borderColor = selectionColor;
|
|
59932
60248
|
mbr.render(context);
|
|
59933
60249
|
}
|
|
@@ -59953,7 +60269,7 @@ class Transformer extends Tool {
|
|
|
59953
60269
|
new Point(right, bottom)
|
|
59954
60270
|
];
|
|
59955
60271
|
for (const point7 of points) {
|
|
59956
|
-
const circle = new Anchor(point7.x, point7.y,
|
|
60272
|
+
const circle = new Anchor(point7.x, point7.y, conf.SELECTION_ANCHOR_RADIUS, conf.SELECTION_COLOR, conf.SELECTION_ANCHOR_COLOR, conf.SELECTION_ANCHOR_WIDTH);
|
|
59957
60273
|
anchors.push(circle);
|
|
59958
60274
|
}
|
|
59959
60275
|
}
|
|
@@ -60440,16 +60756,16 @@ class BoardSelection {
|
|
|
60440
60756
|
}
|
|
60441
60757
|
}
|
|
60442
60758
|
const textItem = item.getRichText()?.getTextString();
|
|
60443
|
-
const copyText = i18n.t("frame.copy");
|
|
60759
|
+
const copyText = conf.i18n.t("frame.copy");
|
|
60444
60760
|
const isCopyTextExist = textItem?.includes(copyText);
|
|
60445
60761
|
const isChangeCopiedFrameText = item.itemType === "Frame" && serializedData.itemType === "Frame" && textItem !== "" && !isCopyTextExist;
|
|
60446
60762
|
if (isChangeCopiedFrameText) {
|
|
60447
60763
|
const copiedFrameText = copyText + (textItem || serializedData.text?.placeholderText);
|
|
60448
|
-
item.
|
|
60449
|
-
item.
|
|
60450
|
-
serializedData.text = item.
|
|
60451
|
-
item.
|
|
60452
|
-
item.
|
|
60764
|
+
item.getRichText()?.editor.clearText();
|
|
60765
|
+
item.getRichText()?.editor.addText(copiedFrameText);
|
|
60766
|
+
serializedData.text = item.getRichText()?.serialize();
|
|
60767
|
+
item.getRichText()?.editor.clearText();
|
|
60768
|
+
item.getRichText()?.editor.addText(textItem || "");
|
|
60453
60769
|
}
|
|
60454
60770
|
copiedItemsMap[item.getId()] = { ...serializedData, zIndex };
|
|
60455
60771
|
}
|
|
@@ -61154,7 +61470,7 @@ class BoardSelection {
|
|
|
61154
61470
|
renderItemMbr(context, item, customScale) {
|
|
61155
61471
|
const mbr = item.getMbr();
|
|
61156
61472
|
mbr.strokeWidth = !customScale ? 1 / context.matrix.scaleX : 1 / customScale;
|
|
61157
|
-
const selectionColor = item.transformation.isLocked ?
|
|
61473
|
+
const selectionColor = item.transformation.isLocked ? conf.SELECTION_LOCKED_COLOR : conf.SELECTION_COLOR;
|
|
61158
61474
|
mbr.borderColor = selectionColor;
|
|
61159
61475
|
mbr.render(context);
|
|
61160
61476
|
}
|
|
@@ -61601,7 +61917,7 @@ class Board {
|
|
|
61601
61917
|
const loadLinksImagesScript = LOAD_LINKS_IMAGES_JS;
|
|
61602
61918
|
const css = INDEX_CSS;
|
|
61603
61919
|
const boardName = this.getName() || this.getBoardId();
|
|
61604
|
-
const items = this.items.getWholeHTML(
|
|
61920
|
+
const items = this.items.getWholeHTML(conf.documentFactory);
|
|
61605
61921
|
const itemsDiv = `<div id="items">${items}</div>`;
|
|
61606
61922
|
const scripts = `
|
|
61607
61923
|
<script type="module">${customTagsScript}</script>
|
|
@@ -61641,7 +61957,7 @@ class Board {
|
|
|
61641
61957
|
return `${head}${body}`;
|
|
61642
61958
|
}
|
|
61643
61959
|
deserializeHTMLAndEmit(stringedHTML) {
|
|
61644
|
-
const parser =
|
|
61960
|
+
const parser = conf.getDOMParser();
|
|
61645
61961
|
const doc = parser.parseFromString(stringedHTML, "text/html");
|
|
61646
61962
|
const items = doc.body.querySelector("#items");
|
|
61647
61963
|
if (items) {
|
|
@@ -61693,7 +62009,7 @@ class Board {
|
|
|
61693
62009
|
return [];
|
|
61694
62010
|
}
|
|
61695
62011
|
deserializeHTML(stringedHTML) {
|
|
61696
|
-
const parser =
|
|
62012
|
+
const parser = conf.getDOMParser();
|
|
61697
62013
|
const doc = parser.parseFromString(stringedHTML, "text/html");
|
|
61698
62014
|
const itemsDiv = doc.body.querySelector("#items");
|
|
61699
62015
|
if (!itemsDiv) {
|
|
@@ -62832,19 +63148,19 @@ function removeNode_removeNode(confirmed, toTransform) {
|
|
|
62832
63148
|
// src/Events/Transform/splitNode_insertNode.ts
|
|
62833
63149
|
function splitNode_insertNode(confirmed, toTransform) {
|
|
62834
63150
|
const transformed = { ...toTransform };
|
|
62835
|
-
const
|
|
63151
|
+
const conf2 = confirmed.path;
|
|
62836
63152
|
const path4 = transformed.path;
|
|
62837
|
-
if (Path3.equals(
|
|
63153
|
+
if (Path3.equals(conf2, path4)) {
|
|
62838
63154
|
return transformed;
|
|
62839
63155
|
}
|
|
62840
|
-
const isDescendant = path4.length >
|
|
63156
|
+
const isDescendant = path4.length > conf2.length && path4.slice(0, conf2.length).every((seg, i) => seg === conf2[i]);
|
|
62841
63157
|
if (isDescendant) {
|
|
62842
63158
|
const newPath = [...path4];
|
|
62843
63159
|
newPath[0] = newPath[0] + 1;
|
|
62844
63160
|
transformed.path = newPath;
|
|
62845
63161
|
return transformed;
|
|
62846
63162
|
}
|
|
62847
|
-
if (Path3.isBefore(
|
|
63163
|
+
if (Path3.isBefore(conf2, path4)) {
|
|
62848
63164
|
transformPath(confirmed, transformed);
|
|
62849
63165
|
}
|
|
62850
63166
|
return transformed;
|
|
@@ -62853,23 +63169,23 @@ function splitNode_insertNode(confirmed, toTransform) {
|
|
|
62853
63169
|
// src/Events/Transform/splitNode_removeNode.ts
|
|
62854
63170
|
function splitNode_removeNode(confirmed, toTransform) {
|
|
62855
63171
|
const transformed = { ...toTransform };
|
|
62856
|
-
const
|
|
63172
|
+
const conf2 = confirmed.path;
|
|
62857
63173
|
const path4 = transformed.path;
|
|
62858
|
-
if (Path3.equals(
|
|
63174
|
+
if (Path3.equals(conf2, path4)) {
|
|
62859
63175
|
return transformed;
|
|
62860
63176
|
}
|
|
62861
|
-
if (path4.length ===
|
|
63177
|
+
if (path4.length === conf2.length + 1 && path4.slice(0, conf2.length).every((seg, i) => seg === conf2[i])) {
|
|
62862
63178
|
const newPath = [...path4];
|
|
62863
|
-
if (
|
|
63179
|
+
if (conf2.length === 1) {
|
|
62864
63180
|
newPath[0] = newPath[0] + 1;
|
|
62865
63181
|
} else {
|
|
62866
|
-
newPath[
|
|
63182
|
+
newPath[conf2.length] = newPath[conf2.length] + 1;
|
|
62867
63183
|
}
|
|
62868
63184
|
transformed.path = newPath;
|
|
62869
63185
|
return transformed;
|
|
62870
63186
|
}
|
|
62871
|
-
const isDescendant = path4.length >
|
|
62872
|
-
if (Path3.isBefore(
|
|
63187
|
+
const isDescendant = path4.length > conf2.length && path4.slice(0, conf2.length).every((seg, i) => seg === conf2[i]);
|
|
63188
|
+
if (Path3.isBefore(conf2, path4) && !isDescendant) {
|
|
62873
63189
|
transformPath(confirmed, transformed);
|
|
62874
63190
|
}
|
|
62875
63191
|
return transformed;
|
|
@@ -63449,8 +63765,8 @@ function transformEvents(confirmed, toTransform) {
|
|
|
63449
63765
|
const transformed = [];
|
|
63450
63766
|
for (const transf of toTransform) {
|
|
63451
63767
|
let actualyTransformed = { ...transf };
|
|
63452
|
-
for (const
|
|
63453
|
-
const { operation: confOp } =
|
|
63768
|
+
for (const conf2 of confirmed) {
|
|
63769
|
+
const { operation: confOp } = conf2.body;
|
|
63454
63770
|
const { operation: transfOp } = actualyTransformed.body;
|
|
63455
63771
|
const transformedOp = transfromOperation(confOp, transfOp);
|
|
63456
63772
|
if (transformedOp) {
|
|
@@ -64082,7 +64398,7 @@ class Events2 {
|
|
|
64082
64398
|
return record !== null;
|
|
64083
64399
|
}
|
|
64084
64400
|
sendPresenceEvent(event) {
|
|
64085
|
-
|
|
64401
|
+
conf.connection.publishPresenceEvent(this.board.getBoardId(), event);
|
|
64086
64402
|
}
|
|
64087
64403
|
canUndoEvent(op, byUserId) {
|
|
64088
64404
|
if (op.method === "undo") {
|
|
@@ -64183,9 +64499,9 @@ function handleChatChunk(chunk, board) {
|
|
|
64183
64499
|
default:
|
|
64184
64500
|
board.camera.unsubscribeFromItem();
|
|
64185
64501
|
if (!chunk.isExternalApiError) {
|
|
64186
|
-
|
|
64187
|
-
header:
|
|
64188
|
-
body:
|
|
64502
|
+
conf.notify({
|
|
64503
|
+
header: conf.i18n.t("AIInput.textGenerationError.header"),
|
|
64504
|
+
body: conf.i18n.t("AIInput.textGenerationError.body"),
|
|
64189
64505
|
variant: "error",
|
|
64190
64506
|
duration: 4000
|
|
64191
64507
|
});
|
|
@@ -64200,7 +64516,7 @@ function handleChatChunk(chunk, board) {
|
|
|
64200
64516
|
editor.markdownProcessor.setStopProcessingMarkDownCb(null);
|
|
64201
64517
|
if (chunk.isExternalApiError) {
|
|
64202
64518
|
editor.clearText();
|
|
64203
|
-
editor.insertCopiedText(
|
|
64519
|
+
editor.insertCopiedText(conf.i18n.t("AIInput.nodeErrorText"));
|
|
64204
64520
|
}
|
|
64205
64521
|
}
|
|
64206
64522
|
board.camera.zoomToFit(item2.getMbr(), 20);
|
|
@@ -64227,7 +64543,7 @@ function handleAudioGenerate(response, board) {
|
|
|
64227
64543
|
}
|
|
64228
64544
|
const audio = new AudioItem(board, true, audioUrl2, board.events, "", "wav");
|
|
64229
64545
|
const { left, top, right } = placeholderNode.getMbr();
|
|
64230
|
-
audio.transformation.applyTranslateTo(left + (right - left -
|
|
64546
|
+
audio.transformation.applyTranslateTo(left + (right - left - conf.AUDIO_DIMENSIONS.width) / 2, top);
|
|
64231
64547
|
audio.updateMbr();
|
|
64232
64548
|
const threadDirection = placeholderNode.getThreadDirection();
|
|
64233
64549
|
board.remove(placeholderNode, false);
|
|
@@ -64249,7 +64565,7 @@ function handleAudioGenerate(response, board) {
|
|
|
64249
64565
|
type: "audio/wav"
|
|
64250
64566
|
});
|
|
64251
64567
|
const audioUrl2 = URL.createObjectURL(audioBlob);
|
|
64252
|
-
const linkElem =
|
|
64568
|
+
const linkElem = conf.documentFactory.createElement("a");
|
|
64253
64569
|
linkElem.href = audioUrl2;
|
|
64254
64570
|
linkElem.setAttribute("download", `${board.getBoardId()}-generated.wav`);
|
|
64255
64571
|
linkElem.click();
|
|
@@ -64268,9 +64584,9 @@ function handleAudioGenerate(response, board) {
|
|
|
64268
64584
|
board.selection.add(placeholderNode);
|
|
64269
64585
|
}
|
|
64270
64586
|
console.error("Audio generation error:", response.message);
|
|
64271
|
-
|
|
64272
|
-
header:
|
|
64273
|
-
body:
|
|
64587
|
+
conf.notify({
|
|
64588
|
+
header: conf.i18n.t("AIInput.audioGenerationError.header"),
|
|
64589
|
+
body: conf.i18n.t("AIInput.audioGenerationError.body"),
|
|
64274
64590
|
variant: "error",
|
|
64275
64591
|
duration: 4000
|
|
64276
64592
|
});
|
|
@@ -64333,14 +64649,14 @@ function handleImageGenerate(response, board) {
|
|
|
64333
64649
|
board.selection.add(item);
|
|
64334
64650
|
const editor = item.getRichText()?.editor;
|
|
64335
64651
|
editor?.clearText();
|
|
64336
|
-
editor?.insertCopiedText(
|
|
64652
|
+
editor?.insertCopiedText(conf.i18n.t("AIInput.nodeErrorText"));
|
|
64337
64653
|
board.camera.zoomToFit(item.getMbr(), 20);
|
|
64338
64654
|
}
|
|
64339
64655
|
}
|
|
64340
64656
|
} else {
|
|
64341
|
-
|
|
64342
|
-
header:
|
|
64343
|
-
body:
|
|
64657
|
+
conf.notify({
|
|
64658
|
+
header: conf.i18n.t("AIInput.imageGenerationError.header"),
|
|
64659
|
+
body: conf.i18n.t("AIInput.imageGenerationError.body"),
|
|
64344
64660
|
variant: "error",
|
|
64345
64661
|
duration: 4000
|
|
64346
64662
|
});
|
|
@@ -64407,10 +64723,10 @@ function startIntervals(board) {
|
|
|
64407
64723
|
}
|
|
64408
64724
|
log.publishIntervalTimer = setInterval(() => {
|
|
64409
64725
|
tryPublishEvent(board);
|
|
64410
|
-
},
|
|
64726
|
+
}, conf.EVENTS_PUBLISH_INTERVAL);
|
|
64411
64727
|
log.resendIntervalTimer = setInterval(() => {
|
|
64412
64728
|
tryResendEvent(board);
|
|
64413
|
-
},
|
|
64729
|
+
}, conf.EVENTS_RESEND_INTERVAL);
|
|
64414
64730
|
}
|
|
64415
64731
|
function tryPublishEvent(board) {
|
|
64416
64732
|
const { log } = board.events;
|
|
@@ -64429,14 +64745,14 @@ function tryResendEvent(board) {
|
|
|
64429
64745
|
return;
|
|
64430
64746
|
}
|
|
64431
64747
|
const date = Date.now();
|
|
64432
|
-
const isTimeToSendPendingEvent = date - log.pendingEvent.lastSentTime >=
|
|
64748
|
+
const isTimeToSendPendingEvent = date - log.pendingEvent.lastSentTime >= conf.EVENTS_RESEND_INTERVAL;
|
|
64433
64749
|
if (!isTimeToSendPendingEvent) {
|
|
64434
64750
|
return;
|
|
64435
64751
|
}
|
|
64436
|
-
const isProbablyLostConnection = log.firstSentTime && date - log.firstSentTime >=
|
|
64752
|
+
const isProbablyLostConnection = log.firstSentTime && date - log.firstSentTime >= conf.EVENTS_RESEND_INTERVAL * 5;
|
|
64437
64753
|
if (isProbablyLostConnection) {
|
|
64438
64754
|
board.presence.clear();
|
|
64439
|
-
|
|
64755
|
+
conf.connection?.notifyAboutLostConnection();
|
|
64440
64756
|
}
|
|
64441
64757
|
sendBoardEvent(board, log.pendingEvent.event, log.currentSequenceNumber);
|
|
64442
64758
|
}
|
|
@@ -64467,12 +64783,12 @@ function sendBoardEvent(board, event, sequenceNumber) {
|
|
|
64467
64783
|
lastKnownOrder: log.getLastIndex()
|
|
64468
64784
|
}
|
|
64469
64785
|
};
|
|
64470
|
-
|
|
64786
|
+
conf.connection.send({
|
|
64471
64787
|
type: "BoardEvent",
|
|
64472
64788
|
boardId: board.getBoardId(),
|
|
64473
64789
|
event: toSend,
|
|
64474
64790
|
sequenceNumber,
|
|
64475
|
-
userId:
|
|
64791
|
+
userId: conf.connection.getCurrentUser()
|
|
64476
64792
|
});
|
|
64477
64793
|
const date = Date.now();
|
|
64478
64794
|
log.pendingEvent = {
|
|
@@ -64518,7 +64834,7 @@ function handleConfirmation(msg2, board) {
|
|
|
64518
64834
|
if (!isPendingEventConfirmation) {
|
|
64519
64835
|
return;
|
|
64520
64836
|
}
|
|
64521
|
-
|
|
64837
|
+
conf.connection?.dismissNotificationAboutLostConnection();
|
|
64522
64838
|
log.currentSequenceNumber++;
|
|
64523
64839
|
log.pendingEvent.event.order = msg2.order;
|
|
64524
64840
|
log.confirmSentLocalEvent(log.pendingEvent.event);
|
|
@@ -64530,7 +64846,7 @@ function handleConfirmation(msg2, board) {
|
|
|
64530
64846
|
// src/Events/MessageRouter/handleCreateSnapshotRequestMessage.ts
|
|
64531
64847
|
function handleCreateSnapshotRequestMessage(msg2, board) {
|
|
64532
64848
|
const { boardId, snapshot, lastOrder } = getSnapshotToPublish(board);
|
|
64533
|
-
|
|
64849
|
+
conf.connection.send({
|
|
64534
64850
|
type: "BoardSnapshot",
|
|
64535
64851
|
boardId,
|
|
64536
64852
|
snapshot,
|
|
@@ -64561,9 +64877,9 @@ function handleModeMessage(message, board) {
|
|
|
64561
64877
|
if (isTemplateView()) {
|
|
64562
64878
|
return;
|
|
64563
64879
|
}
|
|
64564
|
-
|
|
64565
|
-
header:
|
|
64566
|
-
body: message.mode === "edit" ?
|
|
64880
|
+
conf.notify({
|
|
64881
|
+
header: conf.i18n.t("sharing.settingsChanged.heading"),
|
|
64882
|
+
body: message.mode === "edit" ? conf.i18n.t("sharing.settingsChanged.bodyEdit") : conf.i18n.t("sharing.settingsChanged.bodyView"),
|
|
64567
64883
|
duration: 5000
|
|
64568
64884
|
});
|
|
64569
64885
|
}
|
|
@@ -64599,8 +64915,8 @@ messageRouter.addHandler("PresenceEvent", handlePresenceEventMessage);
|
|
|
64599
64915
|
messageRouter.addHandler("UserJoin", handleUserJoinMessage);
|
|
64600
64916
|
// src/api/initI18N.ts
|
|
64601
64917
|
function initI18N(i18nInstance) {
|
|
64602
|
-
|
|
64603
|
-
|
|
64918
|
+
conf.i18n = i18nInstance;
|
|
64919
|
+
conf.planNames = {
|
|
64604
64920
|
basic: i18nInstance.t("userPlan.plans.basic.name"),
|
|
64605
64921
|
plus: i18nInstance.t("userPlan.plans.plus.name")
|
|
64606
64922
|
};
|
|
@@ -64609,7 +64925,7 @@ function initI18N(i18nInstance) {
|
|
|
64609
64925
|
// src/api/getMeasureCtx.ts
|
|
64610
64926
|
function getMeasureCtx() {
|
|
64611
64927
|
if (typeof document !== "undefined") {
|
|
64612
|
-
const measureCanvas =
|
|
64928
|
+
const measureCanvas = conf.documentFactory.createElement("canvas");
|
|
64613
64929
|
const measureCtx = measureCanvas.getContext("2d");
|
|
64614
64930
|
if (!measureCtx) {
|
|
64615
64931
|
throw new Error("Failde to create canvas and get 2d context");
|
|
@@ -64630,7 +64946,7 @@ function getBrowserDOMParser() {
|
|
|
64630
64946
|
|
|
64631
64947
|
// src/api/initPaths.ts
|
|
64632
64948
|
function initPaths(path2D) {
|
|
64633
|
-
|
|
64949
|
+
conf.EXPORT_FRAME_DECORATIONS = {
|
|
64634
64950
|
"top-left": {
|
|
64635
64951
|
path: new path2D("M13 1H1V13"),
|
|
64636
64952
|
lineWidth: 2,
|
|
@@ -64672,22 +64988,22 @@ function initPaths(path2D) {
|
|
|
64672
64988
|
|
|
64673
64989
|
// src/api/initBrowserSettings.ts
|
|
64674
64990
|
function initBrowserSettings() {
|
|
64675
|
-
|
|
64676
|
-
|
|
64677
|
-
|
|
64678
|
-
|
|
64679
|
-
|
|
64680
|
-
|
|
64681
|
-
|
|
64991
|
+
conf.documentFactory = new BrowserDocumentFactory;
|
|
64992
|
+
conf.path2DFactory = BrowserPath2D;
|
|
64993
|
+
conf.measureCtx = getMeasureCtx();
|
|
64994
|
+
conf.getDocumentWidth = () => document.documentElement.clientWidth;
|
|
64995
|
+
conf.getDocumentHeight = () => document.documentElement.clientHeight;
|
|
64996
|
+
conf.getDPI = () => window.devicePixelRatio;
|
|
64997
|
+
conf.getDOMParser = getBrowserDOMParser;
|
|
64682
64998
|
initPaths(BrowserPath2D);
|
|
64683
|
-
|
|
64999
|
+
conf.reactEditorFocus = (editor) => {
|
|
64684
65000
|
try {
|
|
64685
65001
|
ReactEditor.focus(editor);
|
|
64686
65002
|
} catch (e) {
|
|
64687
65003
|
console.warn("Failed to focus editor:", e);
|
|
64688
65004
|
}
|
|
64689
65005
|
};
|
|
64690
|
-
|
|
65006
|
+
conf.reactEditorToSlatePoint = (editor, domNode, offset, options) => {
|
|
64691
65007
|
try {
|
|
64692
65008
|
return ReactEditor.toSlatePoint(editor, [domNode, offset], options);
|
|
64693
65009
|
} catch (e) {
|
|
@@ -64695,7 +65011,7 @@ function initBrowserSettings() {
|
|
|
64695
65011
|
return null;
|
|
64696
65012
|
}
|
|
64697
65013
|
};
|
|
64698
|
-
return
|
|
65014
|
+
return conf;
|
|
64699
65015
|
}
|
|
64700
65016
|
|
|
64701
65017
|
// src/browser.ts
|