building report structure

observablehq.config.js

@@ -3,6 +3,13 @@ export default {
   // The app’s title; used in the sidebar and webpage titles.
   title: "Project Summary",
 
+  pages: [
+    {name: "Contributors", path: "/people_roles"},
+    {name: "Tasks", path: "/elements_tasks"},
+    {name: "Form Data", path: "/forms"},
+    {name: "Events", path: "/timeline"}
+  ],
+
   // The pages and sections in the sidebar. If you don’t specify this option,
   // all pages will be listed in alphabetical order. Listing pages explicitly
   // lets you organize them into sections and have unlisted pages.
@@ -23,7 +30,7 @@ export default {
   root: "src",
 
   // Some additional configuration options and their defaults:
-  // theme: "default", // try "light", "dark", "slate", etc.
+  theme: ["air", "deep-space"], // try "light", "dark", "slate", etc.
   // header: "", // what to show in the header (HTML)
   // footer: "Built with Observable.", // what to show in the footer (HTML)
   // sidebar: true, // whether to show the sidebar

src/elements_tasks.md

@@ -0,0 +1,26 @@
+---
+theme: dashboard
+title: Elements and Tasks
+toc: false
+---
+
+```js 
+const jsonData = FileAttachment("./data/project_summary.json").json();
+import * as Plot from "npm:@observablehq/plot";
+import * as d3 from "npm:d3";
+
+function printJsonStructure(obj, indent = 0) {
+  const padding = " ".repeat(indent);
+  return Object.entries(obj)
+    .map(([key, value]) => {
+      if (typeof value === "object" && value !== null) {
+        return `${padding}${key}: {\n${printJsonStructure(value, indent + 2)}\n${padding}}`;
+      } else {
+        return `${padding}${key}: ${typeof value}`;
+      }
+    })
+    .join("\n");
+}
+```
+
+

src/forms.md

@@ -0,0 +1,26 @@
+---
+theme: dashboard
+title: Contributors
+toc: false
+---
+
+```js 
+const jsonData = FileAttachment("./data/project_summary.json").json();
+import * as Plot from "npm:@observablehq/plot";
+import * as d3 from "npm:d3";
+
+function printJsonStructure(obj, indent = 0) {
+  const padding = " ".repeat(indent);
+  return Object.entries(obj)
+    .map(([key, value]) => {
+      if (typeof value === "object" && value !== null) {
+        return `${padding}${key}: {\n${printJsonStructure(value, indent + 2)}\n${padding}}`;
+      } else {
+        return `${padding}${key}: ${typeof value}`;
+      }
+    })
+    .join("\n");
+}
+```
+
+

src/people_roles.md

@@ -0,0 +1,26 @@
+---
+theme: dashboard
+title: Contributors
+toc: false
+---
+
+```js 
+const jsonData = FileAttachment("./data/project_summary.json").json();
+import * as Plot from "npm:@observablehq/plot";
+import * as d3 from "npm:d3";
+
+function printJsonStructure(obj, indent = 0) {
+  const padding = " ".repeat(indent);
+  return Object.entries(obj)
+    .map(([key, value]) => {
+      if (typeof value === "object" && value !== null) {
+        return `${padding}${key}: {\n${printJsonStructure(value, indent + 2)}\n${padding}}`;
+      } else {
+        return `${padding}${key}: ${typeof value}`;
+      }
+    })
+    .join("\n");
+}
+```
+
+

src/timeline.md

@@ -138,7 +138,6 @@ timelineContainer.appendChild(list);
 ```
 
 ```js
-
 // get the whole year
 function generateFullYearRange(year) {
   const start = new Date(`${year}-01-01T00:00:00Z`);