foss/excalidraw
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

revert previous PRs

Browse Source
This commit is contained in:
dwelle 2021-03-12 18:34:51 +01:00
parent 3780a155f4
commit ba06565673
1 changed files with 4 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/element/textWysiwyg.tsx
View File

@ -21,18 +21,14 @@ const getTransform = (
height: number, height: number,
angle: number, angle: number,
appState: AppState, appState: AppState,
maxWidth: number,
) => { ) => {
const { zoom, offsetTop, offsetLeft } = appState; const { zoom, offsetTop, offsetLeft } = appState;
const degree = (180 * angle) / Math.PI; const degree = (180 * angle) / Math.PI;
// offsets must be multiplied by 2 to account for the division by 2 of // offsets must be multiplied by 2 to account for the division by 2 of
// the whole expression afterwards // the whole expression afterwards
let translateX = ((width - offsetLeft * 2) * (zoom.value - 1)) / 2; return `translate(${((width - offsetLeft * 2) * (zoom.value - 1)) / 2}px, ${
const translateY = ((height - offsetTop * 2) * (zoom.value - 1)) / 2; ((height - offsetTop * 2) * (zoom.value - 1)) / 2
if (width > maxWidth && zoom.value !== 1) { }px) scale(${zoom.value}) rotate(${degree}deg)`;
translateX = (maxWidth / 2) * (zoom.value - 1);
}
return `translate(${translateX}px, ${translateY}px) scale(${zoom.value}) rotate(${degree}deg)`;
}; };
export const textWysiwyg = ({ export const textWysiwyg = ({
@ -65,15 +61,6 @@ export const textWysiwyg = ({
const lines = updatedElement.text.replace(/\r\n?/g, "\n").split("\n"); const lines = updatedElement.text.replace(/\r\n?/g, "\n").split("\n");
const lineHeight = updatedElement.height / lines.length; const lineHeight = updatedElement.height / lines.length;
const maxWidth =
(appState.offsetLeft + appState.width - viewportX - 8) /
appState.zoom.value -
// margin-right of parent if any
Number(
getComputedStyle(
document.querySelector(".excalidraw")!.parentNode as Element,
).marginRight.slice(0, -2),
);
Object.assign(editable.style, { Object.assign(editable.style, {
font: getFontString(updatedElement), font: getFontString(updatedElement),
@ -88,13 +75,11 @@ export const textWysiwyg = ({
updatedElement.height, updatedElement.height,
angle, angle,
appState, appState,
maxWidth,
), ),
textAlign, textAlign,
color: updatedElement.strokeColor, color: updatedElement.strokeColor,
opacity: updatedElement.opacity / 100, opacity: updatedElement.opacity / 100,
filter: "var(--appearance-filter)", filter: "var(--appearance-filter)",
maxWidth: `${maxWidth}px`,
}); });
} }
}; };
@ -108,7 +93,7 @@ export const textWysiwyg = ({
editable.wrap = "off"; editable.wrap = "off";
Object.assign(editable.style, { Object.assign(editable.style, {
position: "absolute", position: "fixed",
display: "inline-block", display: "inline-block",
minHeight: "1em", minHeight: "1em",
backfaceVisibility: "hidden", backfaceVisibility: "hidden",