@v12-engine/create 0.0.0-stage → 0.1.1

package/starters/melee/src/melee/view/undeadLooks.ts

@@ -0,0 +1,220 @@
+import { StandardMaterial } from '@babylonjs/core/Materials/standardMaterial.js'
+import { Color3 } from '@babylonjs/core/Maths/math.color.js'
+import { CreateCylinder } from '@babylonjs/core/Meshes/Builders/cylinderBuilder.js'
+import type { AbilityLooks, ModelDef, ShotContext, ShotDrawing, UnitLooks } from '@v12-engine/client'
+import { building } from './buildings'
+
+/*
+ * How the Restless looks (features-plan C4): the shared art's skeletons with their own gear, and its Fantasy RTS
+ * buildings, each another than the humans' of its kind, all darkened. Dressed in bones in C6
+ */
+
+const BONE: [number, number, number] = [0.86, 0.83, 0.74]
+const STONE: [number, number, number] = [0.42, 0.4, 0.44]
+const GOLD: [number, number, number] = [1, 0.8, 0.2]
+const WOOD: [number, number, number] = [0.45, 0.31, 0.18]
+
+/**
+ * A skeleton of the shared art (`characters/skeleton_*.glb`), `scale` times as big, with what it holds of the skeletons'
+ * gear in each hand (`skeleton-gear/*.glb`). Each file by its whole path: a build copies the files of the shared art
+ * that the code names, and a path put together from parts names none
+ */
+const skeleton = (src: string, scale: number, right?: string, left?: string): ModelDef => ({
+	src,
+	scale,
+	hold: [...(right ? [{ src: right, at: 'handslot.r' }] : []), ...(left ? [{ src: left, at: 'handslot.l' }] : [])]
+})
+
+/** Bones, for what is drawn while a model loads */
+const bones = (height: number) => [
+	{
+		shape: 'cylinder' as const,
+		size: [0.5, height * 0.6, 0.5] as [number, number, number],
+		offset: [0, height * 0.3, 0] as [number, number, number],
+		color: BONE
+	},
+	{
+		shape: 'sphere' as const,
+		size: [0.4, 0.4, 0.4] as [number, number, number],
+		offset: [0, height * 0.75, 0] as [number, number, number],
+		color: BONE
+	},
+	{
+		shape: 'box' as const,
+		size: [0.3, 0.12, 0.3] as [number, number, number],
+		offset: [0, height * 0.45, 0] as [number, number, number],
+		color: 'team' as const
+	}
+]
+
+/** A block of dark stone with a roof in the owner's colour, for what is drawn while a building's model loads */
+const crypt = (size: number, height: number) => [
+	{
+		shape: 'box' as const,
+		size: [size, height * 0.6, size] as [number, number, number],
+		offset: [0, height * 0.3, 0] as [number, number, number],
+		color: STONE
+	},
+	{
+		shape: 'pyramid' as const,
+		size: [size * 1.1, height * 0.4, size * 1.1] as [number, number, number],
+		offset: [0, height * 0.8, 0] as [number, number, number],
+		color: 'team' as const
+	}
+]
+
+export const undeadLooks: UnitLooks = {
+	acolyte: {
+		blood: false,
+		height: 1.5,
+		model: skeleton('characters/skeleton_minion.glb', 0.6, 'skeleton-gear/staff.glb'),
+		parts: [
+			...bones(1.5),
+			{ shape: 'sphere', size: [0.42, 0.36, 0.42], offset: [0, 0.75, -0.34], color: GOLD, carrying: 'gold' },
+			{ shape: 'cylinder', size: [0.22, 0.9, 0.22], offset: [0, 0.8, -0.34], color: WOOD, tilt: Math.PI / 2, turn: Math.PI / 2, carrying: 'lumber' }
+		]
+	},
+	ghoul: {
+		blood: false,
+		height: 1.6,
+		model: skeleton('characters/skeleton_minion.glb', 0.68, 'skeleton-gear/blade.glb', 'skeleton-gear/blade.glb'),
+		// packs of them: drawn as copies of one mesh, their animations baked (S41)
+		baked: true,
+		parts: bones(1.6)
+	},
+	cryptCrawler: {
+		blood: false,
+		height: 1.7,
+		model: {
+			...skeleton('characters/skeleton_rogue.glb', 0.75, 'skeleton-gear/crossbow.glb'),
+			animations: { attack: 'Ranged_2H_Shoot' },
+			hitAt: 0.3
+		},
+		shot: { color: [0.55, 0.85, 0.45], size: 0.25 },
+		parts: bones(1.7)
+	},
+	abomination: {
+		blood: false,
+		height: 2.6,
+		model: skeleton('characters/skeleton_warrior.glb', 1.2, 'skeleton-gear/axe.glb', 'skeleton-gear/shield_large_a.glb'),
+		parts: bones(2.6)
+	},
+	necromancer: {
+		blood: false,
+		height: 1.8,
+		model: { ...skeleton('characters/skeleton_mage.glb', 0.75, 'skeleton-gear/staff.glb'), animations: { attack: 'Ranged_Magic_Shoot' } },
+		shot: { color: [0.55, 0.85, 0.45], size: 0.3 },
+		parts: bones(1.8)
+	},
+	gargoyle: {
+		blood: false,
+		height: 1.6,
+		model: skeleton('characters/skeleton_minion.glb', 0.75, 'skeleton-gear/axe.glb'),
+		altitude: 3.2,
+		shot: { color: [0.6, 0.6, 0.65], size: 0.3 },
+		parts: bones(1.6)
+	},
+	deathKnight: {
+		blood: false,
+		height: 2.3,
+		model: skeleton('characters/skeleton_warrior.glb', 0.95, 'skeleton-gear/blade.glb', 'skeleton-gear/shield_small_a.glb'),
+		parts: bones(2.3)
+	},
+	lich: {
+		blood: false,
+		height: 2.2,
+		model: { ...skeleton('characters/skeleton_mage.glb', 1, 'skeleton-gear/staff.glb'), animations: { attack: 'Ranged_Magic_Shoot' } },
+		shot: { color: [0.55, 0.85, 1], size: 0.35 },
+		parts: bones(2.2)
+	},
+	gravehold: { height: 4.6, model: building('rts/wooden_temple.glb', 3.6), parts: crypt(3.6, 4.6) },
+	hallOfBones: { height: 5.6, model: building('rts/fortress.glb', 3.7), parts: crypt(3.7, 5.6) },
+	duskCitadel: { height: 6.6, model: building('rts/wooden_fortress.glb', 3.9), parts: crypt(3.8, 6.6) },
+	// over the gold mine's own model, a little bigger
+	cursedMine: { height: 3.4, model: building('rts/mine.glb', 4), parts: crypt(4, 3.4) },
+	boneSpire: { height: 2.4, model: building('rts/wooden_monument.glb', 1.9), parts: crypt(1.7, 2.4) },
+	crypt: { height: 3.2, model: building('rts/storage_house.glb', 2.7), parts: crypt(2.7, 3.2) },
+	graveyard: { height: 3, model: building('rts/houses.glb', 2.7), parts: crypt(2.7, 3) },
+	darkAltar: { height: 3.6, model: building('rts/temple.glb', 2.8), parts: crypt(2.8, 3.6) },
+	slaughterhouse: { height: 3.4, model: building('rts/storage_shed.glb', 2.7), parts: crypt(2.7, 3.4) },
+	temple: { height: 3.6, model: building('rts/temple_2.glb', 2.6), parts: crypt(2.6, 3.6) },
+	spiritTower: {
+		height: 4.4,
+		model: building('rts/stone_tower_2.glb', 1.9, { points: { launch: { offset: [0, 3, 0] } } }),
+		// a beam of the dead's green from the tower's top to where the shot is: drawn by melee, not the client
+		shot: { draw: beam([0.55, 0.95, 0.45]) },
+		parts: crypt(1.5, 4.4)
+	},
+	tomb: { height: 3.2, model: building('rts/archery_towers.glb', 2.7), parts: crypt(2.7, 3.2) }
+}
+
+/** What the Restless' buildings are darkened with */
+const DARKENED: [number, number, number] = [0.38, 0.26, 0.42]
+
+// the Restless' buildings are summoned: they rise up out of the ground as they go up, rather than grow
+for (const id of [
+	'gravehold',
+	'hallOfBones',
+	'duskCitadel',
+	'cursedMine',
+	'boneSpire',
+	'crypt',
+	'graveyard',
+	'darkAltar',
+	'slaughterhouse',
+	'temple',
+	'spiritTower',
+	'tomb'
+]) {
+	const look = undeadLooks[id]
+	look.motion = { construction: (progress, root) => void (root.position.y -= (1 - progress) * look.height) }
+	// the human buildings it borrows, darkened to the Restless' bruised purple: every copy, the model itself
+	if (look.model) look.model = { ...look.model, tint: DARKENED }
+}
+
+export const undeadEffects: AbilityLooks = {
+	deathCoil: { color: [0.55, 0.85, 0.45] },
+	animateDead: { color: [0.55, 0.85, 0.45], style: 'burst', options: { count: 80, rise: 2.5, shape: 'rise' } },
+	darkCharge: { color: [0.4, 0.3, 0.55] },
+	unholy: { color: [0.55, 0.85, 0.45] },
+	frostNova: { color: [0.55, 0.85, 1], style: 'burst', options: { count: 60, ring: 2.5, shape: 'about' } },
+	frostArmor: { color: [0.62, 0.86, 1] },
+	chilled: { color: [0.62, 0.86, 1] },
+	deathAndDecay: { color: [0.45, 0.6, 0.3] },
+	unholyFrenzy: { color: [0.9, 0.3, 0.25] },
+	crippled: { color: [0.5, 0.35, 0.6] },
+	webbed: { color: [0.9, 0.9, 0.85] },
+	web: { color: [0.9, 0.9, 0.85] }
+}
+
+/**
+ * A shot drawn as a beam from where it left to where it is, glowing, in a colour: a shot of the game's own drawing
+ * (`ShotDef.draw`), which the client flies and tells where it is
+ */
+function beam(color: [number, number, number]) {
+	return ({ kit, from, projectile }: ShotContext): ShotDrawing => {
+		const mesh = CreateCylinder(`beam-${projectile.id}`, { height: 1, diameter: 0.18, tessellation: 6 }, kit.scene)
+		const material = new StandardMaterial(`beam-${projectile.id}`, kit.scene)
+		material.disableLighting = true
+		material.emissiveColor = new Color3(...color)
+		material.alpha = 0.75
+		mesh.material = material
+		mesh.isPickable = false
+		return {
+			move(at) {
+				const dx = at.x - from.x
+				const dy = at.y - from.y
+				const dz = at.z - from.z
+				const length = Math.hypot(dx, dy, dz)
+				// from where it left to where it is: a cylinder stood on its side, between the two
+				mesh.position.set((from.x + at.x) / 2, (from.y + at.y) / 2, (from.z + at.z) / 2)
+				mesh.scaling.set(1, Math.max(length, 0.01), 1)
+				mesh.rotation.set(Math.acos(Math.max(-1, Math.min(1, dy / Math.max(length, 1e-6)))), Math.atan2(dx, dz), 0)
+			},
+			dispose() {
+				mesh.dispose()
+				material.dispose()
+			}
+		}
+	}
+}

