From de0fce7fde193271dbde5afa5b6cb555d7766e5d Mon Sep 17 00:00:00 2001
From: "Ashwin V. Mohanan" <dev@fluid.quest>
Date: Sun, 19 May 2024 21:53:35 +0200
Subject: [PATCH] Transform to ES6 module style imports, import mathjax plugin

---
 default.nix    |   5 +-
 index.html     |   2 +-
 package.json   |  16 ++---
 src/cli.js     | 164 ++++++++++++++++++++++++++++++++-----------------
 src/version.js |   2 +-
 5 files changed, 119 insertions(+), 70 deletions(-)

diff --git a/default.nix b/default.nix
index f9bb40b..8f690a4 100644
--- a/default.nix
+++ b/default.nix
@@ -1,5 +1,6 @@
+# nixos-23.11
 {
-  pkgs ? import <nixpkgs> {}
+  pkgs ? import (fetchTarball "https://github.com/NixOS/nixpkgs/archive/bacb8503d3a51d9e9b52e52a1ba45e2c380ad07d.tar.gz") {}
 }:
 
 pkgs.mkShell {
@@ -12,7 +13,7 @@ pkgs.mkShell {
     ];
     # libs
     buildInputs = with pkgs; [
-      nodejs-slim-12_x
+      pkgs.nodejs-slim_18
     ];
     shellHook = ''
       npm install .
diff --git a/index.html b/index.html
index 63c0fa0..d19da8d 100644
--- a/index.html
+++ b/index.html
@@ -8,7 +8,7 @@
   <!-- theme stylesheets are dynamic loaded in index.js, according to 'theme' param -->
   <!-- <link rel="stylesheet" type="text/css" href="/css/github-syntax-highlight.css"> -->
   <!-- <link rel="stylesheet" type="text/css" href="/css/github-markdown.css"> -->
-  <link rel="stylesheet" type="text/css" href="/css/mjpage-html.css">
+  <!-- <link rel="stylesheet" type="text/css" href="/css/mjpage-html.css"> -->
   <link rel="stylesheet" type="text/css" href="/css/themes/common.css">
   <style>
     .markdown-body {
diff --git a/package.json b/package.json
index e92c9a2..af6d6ce 100644
--- a/package.json
+++ b/package.json
@@ -6,12 +6,13 @@
     "url": "git+https://github.com/instant-markdown/instant-markdown-d.git"
   },
   "description": "Instantly-updating Markdown Server",
-  "version": "0.3.0",
+  "version": "0.4.0.dev0",
   "license": "Apache-2.0",
   "homepage": "https://github.com/instant-markdown/instant-markdown-d",
   "engines": {
-    "node": ">=12.0.0"
+    "node": ">=18.0.0"
   },
+  "type": "module",
   "main": "./src/cli.js",
   "preferGlobal": "true",
   "bin": {
@@ -25,18 +26,17 @@
   },
   "dependencies": {
     "highlight.js": "^11.8.0",
-    "markdown-it": "^13.0.1",
-    "markdown-it-mathjax": "^2.0.0",
+    "markdown-it": "^14.1.0",
     "markdown-it-task-lists": "^2.1.1",
     "markdown-it-front-matter": "^0.2.3",
     "markdown-it-textual-uml": "^0.1.3",
-    "mathjax": "^2.7.9",
-    "mathjax-node-page": "^1.4.1",
+    "markdown-it-anchor": "^8.6.7",
+    "mathjax-full": "^3.2.2",
+    "@mdit/plugin-mathjax": "~0.12.0",
     "mermaid": "~10.4.0",
     "minimist": "^1.2.8",
     "send": "~0.17.2",
-    "socket.io": "^4.7.2",
-    "markdown-it-anchor": "^8.6.7"
+    "socket.io": "^4.7.2"
   },
   "devDependencies": {
     "genversion": "^3.1.1"
diff --git a/src/cli.js b/src/cli.js
index b28c387..9c7ef10 100755
--- a/src/cli.js
+++ b/src/cli.js
@@ -1,41 +1,47 @@
 #!/usr/bin/env node
 "use strict";
 // node builtins
-const process = require('process'),
-  server = require('http').createServer(httpHandler),
-  exec = require('child_process').exec,
-  os = require('os'),
-  fs = require('fs'),
-  path = require('path'),
-  url = require('url');
-
-const argv = require('minimist')(process.argv.slice(2), {
+import process from 'process';
+import http from 'http'
+import child_process from 'child_process'
+import os from 'os';
+import fs from 'fs';
+import path from 'path';
+import url from 'url';
+
+const server = http.createServer(httpHandler);
+const exec = child_process.exec;
+
+// CLI argument parsing
+import minimist from 'minimist';
+const argv = minimist(process.argv.slice(2), {
   string: ['browser'],
   default: {port: 8090, debug: false, anchor: false, theme: false},
   alias: {V: 'version', h: 'help'},
 });
 
-const MarkdownIt = require('markdown-it'),
-  hljs = require('highlight.js'),
-  io = require('socket.io')(server, {
-    cors: {
-      origin: '*',
-      methods: [
-        "GET",
-        "PUT",
-        "DELETE"
-      ],
-      credentials: true
+import MarkdownIt from 'markdown-it';
+import hljs from 'highlight.js';
+import {Server} from 'socket.io';
+import taskLists from 'markdown-it-task-lists';
+import frontMatter from 'markdown-it-front-matter';
+import send from 'send';
+
+const io = new Server(server, {
+      cors: {
+        origin: '*',
+        methods: [
+          "GET",
+          "PUT",
+          "DELETE"
+        ],
+        credentials: true
+      }
     }
-  }),
-  send = require('send');
-
-const mjpage = require('mathjax-node-page').mjpage;
-const taskLists = require('markdown-it-task-lists');
-const frontMatter = require('markdown-it-front-matter');
+);
 
 if (argv.version || argv.debug) {
-  const version= require('./version');
+  const version = require('./version');
   console.log(`instant-markdown-d version: v${version}`);
   console.log(`nodejs version: ${process.version}`);
 }
@@ -87,56 +93,93 @@ let md = new MarkdownIt({
   }
 }).use(taskLists, {enabled: true}).use(frontMatter, function(fm){});
 
-if (argv.mathjax) md.use(require('markdown-it-mathjax')());
+// if (argv.mathjax) md.use(require('markdown-it-mathjax')());
 if (argv.mermaid)  md.use(require('markdown-it-textual-uml'));
 
+argv.debug && console.debug("argv",argv);
+import anchor from 'markdown-it-anchor';
 if (argv.anchor) {
-  const anchor = require('markdown-it-anchor');
+  // const anchor = require('markdown-it-anchor').default;
   let anchorOpt = {
     tabIndex: false,
     permalink: anchor.permalink.ariaHidden({
       placement: 'after'
     })
   };
+  argv.debug && console.debug("markdown-it-anchor:", anchorOpt);
   md.use(anchor, anchorOpt);
 }
 
-const mjPageConfig = {
-  format: ["TeX"],
-  cssInline: false,
+// const mjPageConfig = {
+//   format: ["TeX"],
+//   cssInline: false,
+// };
+//
+// if (process.env.INSTANT_MARKDOWN_MATHJAX_FONTS) {
+//   mjPageConfig.fontURL = process.env.INSTANT_MARKDOWN_MATHJAX_FONTS;
+// }
+
+const mjConfig = {
+  output: "chtml",
+  // equationNumbers: "AMS",
+  // speakText: false
+  tex: {
+    processEnvironments: false,
+    tags: 'ams'
+  },
+  // chtml: {
+  //     // fontURL: argv.fontURL
+  // },
 };
 
-if (process.env.INSTANT_MARKDOWN_MATHJAX_FONTS) {
-  mjPageConfig.fontURL = process.env.INSTANT_MARKDOWN_MATHJAX_FONTS;
+import { createMathjaxInstance, mathjax } from "@mdit/plugin-mathjax";
+let mjCSS = undefined;
+
+if (argv.mathjax) {
+    const mathjaxInstance = createMathjaxInstance(mjConfig);
+    md.use(mathjax, mathjaxInstance);
+    const mjStyle = mathjaxInstance.outputStyle();
+    mjCSS = `<style>{mjStyle}</style>`
 }
 
-const mjNodeConfig = {
-  html: true,
-  // mml: true,
-  // svg: true,
-  equationNumbers: "AMS",
-  speakText: false
-};
+// if (argv.mathjax) {
+//   // const { createMathjaxInstance, mathjax } = require("@mdit/plugin-mathjax");
+//   var mjLoaded = import("@mdit/plugin-mathjax").then(
+//     (module) => {
+//       // var { createMathjaxInstance, mathjax } = module;
+//       const mathjaxInstance = module.createMathjaxInstance(mjConfig);
+//       md.use(module.mathjax, mathjaxInstance);
+//       mjStyle = mathjaxInstance.outputStyle();
+//     },
+//     () => {
+//       console.error("Could not import @mdit/plugin-mathjax")
+//     }
+//   )
+// }
 
 function mathJaxRenderEmit(newHtml) {
-  if(argv.mathjax) {
-    mjpage(
-      newHtml,
-      mjPageConfig,
-      mjNodeConfig,
-      function(data) {
-          if (argv.debug) {
-            console.log("Rendered html saved as debug.html")
-            // console.debug(data); // resulting HTML string
-            fs.writeFileSync('debug.html', data, 'utf-8'); // debug
-          }
-          io.emit('newContent', data);
-      }
-    );
-  }
-  else {
+  // if(argv.mathjax) {
+  //   mjpage(
+  //     newHtml,
+  //     mjPageConfig,
+  //     mjNodeConfig,
+  //     function(data) {
+  //         if (argv.debug) {
+  //           console.log("Rendered html saved as debug.html")
+  //           // console.debug(data); // resulting HTML string
+  //           fs.writeFileSync('debug.html', data, 'utf-8'); // debug
+  //         }
+  //         io.emit('newContent', data);
+  //     }
+  //   );
+  // }
+  // else {
+  // }
+
+  // mjLoaded.then(() =>
     io.emit('newContent', newHtml)
-  }
+  // );
+  // console.log(mjLoaded)
   if (argv.debug) {
     console.debug('Emitting new data');
     // console.debug(newHtml); // resulting HTML string
@@ -194,6 +237,10 @@ function addSecurityHeaders(req, res, isIndexFile) {
   if (argv.debug) console.debug(`Content-Security-Policy=${csp}`)
 }
 
+import { dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+
 function httpHandler(req, res) {
   if (argv.debug) console.debug("Received %s request", req.method);
 
@@ -204,6 +251,7 @@ function httpHandler(req, res) {
         // Example: /my-repo/raw/master/sub-dir/some.png
         let githubUrl = req.url.match(/\/[^\/]+\/raw\/[^\/]+\/(.+)/);
         let isIndexFile = /^\/(index\.html)?(\?|$)/.test(req.url);
+        const __dirname = dirname(fileURLToPath(import.meta.url));
         let pkgRoot = path.dirname(__dirname);
         let cwd = process.cwd();
 
diff --git a/src/version.js b/src/version.js
index 3984662..2607b7c 100644
--- a/src/version.js
+++ b/src/version.js
@@ -1,2 +1,2 @@
 // Generated by genversion.
-module.exports = '0.3.0'
+module.exports = '0.4.0.dev0'