save copied styles in memory

This commit is contained in:
Faustino Kialungila 2020-01-06 23:20:17 +01:00
parent 00af6dc635
commit 510f4101bb

View file

@ -55,6 +55,8 @@ const KEYS = {
BACKSPACE: "Backspace" BACKSPACE: "Backspace"
}; };
let COPIED_STYLES: string = "{}";
function isArrowKey(keyCode: string) { function isArrowKey(keyCode: string) {
return ( return (
keyCode === KEYS.ARROW_LEFT || keyCode === KEYS.ARROW_LEFT ||
@ -215,43 +217,25 @@ class App extends React.Component<{}, AppState> {
} else if (event.metaKey && event.shiftKey && event.code === "KeyC") { } else if (event.metaKey && event.shiftKey && event.code === "KeyC") {
const element = elements.find(el => el.isSelected); const element = elements.find(el => el.isSelected);
if (element) { if (element) {
if (!navigator.clipboard) return; COPIED_STYLES = JSON.stringify(element);
navigator.clipboard
.writeText(JSON.stringify(element))
.catch(err => alert("Failed to copy shape style!"));
} }
// Paste Styles: Cmd-Shift-V // Paste Styles: Cmd-Shift-V
} else if (event.metaKey && event.shiftKey && event.code === "KeyV") { } else if (event.metaKey && event.shiftKey && event.code === "KeyV") {
if (!navigator.clipboard) return; const pastedElement = JSON.parse(COPIED_STYLES);
navigator.clipboard if (pastedElement.type) {
.readText() elements.forEach(element => {
.then(stringifiedPastedElement => { if (element.isSelected) {
const pastedElement = JSON.parse(stringifiedPastedElement); element.backgroundColor = pastedElement?.backgroundColor;
if (pastedElement.type) { element.strokeWidth = pastedElement?.strokeWidth;
const { element.strokeColor = pastedElement?.strokeColor;
strokeColor, element.fillStyle = pastedElement?.fillStyle;
strokeWidth, element.opacity = pastedElement?.opacity;
backgroundColor, generateDraw(element);
fillStyle,
opacity
} = pastedElement;
elements.forEach(element => {
if (element.isSelected) {
element.backgroundColor = backgroundColor;
element.strokeWidth = strokeWidth;
element.strokeColor = strokeColor;
element.fillStyle = fillStyle;
element.opacity = opacity;
generateDraw(element);
}
});
} }
}) });
.then(() => { }
this.forceUpdate(); this.forceUpdate();
event.preventDefault(); event.preventDefault();
})
.catch(err => alert("Failed to read shape style!"));
} }
}; };