From a204215b3d32eda2e9980b6638603a9d11d1a381 Mon Sep 17 00:00:00 2001 From: Kevin F Date: Thu, 12 Sep 2024 15:30:07 +0200 Subject: [PATCH] test wiki style reference for production --- astro.config.mjs | 3 +- package-lock.json | 30 +++++++-- package.json | 3 +- src/pages/details/tools-and-services.md | 6 -- src/pages/dictionary/annotation-table.md | 62 ++++++++++++++++++ src/pages/dictionary/building-block.md | 16 +++++ src/pages/dictionary/index.astro | 65 ++++++++++++++++++ src/pages/dictionary/json-ld.md | 62 ++++++++++++++++++ src/pages/knowledgebase.astro | 0 src/plugins/remark-dictionary-tooltips.ts | 80 +++++++++++++++++++++++ 10 files changed, 312 insertions(+), 15 deletions(-) create mode 100644 src/pages/dictionary/annotation-table.md create mode 100644 src/pages/dictionary/building-block.md create mode 100644 src/pages/dictionary/index.astro create mode 100644 src/pages/dictionary/json-ld.md delete mode 100644 src/pages/knowledgebase.astro create mode 100644 src/plugins/remark-dictionary-tooltips.ts diff --git a/astro.config.mjs b/astro.config.mjs index d61d972..f153cfd 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -4,6 +4,7 @@ import tailwind from '@astrojs/tailwind'; import rehypeSlug from 'rehype-slug'; import rehypeAutolinkHeadings from 'rehype-autolink-headings'; import {remarkReplaceLinks} from './src/plugins/remark-replace-links.ts'; +import {remarkReplaceTooltips} from './src/plugins/remark-dictionary-tooltips.ts'; import mdx from '@astrojs/mdx'; // https://astro.build/config @@ -12,7 +13,7 @@ export default defineConfig({ site: 'https://freymaurer.github.io', base: 'astro-poc', markdown: { - remarkPlugins: [remarkReplaceLinks()], + remarkPlugins: [remarkReplaceLinks(), remarkReplaceTooltips()], rehypePlugins: [ rehypeSlug, [ diff --git a/package-lock.json b/package-lock.json index e8ca9f0..4bab3cd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,7 +16,8 @@ "rehype-autolink-headings": "^7.1.0", "rehype-slug": "^6.0.0", "tailwindcss": "^3.4.10", - "typescript": "^5.5.4" + "typescript": "^5.5.4", + "unist-builder": "^4.0.0" }, "devDependencies": { "daisyui": "^4.12.10" @@ -2824,9 +2825,10 @@ "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==" }, "node_modules/dset": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/dset/-/dset-3.1.3.tgz", - "integrity": "sha512-20TuZZHCEZ2O71q9/+8BwKwZ0QtD9D8ObhrihJPr+vLLYlSuAU3/zL4cSlgbfeoGHTjCSJBa7NGcrF9/Bx/WJQ==", + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/dset/-/dset-3.1.4.tgz", + "integrity": "sha512-2QF/g9/zTaPDc3BjNcVTGoBbXBgYfMTTceLaYcFJ/W9kggFUkhxD/hMEeuLKbugyef9SqAx8cpgwlIP/jinUTA==", + "license": "MIT", "engines": { "node": ">=4" } @@ -5446,9 +5448,10 @@ "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==" }, "node_modules/path-to-regexp": { - "version": "6.2.2", - "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.2.2.tgz", - "integrity": "sha512-GQX3SSMokngb36+whdpRXE+3f9V8UzyAorlYvOGx87ufGHehNTn5lCxrKtLyZ4Yl/wEKnNnr98ZzOwwDZV5ogw==" + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.3.0.tgz", + "integrity": "sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==", + "license": "MIT" }, "node_modules/periscopic": { "version": "3.1.0", @@ -6660,6 +6663,19 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/unist-builder": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/unist-builder/-/unist-builder-4.0.0.tgz", + "integrity": "sha512-wmRFnH+BLpZnTKpc5L7O67Kac89s9HMrtELpnNaE6TAobq5DTZZs5YaTQfAZBA9bFPECx2uVAPO31c+GVug8mg==", + "license": "MIT", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/unist-util-find-after": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/unist-util-find-after/-/unist-util-find-after-5.0.0.tgz", diff --git a/package.json b/package.json index 28d5514..66cf88e 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,8 @@ "rehype-autolink-headings": "^7.1.0", "rehype-slug": "^6.0.0", "tailwindcss": "^3.4.10", - "typescript": "^5.5.4" + "typescript": "^5.5.4", + "unist-builder": "^4.0.0" }, "devDependencies": { "daisyui": "^4.12.10" diff --git a/src/pages/details/tools-and-services.md b/src/pages/details/tools-and-services.md index e866204..8ef3bc0 100644 --- a/src/pages/details/tools-and-services.md +++ b/src/pages/details/tools-and-services.md @@ -10,12 +10,6 @@ image: tags: ["tools", "services", "community"] --- -PLACEHOLDER - -
-

