60 lines
974 B
JavaScript
60 lines
974 B
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;
|