gcg-website/static/admin/shortcodes/gallery.js

77 lines
1.7 KiB
JavaScript

import { Card, TextField } from "./components/index.js";
const GalleryShortcode = {
label: "Bildergallerie",
openTag: "{{< ",
closeTag: " >}}",
separator: " ",
toProps: (args) => {
if (args.length > 0) {
return {
dir:
args
.find((arg) => arg.startsWith("dir="))
?.split("=")[1]
.replaceAll('"', "") ?? "",
};
}
return { dir: "" };
},
toArgs: ({ dir }) => {
return [`dir=\"${dir}\"`];
},
control: ({ dir, onChange, controlProps }) => {
const { collection, field } = controlProps;
const handleChange = ({ path }) => {
onChange({ dir: path });
};
const handleOpenMediaLibrary = useMediaInsert(
dir,
{ collection, field, forFolder: true },
handleChange
);
return Card([
TextField({
label: "Gallerie-Ordner",
value: dir,
onChange: (event) => {
onChange({ dir: event.target.value });
},
}),
h(
"span",
{
key: "gallery-button",
className: "CMS_WidgetDateTime_NowButton_root",
},
h(
"button",
{
type: "button",
onClick: handleOpenMediaLibrary,
className: "CMS_Button_root CMS_Button_outlined-primary",
},
"wählen"
)
),
]);
},
preview: ({ dir }) => {
return h(
"div",
{ className: "card mb-4" },
h(
"div",
{ className: "card-body mb-0" },
h("div", { className: "card-title h4" }, "Gallerie-Ordner"),
h("div", { className: "card-text" }, dir)
)
);
},
};
export default GalleryShortcode;