chore: enhance build index

openscript-ch · Dec 13, 2023 · a733be0 · a733be0
1 parent 1ef30a0
commit a733be0
Show file tree

Hide file tree

Showing 5 changed files with 68 additions and 18 deletions.
diff --git a/public/index.html b/public/index.html
diff --git a/public/logo.png b/public/logo.png
diff --git a/public/styles.css b/public/styles.css
@@ -0,0 +1,46 @@
+body {
+  margin: 5rem auto;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 500px;
+  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
+}
+
+h1 {
+  padding: 0;
+  margin-top: 2.3rem;
+}
+
+ul {
+  list-style: none;
+  padding: 0;
+}
+
+ul li:first-child:last-child a {
+  border-radius: 0.5rem;
+}
+
+ul li:first-child a {
+  border-radius: 0.5rem 0.5rem 0 0;
+}
+
+ul li:last-child a {
+  border-radius: 0 0 0.5rem 0.5rem;
+}
+
+a {
+  display: block;
+  color: #000;
+  font-size: 1.2rem;
+  padding: 1rem;
+  background-color: #EEEE;
+}
+
+a:hover {
+  background-color: #DDD;
+}
+
+img {
+  width: 100px;
+}
diff --git a/scripts/build-index.js b/scripts/build-index.js
@@ -1,28 +1,42 @@
 import fs from 'node:fs/promises';
+import path from 'node:path';
 
-const TALKS_PATH = 'dist/';
-const OUTPUT_PATH = 'dist/index.html';
+const TALKS_PATH = 'talks/';
+const OUTPUT_PATH = 'dist';
+const PUBLIC_PATH = 'public/';
 const talks = [];
 
 const talksFiles = await fs.readdir(TALKS_PATH, { withFileTypes: true });
 for (const file of talksFiles) {
   if (file.isDirectory()) {
-    talks.push(file.name);
+    try {
+      const rawPackageJson = await fs.readFile(path.join(file.path, file.name, 'package.json'));
+      const packageJson = JSON.parse(rawPackageJson.toString());
+      talks.push({path: file.name, title: packageJson.title, author: packageJson.author});
+    } catch (err) {
+      console.error(err);
+    }
   }
 }
 
-const createLinkList = (talks) => talks.map(talk => `<li><a href="./${talk}">${talk}</a></li>`).join('');
-await fs.writeFile(OUTPUT_PATH, `<!DOCTYPE html>
+const createLinkList = (talks) => talks.map(talk => `<li><a href="./${talk.path}">${talk.title} by ${talk.author.name}</a></li>`).join('');
+await fs.writeFile(path.join(OUTPUT_PATH, 'index.html'), `<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Our internal talks</title>
+    <link rel="stylesheet" href="styles.css" />
   </head>
   <body>
+    <img src="logo.png" alt="openscript logo" />
+    <h1>Internal talks</h1>
     <ul>
-      ${createLinkList(talks)}
+      ${createLinkList(talks.reverse())}
     </ul>
   </body>
 </html>
 `);
+
+await fs.copyFile(path.join(PUBLIC_PATH, 'styles.css'), path.join(OUTPUT_PATH, 'styles.css'));
+await fs.copyFile(path.join(PUBLIC_PATH, 'logo.png'), path.join(OUTPUT_PATH, 'logo.png'));
diff --git a/talks/2023-12-12/package.json b/talks/2023-12-12/package.json
@@ -1,6 +1,7 @@
 {
   "name": "2023-12-12",
-  "title": "Digitale Infrastruktur",
+  "title": "Digitale Büroinfrastruktur",
+  "author": { "name": "Robin Bühler" },
   "version": "0.0.1",
   "private": true,
   "scripts": {