Refactor scripts for readability and fix bugs

javascript/TocCards.tsx

@@ -0,0 +1,79 @@
+import { html, raw } from "hono/html";
+import type { FC } from "hono/jsx";
+
+type HeaderCardProps = {
+  index: number;
+  chapterIndex: number;
+  displayTitle: string;
+  toIndexFolder: string;
+};
+
+export const IndexHeaderCard: FC<HeaderCardProps> = ({
+  index,
+  chapterIndex,
+  displayTitle,
+  toIndexFolder
+}) => {
+  return html`<div class="card-header" role="tab" id="index-${index + 1}">
+    <h5 class="mb-0">
+      <a
+        class="index-show collapsed"
+        data-toggle="collapse"
+        href="#index-collapse-${index + 1}"
+        aria-expanded="true"
+        aria-controls="index-collapse-${index + 1}"
+      >
+        &#10148;
+        <!-- ➤ (because this one is rendered blue on mobile: ▶  -->
+      </a>
+      <a
+        class="index-hide collapsed"
+        data-toggle="collapse"
+        href="#index-collapse-${index + 1}"
+        aria-expanded="true"
+        aria-controls="index-collapse-${index + 1}"
+      >
+        &#x25BC;
+        <!-- ▼ (because the corresponding one is not rendered) -->
+      </a>
+      <a href="${raw(toIndexFolder)}${chapterIndex}.html"
+        >${raw(displayTitle)}</a
+      >
+    </h5>
+  </div>`;
+};
+
+export const SidebarHeaderCard: FC<HeaderCardProps> = ({
+  index,
+  chapterIndex,
+  displayTitle,
+  toIndexFolder
+}) => {
+  return html`<div class="card-header" role="tab" id="sidebar-${index + 1}">
+    <h5 class="mb-0">
+      <a
+        class="sidebar-show collapsed"
+        data-toggle="collapse"
+        href="#sidebar-collapse-${index + 1}"
+        aria-expanded="true"
+        aria-controls="sidebar-collapse-${index + 1}"
+      >
+        &#10148;
+        <!-- ➤ (because this one is rendered blue on mobile: ▶  -->
+      </a>
+      <a
+        class="sidebar-hide collapsed"
+        data-toggle="collapse"
+        href="#sidebar-collapse-${index + 1}"
+        aria-expanded="true"
+        aria-controls="sidebar-collapse-${index + 1}"
+      >
+        &#x25BC;
+        <!-- ▼ (because the corresponding one is not rendered) -->
+      </a>
+      <a href="${raw(toIndexFolder)}${chapterIndex}.html"
+        >${raw(displayTitle)}</a
+      >
+    </h5>
+  </div>`;
+};

javascript/commands/utils.ts

@@ -0,0 +1,66 @@
+import fs from "node:fs";
+import fse from "fs-extra";
+import path from "node:path";
+import { ending, frontmatter, preamble } from "../latexContent.js";
+
+const __dirname = path.resolve(import.meta.dirname);
+
+export const createMain = (
+  inputDir: string,
+  outputDir: string,
+  parseType: string
+) => {
+  // TODO: Use fs-extra to auto create subfolders
+  if (!fs.existsSync(outputDir)) {
+    fs.mkdirSync(outputDir);
+  }
+
+  if (parseType == "js" || parseType == "json") {
+    return;
+  }
+
+  if (parseType == "web") {
+    if (!fs.existsSync(path.join(outputDir, "/chapters"))) {
+      fs.mkdirSync(path.join(outputDir, "/chapters"));
+    }
+    fse.copy(path.join(__dirname, "../../static"), outputDir, err => {
+      if (err) return console.error(err);
+    });
+    return;
+  }
+
+  // for latex version only
+  // create sicpjs.tex file
+  // FIXME: Remove any
+  const chaptersFound: any[] = [];
+  const files = fs.readdirSync(inputDir);
+  files.forEach(file => {
+    if (file.match(/chapter/)) {
+      chaptersFound.push(file);
+    }
+  });
+  const stream = fs.createWriteStream(path.join(outputDir, "sicpjs.tex"));
+  stream.once("open", fd => {
+    stream.write(preamble);
+    stream.write(frontmatter);
+    chaptersFound.forEach(chapter => {
+      const pathStr = "./" + chapter + "/" + chapter + ".tex";
+      stream.write("\\input{" + pathStr + "}\n");
+    });
+    stream.write(ending);
+    stream.end();
+  });
+  // makes the .latexmkrc file
+  const latexmkrcStream = fs.createWriteStream(
+    path.join(outputDir, ".latexmkrc")
+  );
+  latexmkrcStream.once("open", fd => {
+    latexmkrcStream.write(latexmkrcContent);
+    latexmkrcStream.end();
+  });
+};
+
+const latexmkrcContent = `$pdflatex = "xelatex %O %S";
+$pdf_mode = 1;
+$dvi_mode = 0;
+$postscript_mode = 0;`;

javascript/constants.js → javascript/constants.ts

@@ -1,12 +1,5 @@
 export const sourceAcademyURL = "https://sourceacademy.org";
-
-// to change to localhost if required
-// http://localhost:8075
-
 export const authors = "Harold Abelson and Gerald Jay Sussman";
-
 export const authors_with = "Julie Sussman";
-
 export const adapters = "Martin Henz and Tobias Wrigstad";
-
 export const adapters_with = "Samuel Fang";

javascript/findBadTags.js → javascript/findBadTags.ts

@@ -1,13 +1,14 @@
-import fs from "fs";
-import util from "util";
-import path from "path";
+import fs from "node:fs";
+import util from "node:util";
+import path from "node:path";
 
 import { DOMParser as dom } from "xmldom";
 
 const readdir = util.promisify(fs.readdir);
 const open = util.promisify(fs.open);
 const readFile = util.promisify(fs.readFile);
 
+const __dirname = path.resolve(import.meta.dirname);
 const inputDir = path.join(__dirname, "../xml");
 
 const validTags = new Set([
@@ -171,11 +172,10 @@ const recursiveCheckChildrenForValidTag = node => {
   return found;
 };
 
-async function recursiveCheckXmlForTag(filepath, tagName) {
-  let files;
+async function recursiveCheckXmlForTag(filepath: string, tagName: string) {
   const fullPath = path.join(inputDir, filepath);
-  files = await readdir(fullPath);
-  const promises = [];
+  const files = await readdir(fullPath);
+  const promises: Promise<void>[] = [];
 
   files.forEach(file => {
     if (file.match(/\.xml$/)) {
@@ -189,7 +189,11 @@ async function recursiveCheckXmlForTag(filepath, tagName) {
   await Promise.all(promises);
 }
 
-async function checkXmlForTag(filepath, filename, tagName) {
+async function checkXmlForTag(
+  filepath: string,
+  filename: string,
+  tagName: string
+) {
   const fullFilepath = path.join(inputDir, filepath, filename);
   const fileToRead = await open(fullFilepath, "r");
 
@@ -210,7 +214,7 @@ async function checkXmlForTag(filepath, filename, tagName) {
 async function main() {
   const args = process.argv;
   let tagName = "";
-  if (args.length > 2 && args[2] != "") {
+  if (args.length > 2 && args[2]) {
     tagName = args[2];
     console.log("\nLooking for tag: " + tagName + "\n");
   } else {
@@ -220,7 +224,7 @@ async function main() {
   recursiveCheckXmlForTag("", tagName);
 }
 
-// babel-node ./javascript/findBadTags <tagname>
+// tsx ./javascript/findBadTags <tagname>
 
 // Can provide 0 or 1 arguments.
 // If no arguments provided, checks for all invalid tags.