@tenjuu99/blog 0.1.0

package/lib/includeFilter.js

@@ -0,0 +1,38 @@
+import fs from "node:fs/promises";
+import { minifyCss } from './minify.js'
+import { templateDir, cssDir } from './dir.js'
+
+const alreadyLoaded = {}
+
+const includeFilter = async (text) => {
+  let replaced = text
+  const includeRegexp = new RegExp(/\{\s*include\('(template|css)\/([\w\./]+)'\)\s*\}/g)
+  const include = [...text.matchAll(includeRegexp)].map(matched => [matched[0], matched[1], matched[2]])
+  for (const index in include) {
+    const [toBeReplace, type, filename] = [...include[index]]
+    let content
+    const cacheKey = `${type}/${filename}`
+    if (!alreadyLoaded[cacheKey]) {
+      switch (type) {
+        case 'template':
+          content = await fs.readFile(`${templateDir}/${filename}`, 'utf8')
+          break
+        case 'css':
+          content = await fs.readFile(`${cssDir}/${filename}`, 'utf8')
+          break
+        default:
+          throw new Error('type does not match neither `template` nor `css`.');
+      }
+      // include を再帰的に解決する
+      if (content.match(includeRegexp)) {
+        content = await includeFilter(content)
+      }
+      alreadyLoaded[cacheKey] = content
+    } else {
+      content = alreadyLoaded[cacheKey]
+    }
+    replaced = replaced.replace(toBeReplace, content)
+  }
+  return replaced
+}
+export default includeFilter

package/lib/indexer.js

@@ -0,0 +1,82 @@
+"use strict"
+import fs from "node:fs/promises";
+import { cacheDir } from './dir.js'
+
+const parseMetaData = (markdown, filename) => {
+  const regexp = new RegExp(/^(<!|-)--(?<variables>[\s\S]*?)--(-|>)/)
+  const matched = markdown.match(regexp)
+  const markdownReplaced = markdown.replace(regexp, '')
+  const metaDataDefault = {
+    name: filename,
+    title: filename,
+    url: `/${filename}`,
+    description: '',
+    og_description: '',
+    published: '1970-01-01',
+    index: true,
+    noindex: false,
+    lang: 'ja',
+    site_name: process.env.SITE_NAME,
+    url_base: process.env.URL_BASE,
+    gtag_id: process.env.GTAG_ID,
+    markdown: markdownReplaced,
+    relative_path: process.env.RELATIVE_PATH || '',
+    template: 'default.html',
+    ext: 'html',
+    __output: `/${filename}.html`
+  }
+  if (!matched) {
+    return metaDataDefault
+  }
+  const metaData = Object.fromEntries(
+    matched.groups.variables.split('\n').filter(line => line.includes(':'))
+    .map(line => {
+      const index = line.indexOf(':')
+      const key = line.slice(0, index)
+      let value = line.slice(index + 1).trim()
+      if (value === 'true' || value === 'false') {
+        value = JSON.parse(value)
+      }
+      return [key, value]
+    })
+  )
+  const metaDataMerged = Object.assign(metaDataDefault, metaData)
+  if (!metaDataMerged.description) {
+    metaDataMerged.description = markdownReplaced.replace(/(<([^>]+)>)/gi, '').slice(0, 200).replaceAll("\n", '') + '...'
+  }
+  if (!metaDataMerged.og_description) {
+    metaDataMerged.og_description = metaDataMerged.og_description
+  }
+  metaDataMerged['__output'] = filename === 'index' ? '/index.html' : `${metaDataMerged.url}.${metaDataMerged.ext}`
+
+  return metaDataMerged
+}
+
+const indexFile = `${cacheDir}/index.json`
+
+const newIndex = []
+const allData = {}
+
+const indexing = async (targetDir) => {
+  const targets = await fs.readdir(targetDir).then(files => {
+    return files.filter(fileName => fileName.match('\.(md|html)$'))
+  })
+  for (const file of targets) {
+    const markdownText = await fs.readFile(`${targetDir}/${file}`, 'utf8')
+    const [target, ext] = file.split('.')
+    const metaData = parseMetaData(markdownText, target)
+    metaData.__filetype = ext
+    allData[target] = metaData
+    let { name, title, index, url, published, modified, __output } = metaData
+    newIndex.push({ name, title, index, url, published, modified, __output })
+  }
+  await fs.writeFile(indexFile, JSON.stringify(newIndex))
+
+  // 旧インデックスから差分を計算して削除対象をピックアップする
+  const oldIndex = await fs.readFile(indexFile, 'utf8').then(text => JSON.parse(text)).catch(error => [])
+  const deleted = oldIndex.filter(oi => !newIndex.map(ni => ni.__output).includes(oi.__output))
+  allData['__deleted'] = deleted
+  return allData
+}
+
+export { indexing, allData }