Hover me

-
- [Back home]({{Internal_Home}}) Here is some placeholder content in Markdown format for testing purposes. It includes various Markdown elements to ensure that your styling covers a wide range of formatting options. diff --git a/src/pages/dictionary/annotation-table.md b/src/pages/dictionary/annotation-table.md new file mode 100644 index 0000000..b42da65 --- /dev/null +++ b/src/pages/dictionary/annotation-table.md @@ -0,0 +1,62 @@ +--- +layout: ../../layouts/MarkdownLayout.astro +title: 'Annotation Table' +pubDate: 2024-09-12 +description: 'Annotation tables are built from building blocks.' +author: 'Kevin Frey' +image: + url: 'https://docs.astro.build/assets/rose.webp' + alt: 'The Astro logo on a dark background with a pink glow.' +tags: ["tools", "services", "community"] +keywords: 'annotation table' +url: 'annotation-table' +--- + +# Animis capillos carpitur papavera aquilam pronus sponte + +## Solis loquax me fila et cultro spicis + +Lorem markdownum mediam Argum ros quae nisi se saevior sonat, temptantes amanti, +operis. Ire nomen et tamen pars longa sua dextera agros, tamen, illa ulta in +tibi anxius *restatque nomen victam*. Fueris miram flumine, si iubemur quoque +hoc desunt modo, *Vidi stare*, et dentibus *fuisti neque et*. + +1. Primo Stygii furor pellite +2. Parentem canum +3. Vos guttur collo erat oppressit picea unda + +## Retinet pulvere + +Spiramenta neve, pro ira perque Aurorae tota hominum sonuere. Sub perterrita +iactis. Sed me ille inprudens alto **dimotis** sit vultus semper sic, sed hanc +solum libasse famulus; consuetaque nuper silva. Esse cuncta o tamen securi +addidit si Pelates vivit. + +- Non nec +- Vellem meritis temptasse mutata +- Nebulas clara arcum Peleu moenia +- Parva Troiana hic tulit coniunx dextra +- Area ferrea vulnerat isto sit resolutaque + +## Lignum inter maturus + +In nomen **aequora moenia**, lacu Minos neu ipse ergo. Modo *Iovem inmania +monstri* experiar, habebam fugam Cereris. Quae mutatus pectora, sic oculos hic +animi cur cervi, non si Iuppiter notatam. Reverentia facitis vivusque quanta. + +## Natasque per naiades si rudis meae pectora + +Firma procul mixtaeque movetur. Nunc Battum venenis. Poenas restatque mihi, +eadem tradunt quid est eris **obstaret**; et vulnere mente: sub tauri carpens +summam. Stricto unda est pondere votoque caespite; potentem frons. + +## Prensam adhuc illis thalamos ad viderat + +Est certe sunt manuum, vulnera arces spatium lacerat sanguine ingeniis velle +iram multa ut poteram inducto Cerealia in ultima. Ocius iactatis. Valles et cum +mea! + +Illa in viri aret est sic parte cognati stupuit, illa texerat illa agnus fama. +Credere inhonestaque illius ne letalem facti alis sit sequuntur suae Cereris +Thaumas: umquam. **Per** libido tamen siquid segnis cecidere primoque, ullo +gemelliparae turbant Oresitrophos vocor. diff --git a/src/pages/dictionary/building-block.md b/src/pages/dictionary/building-block.md new file mode 100644 index 0000000..939b961 --- /dev/null +++ b/src/pages/dictionary/building-block.md @@ -0,0 +1,16 @@ +--- +layout: ../../layouts/MarkdownLayout.astro +title: 'Building Block' +pubDate: 2024-09-12 +description: 'Building blocks are cool!.' +author: 'Kevin Frey' +image: + url: 'https://docs.astro.build/assets/rose.webp' + alt: 'The Astro logo on a dark background with a pink glow.' +tags: ["tools", "services", "community"] +url: 'building-block' +--- + +In nomen **aequora moenia**, lacu Minos neu ipse ergo. Modo *Iovem inmania +monstri* experiar, habebam fugam Cereris. Quae mutatus pectora, sic oculos hic +animi cur cervi, non si Iuppiter notatam. Reverentia facitis vivusque quanta. \ No newline at end of file diff --git a/src/pages/dictionary/index.astro b/src/pages/dictionary/index.astro new file mode 100644 index 0000000..aa93615 --- /dev/null +++ b/src/pages/dictionary/index.astro @@ -0,0 +1,65 @@ +--- +import Layout from '../../layouts/BaseLayout.astro' +const allVocabularies = await Astro.glob('./*.md'); + +type Vocabulary = { + keyword: string; + title: string; + url: string | undefined; +}; + +// Initialize a map to categorize keywords by their starting letter +const categorizedKeywords: Record = {}; + +// Process each Markdown file +allVocabularies.forEach((file) => { + // Extract necessary fields from the frontmatter of each file + let { title, keywords } = file.frontmatter; + const url = file.url; + // keywords can be null | string or string[] + if (!keywords) { + return; + } + if (typeof keywords === 'string') { + keywords = [keywords]; + } + // Map keywords to their respective title and URL + keywords.forEach((keyword: string) => { + const startingLetter = keyword[0].toUpperCase(); + + // Initialize the starting letter category if it doesn't exist + if (!categorizedKeywords[startingLetter]) { + categorizedKeywords[startingLetter] = []; + } + + // Push the keyword information to its respective category + categorizedKeywords[startingLetter].push({ keyword, title, url }); + }); +}); + +// Sort the keywords in each category +Object.keys(categorizedKeywords).forEach((letter) => { + categorizedKeywords[letter].sort((a, b) => a.keyword.localeCompare(b.keyword)); +}); +--- + + +
+
+
    + {Object.keys(categorizedKeywords).sort().map((letter) => ( +
  • + {letter} +
      + {categorizedKeywords[letter].map(({ keyword, title, url }) => ( +
    • + {keyword} (↪{title}) +
    • + ))} +
    +
  • + ))} +
