Removed logging statement

package-lock.json

@@ -80,6 +80,7 @@
     },
     "node_modules/@clack/prompts/node_modules/is-unicode-supported": {
       "version": "1.3.0",
+      "extraneous": true,
       "inBundle": true,
       "license": "MIT",
       "engines": {

poptimal.js

@@ -12,8 +12,7 @@ const xlinkns = "http://www.w3.org/1999/xlink";
 const svgns = "http://www.w3.org/2000/svg";
 
 import {RADIUS_OPTS, RADIUS_DESC, DotMaker} from './src/components/dots.js';
-import {PALETTES} from './src/components/palettes.js';
-import {ColourNamer} from './src/components/colour_namer.js';
+import {PALETTES, ColourNamer} from './src/components/palettes.js';
 
 const CELL = 10;
 const MAG = 2;
@@ -125,7 +124,7 @@ function poptimal_svg(params) {
 
 
 	params.patterns.map((p) =>  {
-		const dots = dm.dots(1 / p.m, p.n, false);
+		const dots = dm.dots(1 / p.m, p.n);
 		const dots_g = svg.append("g")
 	  			.attr("id", `dots${p.i}`);
 	

src/components/colour_namer.js

@@ -1,39 +0,0 @@
-
-import { promises } from "fs";
-import * as d3 from "d3-color";
-import * as d3cd from "d3-color-difference";
-
-
-class ColourNamer {
-	constructor() {
-		this.colmap = new Map();
-	}
-
-	async load_colours(colourfile) {
-		const colourBuff = await promises.readFile(colourfile);
-		const colours = colourBuff.toString();
-		const seen = new Set(); 
-		colours.split(/\n/).map((l) => {
-			const m = l.match(/(\d+)\s+(\d+)\s+(\d+)\s+(.*)/);
-			if( m ) {
-				const sig = `${m[1]},${m[2]},${m[3]}`;
-				if( !seen.has(sig) ) {
-					this.colmap.set(m[4], d3.rgb(m[1], m[2], m[3]));
-					seen.add(sig);
-				}
-			}
-		});
-	}
-
-	colour_to_text(d3color) {
-		const diffs = []
-		for( const [ name, colour] of this.colmap) {
-			diffs.push({name: name, dist: d3cd.differenceCie76(colour, d3color)});
-		}
-		diffs.sort((a, b) => a.dist - b.dist);
-		return diffs[0].name;
-	}
-}
-
-
-export { ColourNamer}

src/components/dots.js

@@ -18,7 +18,7 @@ const RADIUS_OPTS = [
 
 const RADIUS_DESC = {
 	"const": "of constant size",
-	"right": "getting larger towards the right",
+	"right": "getting larger towards the left",
 	"left": "getting larger towards the left",
 	"up": "getting larger towards the top",
 	"down": "getting larger towards the bottom",
@@ -38,8 +38,8 @@ function distance(dx, dy) {
 function int_range(v1, v2) {
 	const vs = [v1, v2];
 	vs.sort((a, b) => a - b);
-	const low = Math.floor(vs[0] - 1);
-	const high = Math.ceil(vs[1] + 1);
+	const low = Math.floor(vs[0]);
+	const high = Math.ceil(vs[1]);
 	return [...Array(high - low + 1).keys()].map((i) => i + low);
 }
 
@@ -50,7 +50,7 @@ class DotMaker {
 		this.cy = 0.5 * width;
 	}
 
-	dots(m, n, clip) {
+	dots(m, n) {
 		if( m - n === 0 ) {
 			return [];
 		}
@@ -61,7 +61,7 @@ class DotMaker {
 			js.map((j) => {
 				const x = (j - m * i) / (m - n);
 				const y = m * (x + i);
-				if( !clip || (x > 0 && y > 0 && x < this.width && y < this.width) ) {
+				if( x > 0 && y > 0 && x < this.width && y < this.width ) {
 					ps.push({i:i, j:j, x:x, y:y});
 				}
 			});

src/components/download.js

@@ -73,7 +73,7 @@ export async function download_as_png (svg) {
   const opts = {
       fitTo: {
         mode: 'width', // If you need to change the size
-        value: 1200,
+        value: 400,
       }
     };
   const resvgJS = new resvg.Resvg(svgstr, opts)

src/components/palettes.js

@@ -2,7 +2,9 @@
 import * as d3 from "d3-color";
 import shuffle from "lodash.shuffle";
 import random from "random";
+import { promises } from "fs";
 
+import * as d3cd from "d3-color-difference";
 
 const PALETTES = new Map([
 	[ "random RGB", palette_random ], 
@@ -76,6 +78,36 @@ function palette_cmy() {
 	return shuffle(cols);
 }
 
+class ColourNamer {
+	constructor() {
+		this.colmap = new Map();
+	}
+
+	async load_colours(colourfile) {
+		const colourBuff = await promises.readFile(colourfile);
+		const colours = colourBuff.toString();
+		const seen = new Set(); 
+		colours.split(/\n/).map((l) => {
+			const m = l.match(/(\d+)\s+(\d+)\s+(\d+)\s+(.*)/);
+			if( m ) {
+				const sig = `${m[1]},${m[2]},${m[3]}`;
+				if( !seen.has(sig) ) {
+					this.colmap.set(m[4], d3.rgb(m[1], m[2], m[3]));
+					seen.add(sig);
+				}
+			}
+		});
+	}
+
+	colour_to_text(d3color) {
+		const diffs = []
+		for( const [ name, colour] of this.colmap) {
+			diffs.push({name: name, dist: d3cd.differenceCie76(colour, d3color)});
+		}
+		diffs.sort((a, b) => a.dist - b.dist);
+		return diffs[0].name;
+	}
+}
 
 
-export { PALETTES }
+export { PALETTES, ColourNamer }

src/index.md

@@ -8,7 +8,7 @@ toc: false
 
 colourful generative patterns using [d3](https://d3js.org/) and [Observable Framework](https://observablehq.com/framework/)
 
-<p>v1.1.2 | by <a href="https://mikelynch.org">mike lynch</a> | <a href="https://aus.social/@mikelynch">@mikelynch@aus.social</a> | <a href="https://git.tilde.town/bombinans/poptimal">source</a></p>
+<p>v1.1.1 | by <a href="https://mikelynch.org">mike lynch</a> | <a href="https://aus.social/@mikelynch">@mikelynch@aus.social</a> | <a href="https://git.tilde.town/bombinans/poptimal">source</a></p>
 
 <div class="grid grid-cols-2">
 
@@ -118,8 +118,8 @@ if( palette_fn ) {
 
 ```js
 
-const dots1 = dm.dots(1 / m1, n1, false);
-const dots2 = dm.dots(1 / m2, n2, false);
+const dots1 = dm.dots(1 / m1, n1);
+const dots2 = dm.dots(1 / m2, n2);
 
 
 ```
@@ -134,15 +134,6 @@ const svg = d3.create("svg")
   .attr("viewBox", [ 0, 0, WIDTH, HEIGHT ]);
 
 
-svg.append("clipPath")
-    .attr("id", "clipRect")
-    .append("rect")
-    .attr("x", 0)
-    .attr("y", 0)
-    .attr("width", WIDTH)
-    .attr("height", HEIGHT);
-
-
 // re transitions: they should only run when updating the palette and
 // grid, not via the sliders
 
@@ -167,8 +158,7 @@ bg_g.selectAll("rect")
 
 
 const dots_g1 = svg.append("g")
-  .attr("id", "dots1")
-  .attr("clip-path", "url(#clipRect)");
+  .attr("id", "dots1");
 
 dots_g1.selectAll("circle")
   .data(dots1)
@@ -178,8 +168,7 @@ dots_g1.selectAll("circle")
   .attr("fill", fg1);
 
 const dots_g2 = svg.append("g")
-  .attr("id", "dots2")
-  .attr("clip-path", "url(#clipRect)");
+  .attr("id", "dots2");
 
 dots_g2.selectAll("circle")
   .data(dots2)