package/lib/minify.js

@@ -0,0 +1,22 @@
+
+/**
+ * @param {string} css
+ * @returns {string}
+ */
+export function minifyCss (css) {
+  return css.split('\n')
+    .map(s => s.trim()
+      .replace(/\s+{/g, '{')
+      .replace(/:\s/, ':'))
+    .filter(s => !!s)
+    .join('')
+    .replaceAll(/\/\*[\s\S]+?\*\//g, '')
+}
+
+/**
+ * @param {string} html
+ * @returns {string}
+ */
+export function minifyHtml (html) {
+  return html.replace(/\s+(<(?!\/?style).+>?)/g, '$1')
+}

package/lib/replaceIfFilter.js

@@ -0,0 +1,67 @@
+/**
+ * @param {string} condition
+ * @params {object} variables
+ * @return {bool}
+ */
+const ifConditionEvaluator = (condition, variables) => {
+  if (condition.includes('=')) {
+    const segmented = condition.match(/(?<left>[\S]+)\s(?<operator>!=|==)\s(?<right>[\S]+)/)
+    let {left, operator, right} = segmented.groups
+    if (variables.hasOwnProperty(left)) {
+      left = variables[left]
+    } else {
+      try {
+        left = eval(left)
+      } catch (e) {
+        left = undefined
+      }
+    }
+    if (variables.hasOwnProperty(right)) {
+      right = variables[right]
+    } else {
+      try {
+        right = eval(right)
+      } catch (e) {
+        right = undefined
+      }
+    }
+    switch (operator) {
+      case '==':
+        return left == right
+      case '!=':
+        return left != right
+    }
+  } else {
+    if (variables.hasOwnProperty(condition)) {
+      return !!variables[condition]
+    }
+    return false
+  }
+}
+
+const ifRegexp =
+  new RegExp(/(\{|<)if\s(?<condition>[\s\S]+?)(}|>)(?<content>[\s\S]*?)((\{|<)else(\}|>)(?<elsecontent>[\s\S]*?))?(\{<)\/if(>|})/g)
+
+/**
+ * @param {string} text
+ * @param {object} variables
+ * @returns {string}
+ */
+const replaceIfFilter = (text, variables) => {
+  const matched = [...text.matchAll(ifRegexp)]
+  for (const item of matched) {
+    const target = item[0]
+    const content = item.groups.content
+    const elseContent = item.groups.elsecontent
+    if (ifConditionEvaluator(item.groups.condition, variables)) {
+      text = text.replace(target, content)
+    } else if (elseContent) {
+      text = text.replace(target, elseContent)
+    } else {
+      text = text.replace(target, '')
+    }
+  }
+  return text
+}
+
+export default replaceIfFilter

package/lib/replaceScriptFilter.js

@@ -0,0 +1,71 @@
+import * as helper from '../helper/index.js'
+import vm from 'vm'
+
+/**
+ * 配列を再帰的に順不同リストに変換する
+ * @param {Array|string} arrayOrText
+ * @returns {mixed}
+ */
+const arrayToList = (arrayOrText) => {
+  if (typeof arrayOrText === 'string') {
+    return `<li>${arrayOrText}</li>`
+  }
+  if (Array.isArray(arrayOrText)) {
+    let resultListText = '<ul>'
+    for (const item of arrayOrText) {
+      if (Array.isArray(item)) {
+        resultListText += `<li>${arrayToList(item)}</li>`
+      } else {
+        resultListText += `<li>${item}</li>`
+      }
+    }
+    resultListText += '</ul>'
+    arrayOrText = resultListText
+  }
+  return arrayOrText
+}
+
+const replaceScriptFilter = async (text, variables) => {
+  let replaced = text
+  const scriptRegexp = new RegExp(/({script}|\<script\s.*type="ssg".*>)(?<script>[\s\S]*?)(\{\/script}|\<\/script>)/g)
+  const scripts = [...text.matchAll(scriptRegexp)].map((matched) => {
+    return {
+      replace: matched[0],
+      script: matched.groups.script.trim("\n"),
+    }
+  })
+  const context = vm.createContext({
+    helper,
+    variables,
+  })
+  for (const script of scripts) {
+    const s = new vm.Script(script.script)
+    console.log(script.script)
+    console.log(s)
+    console.log('------------------------------------------------')
+    const func = vm.runInContext(script, context)
+    console.log(func)
+    let result = await func(variables, helper)
+    if (result instanceof Promise) {
+      result = await result
+    }
+    if (Array.isArray(result)) {
+      result = arrayToList(result)
+    } else if (typeof result === 'object') {
+      const resultText = []
+      for (const key in result) {
+        resultText.push(`<h3>${key}</h3>`)
+        if (Array.isArray(result[key])) {
+          resultText.push(arrayToList(result[key]))
+        } else {
+          resultText.push(`<p>${result[key]}</p>`)
+        }
+      }
+      result = resultText.join('\n')
+    }
+    replaced = replaced.replace(script.replace, result)
+  }
+  return replaced
+}
+
+export default replaceScriptFilter

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@tenjuu99/blog",
+  "version": "0.1.0",
+  "description": "blog template",
+  "main": "index.js",
+  "scripts": {
+    "build": "npm run generate && npm run serve",
+    "serve": "eval $(cat .env | tr \"\n\" \" \") node server.js",
+    "generate": "eval $(cat .env | tr \"\n\" \" \") node generate.js",
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "watch": "npm-watch build"
+  },
+  "watch": {
+    "build": {
+      "patterns": [
+        "src/",
+        "src-sample/",
+        "../src/",
+        "helper/",
+        "lib/",
+        "generate.js"
+      ],
+      "extensions": "html,md,css,js",
+      "quite": true
+    }
+  },
+  "author": "AmashigeSeiji",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/amashigeseiji/blog_template.git"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "marked": "^13.x"
+  },
+  "devDependencies": {
+    "npm-watch": "^0.x"
+  },
+  "type": "module"
+}

