Migrate to plain ES modules - no build

hessammehr · Oct 31, 2024 · 20a5ed9 · 20a5ed9
1 parent e173bb3
commit 20a5ed9
Show file tree

Hide file tree

Showing 13 changed files with 44 additions and 95 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,3 +0,0 @@
-node_modules
-*.js
-*.map

diff --git a/README.md b/README.md
@@ -10,25 +10,12 @@ Fast exchange (f<sub>exchange</sub> ≫ | f<sub>X-H</sub> – f<sub>Y-H</sub> |)
 
 ![slow exchange spectrum](fast.png)
 
-# Try it out!
-Intall node.js, then
+# Modifying the simulation
 
-```bash
-npm install -g typescript
-git clone https://github.com/hessammehr/coalescence
-cd coalescence
-npm install
-tsc -w
-```
-
-You will need to fire up a local dev server
+You will need to fire up a local dev server, e.g.
 ```bash
 # Python 3
 python -m http.server
-# Python 2
-python -m SimpleHTTPServer
-# something a bit faster?
-caddy -host localhost -port 8000
 ```
 
 Then go to `http://localhost:8000`.

diff --git a/coalesce.html b/coalesce.html
@@ -1,26 +1,23 @@
-<!DOCTYPE html>
-<html>
-<head>
-	<title>Frequency Coalescence</title>
-	<link rel="stylesheet" type="text/css" href="style.css">
-	<script src="node_modules/systemjs/dist/system.js"></script>
-</head>
-<body>
-<span id = "p">-4</span>
-<form>
-	<input id="slider" type="range" min="-10" max="0" value="-4" step="0.05" />
-</form>
-<script>
-  // set our baseURL reference path
-  SystemJS.config({
-    map: {
-		d3: 'node_modules/d3/build/d3.min.js'
-	}
-  });
-
-  // loads /js/main.js
-  System.defaultJSExtensions = true;
-  SystemJS.import('core.js');
-</script>
-</body>
-</html>
+<!doctype html>
+<html>
+    <head>
+        <title>Frequency Coalescence</title>
+        <link rel="stylesheet" type="text/css" href="style.css" />
+    </head>
+    <body>
+        <span id="p">-4</span>
+        <form>
+            <input
+                id="slider"
+                type="range"
+                min="-10"
+                max="0"
+                value="-4"
+                step="0.05"
+            />
+        </form>
+        <script type="module">
+            import './core.js';
+        </script>
+    </body>
+</html>
diff --git a/core.ts → core.js b/core.ts → core.js
@@ -1,5 +1,5 @@
-import { axes, monitor } from "./plot-utils"
-import { map, spec, pad, every, continuous, add, constg, osc, cum, pmux } from "./gen-utils"
+import { axes, monitor } from "./plot-utils.js"
+import { map, spec, pad, every, continuous, add, constg, osc, cum, pmux } from "./gen-utils.js"
 
 let N = 2048;
 let spins = [];
@@ -20,7 +20,7 @@ let a = axes("n", "fft_mag", true);
 let g = map(spec(pad(every(continuous(add(spins), N, true), 16), 0.0, 7 * N), 8 * N),
     function (a) { return a.slice(0, N / 4); });
 
-let slider = (document.getElementById("slider") as HTMLInputElement);
+let slider = (document.getElementById("slider"));
 slider.onchange = function(e) { update(slider.value) };
 // let g = map(continuous(add.apply(null, spins), N), function(a) { return a.slice(0, N/2); });
 console.log("Done");

diff --git a/d3.min.js b/d3.min.js
diff --git a/d3.v3.min.js b/d3.v3.min.js
diff --git a/fft-asm-lib.ts → fft-asm-lib.js b/fft-asm-lib.ts → fft-asm-lib.js
@@ -1,8 +1,8 @@
-import FftModuleAsm from "./fft-asm"
-import FftModuleNoAsm from "./fft-asm-noasm"
+import FftModuleAsm from "./fft-asm.js"
+import FftModuleNoAsm from "./fft-asm-noasm.js"
 
 export default function FftModule(sz,asm) {
-	var i,j,k:number;
+	var i,j,k;
 	this.sz=sz;
 	this.bufsz=sz*32;
 	if(this.bufsz<4096)

diff --git a/fft-asm-noasm.ts → fft-asm-noasm.js b/fft-asm-noasm.ts → fft-asm-noasm.js
diff --git a/fft-asm.ts → fft-asm.js b/fft-asm.ts → fft-asm.js
diff --git a/gen-utils.ts → gen-utils.js b/gen-utils.ts → gen-utils.js
@@ -1,4 +1,4 @@
-import FftModule from "./fft-asm-lib"
+import FftModule from "./fft-asm-lib.js"
 
 export function* mux(a, b) {
   var c = Math.random() > 0.5 ? a : b;
@@ -52,7 +52,7 @@ export function* osc(phase) {
 
 // take populates array d with data points from generator g
 // If d is not specified returns a new array.
-export function take(g, N, d?) {
+export function take(g, N, d) {
   var data = (d ? d : new Array(N));
   for (var n = 0; n < N; n++) {
     data[n] = g.next().value;
@@ -85,7 +85,7 @@ export function* every(g, N) {
   }
 }
 
-export function* pad(g, c, N:number) {
+export function* pad(g, c, N) {
   var m = take(constg(c), N);
   while(true) {
     yield g.next().value.concat(m);

diff --git a/package.json b/package.json
diff --git a/plot-utils.ts → plot-utils.js b/plot-utils.ts → plot-utils.js
@@ -1,4 +1,4 @@
-import * as d3 from "d3";
+import * as d3 from "https://cdn.jsdelivr.net/npm/d3@7/+esm";
 
 export function* axes(xtitle, ytitle, changeLimits) {
 
@@ -35,7 +35,7 @@ export function* axes(xtitle, ytitle, changeLimits) {
 
   let l = d3.line()
     .x(function (d, n) { return x(n) })
-    .y(function (d) { return y(d) });
+    .y(function (d, n) { return y(d) });
   let p = svg.append("path")
     .attr("class", "line")
     .attr("stroke", colors("1"));

diff --git a/tsconfig.json b/tsconfig.json