import { JSResourceToScriptElement, StaticResources } from "../../resources" import { QuartzEmitterPlugin } from "../types" import { render } from "preact-render-to-string" import { QuartzComponent } from "../../components/types" import { resolveToRoot, trimPathSuffix } from "../../path" import HeaderConstructor from "../../components/Header" import { QuartzComponentProps } from "../../components/types" import BodyConstructor from "../../components/Body" interface Options { head: QuartzComponent header: QuartzComponent[], beforeBody: QuartzComponent[], content: QuartzComponent, left: QuartzComponent[], right: QuartzComponent[], footer: QuartzComponent[], } export const ContentPage: QuartzEmitterPlugin = (opts) => { if (!opts) { throw new Error("ContentPage must be initialized with options specifiying the components to use") } const { head: Head, header, beforeBody, left, right, footer } = opts const Header = HeaderConstructor() const Body = BodyConstructor() return { name: "ContentPage", getQuartzComponents() { return [opts.head, Header, Body, ...opts.header, ...opts.beforeBody, opts.content, ...opts.left, ...opts.right, ...opts.footer] }, async emit(_contentDir, cfg, content, resources, emit): Promise { const fps: string[] = [] for (const [tree, file] of content) { const baseDir = resolveToRoot(file.data.slug!) const pageResources: StaticResources = { css: [baseDir + "/index.css", ...resources.css], js: [ { src: baseDir + "/prescript.js", loadTime: "beforeDOMReady", contentType: "external" }, ...resources.js, { src: baseDir + "/postscript.js", loadTime: "afterDOMReady", moduleType: 'module', contentType: "external" } ] } const componentData: QuartzComponentProps = { fileData: file.data, externalResources: pageResources, cfg, children: [], tree } const Content = opts.content const doc =
{header.map(HeaderComponent => )}
{beforeBody.map(BodyComponent => )}
{left.map(BodyComponent => )}
{right.map(BodyComponent => )}
{pageResources.js.filter(resource => resource.loadTime === "afterDOMReady").map(res => JSResourceToScriptElement(res))} const fp = file.data.slug + ".html" await emit({ content: "\n" + render(doc), slug: file.data.slug!, ext: ".html", }) fps.push(fp) } return fps } } }