package/performance.js

@@ -0,0 +1,22 @@
+"use strict"
+import distribute from './lib/distribute.js'
+import { indexing } from './lib/indexer.js'
+import { srcDir, distDir } from './lib/dir.js'
+
+process.env.FORCE_BUILD = true
+const execute = async () => {
+  const start = performance.now()
+  const data = await indexing(srcDir)
+  await distribute(data, srcDir, distDir)
+  const end = performance.now()
+  return end - start
+}
+const times = 100
+let executed = 0
+//for (let i = 0; i < times; i++) {
+  //console.log(await executed())
+  const buildTime = await execute()
+  //executed += (buildTime)
+  console.log(buildTime)
+//}
+//console.log('build average: 100 times: ' + (executed/times) + "ms")

package/server.js

@@ -0,0 +1,48 @@
+import http from 'http'
+import url from 'url'
+import fs from 'node:fs/promises'
+import { distDir } from './lib/dir.js'
+
+const contentType = (ext) => {
+    switch (ext) {
+      case 'html':
+        return 'text/html'
+      case 'css':
+        return 'text/css'
+      case 'js':
+      case 'javascript':
+        return 'text/javascript'
+      case 'json':
+        return 'application/json'
+      case 'jpg':
+      case 'jpeg':
+        return 'image/jpeg'
+      case 'svg':
+        return 'image/svg+xml'
+      case 'xml':
+        return 'application/xml'
+      case 'rdf':
+        return 'application/rdf+xml.rdf'
+      default:
+        return 'application/octet-stream'
+    }
+}
+
+http.createServer((request, response) => {
+  console.log(request.method, request.url)
+  const url = new URL(`http://${request.headers.host}${request.url}`)
+  let path = url.pathname === '/' ? '/index.html' : decodeURIComponent(url.pathname)
+  if (!path.includes('.')) {
+    path += '.html'
+  }
+  fs.readFile(`${distDir}${path}`, 'binary').catch(async (error) => {
+    const errorContent = await fs.readFile(`${distDir}/404.html`)
+    console.log(error)
+    response.writeHead(404)
+    response.end(errorContent)
+  }).then(file => {
+    const ext = path.split('.')[1]
+    response.writeHead(200, { 'Content-Type': `${contentType(ext)}; charset=utf-8` })
+    response.end(file, 'binary')
+  })
+}).listen(process.env.PORT || 8000)

