diff options
Diffstat (limited to 'public/bluebey-studio/src/props.js')
| -rw-r--r-- | public/bluebey-studio/src/props.js | 34 |
1 files changed, 24 insertions, 10 deletions
diff --git a/public/bluebey-studio/src/props.js b/public/bluebey-studio/src/props.js index 9fb3e49..a513546 100644 --- a/public/bluebey-studio/src/props.js +++ b/public/bluebey-studio/src/props.js @@ -99,6 +99,18 @@ function addMesh(parent, geometry, material, x = 0, y = 0, z = 0) { return mesh; } +/** + * The 線画 fill a part takes, as how far it steps from the paper towards the ink + * (see `addMesh` in src/styles.js). A prop is paper in 線画, so two parts of a prop + * that meet flush - the pencil's lead in its wood, a can's label on its body - come + * out as one white shape. Tagging one of them with a tone puts the seam back; it + * has no effect on リアル / フラット, where the part's own colour draws it. + */ +function tone(mesh, strength) { + mesh.userData.tone = strength; + return mesh; +} + /** A cuboid, sized as [width, height, depth] and centred on `at`. */ function addBox(parent, material, size, at = [0, 0, 0]) { const geometry = new THREE.BoxGeometry(size[0], size[1], size[2]); @@ -235,8 +247,8 @@ const PLANT_BRANCHES = [ */ const buildPlant = prop((group, material) => { addCylinder(group, material('accent'), 0.40, 0.28, 0.56, [0, 0.28, 0], 14); - addCylinder(group, material('accent', 0.88), 0.44, 0.42, 0.12, [0, 0.56, 0], 14); - addCylinder(group, material('wood', 0.75), 0.37, 0.37, 0.06, [0, 0.61, 0], 14); + tone(addCylinder(group, material('accent', 0.88), 0.44, 0.42, 0.12, [0, 0.56, 0], 14), 0.18); + tone(addCylinder(group, material('wood', 0.75), 0.37, 0.37, 0.06, [0, 0.61, 0], 14), 0.28); for (const branch of PLANT_BRANCHES) { addStrut(group, material('leaf', 0.6), [0, 0.56, 0], branch.end, 0.035); @@ -264,13 +276,13 @@ const buildBox = prop((group, material, options) => { back.position.set(0, 1.00, -0.62); back.rotation.x = flapsDown ? 0 : -1.05; group.add(back); - addBox(back, material('wood', 0.72), [1.20, 0.07, 0.62], [0, 0.035, 0.31]); + tone(addBox(back, material('wood', 0.72), [1.20, 0.07, 0.62], [0, 0.035, 0.31]), 0.20); const front = new THREE.Group(); front.position.set(0, 1.00, 0.62); front.rotation.x = flapsDown ? 0 : 1.05; group.add(front); - addBox(front, material('wood', 0.72), [1.20, 0.07, 0.62], [0, 0.035, -0.31]); + tone(addBox(front, material('wood', 0.72), [1.20, 0.07, 0.62], [0, 0.035, -0.31]), 0.20); if (flapsDown) addBox(group, material('paper', 0.95), [0.18, 0.05, 1.26], [0, 1.095, 0]); }); @@ -287,10 +299,10 @@ const buildBox = prop((group, material, options) => { const buildCan = prop((group, material) => { addCylinder(group, material('metal'), 0.153, 0.153, 0.05, [0, 0.025, 0], 16); addCylinder(group, material('metal'), 0.145, 0.145, 0.40, [0, 0.20, 0], 16); - addCylinder(group, material('accent', 0.85), 0.148, 0.148, 0.16, [0, 0.21, 0], 16); + tone(addCylinder(group, material('accent', 0.85), 0.148, 0.148, 0.16, [0, 0.21, 0], 16), 0.20); addCylinder(group, material('metal'), 0.153, 0.153, 0.05, [0, 0.40, 0], 16); // A darker disc just inside the rim so the mouth reads as empty, not capped. - addCylinder(group, material('metal', 0.45), 0.132, 0.132, 0.012, [0, 0.422, 0], 16); + tone(addCylinder(group, material('metal', 0.45), 0.132, 0.132, 0.012, [0, 0.422, 0], 16), 0.30); // The one lid, peeled back on a hinge at the back of the mouth so its // underside shows. The hinge sits *on* the can's back rim and the disc is @@ -356,13 +368,15 @@ const buildFuton = prop((group, material) => { /** 鉛筆: an oversized pencil standing on its eraser, point up. */ const buildPencil = prop((group, material) => { const r = 0.13; - addCylinder(group, material('accent', 0.85), r * 0.9, r * 0.98, 0.16, [0, 0.08, 0], 6); - addCylinder(group, material('metal', 0.9), r, r, 0.12, [0, 0.22, 0], 6); + // Eraser, ferrule and lead are each a band of the same width against the body, + // so without a tone of their own they vanish into it in 線画. + tone(addCylinder(group, material('accent', 0.85), r * 0.9, r * 0.98, 0.16, [0, 0.08, 0], 6), 0.20); + tone(addCylinder(group, material('metal', 0.9), r, r, 0.12, [0, 0.22, 0], 6), 0.24); addCylinder(group, material('accent'), r, r, 1.30, [0, 0.93, 0], 6); addCylinder(group, material('wood'), 0, r, 0.30, [0, 1.73, 0], 6); // The lead's wide base sinks into the cone (whose tip is at y = 1.88), so the // two look joined, while its point still pokes out past the wood. - addCylinder(group, material('metal', 0.3), 0, r * 0.3, 0.12, [0, 1.86, 0], 6); + tone(addCylinder(group, material('metal', 0.3), 0, r * 0.3, 0.12, [0, 1.86, 0], 6), 0.45); }); /** コップ: a mug with a rim, a handle and a little drink inside. */ @@ -396,7 +410,7 @@ const buildEraser = prop((group, material) => { const depth = 0.5; const half = 0.15; addBox(group, material('paper'), [width, half, depth], [0, half / 2, 0]); - addBox(group, material('accent', 0.9), [width, half, depth], [0, half + half / 2, 0]); + tone(addBox(group, material('accent', 0.9), [width, half, depth], [0, half + half / 2, 0]), 0.22); }); export const PROP_LIBRARY = [ |