sambruk/excalidraw
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move copy paste handler to document (#334)

Browse Source 
Hopefully it should resolve the copy pasting issues

Fixes #249
This commit is contained in:
Christopher Chedeau 2020-01-11 21:39:16 -08:00 committed by GitHub
parent aad6e8f434
commit bc909b76da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 42 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
src/index.tsx
View File

@ -164,7 +164,44 @@ export class App extends React.Component<{}, AppState> {
} }
}; };
private onCut = (e: ClipboardEvent) => {
if (isInputLike(e.target)) return;
e.clipboardData?.setData(
"text/plain",
JSON.stringify(
elements
.filter(element => element.isSelected)
.map(({ shape, ...el }) => el)
)
);
elements = deleteSelectedElements(elements);
this.forceUpdate();
e.preventDefault();
};
private onCopy = (e: ClipboardEvent) => {
if (isInputLike(e.target)) return;
e.clipboardData?.setData(
"text/plain",
JSON.stringify(
elements
.filter(element => element.isSelected)
.map(({ shape, ...el }) => el)
)
);
e.preventDefault();
};
private onPaste = (e: ClipboardEvent) => {
if (isInputLike(e.target)) return;
const paste = e.clipboardData?.getData("text") || "";
this.addElementsFromPaste(paste);
e.preventDefault();
};
public componentDidMount() { public componentDidMount() {
document.addEventListener("copy", this.onCopy);
document.addEventListener("paste", this.onPaste);
document.addEventListener("cut", this.onCut);
document.addEventListener("keydown", this.onKeyDown, false); document.addEventListener("keydown", this.onKeyDown, false);
document.addEventListener("mousemove", this.getCurrentCursorPosition); document.addEventListener("mousemove", this.getCurrentCursorPosition);
window.addEventListener("resize", this.onResize, false); window.addEventListener("resize", this.onResize, false);
@ -183,6 +220,10 @@ export class App extends React.Component<{}, AppState> {
} }
public componentWillUnmount() { public componentWillUnmount() {
document.removeEventListener("copy", this.onCopy);
document.removeEventListener("paste", this.onPaste);
document.removeEventListener("cut", this.onCut);
document.removeEventListener("keydown", this.onKeyDown, false); document.removeEventListener("keydown", this.onKeyDown, false);
document.removeEventListener( document.removeEventListener(
"mousemove", "mousemove",
@ -292,41 +333,7 @@ export class App extends React.Component<{}, AppState> {
const canvasHeight = window.innerHeight - CANVAS_WINDOW_OFFSET_TOP; const canvasHeight = window.innerHeight - CANVAS_WINDOW_OFFSET_TOP;
return ( return (
<div <div className="container">
className="container"
onCut={e => {
if (isInputLike(e.target)) return;
e.clipboardData.setData(
"text/plain",
JSON.stringify(
elements
.filter(element => element.isSelected)
.map(({ shape, ...el }) => el)
)
);
elements = deleteSelectedElements(elements);
this.forceUpdate();
e.preventDefault();
}}
onCopy={e => {
if (isInputLike(e.target)) return;
e.clipboardData.setData(
"text/plain",
JSON.stringify(
elements
.filter(element => element.isSelected)
.map(({ shape, ...el }) => el)
)
);
e.preventDefault();
}}
onPaste={e => {
if (isInputLike(e.target)) return;
const paste = e.clipboardData.getData("text");
this.addElementsFromPaste(paste);
e.preventDefault();
}}
>
<SidePanel <SidePanel
actionManager={this.actionManager} actionManager={this.actionManager}
syncActionResult={this.syncActionResult} syncActionResult={this.syncActionResult}