.gitea
assets
content
data
layouts
static
admin
config
links
previews
shortcodes
components
audio.js
card.js
download.js
gallery.js
image.js
index.js
slider.js
youtube.js
icons.js
index.html
data
media
schulchronik
favicon.ico
.gitignore
.mailmap
LICENSE
config.yml
65 lines
1.4 KiB
JavaScript
65 lines
1.4 KiB
JavaScript
import { Card, Image } from "./components/index.js";
|
|
import { md5 } from "../previews/page-previews/components/index.js";
|
|
|
|
const ImageShortcode = {
|
|
label: "Bild",
|
|
openTag: "{{< ",
|
|
closeTag: " >}}",
|
|
separator: " ",
|
|
toProps: (args) => {
|
|
if (args.length > 0) {
|
|
return {
|
|
src:
|
|
args
|
|
.find((arg) => arg.startsWith("src="))
|
|
?.split("=")[1]
|
|
.replaceAll('"', "") ?? "",
|
|
};
|
|
}
|
|
|
|
return { src: "" };
|
|
},
|
|
toArgs: ({ src }) => {
|
|
return [`src=\"${src}\"`];
|
|
},
|
|
control: ({ src, onChange, controlProps }) => {
|
|
const { collection, field, entry } = controlProps;
|
|
|
|
const handleChange = ({ path }) => {
|
|
onChange({ src: path });
|
|
};
|
|
|
|
const handleOpenMediaLibrary = useMediaInsert(
|
|
src,
|
|
{ collection, field },
|
|
handleChange
|
|
);
|
|
const assetSource = useMediaAsset(src, collection, field, entry);
|
|
|
|
return Card(
|
|
Image({
|
|
label: "Bild",
|
|
assetSource,
|
|
handleOpenMediaLibrary,
|
|
})
|
|
);
|
|
},
|
|
preview: ({ src }) => {
|
|
return h(
|
|
"div",
|
|
{ className: "col-lg-3 col-md-4 col-sm-6" },
|
|
h(
|
|
"a",
|
|
{ className: "vb-gallery", "data-gall": md5(src) },
|
|
h("img", {
|
|
className: "img-thumbnail w-100 h-100",
|
|
style: { objectFit: "cover" },
|
|
src,
|
|
})
|
|
)
|
|
);
|
|
},
|
|
};
|
|
|
|
export default ImageShortcode;
|