package/starters/melee/src/melee/view/walls.ts

@@ -0,0 +1,59 @@
+import type { GameView, MinimapLayer } from '@v12-engine/client'
+import { wallGate, wallGateCommand } from '@v12-engine/engine'
+import { blightLayer } from '../blight'
+
+/** The game's buttons of the command card, as the view takes them */
+type CardButtons = NonNullable<NonNullable<GameView['hud']>['cardButtons']>
+
+/**
+ * The button of a gate of the player's (`withWalls`, `wall.gate`): Open while it is shut, Shut while it is open, for
+ * everyone (`wallGateCommand`). On the card of the gate picked first, once it stands
+ */
+export const gateButtons: CardButtons = ({ primary }) => {
+	const gate = primary?.own ? (primary.state.components?.[wallGate.id] as { open: boolean } | undefined) : undefined
+	if (!primary || !gate) return []
+	return [
+		{
+			id: 'gate',
+			label: gate.open ? 'Shut' : 'Open',
+			description: gate.open ? 'Shut the gate: nobody walks through' : 'Open the gate: anyone walks through, friend or foe',
+			hotkey: gate.open ? 'S' : 'O',
+			command: wallGateCommand.make({ entity: primary.id, open: !gate.open })
+		}
+	]
+}
+
+/** The game's card buttons together, in order */
+export const cardButtons =
+	(...parts: readonly CardButtons[]): CardButtons =>
+	(context) =>
+		parts.flatMap((part) => part(context))
+
+/**
+ * The blight on the minimap (`blightLayer`): its cells tinted in its colour on the ground, under the dots and the fog,
+ * as it spreads. A run of cells a row is one rectangle
+ */
+export function blightMinimapLayer(): MinimapLayer {
+	const [r, g, b] = blightLayer.color ?? [0.45, 0.3, 0.55]
+	const fill = `rgba(${Math.round(r * 255)}, ${Math.round(g * 255)}, ${Math.round(b * 255)}, 0.6)`
+	return {
+		id: 'blight',
+		at: 'ground',
+		draw(context, { toMap, scale, client }) {
+			const { terrain } = client.cellLayers
+			const cells = terrain.cells[blightLayer.id]
+			if (!cells) return
+			context.fillStyle = fill
+			for (let z = 0; z < terrain.depth; z++) {
+				const row = z * terrain.width
+				for (let x = 0; x < terrain.width; x++) {
+					if (!cells[row + x]) continue
+					const from = x
+					while (x + 1 < terrain.width && cells[row + x + 1]) x++
+					const at = toMap(from, z)
+					context.fillRect(at.x, at.y, (x + 1 - from) * scale.x, scale.y)
+				}
+			}
+		}
+	}
+}