package/src-sample/css/color.css

@@ -0,0 +1,5 @@
+:root {
+  --header-bg: #333;
+  --header-logo-color: #fff;
+  --footer-bg: #eee;
+}

package/src-sample/css/layout.css

@@ -0,0 +1,143 @@
+:root {
+  --headline-1: 28px;
+  --headline-2: 20px;
+  --headline-3: 16px;
+  --text-size: 16px;
+  --text-size-small: 12px;
+}
+
+body {
+  display: flex;
+  flex-direction: column;
+  min-height: 100dvh !important;
+  text-align: justify;
+  font-feature-settings: "palt";
+  font-size: var(--text-size);
+  word-wrap: break-word;
+  word-break: break-all;
+}
+
+.container {
+  margin: 0 auto;
+  padding: 5px 30px;
+  max-width: 80%;
+  min-width: 600px;
+  width: 70vw;
+}
+
+@media screen and (max-width: 600px) {
+  .container {
+    max-width: 100%;
+    width: 100%;
+    min-width: 100%;
+    padding: 5px 15px;
+  }
+}
+
+/**
+ * header, main, footer
+ */
+header {
+  padding: 10px 0;
+  border-bottom: 0.5px solid #ccc;
+  background: var(--header-bg);
+}
+
+header h1, header p {
+  font: normal bold var(--headline-1)/1 monospace;
+  margin: 0;
+}
+
+header a, header a:visited {
+  text-decoration: none;
+  color: var(--header-logo-color);
+}
+
+main {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+footer {
+  border-top: 1px solid #ccc;
+  padding: 15px 0 0;
+  font-size: var(--text-size-small);
+  background: var(--footer-bg);
+}
+footer ul {
+  display: flex;
+  justify-content: flex-start;
+}
+footer ul li {
+  list-style: none;
+  margin-left: 10px;
+}
+
+/**
+ * headline
+ */
+h1 {
+  font-size: var(--headline-1);
+}
+h2 {
+  font-size: var(--headline-2);
+}
+h3 {
+  font-size: var(--headline-3);
+}
+main h1, main h2, main h3, main h4 {
+  margin: 15px 0 5px;
+}
+main h1, main h2 {
+  border-bottom: 0.5px solid #ccc;
+}
+/**
+ * aside
+ */
+aside, aside * {
+  font-size: var(--text-size-small);
+  color: #503838;
+  line-height: 1.125rem;
+}
+
+/**
+ * p
+ */
+p {
+  margin: 15px 0;
+}
+
+.prevNext {
+  list-style: none;
+  display: flex;
+  padding: 0;
+}
+.prevNext li {
+  display: flex;
+  align-items: center;
+  flex-basis: 50%;
+}
+.prevNext a {
+  padding: 10px;
+  display: contents;
+}
+.prevNext__prev {
+  padding-right: 5px;
+  justify-content: flex-start;
+}
+.prevNext__next {
+  padding-left: 5px;
+  justify-content: flex-end;
+}
+.prevNext__next a::after {
+  content: '>';
+  color: #ccc;
+  padding-left: 10px;
+}
+.prevNext__prev a::before {
+  content: '<';
+  color: #ccc;
+  padding-right: 10px;
+}

package/src-sample/css/markdown.css

@@ -0,0 +1,49 @@
+blockquote {
+  padding: 3px 20px 3px 20px;
+  margin: 0 10px;
+  font-style: italic;
+  border-left: 2px solid #999;
+  background: #e3e8f57a;
+}
+blockquote p {
+  color: #5b6e5c;
+  line-height: 1.75;
+}
+table, td, th {
+  border: 0.5px solid #bbb;
+  border-spacing: 0;
+  border-collapse: collapse;
+}
+td, th {
+  padding: 3px 5px;
+  font-size: .7rem;
+  background: #eee;
+}
+th {
+  background: #767676;
+  color: #efefef;
+}
+td ul {
+  padding: 0 0 0 10px;
+}
+em {
+  font-style: italic;
+  font-weight: 600;
+}
+pre {
+  white-space: pre-wrap;
+  background: #333;
+  color: #fff;
+  padding: 10px;
+}
+pre > code {
+  background: #333;
+  color: #fff;
+  padding: 0;
+}
+code {
+  background: #eee;
+  color: #444;
+  padding: 0 5px;
+  border-radius: 5px;
+}

package/src-sample/css/reset.css

@@ -0,0 +1,2 @@
+/* https://github.com/Andy-set-studio/modern-css-reset */
+*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role="list"],ol[role="list"]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}

