@a2f0/skyline 0.2.25 → 0.2.27

package/README.md

@@ -47,8 +47,9 @@ bun run deploy                    # publish to Cloudflare; needs Node.js 22+ and
 
 [Development](docs/development.md) explains the checks, hooks, and PR workflow, and
 [Deploying](docs/deploying.md) the release, its verification, and the gitignored `.secrets` link
-(`ln -s ../matrix-secrets/skyline .secrets`) that Terraform reads credentials through. To add a
-building or improve one, start with [Adding a building](docs/adding-a-building.md) or the
-[fidelity queue](docs/building-fidelity.md). Coding agents follow [`AGENTS.md`](AGENTS.md).
+(`ln -s ../matrix-secrets/skyline .secrets`) that Terraform reads its Cloudflare and R2 state
+credentials through. To add a building or improve one, start with
+[Adding a building](docs/adding-a-building.md) or the [fidelity queue](docs/building-fidelity.md).
+Coding agents follow [`AGENTS.md`](AGENTS.md).
 
 All documentation is indexed in [`docs/`](docs/README.md).

package/lib/models/colour-palette.d.ts

@@ -9,8 +9,9 @@ export declare const daylightColours: {
 export declare const nightColours: {
     readonly ambient: 10596296;
     readonly fill: 9281469;
-    readonly window: 16764817;
-    readonly windowWhite: 16772558;
+    readonly window: 16761213;
+    readonly windowWhite: 16772570;
+    readonly windowCool: 14478079;
 };
 export declare const timeOfDayColours: readonly [{
     readonly elevation: -18;

package/lib/models/colour-palette.js

@@ -290,8 +290,9 @@ export const measuredColours = {
 // above the horizon, each the median of a clear box of the same panorama (scripts/sample-colours.ts,
 // the day study's sky), and the sun's warm white, chosen.
 export const daylightColours = { sky: 0x9ebbdb, horizon: 0xc4d1e1, sun: 0xfff4e6 };
-// Art-directed night illumination: quiet cool facades and a mix of warm office lamps.
-export const nightColours = { ambient: 0xa1afc8, fill: 0x8d9fbd, window: 0xffcf91, windowWhite: 0xffedce };
+// Illustrated warm, neutral and cool white fixtures; not calibrated Kelvin values.
+// DOE's white-tuning overview informs the range; see docs/viewer.md (time of day).
+export const nightColours = { ambient: 0xa1afc8, fill: 0x8d9fbd, window: 0xffc17d, windowWhite: 0xffedda, windowCool: 0xdceaff };
 // Illustrated clear-sky time previews. Solar elevation chooses the stops; these are
 // artistic colours, separate from the photograph-calibrated daytime palette above.
 export const timeOfDayColours = [

package/lib/models/colour-reflections.js

@@ -22,6 +22,7 @@ export function glassReflection(material, geometry, mask, windows = new Float32A
         skylineWindowsSuppressed: { value: 0 },
         skylineWindowWarm: { value: new THREE.Color(nightColours.window) },
         skylineWindowWhite: { value: new THREE.Color(nightColours.windowWhite) },
+        skylineWindowCool: { value: new THREE.Color(nightColours.windowCool) },
     };
     const compile = (shader, renderer) => {
         originalCompile.call(material, shader, renderer);
@@ -44,7 +45,8 @@ uniform float skylineDarkness;
 uniform float skylineActivity;
 uniform float skylineWindowsSuppressed;
 uniform vec3 skylineWindowWarm;
-uniform vec3 skylineWindowWhite;`).replace("#include <opaque_fragment>", `
+uniform vec3 skylineWindowWhite;
+uniform vec3 skylineWindowCool;`).replace("#include <opaque_fragment>", `
 if (vSkylineGlass > 0.0 && skylineReflecting > 0.0) {
   vec3 eye = vec3(0.0);
   eye.z = 1.0;
@@ -59,7 +61,10 @@ if (vSkylineWindow.z > 0.0 && skylineDarkness > 0.0) {
   float occupied = 1.0 - smoothstep(skylineActivity - 0.05, skylineActivity + 0.05, vSkylineWindow.x);
   float dusk = smoothstep(0.12 + 0.35 * vSkylineWindow.x, 0.45 + 0.35 * vSkylineWindow.x, skylineDarkness);
   float light = vSkylineWindow.z > 1.5 ? skylineDarkness : occupied * dusk * (1.0 - skylineWindowsSuppressed);
-  vec3 lamp = mix(skylineWindowWarm, skylineWindowWhite, vSkylineWindow.w);
+  float tint = vSkylineWindow.w;
+  vec3 lamp = tint < 0.5
+    ? mix(skylineWindowWarm, skylineWindowWhite, tint * 2.0)
+    : mix(skylineWindowWhite, skylineWindowCool, (tint - 0.5) * 2.0);
   outgoingLight += lamp * vSkylineWindow.y * light;
 }
 #include <opaque_fragment>`);
@@ -74,7 +79,7 @@ if (vSkylineWindow.z > 0.0 && skylineDarkness > 0.0) {
             geometry.setAttribute("skylineGlass", attribute);
             geometry.setAttribute("skylineWindow", windowAttribute);
             material.onBeforeCompile = compile;
-            material.customProgramCacheKey = () => `${key}:skyline-facade-v2`;
+            material.customProgramCacheKey = () => `${key}:skyline-facade-v3`;
         }
         else {
             material.onBeforeCompile = originalCompile;
@@ -99,7 +104,7 @@ if (vSkylineWindow.z > 0.0 && skylineDarkness > 0.0) {
             uniforms.skylineDarkness.value = lighting?.darkness ?? 0;
             uniforms.skylineWindowsSuppressed.value = celebration ? 1 : 0;
             uniforms.skylineActivity.value = lighting?.activity ?? 0;
-            for (const [uniform, hex] of [[uniforms.skylineWindowWarm, nightColours.window], [uniforms.skylineWindowWhite, nightColours.windowWhite]]) {
+            for (const [uniform, hex] of [[uniforms.skylineWindowWarm, nightColours.window], [uniforms.skylineWindowWhite, nightColours.windowWhite], [uniforms.skylineWindowCool, nightColours.windowCool]]) {
                 uniform.value.setHex(hex);
                 if (!coloured) {
                     const { r, g, b } = uniform.value, grey = r * 0.2126 + g * 0.7152 + b * 0.0722;

package/lib/models/night-windows.js

@@ -29,6 +29,11 @@ const architectural = new Set(["lamp", "crown lights", "band lights", "sign lett
 export function nightWindowMask(geometry, buildingId, materialOf) {
     const positions = geometry.getAttribute("position"), normals = geometry.getAttribute("normal");
     const mask = new Float32Array(positions.count * 4);
+    // A dominant fixture family per building, with smaller tenant-floor and room
+    // differences. Independent seeds keep colour from tracking occupancy/brightness.
+    // These are illustrated white-light mixes, not surveyed fixture temperatures.
+    const buildingTint = hash(`${buildingId}:fixture`);
+    const architecturalTint = 0.15 + 0.65 * hash(`${buildingId}:architectural-fixture`);
     const samePoint = (a, b) => positions.getX(a) === positions.getX(b) && positions.getY(a) === positions.getY(b) && positions.getZ(a) === positions.getZ(b);
     for (let first = 0; first < positions.count;) {
         const name = materialOf(first), crown = architectural.has(name);
@@ -61,6 +66,9 @@ export function nightWindowMask(geometry, buildingId, materialOf) {
         const floor = Math.round(y / count / 3.4), across = Math.floor(x / count / 7), depth = Math.floor(z / count / 7);
         const room = hash(`${buildingId}:${floor}:${across}:${depth}`);
         const brightness = hash(`${buildingId}:${floor}:${across}:${depth}:brightness`);
+        const tint = crown ? architecturalTint : 0.65 * buildingTint
+            + 0.2 * hash(`${buildingId}:${floor}:fixture`)
+            + 0.15 * hash(`${buildingId}:${floor}:${across}:${depth}:fixture`);
         for (let vertex = first; vertex < end; vertex += 1) {
             if (materialOf(vertex) !== name)
                 continue;
@@ -68,7 +76,7 @@ export function nightWindowMask(geometry, buildingId, materialOf) {
             mask[vertex * 4] = rank;
             mask[vertex * 4 + 1] = crown ? 0.3 : 0.25 + brightness * 0.45;
             mask[vertex * 4 + 2] = crown ? 2 : 1;
-            mask[vertex * 4 + 3] = brightness;
+            mask[vertex * 4 + 3] = tint;
         }
         first = end;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a2f0/skyline",
-  "version": "0.2.25",
+  "version": "0.2.27",
   "description": "Interactive Chicago skyline viewer and reusable Three.js building models",
   "license": "UNLICENSED",
   "repository": {

package/site/models/colour-palette.js

@@ -290,8 +290,9 @@ export const measuredColours = {
 // above the horizon, each the median of a clear box of the same panorama (scripts/sample-colours.ts,
 // the day study's sky), and the sun's warm white, chosen.
 export const daylightColours = { sky: 0x9ebbdb, horizon: 0xc4d1e1, sun: 0xfff4e6 };
-// Art-directed night illumination: quiet cool facades and a mix of warm office lamps.
-export const nightColours = { ambient: 0xa1afc8, fill: 0x8d9fbd, window: 0xffcf91, windowWhite: 0xffedce };
+// Illustrated warm, neutral and cool white fixtures; not calibrated Kelvin values.
+// DOE's white-tuning overview informs the range; see docs/viewer.md (time of day).
+export const nightColours = { ambient: 0xa1afc8, fill: 0x8d9fbd, window: 0xffc17d, windowWhite: 0xffedda, windowCool: 0xdceaff };
 // Illustrated clear-sky time previews. Solar elevation chooses the stops; these are
 // artistic colours, separate from the photograph-calibrated daytime palette above.
 export const timeOfDayColours = [

package/site/models/colour-reflections.js

@@ -22,6 +22,7 @@ export function glassReflection(material, geometry, mask, windows = new Float32A
         skylineWindowsSuppressed: { value: 0 },
         skylineWindowWarm: { value: new THREE.Color(nightColours.window) },
         skylineWindowWhite: { value: new THREE.Color(nightColours.windowWhite) },
+        skylineWindowCool: { value: new THREE.Color(nightColours.windowCool) },
     };
     const compile = (shader, renderer) => {
         originalCompile.call(material, shader, renderer);
@@ -44,7 +45,8 @@ uniform float skylineDarkness;
 uniform float skylineActivity;
 uniform float skylineWindowsSuppressed;
 uniform vec3 skylineWindowWarm;
-uniform vec3 skylineWindowWhite;`).replace("#include <opaque_fragment>", `
+uniform vec3 skylineWindowWhite;
+uniform vec3 skylineWindowCool;`).replace("#include <opaque_fragment>", `
 if (vSkylineGlass > 0.0 && skylineReflecting > 0.0) {
   vec3 eye = vec3(0.0);
   eye.z = 1.0;
@@ -59,7 +61,10 @@ if (vSkylineWindow.z > 0.0 && skylineDarkness > 0.0) {
   float occupied = 1.0 - smoothstep(skylineActivity - 0.05, skylineActivity + 0.05, vSkylineWindow.x);
   float dusk = smoothstep(0.12 + 0.35 * vSkylineWindow.x, 0.45 + 0.35 * vSkylineWindow.x, skylineDarkness);
   float light = vSkylineWindow.z > 1.5 ? skylineDarkness : occupied * dusk * (1.0 - skylineWindowsSuppressed);
-  vec3 lamp = mix(skylineWindowWarm, skylineWindowWhite, vSkylineWindow.w);
+  float tint = vSkylineWindow.w;
+  vec3 lamp = tint < 0.5
+    ? mix(skylineWindowWarm, skylineWindowWhite, tint * 2.0)
+    : mix(skylineWindowWhite, skylineWindowCool, (tint - 0.5) * 2.0);
   outgoingLight += lamp * vSkylineWindow.y * light;
 }
 #include <opaque_fragment>`);
@@ -74,7 +79,7 @@ if (vSkylineWindow.z > 0.0 && skylineDarkness > 0.0) {
             geometry.setAttribute("skylineGlass", attribute);
             geometry.setAttribute("skylineWindow", windowAttribute);
             material.onBeforeCompile = compile;
-            material.customProgramCacheKey = () => `${key}:skyline-facade-v2`;
+            material.customProgramCacheKey = () => `${key}:skyline-facade-v3`;
         }
         else {
             material.onBeforeCompile = originalCompile;
@@ -99,7 +104,7 @@ if (vSkylineWindow.z > 0.0 && skylineDarkness > 0.0) {
             uniforms.skylineDarkness.value = lighting?.darkness ?? 0;
             uniforms.skylineWindowsSuppressed.value = celebration ? 1 : 0;
             uniforms.skylineActivity.value = lighting?.activity ?? 0;
-            for (const [uniform, hex] of [[uniforms.skylineWindowWarm, nightColours.window], [uniforms.skylineWindowWhite, nightColours.windowWhite]]) {
+            for (const [uniform, hex] of [[uniforms.skylineWindowWarm, nightColours.window], [uniforms.skylineWindowWhite, nightColours.windowWhite], [uniforms.skylineWindowCool, nightColours.windowCool]]) {
                 uniform.value.setHex(hex);
                 if (!coloured) {
                     const { r, g, b } = uniform.value, grey = r * 0.2126 + g * 0.7152 + b * 0.0722;

package/site/models/night-windows.js

@@ -29,6 +29,11 @@ const architectural = new Set(["lamp", "crown lights", "band lights", "sign lett
 export function nightWindowMask(geometry, buildingId, materialOf) {
     const positions = geometry.getAttribute("position"), normals = geometry.getAttribute("normal");
     const mask = new Float32Array(positions.count * 4);
+    // A dominant fixture family per building, with smaller tenant-floor and room
+    // differences. Independent seeds keep colour from tracking occupancy/brightness.
+    // These are illustrated white-light mixes, not surveyed fixture temperatures.
+    const buildingTint = hash(`${buildingId}:fixture`);
+    const architecturalTint = 0.15 + 0.65 * hash(`${buildingId}:architectural-fixture`);
     const samePoint = (a, b) => positions.getX(a) === positions.getX(b) && positions.getY(a) === positions.getY(b) && positions.getZ(a) === positions.getZ(b);
     for (let first = 0; first < positions.count;) {
         const name = materialOf(first), crown = architectural.has(name);
@@ -61,6 +66,9 @@ export function nightWindowMask(geometry, buildingId, materialOf) {
         const floor = Math.round(y / count / 3.4), across = Math.floor(x / count / 7), depth = Math.floor(z / count / 7);
         const room = hash(`${buildingId}:${floor}:${across}:${depth}`);
         const brightness = hash(`${buildingId}:${floor}:${across}:${depth}:brightness`);
+        const tint = crown ? architecturalTint : 0.65 * buildingTint
+            + 0.2 * hash(`${buildingId}:${floor}:fixture`)
+            + 0.15 * hash(`${buildingId}:${floor}:${across}:${depth}:fixture`);
         for (let vertex = first; vertex < end; vertex += 1) {
             if (materialOf(vertex) !== name)
                 continue;
@@ -68,7 +76,7 @@ export function nightWindowMask(geometry, buildingId, materialOf) {
             mask[vertex * 4] = rank;
             mask[vertex * 4 + 1] = crown ? 0.3 : 0.25 + brightness * 0.45;
             mask[vertex * 4 + 2] = crown ? 2 : 1;
-            mask[vertex * 4 + 3] = brightness;
+            mask[vertex * 4 + 3] = tint;
         }
         first = end;
     }