add copy button

This commit is contained in:
maddalax 2024-10-25 08:12:11 -05:00
parent caa9d10b1b
commit 3f8ab7d905

View file

@ -2,6 +2,7 @@ package partials
import ( import (
"github.com/maddalax/htmgo/framework/h" "github.com/maddalax/htmgo/framework/h"
"github.com/maddalax/htmgo/framework/js"
"github.com/maddalax/htmgo/tools/html-to-htmgo/htmltogo" "github.com/maddalax/htmgo/tools/html-to-htmgo/htmltogo"
"htmgo-site/ui" "htmgo-site/ui"
) )
@ -34,8 +35,30 @@ func GoOutput(content string) *h.Element {
h.Class("h-full w-1/2 min-w-1/2"), h.Class("h-full w-1/2 min-w-1/2"),
h.Id("go-output"), h.Id("go-output"),
h.Div( h.Div(
h.Class("h-[90%] w-full rounded border border-slate-200"), h.Class("h-[90%] w-full rounded border border-slate-200 relative"),
h.UnsafeRaw(content), h.Div(
h.Class("h-full"),
h.Id("go-output-content"),
h.UnsafeRaw(content),
),
h.If(content != "", h.Div(
h.Class("absolute top-0 right-0 p-2 bg-slate-800 text-white rounded-bl-md cursor-pointer"),
h.Text("Copy"),
// language=JavaScript
h.OnClick(js.EvalJs(`
if(!navigator.clipboard) {
alert("Clipboard API not supported");
return;
}
let text = self.parentElement.querySelector("#go-output-content").innerText;
navigator.clipboard.writeText(text);
self.innerText = "Copied!";
setTimeout(() => {
self.innerText = "Copy";
}, 1000);
`)),
)),
), ),
) )
} }