Page MenuHomeSealhub

multiple-photos.ts
No OneTemporary

multiple-photos.ts

import { CollectionItem } from "sealious";
import { FilePointer, PathFilePointer } from "@sealcode/file-manager";
import { FlatTemplatable, tempstream } from "tempstream";
import { MultipleFiles, MultipleFilesOptions } from "./multiple-files.js";
import { MultipleFiles as MultipleFilesField } from "../fields/multiple-files.js";
import { KoaResponsiveImageRouter } from "koa-responsive-image-router";
export class MultiplePhotos extends MultipleFiles {
constructor(
public field: MultipleFilesField,
public imageRouter: KoaResponsiveImageRouter,
options?: Partial<MultipleFilesOptions>
) {
super(field, options);
}
getClassModifiers() {
return ["multiple-files--photos"];
}
getInputAttributes() {
return { ...super.getInputAttributes(), accept: "image/*" };
}
async renderFileItem(
fileItem: CollectionItem,
file: FilePointer
): Promise<FlatTemplatable> {
if (!(file instanceof PathFilePointer)) {
return "";
}
const path = await file.getPath();
if (!path) {
return "missing file";
}
return tempstream/* HTML */ `<li>
<a href="${file.getURL()}" data-turbo="false">
${this.imageRouter.image(path, {
resolutions: [150, 300],
sizesAttr: "150px",
})}
</a>
<span class="filename">
${(await file.getOriginalFilename()) || "no filename"}</span
>
${this.renderFileRemoveButton(fileItem)}
</li>`;
}
}

File Metadata

Mime Type
text/html
Expires
Tue, Dec 24, 14:02 (21 h, 24 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
557179
Default Alt Text
multiple-photos.ts (1 KB)

Event Timeline