Convert context to a factory.

This commit is contained in:
Joshua Bemenderfer
2020-09-23 20:37:34 -04:00
parent 05c575bb26
commit 6f24dd523b
7 changed files with 57 additions and 62 deletions

View File

@@ -8,7 +8,7 @@ const head = ({ title }) => html`
`
const body = async (ctx, { path, title }) => html`
${await ctx.b(Header, { path, title })}
${await ctx.renderBody(Header, { path, title })}
<main id="app">
<section>
<h1>About Page - ${sanitize(title)}</h1>
@@ -23,7 +23,7 @@ const body = async (ctx, { path, title }) => html`
</ul>
</section>
</main>
${await ctx.b(Footer, { path, title })}
${await ctx.renderBody(Footer, { path, title })}
`
const styles = css`
@@ -33,10 +33,10 @@ const styles = css`
`
export async function AboutPage (ctx, { path, title }) {
ctx.css.add(base)
ctx.css.add(styles)
ctx.head.add(head({ title }))
ctx.body = await body(ctx, { path, title })
ctx.addCSS(base)
ctx.addCSS(styles)
ctx.addHead(head({ title }))
ctx.setBody(await body(ctx, { path, title }))
return ctx
}

View File

@@ -8,7 +8,7 @@ const head = ({ title }) => html`
`
const body = async (ctx, { path, title }) => html`
${await ctx.b(Header, { path, title })}
${await ctx.renderBody(Header, { path, title })}
<main id="app">
<section>
<h1>Home Page - ${sanitize(title)}</h1>
@@ -17,7 +17,7 @@ const body = async (ctx, { path, title }) => html`
</p>
</section>
</main>
${await ctx.b(Footer, { path, title })}
${await ctx.renderBody(Footer, { path, title })}
`
const styles = css`
@@ -27,10 +27,10 @@ const styles = css`
`
export async function HomePage (ctx, { path, title }) {
ctx.css.add(base)
ctx.css.add(styles)
ctx.head.add(head({ title }))
ctx.body = await body(ctx, { path, title })
ctx.addCSS(base)
ctx.addCSS(styles)
ctx.addHead(head({ title }))
ctx.setBody(await body(ctx, { path, title }))
return ctx
}

View File

@@ -1,7 +1,7 @@
import { html, render } from '../templater.js'
async function Root (ctx, component, ...params) {
const result = await ctx.render(component, ...params)
const result = await render(ctx, component, ...params)
const scripts = Array.from(result.js).join(';\n')
const css = Array.from(result.css).join('\n')
@@ -25,5 +25,5 @@ async function Root (ctx, component, ...params) {
}
export function page(component, ...params) {
return render(Root, component, ...params)
return render(null, Root, component, ...params)
}