chore: add biome for linting/formatting + CI action for linting in SRC folder (#1284)
Some checks are pending
Deploy static content to Pages / deploy (push) Waiting to run
Code quality / quality (push) Waiting to run

* chore: add npm + vite for progressive enhancement

* fix: update Dockerfile to copy only the dist folder contents

* fix: update Dockerfile to use multi-stage build for optimized production image

* fix: correct nginx config file copy command in Dockerfile

* chore: add netlify configuration for build and redirects

* fix: add NODE_VERSION to environment in Netlify configuration

* remove wrong dist folder

* Update package.json

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* chore: split public and src

* migrating all util files from js to ts

* feat: Implement HeightmapGenerator and Voronoi module

- Added HeightmapGenerator class for generating heightmaps with various tools (Hill, Pit, Range, Trough, Strait, etc.).
- Introduced Voronoi class for creating Voronoi diagrams using Delaunator.
- Updated index.html to include new modules.
- Created index.ts to manage module imports.
- Enhanced arrayUtils and graphUtils with type definitions and improved functionality.
- Added utility functions for generating grids and calculating Voronoi cells.

* chore: add GitHub Actions workflow for deploying to GitHub Pages

* fix: update branch name in GitHub Actions workflow from 'main' to 'master'

* chore: update package.json to specify Node.js engine version and remove unused launch.json

* Initial plan

* Update copilot guidelines to reflect NPM/Vite/TypeScript migration

Co-authored-by: Azgaar <26469650+Azgaar@users.noreply.github.com>

* Update src/modules/heightmap-generator.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update src/utils/graphUtils.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update src/modules/heightmap-generator.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* feat: Add TIME and ERROR variables to global scope in HeightmapGenerator

* fix: Update base path in vite.config.ts for Netlify deployment

* refactor: Migrate features to a new module and remove legacy script reference

* refactor: Update feature interfaces and improve type safety in FeatureModule

* refactor: Add documentation for markupPack and defineGroups methods in FeatureModule

* refactor: Remove legacy ocean-layers.js and migrate functionality to ocean-layers.ts

* refactor: Remove river-generator.js script reference and migrate river generation logic to river-generator.ts

* refactor: Remove river-generator.js reference and add biomes module

* refactor: Migrate lakes functionality to lakes.ts and update related interfaces

* refactor: clean up global variable declarations and improve type definitions

* refactor: update shoreline calculation and improve type imports in PackedGraph

* fix: e2e tests

* chore: add biome for linting/formatting

* chore: add linting workflow using Biome

* refactor: improve code readability by standardizing string quotes and simplifying function calls

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Azgaar <maxganiev@yandex.com>
Co-authored-by: Azgaar <azgaar.fmg@yandex.com>
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: Azgaar <26469650+Azgaar@users.noreply.github.com>
This commit is contained in:
Marc Emmanuel 2026-01-26 22:30:28 +01:00 committed by GitHub
parent e37fce1eed
commit 9db40a5230
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
31 changed files with 2001 additions and 782 deletions

View file

@ -1,8 +1,6 @@
import Alea from "alea";
import { each, rn, round, rw} from "../utils";
import { curveBasis, line, mean, min, sum, curveCatmullRom } from "d3";
import { curveBasis, curveCatmullRom, line, mean, min, sum } from "d3";
import { each, rn, round, rw } from "../utils";
declare global {
var Rivers: RiverModule;
@ -29,18 +27,20 @@ class RiverModule {
private MAX_FLUX_WIDTH = 1;
private LENGTH_FACTOR = 200;
private LENGTH_STEP_WIDTH = 1 / this.LENGTH_FACTOR;
private LENGTH_PROGRESSION = [1, 1, 2, 3, 5, 8, 13, 21, 34].map(n => n / this.LENGTH_FACTOR);
private lineGen = line().curve(curveBasis)
private LENGTH_PROGRESSION = [1, 1, 2, 3, 5, 8, 13, 21, 34].map(
(n) => n / this.LENGTH_FACTOR,
);
private lineGen = line().curve(curveBasis);
riverTypes = {
main: {
big: {River: 1},
small: {Creek: 9, River: 3, Brook: 3, Stream: 1}
big: { River: 1 },
small: { Creek: 9, River: 3, Brook: 3, Stream: 1 },
},
fork: {
big: {Fork: 1},
small: {Branch: 1}
}
big: { Fork: 1 },
small: { Branch: 1 },
},
};
smallLength: number | null = null;
@ -48,10 +48,10 @@ class RiverModule {
generate(allowErosion = true) {
TIME && console.time("generateRivers");
Math.random = Alea(seed);
const {cells, features} = pack;
const { cells, features } = pack;
const riversData: {[riverId: number]: number[]} = {};
const riverParents: {[key: number]: number} = {};
const riversData: { [riverId: number]: number[] } = {};
const riverParents: { [key: number]: number } = {};
const addCellToRiver = (cellId: number, riverId: number) => {
if (!riversData[riverId]) riversData[riverId] = [cellId];
@ -60,26 +60,36 @@ class RiverModule {
const drainWater = () => {
const MIN_FLUX_TO_FORM_RIVER = 30;
const cellsNumberModifier = ((pointsInput.dataset.cells as any) / 10000) ** 0.25;
const cellsNumberModifier =
((pointsInput.dataset.cells as any) / 10000) ** 0.25;
const prec = grid.cells.prec;
const land = cells.i.filter((i: number) => h[i] >= 20).sort((a: number, b: number) => h[b] - h[a]);
const land = cells.i
.filter((i: number) => h[i] >= 20)
.sort((a: number, b: number) => h[b] - h[a]);
const lakeOutCells = Lakes.defineClimateData(h);
land.forEach(function (i: number) {
for (const i of land) {
cells.fl[i] += prec[cells.g[i]] / cellsNumberModifier; // add flux from precipitation
// create lake outlet if lake is not in deep depression and flux > evaporation
const lakes = lakeOutCells[i]
? features.filter((feature: any) => i === feature.outCell && feature.flux > feature.evaporation)
? features.filter(
(feature: any) =>
i === feature.outCell && feature.flux > feature.evaporation,
)
: [];
for (const lake of lakes) {
const lakeCell = cells.c[i].find((c: number) => h[c] < 20 && cells.f[c] === lake.i)!;
const lakeCell = cells.c[i].find(
(c: number) => h[c] < 20 && cells.f[c] === lake.i,
)!;
cells.fl[lakeCell] += Math.max(lake.flux - lake.evaporation, 0); // not evaporated lake water drains to outlet
// allow chain lakes to retain identity
if (cells.r[lakeCell] !== lake.river) {
const sameRiver = cells.c[lakeCell].some((c: number) => cells.r[c] === lake.river);
const sameRiver = cells.c[lakeCell].some(
(c: number) => cells.r[c] === lake.river,
);
if (sameRiver) {
cells.r[lakeCell] = lake.river as number;
@ -105,12 +115,18 @@ class RiverModule {
}
// near-border cell: pour water out of the screen
if (cells.b[i] && cells.r[i]) return addCellToRiver(-1, cells.r[i]);
if (cells.b[i] && cells.r[i]) {
addCellToRiver(-1, cells.r[i]);
continue;
}
// downhill cell (make sure it's not in the source lake)
let min = null;
if (lakeOutCells[i]) {
const filtered = cells.c[i].filter((c: number) => !lakes.map((lake: any) => lake.i).includes(cells.f[c]));
const filtered = cells.c[i].filter(
(c: number) =>
!lakes.map((lake: any) => lake.i).includes(cells.f[c]),
);
min = filtered.sort((a: number, b: number) => h[a] - h[b])[0];
} else if (cells.haven[i]) {
min = cells.haven[i];
@ -119,7 +135,7 @@ class RiverModule {
}
// cells is depressed
if (h[i] <= h[min]) return;
if (h[i] <= h[min]) continue;
// debug
// .append("line")
@ -133,7 +149,7 @@ class RiverModule {
if (cells.fl[i] < MIN_FLUX_TO_FORM_RIVER) {
// flux is too small to operate as a river
if (h[min] >= 20) cells.fl[min] += cells.fl[i];
return;
continue;
}
// proclaim a new river
@ -144,8 +160,8 @@ class RiverModule {
}
flowDown(min, cells.fl[i], cells.r[i]);
});
}
}
};
const flowDown = (toCell: number, fromFlux: number, river: number) => {
const toFlux = cells.fl[toCell] - cells.conf[toCell];
@ -167,7 +183,10 @@ class RiverModule {
// pour water to the water body
const waterBody = features[cells.f[toCell]];
if (waterBody.type === "lake") {
if (!waterBody.river || fromFlux > (waterBody.enteringFlux as number)) {
if (
!waterBody.river ||
fromFlux > (waterBody.enteringFlux as number)
) {
waterBody.river = river;
waterBody.enteringFlux = fromFlux;
}
@ -181,7 +200,7 @@ class RiverModule {
}
addCellToRiver(toCell, river);
}
};
const defineRivers = () => {
// re-initialize rivers and confluence arrays
@ -189,7 +208,10 @@ class RiverModule {
cells.conf = new Uint16Array(cells.i.length);
pack.rivers = [];
const defaultWidthFactor = rn(1 / ((pointsInput.dataset.cells as any) / 10000) ** 0.25, 2);
const defaultWidthFactor = rn(
1 / ((pointsInput.dataset.cells as any) / 10000) ** 0.25,
2,
);
const mainStemWidthFactor = defaultWidthFactor * 1.2;
for (const key in riversData) {
@ -209,7 +231,10 @@ class RiverModule {
const mouth = riverCells[riverCells.length - 2];
const parent = riverParents[key] || 0;
const widthFactor = !parent || parent === riverId ? mainStemWidthFactor : defaultWidthFactor;
const widthFactor =
!parent || parent === riverId
? mainStemWidthFactor
: defaultWidthFactor;
const meanderedPoints = this.addMeandering(riverCells);
const discharge = cells.fl[mouth]; // m3 in second
const length = this.getApproximateLength(meanderedPoints);
@ -219,8 +244,8 @@ class RiverModule {
flux: discharge,
pointIndex: meanderedPoints.length,
widthFactor,
startingWidth: sourceWidth
})
startingWidth: sourceWidth,
}),
);
pack.rivers.push({
@ -233,10 +258,10 @@ class RiverModule {
widthFactor,
sourceWidth,
parent,
cells: riverCells
cells: riverCells,
} as River);
}
}
};
const downcutRivers = () => {
const MAX_DOWNCUT = 5;
@ -245,14 +270,18 @@ class RiverModule {
if (cells.h[i] < 35) continue; // don't donwcut lowlands
if (!cells.fl[i]) continue;
const higherCells = cells.c[i].filter((c: number) => cells.h[c] > cells.h[i]);
const higherFlux = higherCells.reduce((acc: number, c: number) => acc + cells.fl[c], 0) / higherCells.length;
const higherCells = cells.c[i].filter(
(c: number) => cells.h[c] > cells.h[i],
);
const higherFlux =
higherCells.reduce((acc: number, c: number) => acc + cells.fl[c], 0) /
higherCells.length;
if (!higherFlux) continue;
const downcut = Math.floor(cells.fl[i] / higherFlux);
if (downcut) cells.h[i] -= Math.min(downcut, MAX_DOWNCUT);
}
}
};
const calculateConfluenceFlux = () => {
for (const i of cells.i) {
@ -262,9 +291,13 @@ class RiverModule {
.filter((c: number) => cells.r[c] && h[c] > h[i])
.map((c: number) => cells.fl[c])
.sort((a: number, b: number) => b - a);
cells.conf[i] = sortedInflux.reduce((acc: number, flux: number, index: number) => (index ? acc + flux : acc), 0);
cells.conf[i] = sortedInflux.reduce(
(acc: number, flux: number, index: number) =>
index ? acc + flux : acc,
0,
);
}
}
};
cells.fl = new Uint16Array(cells.i.length); // water flux array
cells.r = new Uint16Array(cells.i.length); // rivers array
@ -286,20 +319,28 @@ class RiverModule {
}
TIME && console.timeEnd("generateRivers");
};
}
alterHeights(): number[] {
const {h, c, t} = pack.cells as {h: Uint8Array, c: number[][], t: Uint8Array};
const { h, c, t } = pack.cells as {
h: Uint8Array;
c: number[][];
t: Uint8Array;
};
return Array.from(h).map((h, i) => {
if (h < 20 || t[i] < 1) return h;
return h + t[i] / 100 + (mean(c[i].map(c => t[c])) as number) / 10000;
return h + t[i] / 100 + (mean(c[i].map((c) => t[c])) as number) / 10000;
});
};
}
// depression filling algorithm (for a correct water flux modeling)
resolveDepressions(h: number[]) {
const {cells, features} = pack;
const maxIterations = +(document.getElementById("resolveDepressionsStepsOutput") as HTMLInputElement)?.value;
const { cells, features } = pack;
const maxIterations = +(
document.getElementById(
"resolveDepressionsStepsOutput",
) as HTMLInputElement
)?.value;
const checkLakeMaxIteration = maxIterations * 0.85;
const elevateLakeMaxIteration = maxIterations * 0.75;
@ -312,7 +353,11 @@ class RiverModule {
const progress = [];
let depressions = Infinity;
let prevDepressions = null;
for (let iteration = 0; depressions && iteration < maxIterations; iteration++) {
for (
let iteration = 0;
depressions && iteration < maxIterations;
iteration++
) {
if (progress.length > 5 && sum(progress) > 0) {
// bad progress, abort and set heights back
h = this.alterHeights();
@ -329,8 +374,11 @@ class RiverModule {
if (minHeight >= 100 || l.height > minHeight) continue;
if (iteration > elevateLakeMaxIteration) {
l.shoreline.forEach((i: number) => (h[i] = cells.h[i]));
l.height = (min(l.shoreline.map((s: number) => h[s])) as number) - 1;
l.shoreline.forEach((i: number) => {
h[i] = cells.h[i];
});
l.height =
(min(l.shoreline.map((s: number) => h[s])) as number) - 1;
l.closed = true;
continue;
}
@ -341,7 +389,9 @@ class RiverModule {
}
for (const i of land) {
const minHeight = min(cells.c[i].map((c: number) => height(c))) as number;
const minHeight = min(
cells.c[i].map((c: number) => height(c)),
) as number;
if (minHeight >= 100 || h[i] > minHeight) continue;
depressions++;
@ -352,11 +402,19 @@ class RiverModule {
prevDepressions = depressions;
}
depressions && WARN && console.warn(`Unresolved depressions: ${depressions}. Edit heightmap to fix`);
};
depressions &&
WARN &&
console.warn(
`Unresolved depressions: ${depressions}. Edit heightmap to fix`,
);
}
addMeandering(riverCells: number[], riverPoints = null, meandering = 0.5): [number, number, number][] {
const {fl, h} = pack.cells;
addMeandering(
riverCells: number[],
riverPoints = null,
meandering = 0.5,
): [number, number, number][] {
const { fl, h } = pack.cells;
const meandered = [];
const lastStep = riverCells.length - 1;
const points = this.getRiverPoints(riverCells, riverPoints);
@ -382,7 +440,8 @@ class RiverModule {
const dist2 = (x2 - x1) ** 2 + (y2 - y1) ** 2; // square distance between cells
if (dist2 <= 25 && riverCells.length >= 6) continue;
const meander = meandering + 1 / step + Math.max(meandering - step / 100, 0);
const meander =
meandering + 1 / step + Math.max(meandering - step / 100, 0);
const angle = Math.atan2(y2 - y1, x2 - x1);
const sinMeander = Math.sin(angle) * meander;
const cosMeander = Math.cos(angle) * meander;
@ -403,17 +462,17 @@ class RiverModule {
}
return meandered as [number, number, number][];
};
}
getRiverPoints(riverCells: number[], riverPoints: [number, number][] | null) {
if (riverPoints) return riverPoints;
const {p} = pack.cells;
const { p } = pack.cells;
return riverCells.map((cell, i) => {
if (cell === -1) return this.getBorderPoint(riverCells[i - 1]);
return p[cell];
});
};
}
getBorderPoint(i: number) {
const [x, y] = pack.cells.p[i];
@ -422,22 +481,42 @@ class RiverModule {
else if (min === graphHeight - y) return [x, graphHeight];
else if (min === x) return [0, y];
return [graphWidth, y];
};
}
getOffset({flux, pointIndex, widthFactor, startingWidth}: {flux: number, pointIndex: number, widthFactor: number, startingWidth: number}) {
getOffset({
flux,
pointIndex,
widthFactor,
startingWidth,
}: {
flux: number;
pointIndex: number;
widthFactor: number;
startingWidth: number;
}) {
if (pointIndex === 0) return startingWidth;
const fluxWidth = Math.min(flux ** 0.7 / this.FLUX_FACTOR, this.MAX_FLUX_WIDTH);
const lengthWidth = pointIndex * this.LENGTH_STEP_WIDTH + (this.LENGTH_PROGRESSION[pointIndex] || this.LENGTH_PROGRESSION.at(-1) as number);
const fluxWidth = Math.min(
flux ** 0.7 / this.FLUX_FACTOR,
this.MAX_FLUX_WIDTH,
);
const lengthWidth =
pointIndex * this.LENGTH_STEP_WIDTH +
(this.LENGTH_PROGRESSION[pointIndex] ||
(this.LENGTH_PROGRESSION.at(-1) as number));
return widthFactor * (lengthWidth + fluxWidth) + startingWidth;
};
}
getSourceWidth(flux: number) {
return rn(Math.min(flux ** 0.9 / this.FLUX_FACTOR, this.MAX_FLUX_WIDTH), 2);
}
// build polygon from a list of points and calculated offset (width)
getRiverPath(points: [number, number, number][], widthFactor: number, startingWidth: number) {
getRiverPath(
points: [number, number, number][],
widthFactor: number,
startingWidth: number,
) {
this.lineGen.curve(curveCatmullRom.alpha(0.1));
const riverPointsLeft: [number, number][] = [];
const riverPointsRight: [number, number][] = [];
@ -449,7 +528,12 @@ class RiverModule {
const [x2, y2] = points[pointIndex + 1] || points[pointIndex];
if (pointFlux > flux) flux = pointFlux;
const offset = this.getOffset({flux, pointIndex, widthFactor, startingWidth});
const offset = this.getOffset({
flux,
pointIndex,
widthFactor,
startingWidth,
});
const angle = Math.atan2(y0 - y2, x0 - x2);
const sinOffset = Math.sin(angle) * offset;
const cosOffset = Math.cos(angle) * offset;
@ -463,7 +547,7 @@ class RiverModule {
left = left.substring(left.indexOf("C"));
return round(right + left, 1);
};
}
specify() {
const rivers = pack.rivers;
@ -474,57 +558,69 @@ class RiverModule {
river.name = this.getName(river.mouth);
river.type = this.getType(river);
}
};
}
getName(cell: number) {
return Names.getCulture(pack.cells.culture[cell]);
};
}
getType({i, length, parent}: River) {
getType({ i, length, parent }: River) {
if (this.smallLength === null) {
const threshold = Math.ceil(pack.rivers.length * 0.15);
this.smallLength = pack.rivers.map(r => r.length || 0).sort((a: number, b: number) => a - b)[threshold];
this.smallLength = pack.rivers
.map((r) => r.length || 0)
.sort((a: number, b: number) => a - b)[threshold];
}
const isSmall: boolean = length < (this.smallLength as number);
const isFork = each(3)(i) && parent && parent !== i;
return rw(this.riverTypes[isFork ? "fork" : "main"][isSmall ? "small" : "big"]);
};
return rw(
this.riverTypes[isFork ? "fork" : "main"][isSmall ? "small" : "big"],
);
}
getApproximateLength(points: [number, number, number][]) {
const length = points.reduce((s, v, i, p) => s + (i ? Math.hypot(v[0] - p[i - 1][0], v[1] - p[i - 1][1]) : 0), 0);
const length = points.reduce(
(s, v, i, p) =>
s + (i ? Math.hypot(v[0] - p[i - 1][0], v[1] - p[i - 1][1]) : 0),
0,
);
return rn(length, 2);
};
}
// Real mouth width examples: Amazon 6000m, Volga 6000m, Dniepr 3000m, Mississippi 1300m, Themes 900m,
// Danube 800m, Daugava 600m, Neva 500m, Nile 450m, Don 400m, Wisla 300m, Pripyat 150m, Bug 140m, Muchavets 40m
getWidth(offset: number) {
return rn((offset / 1.5) ** 1.8, 2); // mouth width in km
};
return rn((offset / 1.5) ** 1.8, 2); // mouth width in km
}
// remove river and all its tributaries
remove(id: number) {
const cells = pack.cells;
const riversToRemove = pack.rivers.filter(r => r.i === id || r.parent === id || r.basin === id).map(r => r.i);
riversToRemove.forEach(r => rivers.select("#river" + r).remove());
const riversToRemove = pack.rivers
.filter((r) => r.i === id || r.parent === id || r.basin === id)
.map((r) => r.i);
riversToRemove.forEach((r) => {
rivers.select(`#river${r}`).remove();
});
cells.r.forEach((r, i) => {
if (!r || !riversToRemove.includes(r)) return;
cells.r[i] = 0;
cells.fl[i] = grid.cells.prec[cells.g[i]];
cells.conf[i] = 0;
});
pack.rivers = pack.rivers.filter(r => !riversToRemove.includes(r.i));
};
pack.rivers = pack.rivers.filter((r) => !riversToRemove.includes(r.i));
}
getBasin(r: number): number {
const parent = pack.rivers.find(river => river.i === r)?.parent;
const parent = pack.rivers.find((river) => river.i === r)?.parent;
if (!parent || r === parent) return r;
return this.getBasin(parent);
};
}
getNextId(rivers: {i: number}[]) {
return rivers.length ? Math.max(...rivers.map(r => r.i)) + 1 : 1;
};
getNextId(rivers: { i: number }[]) {
return rivers.length ? Math.max(...rivers.map((r) => r.i)) + 1 : 1;
}
}
window.Rivers = new RiverModule()
window.Rivers = new RiverModule();