Skip to content

Commit 09c03c5

Browse files
slides voor alle 7 lessen gegenereerd.
1 parent e549bb5 commit 09c03c5

22 files changed

Lines changed: 1262 additions & 0 deletions

.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,3 +9,8 @@ _build
99
profile_default/
1010
ipython_config.py
1111
.DS_Store
12+
13+
slides/node_modules/
14+
slides/package-lock.json
15+
slides/dist/
16+

slides/README.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
# slides
2+
3+
Deze slides zijn gemaakt in [Reveal.js](https://revealjs.com/), met een paar plugins en custom styles. Zo gebruik je ze:
4+
5+
1. Installeer [Node.js](https://nodejs.org/en), mocht je dat nog niet hebben
6+
2. (Optioneel) Installeer [pnpm](https://pnpm.io/), zodat dependencies wat efficienter op je schijf bewaard worden
7+
3. `pnpm install` of `npm install`
8+
4. `pnpm serve` of `npm serve`
9+
5. Open <http://127.0.0.1:8000/> in je browser
10+
- Navigeer door de presentatie met de pijltjestoetsen of de spatiebalk
11+
- Toets <kbd>S</kbd> om de speaker view te openen
12+
- Druk op <kbd>D</kbd> of dubbelklik om op de slides te tekenen
13+
- Tekeningen worden standaard opgeslagen in localstorage, maar zijn ook te downloaden vanuit het hamburger menu
14+
- <kbd>Esc</kbd> sluit de tekenmodus
15+
- Gebruik <kbd>?</kbd> om alle sneltoetsen te zien

slides/build.js

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
const { build, context } = require("esbuild")
2+
const { copy } = require("esbuild-plugin-copy")
3+
const fs = require("fs")
4+
const path = require("path")
5+
const yaml = require("js-yaml")
6+
7+
const entryPoints = [
8+
"src/*.html",
9+
"src/*.tldrev",
10+
"src/*.md",
11+
"src/index.ts"
12+
]
13+
14+
// Load substitutions from _config.yml
15+
function getSubstitutions() {
16+
const extConfigPath = path.resolve(__dirname, "../syllabus/_config_ext.yml")
17+
const baseConfigPath = path.resolve(__dirname, "../syllabus/_config.yml")
18+
let configPath
19+
if (fs.existsSync(extConfigPath)) {
20+
configPath = extConfigPath
21+
} else {
22+
configPath = baseConfigPath
23+
}
24+
const config = yaml.load(fs.readFileSync(configPath, "utf8"))
25+
return (
26+
config?.sphinx?.config?.myst_substitutions
27+
|| {}
28+
)
29+
}
30+
31+
// esbuild plugin for .md and .html substitution
32+
function mdHtmlSubstitutionPlugin() {
33+
return {
34+
name: "md-html-substitution",
35+
setup(build) {
36+
const substitutions = getSubstitutions()
37+
build.onLoad({ filter: /\.(md|html)$/ }, async (args) => {
38+
let content = await fs.promises.readFile(args.path, "utf8")
39+
const warnings = []
40+
// Find all {{ key }} occurrences and substitute
41+
const regex = /{{\s*(\w+)\s*}}/g
42+
let match
43+
let newContent = ""
44+
let lastIndex = 0
45+
while ((match = regex.exec(content)) !== null) {
46+
const [fullMatch, key] = match
47+
const start = match.index
48+
const end = regex.lastIndex
49+
// Add content before match
50+
newContent += content.slice(lastIndex, start)
51+
if (substitutions[key] === undefined) {
52+
// Find line/column for warning
53+
const before = content.slice(0, start)
54+
const lines = before.split("\n")
55+
const lineNum = lines.length
56+
const lineText = lines[lines.length - 1] + content.slice(start, end)
57+
const colNum = Buffer.byteLength(lines[lines.length - 1], "utf8")
58+
warnings.push({
59+
text: `Substitution key '${key}' not found in myst_substitutions`,
60+
location: {
61+
file: args.path,
62+
namespace: "file",
63+
line: lineNum,
64+
column: colNum,
65+
length: Buffer.byteLength(fullMatch, "utf8"),
66+
lineText
67+
}
68+
})
69+
newContent += fullMatch
70+
} else {
71+
newContent += substitutions[key]
72+
}
73+
lastIndex = end
74+
}
75+
newContent += content.slice(lastIndex)
76+
return {
77+
contents: newContent,
78+
loader: "copy",
79+
warnings
80+
}
81+
})
82+
}
83+
}
84+
}
85+
86+
function config(isProduction) {
87+
return {
88+
entryPoints,
89+
outdir: "dist",
90+
bundle: true,
91+
sourcemap: true,
92+
loader: {
93+
".woff": "file",
94+
".eot": "file",
95+
".ttf": "file",
96+
".html": "copy",
97+
".tldrev": "copy",
98+
".md": "copy"
99+
},
100+
plugins: [
101+
mdHtmlSubstitutionPlugin(),
102+
copy({
103+
assets: {
104+
from: [ "./src/assets/**/*" ],
105+
to: [ "./assets" ]
106+
}
107+
})
108+
],
109+
define: {
110+
"process.env.NODE_ENV": isProduction ? "\"production\"" : "\"dev\"",
111+
"process.env.IS_PREACT": "\"false\""
112+
},
113+
logLevel: "info"
114+
}
115+
}
116+
117+
switch (process.argv[2]) {
118+
case "serve":
119+
(async () => {
120+
const ctx = await context({
121+
...config(false),
122+
inject: [ "live-reload.js" ]
123+
})
124+
await ctx.watch()
125+
await ctx.serve({
126+
servedir: "dist"
127+
})
128+
})()
129+
break;
130+
case "build":
131+
build({
132+
...config(true),
133+
minify: true
134+
})
135+
break;
136+
default:
137+
console.warn("Specify either serve or build as an argument.")
138+
break;
139+
}

slides/live-reload.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
// Enables live reloading in the esbuild server
2+
new EventSource('/esbuild').addEventListener('change', () => location.reload())

slides/package.json

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"scripts": {
3+
"serve": "npm run clean && node build.js serve",
4+
"build": "npm run clean && node build.js build",
5+
"clean": "rimraf dist"
6+
},
7+
"dependencies": {
8+
"highlight.js": "^11.11.1",
9+
"react": "^18.3.1",
10+
"react-dom": "^18.3.1",
11+
"reveal.js": "^5.2.1",
12+
"tldreveal": "^1.2.0"
13+
},
14+
"devDependencies": {
15+
"@types/react": "^18.3.26",
16+
"@types/react-dom": "^18.3.7",
17+
"@types/reveal.js": "^5.2.1",
18+
"esbuild": "^0.25.12",
19+
"esbuild-plugin-copy": "^2.1.1",
20+
"js-yaml": "^4.1.0",
21+
"rimraf": "^5.0.10",
22+
"typescript": "^5.9.3"
23+
}
24+
}

slides/src/index.css

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
:root {
2+
--font-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
3+
4+
--r-main-font: system-ui, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, Helvetica, Arial, "Helvetica Neue", sans-serif, var(--font-emoji);
5+
6+
--r-heading-font: Avenir, Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif, var(--font-emoji);
7+
--r-heading-font-weight: 600;
8+
--r-heading-text-transform: none;
9+
}
10+
11+
.reveal a {
12+
text-decoration: underline;
13+
}
14+
15+
.reveal pre {
16+
font-size: .8em;
17+
}
18+
19+
.reveal table.noborder td {
20+
border-bottom: none;
21+
}
22+
23+
@counter-style mc-teams {
24+
system: fixed;
25+
symbols: "\1F44D" "\2764\FE0F" "\1F606" "\1F62E";
26+
suffix: " ";
27+
}
28+
29+
@counter-style mc-hands {
30+
system: fixed;
31+
symbols: "\1F590\FE0F" "\270C\FE0F" "\270A" "\1F64C";
32+
suffix: " ";
33+
}
34+
35+
.mc-teams ul.mc {
36+
list-style: mc-teams;
37+
}
38+
39+
.mc-hands ul.mc {
40+
list-style: mc-hands;
41+
}
42+
43+
ul.mc {
44+
min-width: 60%;
45+
}
46+
47+
ul.mc li {
48+
padding: 0 .5em;
49+
}
50+
51+
.columns {
52+
display: flex;
53+
gap: 2em;
54+
align-items: flex-start;
55+
}
56+
57+
.columns > * {
58+
flex: 1;
59+
}

slides/src/index.ts

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import Reveal from "reveal.js"
2+
3+
import { Tldreveal } from "tldreveal"
4+
import "tldreveal/dist/esm/index.css"
5+
6+
import RevealMarkdown from "reveal.js/plugin/markdown/markdown.esm"
7+
8+
import RevealHighlight from "reveal.js/plugin/highlight/highlight.esm"
9+
import "highlight.js/styles/base16/one-light.css"
10+
11+
import RevealNotes from "reveal.js/plugin/notes/notes.esm"
12+
13+
import "reveal.js/dist/reveal.css"
14+
import "reveal.js/dist/theme/white.css"
15+
16+
import "./index.css"
17+
18+
Reveal.initialize({
19+
hash: true,
20+
keyboard: {
21+
39: "next",
22+
37: "prev"
23+
},
24+
scrollActivationWidth: undefined,
25+
plugins: [ Tldreveal, RevealMarkdown, RevealHighlight, RevealNotes ],
26+
tldreveal: {
27+
isDarkMode: false,
28+
snapshotUrl: "auto"
29+
}
30+
})

slides/src/les_1.html

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<html lang="nl">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Python Plus / Les 1</title>
7+
<link rel="stylesheet" href="index.css" />
8+
</head>
9+
<body>
10+
<div class="reveal mc-teams" id="pythonplus/1">
11+
<div class="slides">
12+
<section data-markdown="les_1.md" data-separator="^\r?\n\*\*\*\r?\n$" data-separator-vertical="^\r?\n---\r?\n$" data-separator-notes="[Nn]otes?:"></section>
13+
</div>
14+
</div>
15+
<script src="index.js"></script>
16+
</body>
17+
</html>

0 commit comments

Comments
 (0)