diff --git a/package.json b/package.json index 14ad270..fb4323c 100644 --- a/package.json +++ b/package.json @@ -63,11 +63,13 @@ "default": "container", "enum": [ "container", - "snippet" + "snippet", + "clipboard" ], "enumDescriptions": [ "Shoot with the container.", - "Shoot with the snippet alone. If you want transparent padding, use `container` with `\"polacode.transparentBackground\": true`" + "Shoot with the snippet alone. If you want transparent padding, use `container` with `\"polacode.transparentBackground\": true`", + "Shoot to clipboard" ] } } @@ -77,4 +79,4 @@ "@types/node": "^11.12.0", "@types/vscode": "^1.32.0" } -} +} \ No newline at end of file diff --git a/webview/index.js b/webview/index.js index 1b4ae9e..51c5564 100644 --- a/webview/index.js +++ b/webview/index.js @@ -127,13 +127,15 @@ vscode.setState({ innerHTML }) }) - obturateur.addEventListener('click', () => { - if (target === 'container') { - shootAll() + obturateur.addEventListener("click", () => { + if (target === "container") { + shootAll(); + } else if (target === "clipboard") { + shootClipboard(); } else { - shootSnippet() + shootSnippet(); } - }) + }); function shootAll() { const width = snippetContainerNode.offsetWidth * 2 @@ -188,6 +190,37 @@ }) } + function shootClipboard() { + const width = snippetContainerNode.offsetWidth * 2; + const height = snippetContainerNode.offsetHeight * 2; + const config = { + width, + height, + style: { + transform: "scale(2)", + "transform-origin": "center", + background: getRgba(backgroundColor, transparentBackground), + }, + }; + + // Hide resizer before capture + snippetNode.style.resize = "none"; + snippetContainerNode.style.resize = "none"; + + domtoimage.toBlob(snippetContainerNode, config).then((blob) => { + snippetNode.style.resize = ""; + snippetContainerNode.style.resize = ""; + + var data = [new ClipboardItem({ "image/png": blob })]; + + navigator.clipboard.write(data).then( + () => { + shoot(data); + } + ); + }); + } + let isInAnimation = false obturateur.addEventListener('mouseover', () => {