refactor: update sky colors and render stars based on state

renderer/internal/colors.mjs

@@ -1,14 +1,25 @@
+import { state } from './state.mjs';
 import { randomFloat } from '../../utils/rng.mjs';
 
 export const colors = {
     primary_sky: {
         h: randomFloat('sky_hue'),
         s: randomFloat('sky_saturation', 0.7, 0.9),
-        v: randomFloat('sky_value_1', 0.5, 0.7)
+        v: randomFloat('sky_value_1', 0.6, 0.85)
     },
     secondary_sky: {
         h: randomFloat('sky_hue') * 0.85,
         s: randomFloat('sky_saturation', 0.7, 0.9),
-        v: randomFloat('sky_value_2', 0.5, 0.7)
+        v: randomFloat('sky_value_2', 0.6, 0.85)
+    },
+    star: {
+        h: randomFloat('sky_hue'),
+        s: .2,
+        v: .8,
     }
 };
+
+if (state.isNight) {
+    colors.primary_sky.v -= .6;
+    colors.secondary_sky.v -= .4;
+}

renderer/internal/renderSky.mjs

@@ -1,23 +1,12 @@
 import { randomColor, randomFloat, noise, randomBool, randomInt } from '../../utils/rng.mjs';
+import { colors } from './colors.mjs';
+import { state } from './state.mjs';
 import { setPixel } from './setPixel.mjs';
 import { toRGB } from './toRGB.mjs';
 import { readBuffer } from './readBuffer.mjs';
 import { applyBuffer } from './applyBuffer.mjs';
 import { renderSkyBackground } from './renderSkyBackground.mjs';
-import { calculateTerrainHeight } from './calculateTerrainHeight.mjs';
-
-function renderStars(canvas) {
-    const isNight = randomBool();
-
-    if (!isNight) {
-        return;
-    }
-
-    const data = readBuffer(canvas);
-    const starCount = randomInt('star_count', 100, 300);
-
-    applyBuffer(canvas, data);
-}
+import { renderStars } from './renderStars.mjs';
 
 /**
  * 
@@ -31,9 +20,6 @@ export function renderSky(canvas) {
 /*
     function drawSky() {
     // ... (existing code)
-
-    drawSkyBackground();
-    drawStars();
     drawSunOrPlanet();
     drawAtlasIfPresent();
     drawCloudsIfNotNight();

renderer/internal/renderStars.mjs

@@ -0,0 +1,39 @@
+import { randomInt } from '../../utils/rng.mjs';
+import { colors } from './colors.mjs';
+import { state } from './state.mjs';
+import { setPixel } from './setPixel.mjs';
+import { toRGB } from './toRGB.mjs';
+import { readBuffer } from './readBuffer.mjs';
+import { applyBuffer } from './applyBuffer.mjs';
+import { calculateTerrainHeight } from './calculateTerrainHeight.mjs';
+
+/**
+ * 
+ * @param {HTMLCanvasElement} canvas 
+ * @returns 
+ */
+export function renderStars(canvas) {
+    if (!state.isNight) {
+        return;
+    }
+
+    const data = readBuffer(canvas);
+    const { width, height } = canvas;
+
+    for (let i = 0; i < state.starCount; i++) {
+        const x = randomInt(`star_x_${i}`, 0, width);
+        const y = randomInt(`star_y_${i}`, 0, height);
+
+        const maxTerrainHeight = height * Math.min(
+            ...calculateTerrainHeight(x, width)
+        );
+
+        if (y > maxTerrainHeight) {
+            continue;
+        }
+
+        setPixel(data, x, y, toRGB(colors.star));
+
+        applyBuffer(canvas, data);
+    }
+}

renderer/internal/state.mjs

@@ -0,0 +1,13 @@
+import { randomBool, randomInt } from "../../utils/rng.mjs";
+
+const isNight = () => randomBool('is_night');
+const starCount = () => randomInt('star_count', 200, 400);
+const sunCount = () => randomInt('sun_count', 1, 3);
+
+
+export const state = {
+    isNight: isNight(),
+    starCount: starCount(),
+    sunCount: sunCount(),
+    isSunVisible: !isNight() && sunCount() > 0,
+}