package/starters/melee/src/rules.ts

@@ -0,0 +1,24 @@
+/**
+ * The rules: melee's, in `src/melee`. Its races, heroes, units, buildings and the generator of its random maps are
+ * in that folder; this is the name every part of the project knows them by
+ */
+import type { GameMap, PlayerId, World } from '@v12-engine/engine'
+import { melee } from './melee'
+
+export const rules = melee
+
+/**
+ * What the game does once a world is made from a map, before anyone plays. Every player with a start is given a hall
+ * and five workers by the rules themselves; in the page, the computer plays everyone but you, each against the other
+ * teams' starts. A server seats its computers itself (`server.ts`), so there is no one to seat here
+ */
+export function start(world: World, { map, player }: { map?: GameMap; player?: PlayerId }): void {
+	if (!map || player === undefined) return
+	const players = map.players.filter((other) => other.start)
+	for (const other of players) {
+		if (other.id === player) continue
+		const enemyBases = players.filter((rival) => rival.team !== other.team).map((rival) => rival.start!)
+		// remembered, so that a game loaded from a save of this one plays on against them
+		world.computers.seat(other.id, { enemyBases, settings: { army: { firstAttack: 360, waveSize: 6 } } })
+	}
+}

package/starters.mjs

@@ -0,0 +1,35 @@
+/**
+ * The games a project starts from (`--starter`), in the order the command line offers them. `needs`: the options it
+ * cannot be made without (melee and the campaign play with the shared art). `generator`: its random map's preview is
+ * made in a worker of the page's (`src/generate.worker.ts`, the `@if generator` lines of the shared `main.ts`)
+ */
+export const starters = [
+	{
+		name: 'empty',
+		title: 'Hello world',
+		summary: 'a flat field and a scout to walk it, nothing more: the smallest game to grow your own from',
+		generator: true
+	},
+	{
+		name: 'melee',
+		title: 'Melee',
+		summary: 'a whole RTS: two races and their heroes, bases and armies, against the computer',
+		needs: ['assets']
+	},
+	{
+		name: 'campaign',
+		title: 'A campaign',
+		summary: 'three missions with a hero carried between them: a base to defend, a siege of waves at night, a warlord to face',
+		needs: ['assets']
+	}
+]
+
+/** The starter the command line makes a project from when nothing says which */
+export const DEFAULT_STARTER = 'empty'
+
+/** A starter by name, or an error that lists them */
+export function starterNamed(name) {
+	const found = starters.find((starter) => starter.name === name)
+	if (!found) throw new Error(`There is no starter "${name}": the starters are ${starters.map((starter) => starter.name).join(', ')}`)
+	return found
+}

