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

rename

Browse Source
This commit is contained in:
Aakansha Doshi 2023-03-14 19:59:58 +05:30
parent 96c4cff805
commit 15f19835fe
7 changed files with 41 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/element/newElement.ts
View File

@ -28,7 +28,7 @@ import {
measureText, measureText,
normalizeText, normalizeText,
wrapText, wrapText,
getContainerMaxWidth, getBoundTextMaxWidth,
} from "./textElement"; } from "./textElement";
import { VERTICAL_ALIGN } from "../constants"; import { VERTICAL_ALIGN } from "../constants";
import { isArrowElement } from "./typeChecks"; import { isArrowElement } from "./typeChecks";
@ -261,7 +261,7 @@ export const refreshTextDimensions = (
text = wrapText( text = wrapText(
text, text,
getFontString(textElement), getFontString(textElement),
getContainerMaxWidth(container), getBoundTextMaxWidth(container),
); );
} }
const dimensions = getAdjustedDimensions(textElement, text); const dimensions = getAdjustedDimensions(textElement, text);

8
src/element/resizeElements.ts
View File

@ -45,7 +45,7 @@ import {
getBoundTextElementId, getBoundTextElementId,
getContainerElement, getContainerElement,
handleBindTextResize, handleBindTextResize,
getContainerMaxWidth, getBoundTextMaxWidth,
} from "./textElement"; } from "./textElement";
export const normalizeAngle = (angle: number): number => { export const normalizeAngle = (angle: number): number => {
@ -201,7 +201,7 @@ const measureFontSizeFromWidth = (
if (hasContainer) { if (hasContainer) {
const container = getContainerElement(element); const container = getContainerElement(element);
if (container) { if (container) {
width = getContainerMaxWidth(container); width = getBoundTextMaxWidth(container);
} }
} }
const nextFontSize = element.fontSize * (nextWidth / width); const nextFontSize = element.fontSize * (nextWidth / width);
@ -423,7 +423,7 @@ export const resizeSingleElement = (
const nextFontSize = measureFontSizeFromWidth( const nextFontSize = measureFontSizeFromWidth(
boundTextElement, boundTextElement,
getContainerMaxWidth(updatedElement), getBoundTextMaxWidth(updatedElement),
); );
if (nextFontSize === null) { if (nextFontSize === null) {
return; return;
@ -694,7 +694,7 @@ const resizeMultipleElements = (
const fontSize = measureFontSizeFromWidth( const fontSize = measureFontSizeFromWidth(
boundTextElement ?? (element.orig as ExcalidrawTextElement), boundTextElement ?? (element.orig as ExcalidrawTextElement),
boundTextElement boundTextElement
? getContainerMaxWidth(updatedElement) ? getBoundTextMaxWidth(updatedElement)
: updatedElement.width, : updatedElement.width,
); );

26
src/element/textElement.test.ts
View File

@ -3,8 +3,8 @@ import { API } from "../tests/helpers/api";
import { import {
computeContainerDimensionForBoundText, computeContainerDimensionForBoundText,
getContainerCoords, getContainerCoords,
getContainerMaxWidth, getBoundTextMaxWidth,
getContainerMaxHeight, getBoundTextMaxHeight,
wrapText, wrapText,
} from "./textElement"; } from "./textElement";
import { ExcalidrawTextElementWithContainer, FontString } from "./types"; import { ExcalidrawTextElementWithContainer, FontString } from "./types";
@ -261,7 +261,7 @@ describe("Test measureText", () => {
}); });
}); });
describe("Test getContainerMaxWidth", () => { describe("Test getBoundTextMaxWidth", () => {
const params = { const params = {
width: 178, width: 178,
height: 194, height: 194,
@ -269,17 +269,17 @@ describe("Test measureText", () => {
it("should return max width when container is rectangle", () => { it("should return max width when container is rectangle", () => {
const container = API.createElement({ type: "rectangle", ...params }); const container = API.createElement({ type: "rectangle", ...params });
expect(getContainerMaxWidth(container)).toBe(168); expect(getBoundTextMaxWidth(container)).toBe(168);
}); });
it("should return max width when container is ellipse", () => { it("should return max width when container is ellipse", () => {
const container = API.createElement({ type: "ellipse", ...params }); const container = API.createElement({ type: "ellipse", ...params });
expect(getContainerMaxWidth(container)).toBe(116); expect(getBoundTextMaxWidth(container)).toBe(116);
}); });
it("should return max width when container is diamond", () => { it("should return max width when container is diamond", () => {
const container = API.createElement({ type: "diamond", ...params }); const container = API.createElement({ type: "diamond", ...params });
expect(getContainerMaxWidth(container)).toBe(79); expect(getBoundTextMaxWidth(container)).toBe(79);
}); });
it("should return max width when container is arrow", () => { it("should return max width when container is arrow", () => {
@ -287,11 +287,11 @@ describe("Test measureText", () => {
type: "arrow", type: "arrow",
...params, ...params,
}); });
expect(getContainerMaxWidth(container)).toBe(220); expect(getBoundTextMaxWidth(container)).toBe(220);
}); });
}); });
describe("Test getContainerMaxHeight", () => { describe("Test getBoundTextMaxHeight", () => {
const params = { const params = {
width: 178, width: 178,
height: 194, height: 194,
@ -315,17 +315,17 @@ describe("Test measureText", () => {
it("should return max height when container is rectangle", () => { it("should return max height when container is rectangle", () => {
const container = API.createElement({ type: "rectangle", ...params }); const container = API.createElement({ type: "rectangle", ...params });
expect(getContainerMaxHeight(container, boundTextElement)).toBe(184); expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(184);
}); });
it("should return max height when container is ellipse", () => { it("should return max height when container is ellipse", () => {
const container = API.createElement({ type: "ellipse", ...params }); const container = API.createElement({ type: "ellipse", ...params });
expect(getContainerMaxHeight(container, boundTextElement)).toBe(127); expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(127);
}); });
it("should return max height when container is diamond", () => { it("should return max height when container is diamond", () => {
const container = API.createElement({ type: "diamond", ...params }); const container = API.createElement({ type: "diamond", ...params });
expect(getContainerMaxHeight(container, boundTextElement)).toBe(87); expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(87);
}); });
it("should return max height when container is arrow", () => { it("should return max height when container is arrow", () => {
@ -333,7 +333,7 @@ describe("Test measureText", () => {
type: "arrow", type: "arrow",
...params, ...params,
}); });
expect(getContainerMaxHeight(container, boundTextElement)).toBe(194); expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(194);
}); });
it("should return max height when container is arrow and height is less than threshold", () => { it("should return max height when container is arrow and height is less than threshold", () => {
@ -344,7 +344,7 @@ describe("Test measureText", () => {
boundElements: [{ type: "text", id: "text-id" }], boundElements: [{ type: "text", id: "text-id" }],
}); });
expect(getContainerMaxHeight(container, boundTextElement)).toBe( expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(
boundTextElement.height, boundTextElement.height,
); );
}); });

16
src/element/textElement.ts
View File

@ -56,7 +56,7 @@ export const redrawTextBoundingBox = (
}; };
if (container) { if (container) {
maxWidth = getContainerMaxWidth(container); maxWidth = getBoundTextMaxWidth(container);
boundTextUpdates.text = wrapText( boundTextUpdates.text = wrapText(
textElement.originalText, textElement.originalText,
getFontString(textElement), getFontString(textElement),
@ -74,7 +74,7 @@ export const redrawTextBoundingBox = (
if (container) { if (container) {
const containerDims = getContainerDims(container); const containerDims = getContainerDims(container);
const maxContainerHeight = getContainerMaxHeight( const maxContainerHeight = getBoundTextMaxHeight(
container, container,
textElement as ExcalidrawTextElementWithContainer, textElement as ExcalidrawTextElementWithContainer,
); );
@ -167,8 +167,8 @@ export const handleBindTextResize = (
let nextHeight = textElement.height; let nextHeight = textElement.height;
let nextWidth = textElement.width; let nextWidth = textElement.width;
const containerDims = getContainerDims(container); const containerDims = getContainerDims(container);
const maxWidth = getContainerMaxWidth(container); const maxWidth = getBoundTextMaxWidth(container);
const maxHeight = getContainerMaxHeight( const maxHeight = getBoundTextMaxHeight(
container, container,
textElement as ExcalidrawTextElementWithContainer, textElement as ExcalidrawTextElementWithContainer,
); );
@ -230,8 +230,8 @@ export const computeBoundTextPosition = (
boundTextElement: ExcalidrawTextElementWithContainer, boundTextElement: ExcalidrawTextElementWithContainer,
) => { ) => {
const containerCoords = getContainerCoords(container); const containerCoords = getContainerCoords(container);
const maxContainerHeight = getContainerMaxHeight(container, boundTextElement); const maxContainerHeight = getBoundTextMaxHeight(container, boundTextElement);
const maxContainerWidth = getContainerMaxWidth(container); const maxContainerWidth = getBoundTextMaxWidth(container);
let x; let x;
let y; let y;
@ -746,7 +746,7 @@ export const computeContainerDimensionForBoundText = (
return dimension + padding; return dimension + padding;
}; };
export const getContainerMaxWidth = (container: ExcalidrawElement) => { export const getBoundTextMaxWidth = (container: ExcalidrawElement) => {
const width = getContainerDims(container).width; const width = getContainerDims(container).width;
if (isArrowElement(container)) { if (isArrowElement(container)) {
return width - BOUND_TEXT_PADDING * 8 * 2; return width - BOUND_TEXT_PADDING * 8 * 2;
@ -766,7 +766,7 @@ export const getContainerMaxWidth = (container: ExcalidrawElement) => {
return width - BOUND_TEXT_PADDING * 2; return width - BOUND_TEXT_PADDING * 2;
}; };
export const getContainerMaxHeight = ( export const getBoundTextMaxHeight = (
container: ExcalidrawElement, container: ExcalidrawElement,
boundTextElement: ExcalidrawTextElementWithContainer, boundTextElement: ExcalidrawTextElementWithContainer,
) => { ) => {

12
src/element/textWysiwyg.tsx
View File

@ -32,8 +32,8 @@ import {
normalizeText, normalizeText,
redrawTextBoundingBox, redrawTextBoundingBox,
wrapText, wrapText,
getContainerMaxHeight, getBoundTextMaxHeight,
getContainerMaxWidth, getBoundTextMaxWidth,
computeBoundTextPosition, computeBoundTextPosition,
getTextHeight, getTextHeight,
} from "./textElement"; } from "./textElement";
@ -202,8 +202,8 @@ export const textWysiwyg = ({
} }
} }
maxWidth = getContainerMaxWidth(container); maxWidth = getBoundTextMaxWidth(container);
maxHeight = getContainerMaxHeight( maxHeight = getBoundTextMaxHeight(
container, container,
updatedTextElement as ExcalidrawTextElementWithContainer, updatedTextElement as ExcalidrawTextElementWithContainer,
); );
@ -348,7 +348,7 @@ export const textWysiwyg = ({
const wrappedText = wrapText( const wrappedText = wrapText(
`${editable.value}${data}`, `${editable.value}${data}`,
font, font,
getContainerMaxWidth(container), getBoundTextMaxWidth(container),
); );
const width = getTextWidth(wrappedText, font); const width = getTextWidth(wrappedText, font);
editable.style.width = `${width}px`; editable.style.width = `${width}px`;
@ -365,7 +365,7 @@ export const textWysiwyg = ({
const wrappedText = wrapText( const wrappedText = wrapText(
normalizeText(editable.value), normalizeText(editable.value),
font, font,
getContainerMaxWidth(container!), getBoundTextMaxWidth(container!),
); );
const { width, height } = measureText(wrappedText, font); const { width, height } = measureText(wrappedText, font);
editable.style.width = `${width}px`; editable.style.width = `${width}px`;

8
src/renderer/renderElement.ts
View File

@ -44,8 +44,8 @@ import {
getBoundTextElement, getBoundTextElement,
getContainerCoords, getContainerCoords,
getContainerElement, getContainerElement,
getContainerMaxHeight, getBoundTextMaxHeight,
getContainerMaxWidth, getBoundTextMaxWidth,
} from "../element/textElement"; } from "../element/textElement";
import { LinearElementEditor } from "../element/linearElementEditor"; import { LinearElementEditor } from "../element/linearElementEditor";
@ -829,8 +829,8 @@ const drawElementFromCanvas = (
context.strokeRect( context.strokeRect(
(coords.x + renderConfig.scrollX) * window.devicePixelRatio, (coords.x + renderConfig.scrollX) * window.devicePixelRatio,
(coords.y + renderConfig.scrollY) * window.devicePixelRatio, (coords.y + renderConfig.scrollY) * window.devicePixelRatio,
getContainerMaxWidth(element) * window.devicePixelRatio, getBoundTextMaxWidth(element) * window.devicePixelRatio,
getContainerMaxHeight(element, textElement) * window.devicePixelRatio, getBoundTextMaxHeight(element, textElement) * window.devicePixelRatio,
); );
} }
} }

8
src/tests/linearElementEditor.test.tsx
View File

@ -17,7 +17,7 @@ import { KEYS } from "../keys";
import { LinearElementEditor } from "../element/linearElementEditor"; import { LinearElementEditor } from "../element/linearElementEditor";
import { queryByTestId, queryByText } from "@testing-library/react"; import { queryByTestId, queryByText } from "@testing-library/react";
import { resize, rotate } from "./utils"; import { resize, rotate } from "./utils";
import { wrapText, getContainerMaxWidth } from "../element/textElement"; import { wrapText, getBoundTextMaxWidth } from "../element/textElement";
import * as textElementUtils from "../element/textElement"; import * as textElementUtils from "../element/textElement";
import { ROUNDNESS } from "../constants"; import { ROUNDNESS } from "../constants";
@ -725,7 +725,7 @@ describe("Test Linear Elements", () => {
type: "text", type: "text",
x: 0, x: 0,
y: 0, y: 0,
text: wrapText(text, font, getContainerMaxWidth(container)), text: wrapText(text, font, getBoundTextMaxWidth(container)),
containerId: container.id, containerId: container.id,
width: 30, width: 30,
height: 20, height: 20,
@ -1151,7 +1151,7 @@ describe("Test Linear Elements", () => {
expect(rect.x).toBe(400); expect(rect.x).toBe(400);
expect(rect.y).toBe(0); expect(rect.y).toBe(0);
expect( expect(
wrapText(textElement.originalText, font, getContainerMaxWidth(arrow)), wrapText(textElement.originalText, font, getBoundTextMaxWidth(arrow)),
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"Online whiteboard collaboration "Online whiteboard collaboration
made easy" made easy"
@ -1174,7 +1174,7 @@ describe("Test Linear Elements", () => {
false, false,
); );
expect( expect(
wrapText(textElement.originalText, font, getContainerMaxWidth(arrow)), wrapText(textElement.originalText, font, getBoundTextMaxWidth(arrow)),
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"Online whiteboard "Online whiteboard
collaboration made collaboration made