60 lines
1.1 KiB
JavaScript
60 lines
1.1 KiB
JavaScript
import { Card, TextField } from "./components/index.js";
|
|
|
|
const YoutubeShortcode = {
|
|
label: "YouTube-Video",
|
|
openTag: "{{< ",
|
|
closeTag: " >}}",
|
|
separator: " ",
|
|
toProps: (args) => {
|
|
if (args.length > 0) {
|
|
return { src: args[0] };
|
|
}
|
|
|
|
return { src: "" };
|
|
},
|
|
toArgs: ({ src }) => {
|
|
return [src];
|
|
},
|
|
control: ({ src, onChange }) => {
|
|
return Card(
|
|
[
|
|
TextField({
|
|
label: "YouTube-Video-ID",
|
|
value: src,
|
|
onChange: (event) => {
|
|
onChange({ src: event.target.value });
|
|
},
|
|
}),
|
|
h(
|
|
"iframe",
|
|
{
|
|
width: "100%",
|
|
height: "360",
|
|
src: `https://piped.kavin.rocks/embed/${src}`,
|
|
className: "px-3 pt-3",
|
|
},
|
|
""
|
|
),
|
|
],
|
|
{ vertical: true }
|
|
);
|
|
},
|
|
preview: ({ src }) => {
|
|
return h(
|
|
"span",
|
|
{},
|
|
h(
|
|
"iframe",
|
|
{
|
|
width: "420",
|
|
height: "315",
|
|
src: `https://piped.kavin.rocks/embed/${src}`,
|
|
},
|
|
""
|
|
)
|
|
);
|
|
},
|
|
};
|
|
|
|
export default YoutubeShortcode;
|