+
+
+
\ No newline at end of file diff --git a/src/pages/dictionary/json-ld.md b/src/pages/dictionary/json-ld.md new file mode 100644 index 0000000..3a3bc9f --- /dev/null +++ b/src/pages/dictionary/json-ld.md @@ -0,0 +1,62 @@ +--- +layout: ../../layouts/MarkdownLayout.astro +title: 'json-ld' +pubDate: 2024-09-12 +description: 'JSON-LD is a advanced json format.' +author: 'Kevin Frey' +image: + url: 'https://docs.astro.build/assets/rose.webp' + alt: 'The Astro logo on a dark background with a pink glow.' +tags: ["tools", "services", "community"] +keywords: ["json-ld", "testing"] +url: "json-ld" +--- + +# Animis capillos carpitur papavera aquilam pronus sponte + +## Solis loquax me fila et cultro spicis + +Lorem markdownum mediam Argum ros quae nisi se saevior sonat, temptantes amanti, +operis. Ire nomen et tamen pars longa sua dextera agros, tamen, illa ulta in +tibi anxius *restatque nomen victam*. Fueris miram flumine, si iubemur quoque +hoc desunt modo, *Vidi stare*, et dentibus *fuisti neque et*. + +1. Primo Stygii furor pellite +2. Parentem canum +3. Vos guttur collo erat oppressit picea unda + +## Retinet pulvere + +Spiramenta neve, pro ira perque Aurorae tota hominum sonuere. Sub perterrita +iactis. Sed me ille inprudens alto **dimotis** sit vultus semper sic, sed hanc +solum libasse famulus; consuetaque nuper silva. Esse cuncta o tamen securi +addidit si Pelates vivit. + +- Non nec +- Vellem meritis temptasse mutata +- Nebulas clara arcum Peleu moenia +- Parva Troiana hic tulit coniunx dextra +- Area ferrea vulnerat isto sit resolutaque + +## Lignum inter maturus + +In nomen **aequora moenia**, lacu Minos neu ipse ergo. Modo *Iovem inmania +monstri* experiar, habebam fugam Cereris. Quae mutatus pectora, sic oculos hic +animi cur cervi, non si Iuppiter notatam. Reverentia facitis vivusque quanta. + +## Natasque per naiades si rudis meae pectora + +Firma procul mixtaeque movetur. Nunc Battum venenis. Poenas restatque mihi, +eadem tradunt quid est eris **obstaret**; et vulnere mente: sub tauri carpens +summam. Stricto unda est pondere votoque caespite; potentem frons. + +## Prensam adhuc illis thalamos ad viderat + +Est certe sunt manuum, vulnera arces spatium lacerat sanguine ingeniis velle +iram multa ut poteram inducto Cerealia in ultima. Ocius iactatis. Valles et cum +mea! + +Illa in viri aret est sic parte cognati stupuit, illa texerat illa agnus fama. +Credere inhonestaque illius ne letalem facti alis sit sequuntur suae Cereris +Thaumas: umquam. **Per** libido tamen siquid segnis cecidere primoque, ullo +gemelliparae turbant Oresitrophos vocor. diff --git a/src/pages/knowledgebase.astro b/src/pages/knowledgebase.astro deleted file mode 100644 index e69de29..0000000 diff --git a/src/plugins/remark-dictionary-tooltips.ts b/src/plugins/remark-dictionary-tooltips.ts new file mode 100644 index 0000000..ebce741 --- /dev/null +++ b/src/plugins/remark-dictionary-tooltips.ts @@ -0,0 +1,80 @@ +import yaml from 'yaml'; +import type { Root } from 'mdast'; +import type { Plugin, Transformer } from 'unified'; +import {findAndReplace, type FindAndReplaceList} from 'mdast-util-find-and-replace'; +import {u} from 'unist-builder'; +import { URLS } from '../statics'; + +interface Frontmatter { + description: string; + url: string; +} + +const postImportResult = import.meta.glob('/src/pages/dictionary/*.md', { eager: true, query: '?raw', import: 'default' }); +const entries = Object.values(postImportResult) as string[]; + +function getFrontmatter(txt: string) { + const match = txt.match(/---\s*([\s\S]*?)\s*---/); + // frontmatter = frontmatter.join('\n'); + // const yamlFrontmatter = yaml.parse(frontmatter); + if (match) { + // Extract the YAML part + const yamlFrontMatter = match[1].trim(); + const frontMatterObject = yaml.parse(yamlFrontMatter); + return frontMatterObject; + } else { + return; + } +} + +const Tooltips = new Map(); + +entries.map((entry: string) => { + const frontmatter = getFrontmatter(entry); + // keywords can be string[] or string or null + if (!frontmatter || !frontmatter.keywords) { + return; + } + if (typeof frontmatter.keywords === 'string') { + const fMatterValue = {description: frontmatter.description, url: frontmatter.url}; + Tooltips.set(frontmatter.keywords, fMatterValue); + return + } else if (Array.isArray(frontmatter.keywords)) { + frontmatter.keywords.map((keyword: string) => { + const fMatterValue = {description: frontmatter.description, url: frontmatter.url}; + Tooltips.set(keyword, fMatterValue); + }); + } +}); + +function createTooltip(key: string): string { + const tt: Frontmatter | undefined = Tooltips.get(key); + if (tt) { + return ` + ${key} + `; + } else { + return key; + } +} + +// https://dev.to/ritek/the-power-of-remark-6h +export function remarkReplaceTooltips(): Plugin<[], Root> { + const transformer: Transformer = (tree, file) => { + + const replacements: FindAndReplaceList = Array.from(Tooltips.keys()).map(key => [ + new RegExp(`\\b${key}\\b`, 'gi'), // Create a case-insensitive regex to match the keyword + (match: string) => { + // Use the key to create the tooltip HTML + return u('html', createTooltip(key)); + } + ]); + + + findAndReplace(tree, replacements) + }; + + return function attacher() { + return transformer; + }; +} \ No newline at end of file