smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: support collaboration in bound text (#4573)

Browse source 
* fix: support collaboration in bounded text

* align implementation irrespective of collab/submit

* don't wrap when submitted

* fix

* tests: exit editor via ESCAPE instead to remove async hacks

* simplify and remove dead comment

* remove mutating coords in submit since its taken care in updateWysiwygStyle

Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Aakansha Doshi 2022-01-17 17:35:35 +05:30 • committed by GitHub
parent 0850ab0dd0
commit 24bf4cb5fb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 56 additions and 82 deletions
Download patch file Download diff file Expand all files Collapse all files

80
src/element/textWysiwyg.tsx
View file

@ -8,7 +8,11 @@ import {
import Scene from "../scene/Scene";
import { isBoundToContainer, isTextElement } from "./typeChecks";
import { CLASSES, BOUND_TEXT_PADDING } from "../constants";
import { ExcalidrawElement, ExcalidrawTextElement } from "./types";
import {
ExcalidrawElement,
ExcalidrawTextElement,
ExcalidrawLinearElement,
} from "./types";
import { AppState } from "../types";
import { mutateElement } from "./mutateElement";
import {
@ -100,7 +104,6 @@ export const textWysiwyg = ({
let originalContainerHeight: number;
let approxLineHeight = getApproxLineHeight(getFontString(element));
const initialText = element.originalText;
const updateWysiwygStyle = () => {
const updatedElement = Scene.getScene(element)?.getElement(id);
if (updatedElement && isTextElement(updatedElement)) {
@ -222,6 +225,7 @@ export const textWysiwyg = ({
if (isTestEnv()) {
editable.style.fontFamily = getFontFamilyString(updatedElement);
}
mutateElement(updatedElement, { x: coordX, y: coordY });
}
};
@ -442,61 +446,41 @@ export const textWysiwyg = ({
// it'd get stuck in an infinite loop of blur→onSubmit after we re-focus the
// wysiwyg on update
cleanup();
const updateElement = Scene.getScene(element)?.getElement(element.id);
const updateElement = Scene.getScene(element)?.getElement(
element.id,
) as ExcalidrawTextElement;
if (!updateElement) {
return;
}
let wrappedText = "";
if (isTextElement(updateElement) && updateElement?.containerId) {
const container = getContainerElement(updateElement);
let text = editable.value;
const container = getContainerElement(updateElement);
if (container) {
wrappedText = wrapText(
editable.value,
getFontString(updateElement),
container.width,
);
if (updateElement.containerId) {
const editorHeight = Number(editable.style.height.slice(0, -2));
if (editable.value) {
// Don't mutate if text is not updated
if (initialText !== editable.value) {
mutateElement(updateElement, {
// vertically center align
y: container.y + container.height / 2 - editorHeight / 2,
height: editorHeight,
width: Number(editable.style.width.slice(0, -2)),
// preserve padding
x: container.x + BOUND_TEXT_PADDING,
angle: container.angle,
});
}
const boundTextElementId = getBoundTextElementId(container);
if (!boundTextElementId || boundTextElementId !== element.id) {
mutateElement(container, {
boundElements: (container.boundElements || []).concat({
type: "text",
id: element.id,
}),
});
}
} else {
mutateElement(container, {
boundElements: container.boundElements?.filter(
(ele) => ele.type !== "text",
),
});
}
if (container) {
text = updateElement.text;
if (editable.value) {
const boundTextElementId = getBoundTextElementId(container);
if (!boundTextElementId || boundTextElementId !== element.id) {
mutateElement(container, {
boundElements: (container.boundElements || []).concat({
type: "text",
id: element.id,
}),
});
}
} else {
mutateElement(container, {
boundElements: container.boundElements?.filter(
(ele) =>
!isTextElement(
ele as ExcalidrawTextElement | ExcalidrawLinearElement,
),
),
});
}
} else {
wrappedText = editable.value;
}
onSubmit({
text: normalizeText(wrappedText),
text,
viaKeyboard: submittedViaKeyboard,
originalText: editable.value,
});