fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-25 16:58:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add embedable images (#564)

Browse Source 
* Add embedable bitmaps

* Initial work on blob urls

* Finish implementing data url

* Fix some bugs

* Rename bitmap to image

* Fix loading image on document load

* Add transform properties for image

* Remove some logging

* Add image dimensions

* Implement system copy and paste

* Fix pasting images

* Fix test

* Address code review

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
0HyperCube
2022-03-27 11:43:41 +01:00
committed by Keavon Chambers
co-authored by Keavon Chambers
parent 0ee492a857
commit 51c31f042b
23 changed files with 462 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lifetime/input.ts
+29
View File
@@ -26,6 +26,7 @@ export function createInputManager(editor: EditorState, container: HTMLElement,
{ target: window, eventName: "mousedown", action: (e: MouseEvent): void => onMouseDown(e) },
{ target: window, eventName: "wheel", action: (e: WheelEvent): void => onMouseScroll(e), options: { passive: false } },
{ target: window, eventName: "modifyinputfield", action: (e: CustomEvent): void => onModifyInputField(e) },
{ target: window.document.body, eventName: "paste", action: (e: ClipboardEvent): void => onPaste(e) },
];
let viewportPointerInteractionOngoing = false;
@@ -45,6 +46,9 @@ export function createInputManager(editor: EditorState, container: HTMLElement,
if (key !== "escape" && !(key === "enter" && e.ctrlKey) && target instanceof HTMLElement && (target.nodeName === "INPUT" || target.nodeName === "TEXTAREA" || target.isContentEditable))
return false;
// Don't redirect paste
if (key === "v" && e.ctrlKey) return false;
// Don't redirect a fullscreen request
if (key === "f11" && e.type === "keydown" && !e.repeat) {
e.preventDefault();
@@ -208,6 +212,31 @@ export function createInputManager(editor: EditorState, container: HTMLElement,
}
};
const onPaste = (e: ClipboardEvent): void => {
const dataTransfer = e.clipboardData;
if (!dataTransfer) return;
e.preventDefault();
Array.from(dataTransfer.items).forEach((item) => {
if (item.type === "text/plain") {
item.getAsString((text) => {
if (text.startsWith("graphite/layer: ")) {
editor.instance.paste_serialized_data(text.substring(16, text.length));
}
});
}
const file = item.getAsFile();
if (file && file.type.startsWith("image")) {
file.arrayBuffer().then((buffer): void => {
const u8Array = new Uint8Array(buffer);
editor.instance.paste_image(file.type, u8Array, undefined, undefined);
});
}
});
};
// Event bindings
const addListeners = (): void => {