From bf66ea62750baf85df86bcf8e73c8e674c459bac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Norman=20K=C3=B6hring?= <norman.koehring@spenoki.de>
Date: Thu, 7 Dec 2023 10:49:25 +0100
Subject: [PATCH] list pages and render markdown content

---
 .vitepress/theme/Layout.vue     | 53 +++++++++++++++++++++++----------
 .vitepress/theme/pages.data.mts |  2 ++
 .vitepress/theme/useTerminal.ts | 13 ++++++--
 index.md                        | 18 ++++-------
 4 files changed, 55 insertions(+), 31 deletions(-)
 create mode 100644 .vitepress/theme/pages.data.mts

diff --git a/.vitepress/theme/Layout.vue b/.vitepress/theme/Layout.vue
index 7aeac7c..59c86e9 100644
--- a/.vitepress/theme/Layout.vue
+++ b/.vitepress/theme/Layout.vue
@@ -1,38 +1,59 @@
 <script setup lang="ts">
-import { ref, computed, onMounted, watch } from 'vue'
+import { ref, reactive, computed, onMounted, watch } from 'vue'
 import { useData } from 'vitepress'
 import useTerminal from './useTerminal'
 import titleArt from './titles'
+import { data as pages } from './pages.data'
 
-const { site, page, frontmatter } = useData()
-const enhancedReadability = ref(false)
+const { site, page } = useData()
+const enhancedReadability = ref(false) // TODO!
 
-const title = computed(() => {
-  const titleKey = frontmatter.value.title
-  const title = titleArt[titleKey] || titleArt['not_found']
-
-  return title.join('\n')
-})
-const content = computed(() => frontmatter.value.content ?? ['this page does not exist'])
 const commands = computed(() => site.value.themeConfig.commands)
-
 const prompt = '\n$> '
-const lines = ref(title.value + '\n\n' + content.value.join('\n') + '\n' + prompt)
 
 const textArea = ref<HTMLTextAreaElement | null>(null)
 const footer = ref([])
 
+function getTitleArt(key: string) {
+  const art = titleArt[key] ?? titleArt['not_found']
+  return art.join('\n')
+}
+
+function parsedContent(src: string) {
+  const pieces = src.split('---').map(s => s.trim())
+  const [_frontmatter, ...content] = pieces.filter(x => x.length)
+
+  return content.join('\n\n')
+}
+
+function getCurrentPage(title: string) {
+  const page = pages.find(p => p.frontmatter.title === title)
+  console.log('getting page', title, page)
+  if (!page) {
+    console.error('current page not found')
+    return {
+      title: 'not_found',
+      titleArt: getTitleArt('not_found'),
+      content: 'The page could not be found.',
+    }
+  }
+  const titleArt = page.frontmatter.titleArt ?? getTitleArt(title)
+  const content = parsedContent(page.src)
+
+  return { title, titleArt, content }
+}
+
 onMounted(() => {
   if (textArea.value === null) {
     console.error('textarea is missing')
     return
   }
 
-  const { addText, addLine, clear, footerLinks } = useTerminal(textArea.value, commands.value)
+  const { addText, addLine, clear, footerLinks } = useTerminal(textArea.value, commands.value, pages)
 
-  watch(frontmatter, () => {
-    addText(title.value + '\n', false)
-    addLine(content.value.join('\n'))
+  watch(page, () => {
+    const { title, titleArt, content } = getCurrentPage(page.value.title)
+    addText(`${titleArt}\n${title}\n\n${content}`)
   }, { immediate: true })
 
   watch(footerLinks, () => {
diff --git a/.vitepress/theme/pages.data.mts b/.vitepress/theme/pages.data.mts
new file mode 100644
index 0000000..474c8e4
--- /dev/null
+++ b/.vitepress/theme/pages.data.mts
@@ -0,0 +1,2 @@
+import { createContentLoader } from 'vitepress'
+export default createContentLoader('*.md', { includeSrc: true })
diff --git a/.vitepress/theme/useTerminal.ts b/.vitepress/theme/useTerminal.ts
index 6073c51..21c5fff 100644
--- a/.vitepress/theme/useTerminal.ts
+++ b/.vitepress/theme/useTerminal.ts
@@ -2,12 +2,17 @@ import { ref } from 'vue'
 import type { SimpleCommand, Uri } from './Config'
 import { useRouter } from 'vitepress'
 
-export default function useTerminal(inputEl: HTMLTextAreaElement, commands: SimpleCommand[]) {
+type PageInfo = {
+  frontmatter: Record<string, string>
+  src: string
+  url: string
+}
+
+export default function useTerminal(inputEl: HTMLTextAreaElement, commands: SimpleCommand[], pages: PageInfo[]) {
   const prompt = '\n$> '
   const footerLinks = ref([])
 
   const router = useRouter()
-  console.log('router', router)
 
   function moveCursorToEnd() {
     const pos = inputEl.value.length
@@ -109,7 +114,9 @@ export default function useTerminal(inputEl: HTMLTextAreaElement, commands: Simp
   }
 
   function listPages() {
-    addLine('TODO: list pages')
+    const specialPages = ['README', 'not_found']
+    const pageTitles = pages.map(p => p.frontmatter.title).filter(t => t?.length && !specialPages.includes(t))
+    addLine(`Following pages are available:\n\n${pageTitles.join('\n')}\n\nUse the go command to switch pages.`)
   }
 
   async function openPage(page: string) {
diff --git a/index.md b/index.md
index 229881d..044b03d 100644
--- a/index.md
+++ b/index.md
@@ -1,16 +1,10 @@
 ---
 title: 'welcome'
-content: [
-  'This is the homepage of Norman Köhring,',
-  'a programmer, OpenSource enthusiast and hacker based in Berlin, Germany.',
-  '',
-  'I call myself a code artist because programming can and should be seen as a creative process. Therefore code is art. I love to craft pieces of art with code that are beautiful and elegant in their simplicity, readability and architecture.',
-  '',
-  'Type "help" to see a list of available commands.',
-  'Some commands might update the footer with useful links.'
-]
 ---
+This is the homepage of Norman Köhring,
+a programmer, OpenSource enthusiast and hacker based in Berlin, Germany.
 
-Some testcontent for testing.
-
-It is a *paragraph*!
+I call myself a code artist because programming can and should be seen as a creative process. Therefore code is art. I love to craft pieces of art with code that are beautiful and elegant in their simplicity, readability and architecture.
+  
+Type "help" to see a list of available commands.
+Some commands might update the footer with useful links.