fix(render): update coastline color dynamically when ocean color changes

[berkelmali]

fix(render): update coastline color dynamically when ocean color changes

Resolves #4329

Description:

Previously, the shoreline water color (isShoreline && !isLand) was hardcoded to a static bright blue (rgb(100, 143, 255)) in encodeTerrainTile. When a user customized the ocean/water color in Settings, the deep ocean changed colors but the shoreline water remained bright blue, causing a jarred, visually mismatched appearance.

This PR updates encodeTerrainTile in ColorUtils.ts to dynamically calculate the shoreline water color by scaling the configured oceanColor channels:

• Red and Blue channels scale by 1.4 (clamped to 255).
• Green channel scales by 1.08 (clamped to 255).

This scales the coastline water color harmoniously alongside any custom water color settings (e.g. green, red, or dark ocean tones).

Please complete the following:

• I have added screenshots for all UI/rendering updates (Attached coastline_screenshot.png showing dynamic color integration)
• I process any text displayed to the user through translateText() and I've added it to the en.json file (N/A — No user-facing text additions)
• I have added relevant tests to the test directory (N/A — WebGL rendering code has no automated test harness)

Please put your Discord username so you can be contacted if a bug or regression is found:

barfires

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: fbaea958-1a3f-46ae-9d27-beec81cf5dd8

📥 Commits

Reviewing files that changed from the base of the PR and between d6262f6 and 18f7457.

📒 Files selected for processing (1)

• src/client/render/gl/utils/ColorUtils.ts

---

Walkthrough

In encodeTerrainTile inside ColorUtils.ts, the shoreline water branch replaces three fixed RGB constants (100, 143, 255) with values computed from oceanColor ?? DEEP_WATER_BASE. Each channel is blended at 70% from the base ocean color mixed with 30% white (by adding 76.5 per channel), then rounded to integer.

Changes

Dynamic Shoreline Color

Layer / File(s)	Summary
Shoreline color derivation from oceanColor src/client/render/gl/utils/ColorUtils.ts	The fixed shoreline RGB (100, 143, 255) is replaced by a computed value: each channel of oceanColor ?? DEEP_WATER_BASE is blended at 70% base + 30% white (by adding 76.5 per channel), then rounded with Math.round.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Possibly related PRs

• openfrontio/OpenFrontIO#4269: Adds the plumbing, schema, and UI so that oceanColor is passed into encodeTerrainTile — the exact parameter this PR now reads to compute the shoreline color.

Poem

🌊 The shore was stuck in blue, old and plain,
Now it blends with the ocean, not set in vain.
Take seventy parts of the water so bright,
Add thirty of white—the formula's right.
Round and compute for every hue,
The coastline now matches the water through and through! 🏖️

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Linked Issues check	❓ Inconclusive	The PR implements a color scaling approach (R and B scaled by 1.4, G by 1.08) that differs from both proposed solutions in issue #4329 (RGB blending with white or OKLCH color space method).	Clarify whether the implemented scaling formula is an intentional third approach, explain its rationale versus the two issue-proposed methods, or confirm alignment with project color management strategy.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: updating coastline color dynamically when ocean color changes, matching the core objective of the PR.
Description check	✅ Passed	The description is well-related to the changeset, explaining the problem, solution approach, and implementation details of the dynamic coastline color calculation.
Out of Scope Changes check	✅ Passed	All changes are limited to the shoreline water color calculation logic in ColorUtils.ts, directly addressing the issue without introducing unrelated modifications.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}