fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-10-02 04:58:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Implement the Text Tool and text layer MVP (#492)

Browse Source 
* Add text tool

* Double click with the select tool to edit text

* Fix (I think?) transitioning to select tool

* Commit and abort text editing

* Transition to a contenteditable div and autosize

* Fix right click blocking

* Cleanup hints

* Ctrl + enter leaves text edit mode

* Render indervidual bounding boxes for text

* Re-format space indents

* Reflect font size in the textarea

* Fix change tool behaviour

* Remove starting text

* Populate the cache (caused doc load bug)

* Remove console log

* Chrome display the flashing text entry cursor

* Update overlay on input

* Cleanup input.ts

* Fix bounding boxes

* Apply review feedback

* Remove manual test

* Remove svg from gitignore

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
0HyperCube
2022-01-30 15:10:10 +00:00
committed by Keavon Chambers
co-authored by Keavon Chambers
parent 0da8dabba9
commit a66920aa1c
33 changed files with 1152 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/dispatcher/js-messages.ts
+17 -1
View File
@@ -201,7 +201,7 @@ export class UpdateDocumentRulers extends JsMessage {
readonly interval!: number;
}
export type MouseCursorIcon = "default" | "zoom-in" | "zoom-out" | "grabbing" | "crosshair";
export type MouseCursorIcon = "default" | "zoom-in" | "zoom-out" | "grabbing" | "crosshair" | "text";
const ToCssCursorProperty = Transform(({ value }) => {
const cssNames: Record<string, MouseCursorIcon> = {
@@ -209,6 +209,7 @@ const ToCssCursorProperty = Transform(({ value }) => {
ZoomOut: "zoom-out",
Grabbing: "grabbing",
Crosshair: "crosshair",
Text: "text",
};
return cssNames[value] || "default";
@@ -294,6 +295,16 @@ export function newDisplayDocumentLayerTreeStructure(input: { data_buffer: DataB
return currentFolder;
}
export class DisplayEditableTextbox extends JsMessage {
readonly text!: string;
readonly line_width!: undefined | number;
readonly font_size!: number;
}
export class DisplayRemoveEditableTextbox extends JsMessage {}
export class UpdateDocumentLayer extends JsMessage {
@Type(() => LayerPanelEntry)
readonly data!: LayerPanelEntry;
@@ -375,6 +386,8 @@ export class TriggerIndexedDbRemoveDocument extends JsMessage {
document_id!: string;
}
export class TriggerTextCommit extends JsMessage {}
// Any is used since the type of the object should be known from the rust side
// eslint-disable-next-line @typescript-eslint/no-explicit-any
type JSMessageFactory = (data: any, wasm: WasmInstance, instance: RustEditorInstance) => JsMessage;
@@ -388,6 +401,8 @@ export const messageConstructors: Record<string, MessageMaker> = {
TriggerFileDownload,
TriggerFileUpload,
DisplayDocumentLayerTreeStructure: newDisplayDocumentLayerTreeStructure,
DisplayEditableTextbox,
DisplayRemoveEditableTextbox,
UpdateDocumentLayer,
UpdateActiveTool,
UpdateActiveDocument,
@@ -404,6 +419,7 @@ export const messageConstructors: Record<string, MessageMaker> = {
DisplayDialogAboutGraphite,
TriggerIndexedDbWriteDocument,
TriggerIndexedDbRemoveDocument,
TriggerTextCommit,
UpdateDocumentArtboards,
} as const;
export type JsMessageType = keyof typeof messageConstructors;