Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Don't render frontmatter for chapters of type "slides" and use standard .md extension #51

Merged
merged 6 commits into from
May 31, 2024
Merged
26 changes: 19 additions & 7 deletions components/Slides.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,13 @@
<div class="flex relative box-border h-full reveal">
<div class="slides flex h-full w-full">
<section
:data-markdown="slidescontent"
data-separator="^\r?\n---\r?\n$"
data-markdown
data-separator="^\r?\n===\r?\n$"
data-separator-vertical="^\r?\n==\r?\n$"
data-separator-notes="^Note:"
/>
>
{{ stripFrontmatter(slidescontent) }}
</section>
</div>
</div>
</template>
Expand All @@ -18,6 +21,19 @@ export default {
default: "Missing Document",
},
},
methods: {
/**
Takes a string containing raw markdown (mdstr) and returns it with
the yaml frontmatter removed. It does this by deleting the first
instance of text between "---" separators. Currently this means that
if the markdown file is missing the frontmatter, this function will
probably remove the first slide (since reveal.js defaults to "---"
as a slides separator.
*/
stripFrontmatter (mdstr) {
return mdstr.replace(/^---$.*?^---$/ms, '');
},
},
};
</script>

Expand All @@ -36,8 +52,6 @@ onMounted(() => {
// (Importing statically causes errors during server side rendering)
if (process.browser) {
import("reveal.js").then((revealModule) => {
console.log("Check", revealModule);

const deck = new revealModule.default();
deck.initialize({
controls: true,
Expand All @@ -49,8 +63,6 @@ onMounted(() => {
showNotes: true,
plugins: [RevealMarkdown, RevealNotes, Decorations, Search],
});

console.log("Check", deck);
});
}
});
Expand Down
4 changes: 2 additions & 2 deletions pages/modules/[module]/[chapter].vue
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<template>

<ContentDoc v-slot="{ doc }">
<div v-if="doc._extension === 'pmd'" class='overflow-hidden h-full '>
<Slides :slidescontent="baseUrl + doc._file"/>
<div v-if="doc.type === 'slides'" class='overflow-hidden h-full '>
<Slides :slidescontent="doc.plainText"/>
</div>

<div v-else class="flex justify-center items-center">
Expand Down
26 changes: 26 additions & 0 deletions server/plugins/content.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
// This plugin is needed to solve the current bad implementation of NuxtContent
raar1 marked this conversation as resolved.
Show resolved Hide resolved
// that only makes the post-processed markdown available in body and drops
// other props (added e.g. during beforeParse) so the raw markdown cannot simply
// be passed as a custom property.
//
// Check e.g. https://github.com/nuxt/content/issues/2056 to see if this
// eventually gets fixed.

// The following code is the workaround proposed here:
// https://github.com/nuxt/content/issues/2056#issuecomment-1560200992
export default defineNitroPlugin((nitroApp) => {

let files = {}

nitroApp.hooks.hook("content:file:beforeParse", (file) => {
if (file._id.endsWith(".md")) {
files[file._id] = file.body;
}
})

nitroApp.hooks.hook("content:file:afterParse", (file) => {
if (file._id.endsWith(".md")) {
file.plainText = files[file._id];
}
})
});
Loading