[Migration] NPM (#1266)

* 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

* fix: Update Node.js version in Dockerfile to 24-alpine

---------

Co-authored-by: Marc Emmanuel <marc.emmanuel@tado.com>
Co-authored-by: Marc Emmanuel <marcwissler@gmail.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: Azgaar <26469650+Azgaar@users.noreply.github.com>

public/modules/renderers/draw-features.js

@@ -0,0 +1,66 @@
+"use strict";
+
+function drawFeatures() {
+  TIME && console.time("drawFeatures");
+
+  const html = {
+    paths: [],
+    landMask: [],
+    waterMask: ['<rect x="0" y="0" width="100%" height="100%" fill="white" />'],
+    coastline: {},
+    lakes: {}
+  };
+
+  for (const feature of pack.features) {
+    if (!feature || feature.type === "ocean") continue;
+
+    html.paths.push(`<path d="${getFeaturePath(feature)}" id="feature_${feature.i}" data-f="${feature.i}"></path>`);
+
+    if (feature.type === "lake") {
+      html.landMask.push(`<use href="#feature_${feature.i}" data-f="${feature.i}" fill="black"></use>`);
+
+      const lakeGroup = feature.group || "freshwater";
+      if (!html.lakes[lakeGroup]) html.lakes[lakeGroup] = [];
+      html.lakes[lakeGroup].push(`<use href="#feature_${feature.i}" data-f="${feature.i}"></use>`);
+    } else {
+      html.landMask.push(`<use href="#feature_${feature.i}" data-f="${feature.i}" fill="white"></use>`);
+      html.waterMask.push(`<use href="#feature_${feature.i}" data-f="${feature.i}" fill="black"></use>`);
+
+      const coastlineGroup = feature.group === "lake_island" ? "lake_island" : "sea_island";
+      if (!html.coastline[coastlineGroup]) html.coastline[coastlineGroup] = [];
+      html.coastline[coastlineGroup].push(`<use href="#feature_${feature.i}" data-f="${feature.i}"></use>`);
+    }
+  }
+
+  defs.select("#featurePaths").html(html.paths.join(""));
+  defs.select("#land").html(html.landMask.join(""));
+  defs.select("#water").html(html.waterMask.join(""));
+
+  coastline.selectAll("g").each(function () {
+    const paths = html.coastline[this.id] || [];
+    d3.select(this).html(paths.join(""));
+  });
+
+  lakes.selectAll("g").each(function () {
+    const paths = html.lakes[this.id] || [];
+    d3.select(this).html(paths.join(""));
+  });
+
+  TIME && console.timeEnd("drawFeatures");
+}
+
+function getFeaturePath(feature) {
+  const points = feature.vertices.map(vertex => pack.vertices.p[vertex]);
+  if (points.some(point => point === undefined)) {
+    ERROR && console.error("Undefined point in getFeaturePath");
+    return "";
+  }
+
+  const simplifiedPoints = simplify(points, 0.3);
+  const clippedPoints = clipPoly(simplifiedPoints, 1);
+
+  const lineGen = d3.line().curve(d3.curveBasisClosed);
+  const path = round(lineGen(clippedPoints)) + "Z";
+
+  return path;
+}