diff options
Diffstat (limited to 'nuldoc-src')
| -rw-r--r-- | nuldoc-src/components/global_footer.ts | 12 | ||||
| -rw-r--r-- | nuldoc-src/components/global_header.ts | 37 | ||||
| -rw-r--r-- | nuldoc-src/components/page_layout.ts | 89 | ||||
| -rw-r--r-- | nuldoc-src/dom.ts | 21 | ||||
| -rw-r--r-- | nuldoc-src/pages/about.ts | 87 | ||||
| -rw-r--r-- | nuldoc-src/pages/post.ts | 103 | ||||
| -rw-r--r-- | nuldoc-src/pages/post_list.ts | 84 | ||||
| -rw-r--r-- | nuldoc-src/pages/tag.ts | 91 | ||||
| -rw-r--r-- | nuldoc-src/pages/utils.ts | 51 |
9 files changed, 230 insertions, 345 deletions
diff --git a/nuldoc-src/components/global_footer.ts b/nuldoc-src/components/global_footer.ts new file mode 100644 index 0000000..4c9d245 --- /dev/null +++ b/nuldoc-src/components/global_footer.ts @@ -0,0 +1,12 @@ +import { Config } from "../config.ts"; +import { el, Element, text } from "../dom.ts"; + +export function globalFooter(config: Config): Element { + return el( + "footer", + [["class", "footer"]], + text( + `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, + ), + ); +} diff --git a/nuldoc-src/components/global_header.ts b/nuldoc-src/components/global_header.ts new file mode 100644 index 0000000..4f7df3b --- /dev/null +++ b/nuldoc-src/components/global_header.ts @@ -0,0 +1,37 @@ +import { Config } from "../config.ts"; +import { el, Element, text } from "../dom.ts"; + +export function globalHeader(config: Config): Element { + return el( + "header", + [["class", "header"]], + el( + "nav", + [["class", "nav"]], + el( + "ul", + [], + el( + "li", + [["class", "logo"]], + el("a", [["href", "/"]], text(config.blog.siteName)), + ), + el( + "li", + [], + el("a", [["href", "/about"]], text("About")), + ), + el( + "li", + [], + el("a", [["href", "/posts"]], text("Posts")), + ), + el( + "li", + [], + el("a", [["href", "/slides"]], text("Slides")), + ), + ), + ), + ); +} diff --git a/nuldoc-src/components/page_layout.ts b/nuldoc-src/components/page_layout.ts new file mode 100644 index 0000000..d76e3b2 --- /dev/null +++ b/nuldoc-src/components/page_layout.ts @@ -0,0 +1,89 @@ +import { crypto, toHashString } from "std/crypto/mod.ts"; +import { join } from "std/path/mod.ts"; +import { Config } from "../config.ts"; +import { el, Element, text } from "../dom.ts"; + +type Params = { + metaCopyrightYear: number; + metaDescription: string; + metaKeywords: string[]; + metaTitle: string; + requiresSyntaxHighlight: boolean; +}; + +export async function pageLayout( + { + metaCopyrightYear, + metaDescription, + metaKeywords, + metaTitle, + requiresSyntaxHighlight, + }: Params, + body: Element, + config: Config, +): Promise<Element> { + const head = el( + "head", + [], + metaElement([["charset", "UTF-8"]]), + metaElement([["name", "viewport"], [ + "content", + "width=device-width, initial-scale=1.0", + ]]), + metaElement([["name", "author"], ["content", config.blog.author]]), + metaElement([["name", "copyright"], [ + "content", + `© ${metaCopyrightYear} ${config.blog.author}`, + ]]), + metaElement([["name", "description"], [ + "content", + metaDescription, + ]]), + ...(metaKeywords.length === 0 ? [] : [ + metaElement([["name", "keywords"], [ + "content", + metaKeywords.join(","), + ]]), + ]), + linkElement("icon", "/favicon.svg", "image/svg+xml"), + el("title", [], text(`${metaTitle} | ${config.blog.siteName}`)), + await stylesheetLinkElement("/style.css", config), + ...( + requiresSyntaxHighlight + ? [await stylesheetLinkElement("/hl.css", config)] + : [] + ), + ); + return el( + "html", + [["lang", "ja-JP"]], + head, + body, + ); +} + +async function stylesheetLinkElement( + fileName: string, + config: Config, +): Promise<Element> { + const filePath = join(Deno.cwd(), config.locations.staticDir, fileName); + const content = (await Deno.readFile(filePath)).buffer; + const hash = toHashString(await crypto.subtle.digest("MD5", content), "hex"); + return el("link", [["rel", "stylesheet"], ["href", `${fileName}?h=${hash}`]]); +} + +function metaElement(attrs: [string, string][]): Element { + return el("meta", attrs); +} + +function linkElement( + rel: string, + href: string, + type: string | null, +): Element { + const attrs: [string, string][] = [["rel", rel], ["href", href]]; + if (type !== null) { + attrs.push(["type", type]); + } + return el("link", attrs); +} diff --git a/nuldoc-src/dom.ts b/nuldoc-src/dom.ts index 626d400..d8f53d7 100644 --- a/nuldoc-src/dom.ts +++ b/nuldoc-src/dom.ts @@ -84,3 +84,24 @@ export function forEachChildRecursively(e: Element, f: (n: Node) => void) { }; forEachChild(e, g); } + +export function text(content: string): Text { + return { + kind: "text", + content: content, + raw: false, + }; +} + +export function el( + name: string, + attrs: [string, string][], + ...children: Node[] +): Element { + return { + kind: "element", + name: name, + attributes: new Map(attrs), + children: children, + }; +} diff --git a/nuldoc-src/pages/about.ts b/nuldoc-src/pages/about.ts index bba4031..4f98930 100644 --- a/nuldoc-src/pages/about.ts +++ b/nuldoc-src/pages/about.ts @@ -1,72 +1,17 @@ +import { globalFooter } from "../components/global_footer.ts"; +import { globalHeader } from "../components/global_header.ts"; +import { pageLayout } from "../components/page_layout.ts"; import { Config } from "../config.ts"; +import { el, text } from "../dom.ts"; import { Page } from "../page.ts"; -import { - el, - linkElement, - metaElement, - stylesheetLinkElement, - text, -} from "./utils.ts"; export type AboutPage = Page; export async function generateAboutPage(config: Config): Promise<AboutPage> { - const head = el( - "head", - [], - metaElement([["charset", "UTF-8"]]), - metaElement([["name", "viewport"], [ - "content", - "width=device-width, initial-scale=1.0", - ]]), - metaElement([["name", "author"], ["content", config.blog.author]]), - metaElement([["name", "copyright"], [ - "content", - `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, - ]]), - metaElement([["name", "description"], [ - "content", - "このサイトの著者について", - ]]), - linkElement("icon", "/favicon.svg", "image/svg+xml"), - el("title", [], text(`About | ${config.blog.siteName}`)), - await stylesheetLinkElement("/style.css", config), - ); const body = el( "body", [["class", "single"]], - el( - "header", - [["class", "header"]], - el( - "nav", - [["class", "nav"]], - el( - "ul", - [], - el( - "li", - [["class", "logo"]], - el("a", [["href", "/"]], text(config.blog.siteName)), - ), - el( - "li", - [], - el("a", [["href", "/about"]], text("About")), - ), - el( - "li", - [], - el("a", [["href", "/posts"]], text("Posts")), - ), - el( - "li", - [], - el("a", [["href", "/slides"]], text("Slides")), - ), - ), - ), - ), + globalHeader(config), el( "main", [["class", "main"]], @@ -89,19 +34,19 @@ export async function generateAboutPage(config: Config): Promise<AboutPage> { ), ), ), - el( - "footer", - [["class", "footer"]], - text( - `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, - ), - ), + globalFooter(config), ); - const html = el( - "html", - [["lang", "ja-JP"]], - head, + + const html = await pageLayout( + { + metaCopyrightYear: config.blog.siteCopyrightYear, + metaDescription: "このサイトの著者について", + metaKeywords: [], + metaTitle: "About", + requiresSyntaxHighlight: false, + }, body, + config, ); return { diff --git a/nuldoc-src/pages/post.ts b/nuldoc-src/pages/post.ts index a431c37..597a667 100644 --- a/nuldoc-src/pages/post.ts +++ b/nuldoc-src/pages/post.ts @@ -1,16 +1,12 @@ import { join } from "std/path/mod.ts"; +import { globalFooter } from "../components/global_footer.ts"; +import { globalHeader } from "../components/global_header.ts"; +import { pageLayout } from "../components/page_layout.ts"; import { Config } from "../config.ts"; -import { Element } from "../dom.ts"; +import { el, Element, text } from "../dom.ts"; import { Document } from "../docbook/document.ts"; import { Page } from "../page.ts"; import { Revision } from "../revision.ts"; -import { - el, - linkElement, - metaElement, - stylesheetLinkElement, - text, -} from "./utils.ts"; export interface PostPage extends Page { title: string; @@ -31,71 +27,10 @@ export async function generatePostPage( doc: Document, config: Config, ): Promise<PostPage> { - const headChildren = [ - metaElement([["charset", "UTF-8"]]), - metaElement([["name", "viewport"], [ - "content", - "width=device-width, initial-scale=1.0", - ]]), - metaElement([["name", "author"], ["content", config.blog.author]]), - metaElement([["name", "copyright"], [ - "content", - `© ${getPostCreatedDate(doc).substring(0, 4)} ${config.blog.author}`, - ]]), - metaElement([["name", "description"], ["content", doc.summary]]), - ]; - if (doc.tags.length !== 0) { - headChildren.push( - metaElement([["name", "keywords"], [ - "content", - doc.tags.map((slug) => - (config.blog.tagLabels as { [key: string]: string })[slug] - ).join(","), - ]]), - ); - } - headChildren.push(linkElement("icon", "/favicon.svg", "image/svg+xml")); - headChildren.push( - el("title", [], text(`${doc.title} | ${config.blog.siteName}`)), - ); - headChildren.push(await stylesheetLinkElement("/style.css", config)); - headChildren.push(await stylesheetLinkElement("/hl.css", config)); - const head = el("head", [], ...headChildren); const body = el( "body", [["class", "single"]], - el( - "header", - [["class", "header"]], - el( - "nav", - [["class", "nav"]], - el( - "ul", - [], - el( - "li", - [["class", "logo"]], - el("a", [["href", "/"]], text(config.blog.siteName)), - ), - el( - "li", - [], - el("a", [["href", "/about"]], text("About")), - ), - el( - "li", - [], - el("a", [["href", "/posts"]], text("Posts")), - ), - el( - "li", - [], - el("a", [["href", "/slides"]], text("Slides")), - ), - ), - ), - ), + globalHeader(config), el( "main", [["class", "main"]], @@ -120,7 +55,7 @@ export async function generatePostPage( [["class", "tag"]], el( "a", - [["href", `/tags/${slug}`]], + [["href", `/tags/${slug}/`]], text( (config.blog.tagLabels as { [key: string]: string; @@ -173,19 +108,23 @@ export async function generatePostPage( ), ), ), - el( - "footer", - [["class", "footer"]], - text( - `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, - ), - ), + globalFooter(config), ); - const html = el( - "html", - [["lang", "ja-JP"]], - head, + + const html = await pageLayout( + { + metaCopyrightYear: parseInt( + getPostCreatedDate(doc).substring(0, 4), + ), + metaDescription: doc.summary, + metaKeywords: doc.tags.map((slug) => + (config.blog.tagLabels as { [key: string]: string })[slug] + ), + metaTitle: doc.title, + requiresSyntaxHighlight: true, + }, body, + config, ); const cwd = Deno.cwd(); diff --git a/nuldoc-src/pages/post_list.ts b/nuldoc-src/pages/post_list.ts index e22316e..09d1942 100644 --- a/nuldoc-src/pages/post_list.ts +++ b/nuldoc-src/pages/post_list.ts @@ -1,13 +1,10 @@ +import { globalFooter } from "../components/global_footer.ts"; +import { globalHeader } from "../components/global_header.ts"; +import { pageLayout } from "../components/page_layout.ts"; import { Config } from "../config.ts"; +import { el, text } from "../dom.ts"; import { Page } from "../page.ts"; import { getPostCreatedDate, getPostUpdatedDate, PostPage } from "./post.ts"; -import { - el, - linkElement, - metaElement, - stylesheetLinkElement, - text, -} from "./utils.ts"; export type PostListPage = Page; @@ -17,59 +14,10 @@ export async function generatePostListPage( ): Promise<PostListPage> { const pageTitle = "投稿一覧"; - const head = el( - "head", - [], - metaElement([["charset", "UTF-8"]]), - metaElement([["name", "viewport"], [ - "content", - "width=device-width, initial-scale=1.0", - ]]), - metaElement([["name", "author"], ["content", config.blog.author]]), - metaElement([["name", "copyright"], [ - "content", - `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, - ]]), - metaElement([["name", "description"], ["content", "投稿した記事の一覧"]]), - linkElement("icon", "/favicon.svg", "image/svg+xml"), - el("title", [], text(`${pageTitle} | ${config.blog.siteName}`)), - await stylesheetLinkElement("/style.css", config), - ); const body = el( "body", [["class", "list"]], - el( - "header", - [["class", "header"]], - el( - "nav", - [["class", "nav"]], - el( - "ul", - [], - el( - "li", - [["class", "logo"]], - el("a", [["href", "/"]], text(config.blog.siteName)), - ), - el( - "li", - [], - el("a", [["href", "/about"]], text("About")), - ), - el( - "li", - [], - el("a", [["href", "/posts"]], text("Posts")), - ), - el( - "li", - [], - el("a", [["href", "/slides"]], text("Slides")), - ), - ), - ), - ), + globalHeader(config), el( "main", [["class", "main"]], @@ -128,19 +76,19 @@ export async function generatePostListPage( ) ), ), - el( - "footer", - [["class", "footer"]], - text( - `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, - ), - ), + globalFooter(config), ); - const html = el( - "html", - [["lang", "ja-JP"]], - head, + + const html = await pageLayout( + { + metaCopyrightYear: config.blog.siteCopyrightYear, + metaDescription: "投稿した記事の一覧", + metaKeywords: [], + metaTitle: pageTitle, + requiresSyntaxHighlight: false, + }, body, + config, ); return { diff --git a/nuldoc-src/pages/tag.ts b/nuldoc-src/pages/tag.ts index 51aedcd..c9eaf7e 100644 --- a/nuldoc-src/pages/tag.ts +++ b/nuldoc-src/pages/tag.ts @@ -1,13 +1,10 @@ +import { globalFooter } from "../components/global_footer.ts"; +import { globalHeader } from "../components/global_header.ts"; +import { pageLayout } from "../components/page_layout.ts"; import { Config } from "../config.ts"; +import { el, text } from "../dom.ts"; import { Page } from "../page.ts"; import { getPostCreatedDate, getPostUpdatedDate, PostPage } from "./post.ts"; -import { - el, - linkElement, - metaElement, - stylesheetLinkElement, - text, -} from "./utils.ts"; export type TagPage = Page; @@ -20,64 +17,10 @@ export async function generateTagPage( (config.blog.tagLabels as { [key: string]: string })[tagSlug]; const pageTitle = `タグ「${tagLabel}」一覧`; - const headChildren = [ - metaElement([["charset", "UTF-8"]]), - metaElement([["name", "viewport"], [ - "content", - "width=device-width, initial-scale=1.0", - ]]), - metaElement([["name", "author"], ["content", config.blog.author]]), - metaElement([["name", "copyright"], [ - "content", - `© ${ - getPostCreatedDate(posts[posts.length - 1]).substring(0, 4) - } ${config.blog.author}`, - ]]), - metaElement([["name", "description"], [ - "content", - `タグ「${tagLabel}」のついた記事一覧`, - ]]), - metaElement([["name", "keywords"], ["content", tagLabel]]), - linkElement("icon", "/favicon.svg", "image/svg+xml"), - el("title", [], text(`${pageTitle} | ${config.blog.siteName}`)), - await stylesheetLinkElement("/style.css", config), - ]; - const head = el("head", [], ...headChildren); const body = el( "body", [["class", "list"]], - el( - "header", - [["class", "header"]], - el( - "nav", - [["class", "nav"]], - el( - "ul", - [], - el( - "li", - [["class", "logo"]], - el("a", [["href", "/"]], text(config.blog.siteName)), - ), - el( - "li", - [], - el("a", [["href", "/about"]], text("About")), - ), - el( - "li", - [], - el("a", [["href", "/posts"]], text("Posts")), - ), - el( - "li", - [], - el("a", [["href", "/slides"]], text("Slides")), - ), - ), - ), - ), + globalHeader(config), el( "main", [["class", "main"]], @@ -122,19 +65,21 @@ export async function generateTagPage( ) ), ), - el( - "footer", - [["class", "footer"]], - text( - `© ${config.blog.siteCopyrightYear} ${config.blog.author}`, - ), - ), + globalFooter(config), ); - const html = el( - "html", - [["lang", "ja-JP"]], - head, + + const html = await pageLayout( + { + metaCopyrightYear: parseInt( + getPostCreatedDate(posts[posts.length - 1]).substring(0, 4), + ), + metaDescription: `タグ「${tagLabel}」のついた記事一覧`, + metaKeywords: [tagLabel], + metaTitle: pageTitle, + requiresSyntaxHighlight: false, + }, body, + config, ); return { diff --git a/nuldoc-src/pages/utils.ts b/nuldoc-src/pages/utils.ts deleted file mode 100644 index 018c460..0000000 --- a/nuldoc-src/pages/utils.ts +++ /dev/null @@ -1,51 +0,0 @@ -import { join } from "std/path/mod.ts"; -import { crypto, toHashString } from "std/crypto/mod.ts"; -import { Element, Node, Text } from "../dom.ts"; -import { Config } from "../config.ts"; - -export function text(content: string): Text { - return { - kind: "text", - content: content, - raw: false, - }; -} - -export function el( - name: string, - attrs: [string, string][], - ...children: Node[] -): Element { - return { - kind: "element", - name: name, - attributes: new Map(attrs), - children: children, - }; -} - -export async function stylesheetLinkElement( - fileName: string, - config: Config, -): Promise<Element> { - const filePath = join(Deno.cwd(), config.locations.staticDir, fileName); - const content = (await Deno.readFile(filePath)).buffer; - const hash = toHashString(await crypto.subtle.digest("MD5", content), "hex"); - return el("link", [["rel", "stylesheet"], ["href", `${fileName}?h=${hash}`]]); -} - -export function metaElement(attrs: [string, string][]): Element { - return el("meta", attrs); -} - -export function linkElement( - rel: string, - href: string, - type: string | null, -): Element { - const attrs: [string, string][] = [["rel", rel], ["href", href]]; - if (type !== null) { - attrs.push(["type", type]); - } - return el("link", attrs); -} |