shores.ts

1	import * as THREE from 'three'
2	import { type Channel, type Lake, channelsAt, mulberry32 } from '../world/lake.js'
3
4	/** The shores are made a stretch at a time, this many metres of lake each. */
5	const CHUNK = 100
6	/** Metres between rows of the land's mesh along the lake. */
7	const STEP = 5
8	const ROWS = CHUNK / STEP
9	/** How far inland each column of a bank's mesh is, metres: fine at the shore, coarse far off. */
10	const INLAND = [0, 2, 6, 14, 30, 60, 120, 220, 400]
11	/** How far across an island each column of its mesh is, as a fraction of its width. */
12	const ACROSS = [0, 0.04, 0.12, 0.25, 0.5, 0.75, 0.88, 0.96, 1]
13	/**
14	* How far the land is made in the direction the skater faces, and how far the other way,
15	* metres. The fog ends at 600. Facing across the lake, it is made that far both ways.
16	*/
17	const AHEAD = 700
18	const BEHIND = 100
19	/** Stretches made in one frame at most, so that turning round does not make them all at once. */
20	const MADE_AT_ONCE = 2
21	const TREES_PER_BANK = 60
22	const TREES_PER_ISLAND = 50
23	/** Reeds on an islet for each square metre of it, and the most on one. */
24	const REEDS_PER_M2 = 2.5
25	const MOST_REEDS = 260
26	/** Reeds on each stretch of a long island. */
27	const REEDS_PER_ISLAND = 1400
28
29	const snow = new THREE.MeshStandardMaterial({ color: 0xe8eef4, roughness: 0.9 })
30	const spruce = new THREE.MeshStandardMaterial({ color: 0x1f3b2c, roughness: 1, flatShading: true })
31	// A spruce is a cone standing on its base.
32	const cone = new THREE.ConeGeometry(1.7, 8, 6).translate(0, 4, 0)
33	// An islet is a low hump of frozen ground, white with frost, with reeds standing in it:
34	// dry, straw-coloured, a metre or two tall, and thin.
35	const frost = new THREE.MeshStandardMaterial({ color: 0xd9d6c8, roughness: 1 })
36	const straw = new THREE.MeshStandardMaterial({ color: 0xb59a62, roughness: 1 })
37	const hump = new THREE.SphereGeometry(1, 12, 5, 0, Math.PI * 2, 0, Math.PI / 2).scale(1, 0.14, 1)
38	const reed = new THREE.ConeGeometry(0.045, 1, 3).translate(0, 0.5, 0)
39
40	interface Chunk {
41	/** Where the chunk's own origin is: across the lake, and along it. */
42	x: number
43	s: number
44	group: THREE.Group
45	}
46
47	/** The water's edges at `s`: the outer shores, and the island between two channels. */
48	interface Shoreline {
49	left: number
50	right: number
51	/** The island's two shores; the same number where there is no island. */
52	islandLeft: number
53	islandRight: number
54	/** Whether the island is a low bank of reeds, as one standing in a channel is, and not wooded land. */
55	reeds?: boolean
56	}
57
58	function shoreline(channel: Channel, s: number): Shoreline {
59	const channels = channelsAt(channel, s)
60	const first = channels[0]!
61	const last = channels[channels.length - 1]!
62	const left = first.centre(s) - first.halfWidth(s)
63	const right = last.centre(s) + last.halfWidth(s)
64	// The land in the middle is the island between a fork's two channels, or the island
65	// standing in one channel.
66	const within = channels.length === 1 ? first.island(s) : 0
67	if (within > 0) return { left, right, islandLeft: first.centre(s) - within, islandRight: first.centre(s) + within, reeds: true }
68	const islandLeft = first.centre(s) + first.halfWidth(s)
69	const islandRight = last.centre(s) - last.halfWidth(s)
70	// One channel, or two that have not yet drawn apart: no island, and its two shores
71	// are put at one point so that the mesh made for it closes up to nothing.
72	if (islandRight <= islandLeft) {
73	const middle = (islandLeft + islandRight) / 2
74	return { left, right, islandLeft: middle, islandRight: middle }
75	}
76	return { left, right, islandLeft, islandRight }
77	}
78
79	/**
80	* A strip of land for one stretch, `columns` wide, as a mesh whose vertices are measured
81	* from the stretch's own origin (`x0`, `s0`) so that they stay small numbers. `place`
82	* says where column `col` is at `s`, across and up.
83	*/
84	function land(columns: number, x0: number, s0: number, place: (s: number, col: number) => [number, number]): THREE.BufferGeometry {
85	// One row more at each end than is drawn. The normals are worked out with them and
86	// they are then left out, so the shading runs unbroken from one stretch into the next.
87	const positions = new Float32Array((ROWS + 3) * columns * 3)
88	let p = 0
89	for (let row = -1; row <= ROWS + 1; row++) {
90	const s = s0 + row * STEP
91	for (let col = 0; col < columns; col++) {
92	const [x, y] = place(s, col)
93	positions[p++] = x - x0
94	positions[p++] = y
95	positions[p++] = -(s - s0)
96	}
97	}
98	const quads = (from: number, to: number): number[] => {
99	const index: number[] = []
100	for (let row = from; row < to; row++) {
101	for (let col = 0; col < columns - 1; col++) {
102	const a = row * columns + col
103	const b = a + 1
104	const c = a + columns
105	const d = c + 1
106	// Columns run left to right; wound so that the land faces up.
107	index.push(a, b, c, b, d, c)
108	}
109	}
110	return index
111	}
112	const geometry = new THREE.BufferGeometry()
113	geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3))
114	geometry.setIndex(quads(0, ROWS + 2))
115	geometry.computeVertexNormals()
116	geometry.setIndex(quads(1, ROWS + 1))
117	return geometry
118	}
119
120	/**
121	* How high a strip of land's mesh is at `s` along and `at` across, where `columns` is
122	* what its columns are placed by and `height` the height it was given at a row and a
123	* column. Not the height of the land itself there: the mesh is flat between its rows and
124	* columns and the land curves, so the two differ by a metre or more far inland, where
125	* the columns are far apart. Whatever stands on the land stands on its mesh.
126	*/
127	function meshHeight(s0: number, s: number, columns: readonly number[], at: number, height: (s: number, column: number) => number): number {
128	let col = 0
129	while (col < columns.length - 2 && columns[col + 1]! < at) col++
130	const across = Math.max(0, Math.min(1, (at - columns[col]!) / (columns[col + 1]! - columns[col]!)))
131	const row = Math.floor((s - s0) / STEP)
132	const along = (s - s0) / STEP - row
133	const atRow = (r: number): number => {
134	const rowS = s0 + r * STEP
135	return height(rowS, columns[col]!) * (1 - across) + height(rowS, columns[col + 1]!) * across
136	}
137	return atRow(row) * (1 - along) + atRow(row + 1) * along
138	}
139
140	/** How high the island between two channels is at `s`, a fraction `t` of the way across it. */
141	function islandHeight(lake: Lake, channel: Channel, s: number, t: number): number {
142	const { islandLeft, islandRight, reeds } = shoreline(channel, s)
143	// An island rises from both its shores, so its height is that of land as far inland
144	// as its nearer shore. A bank of reeds is a quarter as high as wooded land would be.
145	return lake.bankHeight(1, s, Math.min(t, 1 - t) * (islandRight - islandLeft)) * (reeds ? 0.25 : 1)
146	}
147
148	function trees(lake: Lake, channel: Channel, seed: number, index: number, x0: number, s0: number): THREE.InstancedMesh {
149	const random = mulberry32(seed ^ Math.imul(index, 0x9e3779b1))
150	const mesh = new THREE.InstancedMesh(cone, spruce, TREES_PER_BANK * 2 + TREES_PER_ISLAND)
151	const at = new THREE.Object3D()
152	let n = 0
153	const plant = (x: number, s: number, ground: number, size: number): void => {
154	// A little into the ground, so that no tree shows its base on a slope.
155	at.position.set(x - x0, ground - 0.3, -(s - s0))
156	at.rotation.y = random() * Math.PI
157	at.scale.set(size, size * (0.8 + random() * 0.5), size)
158	at.updateMatrix()
159	mesh.setMatrixAt(n++, at.matrix)
160	}
161	for (const side of [-1, 1] as const) {
162	for (let i = 0; i < TREES_PER_BANK; i++) {
163	const s = s0 + random() * CHUNK
164	const shore = shoreline(channel, s)
165	// Thick along the shore and thinning out up the hill.
166	const d = 5 + random() ** 2 * 170
167	const ground = meshHeight(s0, s, INLAND, d, (rowS, inland) => lake.bankHeight(side, rowS, inland))
168	plant((side < 0 ? shore.left : shore.right) + side * d, s, ground, 0.7 + random() * 0.9)
169	}
170	}
171	for (let i = 0; i < TREES_PER_ISLAND; i++) {
172	const s = s0 + random() * CHUNK
173	const { islandLeft, islandRight, reeds } = shoreline(channel, s)
174	const width = islandRight - islandLeft
175	const x = islandLeft + 2 + random() * (width - 4)
176	const wooded = width > 8 && !reeds
177	const ground = wooded ? meshHeight(s0, s, ACROSS, (x - islandLeft) / width, (rowS, t) => islandHeight(lake, channel, rowS, t)) : 0
178	// No island here, one too narrow to stand a tree on, or one of reeds: a tree of no size.
179	plant(x, s, ground, wooded ? 0.7 + random() * 0.9 : 0)
180	}
181	return mesh
182	}
183
184	/** The reeds of one stretch of an island that has them, if there is one in this stretch. */
185	function islandReeds(lake: Lake, channel: Channel, seed: number, index: number, x0: number, s0: number): THREE.Object3D[] {
186	let any = false
187	for (let s = s0; s <= s0 + CHUNK && !any; s += STEP) any = shoreline(channel, s).reeds === true
188	if (!any) return []
189	const random = mulberry32(seed ^ Math.imul(index, 0xc2b2ae35))
190	const stand = new THREE.InstancedMesh(reed, straw, REEDS_PER_ISLAND)
191	const at = new THREE.Object3D()
192	for (let n = 0; n < REEDS_PER_ISLAND; n++) {
193	const s = s0 + random() * CHUNK
194	const { islandLeft, islandRight, reeds } = shoreline(channel, s)
195	const width = islandRight - islandLeft
196	// Across all of it but its very edges.
197	const t = 0.06 + 0.88 * random()
198	const here = reeds && width > 1.5
199	at.position.set(
200	islandLeft + t * width - x0,
201	here ? meshHeight(s0, s, ACROSS, t, (rowS, across) => islandHeight(lake, channel, rowS, across)) - 0.05 : 0,
202	-(s - s0),
203	)
204	at.rotation.set((random() - 0.5) * 0.35, random() * Math.PI, (random() - 0.5) * 0.35)
205	const tall = here ? 0.9 + random() * 1.3 : 0
206	at.scale.set(tall > 0 ? 1 : 0, tall, tall > 0 ? 1 : 0)
207	at.updateMatrix()
208	stand.setMatrixAt(n, at.matrix)
209	}
210	return [stand]
211	}
212
213	/** The islets of one stretch: their humps, and the reeds on them. */
214	function islets(channel: Channel, x0: number, s0: number): THREE.Object3D[] {
215	const found = channel.islets(s0, s0 + CHUNK)
216	if (found.length === 0) return []
217	const reeds = found.map((islet) => Math.min(MOST_REEDS, Math.round(REEDS_PER_M2 * Math.PI * islet.radius ** 2)))
218	const humps = new THREE.InstancedMesh(hump, frost, found.length)
219	const stand = new THREE.InstancedMesh(reed, straw, reeds.reduce((a, b) => a + b))
220	const at = new THREE.Object3D()
221	let n = 0
222	for (const [i, islet] of found.entries()) {
223	const random = mulberry32(islet.seed)
224	at.position.set(islet.x - x0, 0, -(islet.s - s0))
225	at.rotation.set(0, 0, 0)
226	at.scale.set(islet.radius, islet.radius, islet.radius)
227	at.updateMatrix()
228	humps.setMatrixAt(i, at.matrix)
229	for (let r = 0; r < reeds[i]!; r++) {
230	// Thickest in the middle; none on the last of the hump, where the ice begins.
231	const out = Math.sqrt(random()) * 0.85
232	const round = random() * Math.PI * 2
233	at.position.set(
234	islet.x - x0 + Math.cos(round) * out * islet.radius,
235	// The hump is part of a sphere, squashed: this is how high it is that far out.
236	0.14 * islet.radius * Math.sqrt(1 - out * out) - 0.05,
237	-(islet.s - s0) + Math.sin(round) * out * islet.radius,
238	)
239	// Each leaning a little its own way.
240	at.rotation.set((random() - 0.5) * 0.35, random() * Math.PI, (random() - 0.5) * 0.35)
241	const tall = 0.9 + random() * 1.1
242	at.scale.set(1, tall, 1)
243	at.updateMatrix()
244	stand.setMatrixAt(n++, at.matrix)
245	}
246	}
247	return [humps, stand]
248	}
249
250	/**
251	* The land of the lake: both banks, the island wherever it has forked, and the islets. It is made
252	* ahead of the skater and thrown away behind, and each stretch is placed relative to the
253	* skater every frame, so the skater is always at the origin of what is drawn and the lake
254	* can run on without losing precision.
255	*/
256	export class Shores {
257	readonly group = new THREE.Group()
258	private readonly chunks = new Map<number, Chunk>()
259	/** Whether nothing of this lake has been made yet. */
260	private starting = true
261
262	constructor(private lake: Lake, private seed: number) {}
263
264	/** Be the land of another lake: what was made of the last one is thrown away. */
265	show(lake: Lake, seed: number): void {
266	this.lake = lake
267	this.seed = seed
268	for (const chunk of this.chunks.values()) this.drop(chunk)
269	this.chunks.clear()
270	this.starting = true
271	}
272
273	private drop(chunk: Chunk): void {
274	this.group.remove(chunk.group)
275	for (const child of chunk.group.children) {
276	// The land is this stretch's own; the trees share one cone and one material.
277	if (child instanceof THREE.InstancedMesh) child.dispose()
278	else (child as THREE.Mesh).geometry.dispose()
279	}
280	}
281
282	/**
283	* Make, drop and place the stretches for a skater at `x` across and `s` along, who is
284	* in `channel`. `facing` is 1 for a skater looking down the lake, -1 for one looking
285	* back up it, and between for one looking across.
286	*
287	* A stretch is made once, with whichever channel the skater was in at the time, and
288	* that is safe: a stretch near a fork has both of the fork's channels in it whichever
289	* of them the skater takes, for `FORK_ZONE` metres, and the skater has taken one long
290	* before stretches further off than that are made.
291	*/
292	update(x: number, s: number, channel: Channel, facing = 1): void {
293	const first = Math.floor((s - (facing > 0.5 ? BEHIND : AHEAD)) / CHUNK)
294	const last = Math.floor((s + (facing < -0.5 ? BEHIND : AHEAD)) / CHUNK)
295	for (const [index, chunk] of this.chunks) {
296	if (index >= first && index <= last) continue
297	this.drop(chunk)
298	this.chunks.delete(index)
299	}
300	// Nearest first, and only so many in a frame; the rest are for the frames after.
301	const here = Math.floor(s / CHUNK)
302	let made = 0
303	for (let away = 0; made < MADE_AT_ONCE && (here - away >= first \|\| here + away <= last); away++) {
304	for (const index of away === 0 ? [here] : [here + away, here - away]) {
305	if (index < first \|\| index > last \|\| this.chunks.has(index) \|\| made >= MADE_AT_ONCE) continue
306	this.chunks.set(index, this.make(index, channel))
307	// The very first frame makes everything: there is nothing yet to look at meanwhile.
308	if (this.chunks.size > 1 && !this.starting) made++
309	}
310	}
311	this.starting = false
312	for (const chunk of this.chunks.values()) {
313	chunk.group.position.set(chunk.x - x, 0, -(chunk.s - s))
314	}
315	}
316
317	private make(index: number, channel: Channel): Chunk {
318	const { lake } = this
319	const s0 = index * CHUNK
320	const x0 = channel.centre(s0)
321	const group = new THREE.Group()
322	// The left bank's columns run from far inland to the shore, the right bank's from
323	// the shore inland, and the island's from its left shore to its right.
324	const inland = INLAND.length - 1
325	group.add(new THREE.Mesh(land(INLAND.length, x0, s0, (s, col) => {
326	const d = INLAND[inland - col]!
327	return [shoreline(channel, s).left - d, lake.bankHeight(-1, s, d)]
328	}), snow))
329	group.add(new THREE.Mesh(land(INLAND.length, x0, s0, (s, col) => {
330	const d = INLAND[col]!
331	return [shoreline(channel, s).right + d, lake.bankHeight(1, s, d)]
332	}), snow))
333	group.add(new THREE.Mesh(land(ACROSS.length, x0, s0, (s, col) => {
334	const { islandLeft, islandRight } = shoreline(channel, s)
335	const t = ACROSS[col]!
336	return [islandLeft + t * (islandRight - islandLeft), islandHeight(lake, channel, s, t)]
337	}), snow))
338	group.add(trees(lake, channel, this.seed, index, x0, s0), ...islets(channel, x0, s0), ...islandReeds(lake, channel, this.seed, index, x0, s0))
339	this.group.add(group)
340	return { x: x0, s: s0, group }
341	}
342	}