package/src-sample/helper/index.js

@@ -0,0 +1,3 @@
+export function additionalHelper() {
+  return 'これは追加ヘルパーによって出力されているメッセージです。'
+}

package/src-sample/pages/abc.md

@@ -0,0 +1,5 @@
+---
+title: abc
+url: /abc
+published: 2024-08-31
+---

package/src-sample/pages/fuga.md

@@ -0,0 +1,3 @@
+## fuga
+
+これは変数がないです

package/src-sample/pages/hogehoge.md

@@ -0,0 +1,8 @@
+---
+title: hoge
+url: /hoge
+published: 2024/03/19 00:00
+ifTrueVariable: true
+---
+
+hoge

package/src-sample/pages/html_render.html

@@ -0,0 +1,20 @@
+---
+title: html render
+url: /html_render
+---
+
+<section>
+  section
+  <h2>h2</h2>
+  <p>p</p>
+  <ul>
+    <li>list</li>
+    <li>list</li>
+  </ul>
+</section>
+
+aaa
+
+### マークダウンがパースされないことを確認します
+
+[abc](/a)

package/src-sample/pages/index.md

@@ -0,0 +1,35 @@
+---
+title: INDEX
+template: index.html
+index: false
+url: /
+published: 2023-03-03 20:21
+modified: 2023-03-03 20:21
+---
+## INDEX
+
+{script}
+const data = helper.readIndex()
+
+const pages = {}
+for (const page of data) {
+  if (page.index) {
+    const url = variables.relative_path ? variables.relative_path + page.url : page.url
+    if (page.published === '1970-01-01') {
+      if (!pages['日付なし']) {
+          pages['日付なし'] = []
+      }
+      pages['日付なし'].push(`<a href="${url}">${page.title}</a>`)
+      continue
+    }
+    const published = new Date(page.published)
+    const year = `${published.getFullYear()}年`
+    const date = `${published.getMonth() +1}月${published.getDate()}日`
+    if (!pages[year]) {
+      pages[year] = []
+    }
+    pages[year].push(`<a href="${url}">${page.title}</a> (${date})`)
+  }
+}
+return pages
+{/script}

package/src-sample/pages/notfound.md

@@ -0,0 +1,8 @@
+---
+title: 404 not found
+url: /404
+index: false
+noindex: true
+---
+
+記事が見つかりませんでした。