package/v12.mjs

@@ -0,0 +1,111 @@
+#!/usr/bin/env node
+/**
+ * `v12`: a project's own commands, from its folder (`npm run map …` in a project made with `npm create @v12-engine`).
+ *
+ *   v12 map check [map …] | picture <map> <out.png> | picture [folder] --all | diff <before> <after> <out.png> | diff <before> <after> --text | run <script.ts> <map>
+ *                | merge <base> <ours> <theirs> | generate <game> <name> [--generator id] [--seed N] …
+ *   v12 save diff <a> <b>
+ *
+ * The project is read as its page reads it, through its own Vite, so its game (`src/game.ts`: every game defined there,
+ * `defineGame`) and a script for `map run` are TypeScript with nothing built first. Its maps are in `src/maps`
+ */
+import { readFileSync } from 'node:fs'
+import { createRequire } from 'node:module'
+import { join, resolve } from 'node:path'
+import { pathToFileURL } from 'node:url'
+
+const [command, ...args] = process.argv.slice(2)
+
+/** The project's games: every game defined in its `src/game.ts` (what `defineGame` gives: an id, rules and a view) */
+function gamesOf(module) {
+	const games = {}
+	for (const value of Object.values(module)) {
+		if (value && typeof value === 'object' && typeof value.id === 'string' && value.rules && value.view) {
+			games[value.id] = { module: value.rules, view: value.view }
+		}
+	}
+	return games
+}
+
+async function map(project) {
+	// the project's own Vite, as its page builds with
+	const require = createRequire(join(project, 'package.json'))
+	const { createServer } = await import(pathToFileURL(require.resolve('vite')).href)
+	const server = await createServer({
+		root: project,
+		server: { middlewareMode: true, hmr: false, watch: null },
+		appType: 'custom',
+		logLevel: 'error'
+	})
+	try {
+		const games = gamesOf(await server.ssrLoadModule('/src/game.ts'))
+		if (!Object.keys(games).length) throw new Error('src/game.ts defines no game (`export const game = defineGame({ rules, view })`)')
+		// the map editor's: a project made without the editor has no map command
+		try {
+			require.resolve('@v12-engine/editor/map-command')
+		} catch {
+			throw new Error("v12 map is the map editor's: this project has none. npm install @v12-engine/editor")
+		}
+		const { mapCommand } = await server.ssrLoadModule('@v12-engine/editor/map-command')
+		return await mapCommand(args, {
+			games,
+			mapsOf: () => join(project, 'src/maps'),
+			load: (path) => server.ssrLoadModule(path),
+			name: 'npm run map',
+			root: project
+		})
+	} finally {
+		await server.close()
+	}
+}
+
+/** A save as a file keeps it: what `encodeSave` writes, or something that holds that text as its `save` (a saved game, a scenario) */
+function saveIn(engine, path) {
+	const text = readFileSync(path, 'utf8')
+	const read = JSON.parse(text)
+	return typeof read?.save === 'string' ? engine.decodeSave(read.save) : engine.decodeSave(text)
+}
+
+/** A value of a save, short enough for a line */
+const shown = (value) => {
+	const text = value === undefined ? 'nothing' : JSON.stringify(value)
+	return text.length > 200 ? `${text.slice(0, 200)}…` : text
+}
+
+/**
+ * `v12 save diff a b`: where two saves of a game first differ, as a replay that came apart says it (the engine's
+ * `saveDifference`): the path (`entities[id 11].pos.x`) and what each holds there. Exits 1 when they differ, 0 when not
+ */
+async function save(project) {
+	const [what, ...files] = args
+	if (what !== 'diff' || files.length !== 2) {
+		console.log('v12 save diff <a> <b>: where two saves of a game first differ (an entity and its field), exit 1 if they do')
+		return what === 'help' || what === undefined ? 0 : 1
+	}
+	const require = createRequire(join(project, 'package.json'))
+	const engine = await import(pathToFileURL(require.resolve('@v12-engine/engine')).href)
+	const [a, b] = files.map((file) => saveIn(engine, file))
+	const found = engine.saveDifference(a, b)
+	if (!found) {
+		console.log('The two saves are the same')
+		return 0
+	}
+	console.log(`They differ first at ${found.path || 'the top'}: ${shown(found.a)} in ${files[0]}, ${shown(found.b)} in ${files[1]}`)
+	return 1
+}
+
+try {
+	// npm runs a script from the project's folder; the paths it was given are where it was asked from
+	const project = resolve(process.env.npm_config_local_prefix ?? process.cwd())
+	if (process.env.INIT_CWD) process.chdir(process.env.INIT_CWD)
+	if (command === 'map') process.exitCode = await map(project)
+	else if (command === 'save') process.exitCode = await save(project)
+	else {
+		console.log('v12 map …: the maps of this project from the command line (v12 map help)')
+		console.log('v12 save diff <a> <b>: where two saves of a game first differ')
+		process.exitCode = command ? 1 : 0
+	}
+} catch (error) {
+	console.error(error instanceof Error ? error.message : error)
+	process.exitCode = 1
+}