const T = api.THREE; const ink = "#3a2230", steel = "#687ba8", pale = "#b9a3e8", yellow = "#efb83e", orange = "#ef8a3c"; const mats = {}; function mat(c) { return mats[c] || (mats[c] = api.toon(c)); } function box(g, x, y, z, w, h, d, c, name) { const m = new T.Mesh(new T.BoxGeometry(w, h, d), mat(c)); m.position.set(x, y, z); if (name) m.name = name; g.add(m); return m; } function cyl(g, x, y, z, r1, r2, h, c, rz = 0, rx = 0) { const m = new T.Mesh(new T.CylinderGeometry(r1, r2, h, 12), mat(c)); m.position.set(x, y, z); m.rotation.set(rx, 0, rz); g.add(m); return m; } function ball(g, x, y, z, w, h, d, c) { const m = new T.Mesh(new T.SphereGeometry(1, 12, 8), mat(c)); m.position.set(x, y, z); m.scale.set(w / 2, h / 2, d / 2); g.add(m); return m; } const dir = new T.Vector3(); api.camera.getWorldDirection(dir); dir.y = 0; if (dir.lengthSq() < 0.001) dir.set(0, 0, -1); dir.normalize(); const cx = api.player.x + dir.x * 38, cz = api.player.z + dir.z * 38; const gy = api.groundHeight(cx, cz); function addAt(g, id, description, x, z, solid = true) { g.position.set(cx + x, gy, cz + z); api.add(g, { id, describe: description, solid }); return g; } // Packed earth, with a few broad tire tracks and a visitor path. const site = new T.Group(); box(site, 0, 0.035, 0, 74, 0.06, 60, "#d9a968"); for (let z = -22; z <= 22; z += 4) { box(site, -26, 0.075, z, 0.25, 0.025, 2.5, "#b78065"); box(site, -22.5, 0.075, z, 0.25, 0.025, 2.5, "#b78065"); } for (let i = 0; i < 8; i++) { box(site, -3 + i * 1.5, 0.08, 25, 0.8, 0.025, 2, "#efc981"); } addAt(site, "construction-ground", "a broad sandy construction site with tire tracks", 0, 0, false); // Open steel-frame skyscraper with floors, diagonal bracing and a partly fitted facade. const building = new T.Group(); box(building, 0, 0.25, 0, 18, 0.5, 14, "#b9a3e8", "foundation"); for (let level = 1; level <= 5; level++) { const y = level * 6; box(building, 0, y, 0, 18, 0.32, 14, "#c3b4d6", "floor-" + level); for (let x = -8; x <= 8; x += 4) { box(building, x, y + 0.16, 0, 0.25, 0.25, 13.8, steel); } for (let z = -6; z <= 6; z += 6) { box(building, 0, y + 0.16, z, 17.8, 0.25, 0.25, steel); } } for (let x = -8; x <= 8; x += 4) { for (let z of [-6, 0, 6]) { const top = (x === 8 && z === 6) ? 34 : 32; box(building, x, top / 2, z, 0.55, top, 0.55, steel, "steel-column"); } } for (let y = 6; y <= 30; y += 6) { for (let z of [-6, 6]) box(building, 0, y, z, 18, 0.55, 0.6, "#526a99"); for (let x of [-8, 8]) box(building, x, y, 0, 0.6, 0.55, 13, "#526a99"); } function brace(g, a, b, color, thick = 0.22) { const v1 = new T.Vector3(...a), v2 = new T.Vector3(...b); const delta = v2.clone().sub(v1); const m = new T.Mesh(new T.BoxGeometry(thick, delta.length(), thick), mat(color)); m.position.copy(v1).add(v2).multiplyScalar(0.5); m.quaternion.setFromUnitVectors(new T.Vector3(0, 1, 0), delta.normalize()); g.add(m); } for (let y = 0; y < 24; y += 6) { brace(building, [-8, y + 0.4, -6], [-4, y + 5.8, -6], "#8a79a8"); brace(building, [-4, y + 0.4, -6], [-8, y + 5.8, -6], "#8a79a8"); brace(building, [8, y + 0.4, 0], [8, y + 5.8, 6], "#8a79a8"); } for (let y of [3, 9, 15]) { for (let x of [2, 6]) { box(building, x, y, -6.1, 3.5, 5.2, 0.18, "#8bc8df"); box(building, x, y, -6.24, 0.13, 5.1, 0.12, "#e8d5ed"); } } for (let i = 0; i < 4; i++) { box(building, -5.5 + i * 1.1, 0.4, 7.8, 0.8, 0.8, 0.8, i % 2 ? orange : yellow); } addAt(building, "half-built-skyscraper", "a five-storey unfinished steel skyscraper", 8, -3); // Tower crane, lattice mast, long jib and counterweights. const crane = new T.Group(); box(crane, 0, 0.4, 0, 5, 0.8, 5, "#8572a0"); for (let x of [-1.1, 1.1]) for (let z of [-1.1, 1.1]) { box(crane, x, 21, z, 0.34, 42, 0.34, yellow, "mast-leg"); } for (let y = 1; y <= 41; y += 4) { for (let z of [-1.1, 1.1]) { box(crane, 0, y, z, 2.5, 0.24, 0.24, orange); if (y < 40) brace(crane, [-1.1, y, z], [1.1, y + 4, z], yellow, 0.15); } for (let x of [-1.1, 1.1]) { box(crane, x, y, 0, 0.24, 0.24, 2.5, orange); if (y < 40) brace(crane, [x, y, -1.1], [x, y + 4, 1.1], yellow, 0.15); } } box(crane, 0, 42, 0, 4, 1.1, 4, orange); box(crane, 7, 42.4, 0, 28, 0.5, 1.1, yellow, "jib"); box(crane, 7, 44.4, 0, 28, 0.3, 0.45, yellow); for (let x = -6; x <= 20; x += 2) { brace(crane, [x, 42.5, 0], [x + 2, 44.3, 0], orange, 0.15); } box(crane, -7, 42.2, 0, 6, 0.7, 2.5, "#8a79a8", "counterweight"); box(crane, 1.7, 40.3, 1.6, 2.5, 2, 2.3, orange, "operator-cab"); box(crane, 1.7, 40.5, 2.78, 1.8, 1.05, 0.1, "#a9d8ea"); addAt(crane, "tower-crane", "a tall yellow lattice tower crane", -15, -3); // A trolley, hanging cable, hook and I-beam travel slowly over the frame. const lift = new T.Group(); const trolley = box(lift, 0, 42, 0, 1.5, 0.65, 1.5, orange, "trolley"); const cable = cyl(lift, 0, 36, 0, 0.055, 0.055, 1, ink); const hook = new T.Group(); cyl(hook, 0, 0.65, 0, 0.25, 0.25, 0.7, yellow); const ring = new T.Mesh(new T.TorusGeometry(0.3, 0.09, 8, 16, Math.PI * 1.65), mat(steel)); ring.rotation.z = -0.4; hook.add(ring); box(hook, 0, -1.4, 0, 0.35, 0.6, 9, steel, "lifted-beam"); box(hook, 0, -1.05, 0, 0.9, 0.12, 9, steel); box(hook, 0, -1.75, 0, 0.9, 0.12, 9, steel); brace(hook, [0, 0, 0], [0, -1.15, -3.5], ink, 0.06); brace(hook, [0, 0, 0], [0, -1.15, 3.5], ink, 0.06); lift.add(hook); addAt(lift, "crane-lift", "a crane trolley lifting a long steel I-beam", -15, -3, false); api.onFrame((dt, t) => { const x = 12 + 6 * Math.sin(t * 0.12); const y = 32 + 2 * Math.sin(t * 0.17); trolley.position.x = x; cable.position.set(x, (41.7 + y) / 2, 0); cable.scale.y = 41.7 - y; hook.position.set(x, y, 0); hook.rotation.z = 0.045 * Math.sin(t * 1.2); }); // Vehicle helper: chunky wheels and windowed cab. function wheel(g, x, z, r = 0.7) { cyl(g, x, r, z, r, r, 0.42, "#523b58", Math.PI / 2); cyl(g, x + (x > 0 ? 0.23 : -0.23), r, z, r * 0.48, r * 0.48, 0.04, "#b9a3e8", Math.PI / 2); } function truckBase(g, color) { box(g, 0, 1, 0, 3, 0.55, 7.4, "#645071"); for (let x of [-1.55, 1.55]) for (let z of [-2.5, 1.9]) wheel(g, x, z); box(g, 0, 2.1, 2.2, 2.8, 2.2, 2.4, color, "cab"); box(g, 0, 2.5, 3.43, 2.2, 1.05, 0.08, "#a9d8ea"); for (let x of [-1.43, 1.43]) box(g, x, 2.5, 2.15, 0.08, 1.05, 1.5, "#a9d8ea"); box(g, 0, 1.35, 3.75, 3.1, 0.3, 0.25, "#b9a3e8"); for (let x of [-1, 1]) ball(g, x, 1.7, 3.68, 0.35, 0.35, 0.18, "#ffed9c"); } const dump = new T.Group(); truckBase(dump, "#ef8a3c"); box(dump, 0, 1.65, -1.45, 3.25, 0.35, 4, "#d0453a", "dump-bed"); for (let x of [-1.5, 1.5]) { box(dump, x, 2.35, -1.45, 0.2, 1.5, 4, "#d0453a"); for (let z of [-2.8, -1.4, 0]) box(dump, x * 1.01, 2.35, z, 0.1, 1.25, 0.15, orange); } box(dump, 0, 2.35, -3.4, 3, 1.5, 0.2, "#d0453a"); for (let i = 0; i < 8; i++) ball(dump, -1 + (i % 3), 2.4 + (i % 2) * 0.3, -2.7 + Math.floor(i / 3), 1.1, 0.8, 1.1, i % 2 ? "#bf8c74" : "#d8ae83"); addAt(dump, "dump-truck", "an orange dump truck carrying rocks", -23, -14); const mixer = new T.Group(); truckBase(mixer, "#f2c45b"); box(mixer, 0, 1.7, -1.4, 2, 1.2, 3.7, "#8a79a8"); const drum = new T.Group(); drum.position.set(0, 2.65, -1.2); const barrel = cyl(drum, 0, 0, 0, 1.3, 1.05, 3.8, "#f2d4b0", 0, Math.PI / 2); cyl(drum, 0, 0, 0.1, 1.33, 1.33, 0.45, orange, 0, Math.PI / 2); cyl(drum, 0, 0, -1.15, 1.22, 1.22, 0.3, orange, 0, Math.PI / 2); mixer.add(drum); box(mixer, 0, 1.7, -3.6, 1.1, 0.2, 2, steel).rotation.x = -0.35; addAt(mixer, "cement-mixer", "a cement mixer truck with a turning striped drum", -23, 1); api.onFrame((dt) => { drum.rotation.z += dt * 0.6; }); const dozer = new T.Group(); box(dozer, 0, 1.1, 0, 3.2, 1.3, 4.6, yellow, "engine"); box(dozer, 0, 2.3, -0.8, 2.4, 1.8, 2, orange, "cab"); for (let x of [-1.22, 1.22]) box(dozer, x, 2.5, -0.8, 0.08, 0.95, 1.35, "#a9d8ea"); box(dozer, 0, 2.5, 0.22, 1.9, 0.95, 0.08, "#a9d8ea"); for (let x of [-1.7, 1.7]) { box(dozer, x, 0.7, 0, 0.7, 1.1, 5.1, "#60495e", "track"); for (let z of [-1.7, -0.6, 0.5, 1.6]) cyl(dozer, x * 1.2, 0.7, z, 0.33, 0.33, 0.08, "#b9a3e8", Math.PI / 2); } box(dozer, 0, 0.9, 3.2, 4.6, 1.5, 0.3, "#b9a3e8", "blade").rotation.x = -0.15; for (let x of [-1.4, 1.4]) brace(dozer, [x, 0.7, 1], [x, 0.7, 3.2], yellow, 0.25); cyl(dozer, -0.9, 2.2, 1.5, 0.15, 0.15, 1.5, "#60495e"); addAt(dozer, "bulldozer", "a yellow tracked bulldozer with a broad blade", -8, 15); // Site barriers, cones and material stacks. const props = new T.Group(); for (let x = -32; x <= 32; x += 4) { if (x > -8 && x < 8) continue; box(props, x, 1, 28, 0.18, 2, 0.18, "#8a79a8"); box(props, x + 2, 1.15, 28, 3.8, 0.35, 0.16, orange); box(props, x + 2, 0.65, 28, 3.8, 0.25, 0.16, "#f5d89c"); } for (let i = 0; i < 7; i++) { const x = -8 + i * 2.5, z = 22; box(props, x, 0.08, z, 0.8, 0.16, 0.8, ink); cyl(props, x, 0.55, z, 0.07, 0.36, 0.9, orange); cyl(props, x, 0.6, z, 0.18, 0.25, 0.15, "#fff1c9"); } for (let i = 0; i < 5; i++) { box(props, 25, 0.25 + i * 0.35, -14, 0.5, 0.3, 7, steel); box(props, 26, 0.25 + i * 0.35, -14, 0.5, 0.3, 7, steel); } for (let x of [20, 22, 24]) { cyl(props, x, 0.55, 14, 0.55, 0.55, 1.1, orange); cyl(props, x, 0.8, 14, 0.56, 0.56, 0.15, "#f8d37d"); } addAt(props, "site-equipment", "safety barriers, cones, barrels and stacked beams", 0, 0, false); // Hard-hatted workers move around the site. function worker(x, z, shirt, phase) { const p = [ {name:"body",shape:"roundbox",size:[0.8,0.95,0.45],pos:[0,1.15,0],color:shirt}, {name:"vest",shape:"box",size:[0.84,0.22,0.48],pos:[0,1.18,0],color:"#f8d863"}, {name:"head",shape:"sphere",size:[0.62,0.67,0.58],pos:[0,1.96,0],color:"#f2c9a0"}, {name:"eyeL",shape:"eye",size:[0.22,0.25,0.12],pos:[-0.16,2.02,0.27],color:"#ffffff"}, {name:"eyeR",shape:"eye",size:[0.25,0.27,0.12],pos:[0.15,2.03,0.27],color:"#ffffff"}, {name:"hat",shape:"sphere",size:[0.72,0.36,0.66],pos:[0,2.26,0],color:orange}, {name:"brim",shape:"cylinder",size:[0.85,0.09,0.75],pos:[0,2.2,0],color:orange}, {name:"armL",shape:"capsule",size:[0.22,0.8,0.22],pos:[-0.52,1.46,0],anchor:"top",color:shirt,mirror:true}, {name:"legL",shape:"capsule",size:[0.27,0.8,0.3],pos:[-0.22,0.8,0],anchor:"top",color:"#5c6494",mirror:true}, {name:"bootL",shape:"roundbox",size:[0.32,0.2,0.46],pos:[-0.22,0.12,0.08],color:"#60495e",mirror:true} ]; const g = api.build({parts:p, motion:{type:"wander",speed:0.55,radius:3.5}, anim:[ {part:"legL",prop:"rx",amp:30,speed:1.1,walk:true}, {part:"armL",prop:"rx",amp:22,speed:1.1,walk:true}, {part:"head",prop:"ry",amp:12,speed:0.2,phase} ]}); addAt(g, "construction-worker-" + (phase + 1), "a worker in an orange hard hat and safety vest", x, z, false); } worker(-4, 8, "#ef8a3c", 0); worker(1, 13, "#d0453a", 1); worker(18, 9, "#2ea4ad", 2); worker(-18, 9, "#ef8a3c", 3); worker(20, -18, "#8a5cc9", 4); api.say = "I built a busy construction site with a working tower crane, an unfinished skyscraper, construction vehicles and hard-hatted workers."; api.suggest = [ "Add sparks as the workers weld the steel frame", "Make the dump truck unload a pile of gravel", "Add a lunch break area for the workers", "Give the site a colorful sunset sky" ];