]>
Commit | Line | Data |
---|---|---|
1 | import { System } from '@serpentity/serpentity'; | |
2 | import Cameras from '../nodes/cameras'; | |
3 | import { settingsContainer, slider } from '../factories/ui'; | |
4 | ||
5 | const internals = { | |
6 | symbols: { | |
7 | x: '𝜃', | |
8 | y: '𝜓', | |
9 | z: '𝜙' | |
10 | } | |
11 | }; | |
12 | ||
13 | export default class CameraAdjuster extends System { | |
14 | ||
15 | constructor(container) { | |
16 | ||
17 | super(); | |
18 | this.container = container; | |
19 | } | |
20 | ||
21 | added(engine){ | |
22 | ||
23 | this.nodes = engine.getNodes(Cameras); | |
24 | this.adjusterContainer = settingsContainer({ | |
25 | id: 'camera-adjuster', | |
26 | label: 'Camera' | |
27 | }) | |
28 | ||
29 | let i = 0; | |
30 | for (const node of this.nodes) { | |
31 | const nodeElement = settingsContainer({ | |
32 | id: `camera-adjuster-${i}`, | |
33 | label: `C${i + 1}`, | |
34 | level: 3 | |
35 | }); | |
36 | ||
37 | nodeElement.appendChild(slider({ | |
38 | min: '2', | |
39 | max: '10', | |
40 | step: '0.1', | |
41 | label: '𝑟', | |
42 | className: 'radius', | |
43 | get: () => node.radius.radius.toString(), | |
44 | set: (value) => (node.radius.radius = parseFloat(value)) | |
45 | })); | |
46 | ||
47 | ['x', 'y', 'z'].forEach(key => { | |
48 | nodeElement.appendChild(slider({ | |
49 | min: '0', | |
50 | max: '0.5', | |
51 | step: '0.001', | |
52 | label: internals.symbols[key], | |
53 | className: `rotation-${key}`, | |
54 | get: () => node.velocity[key].toString(), | |
55 | set: (value) => (node.velocity[key] = parseFloat(value)) | |
56 | })); | |
57 | }); | |
58 | ||
59 | this.adjusterContainer.appendChild(nodeElement); | |
60 | ++i; | |
61 | } | |
62 | ||
63 | this.container.appendChild(this.adjusterContainer); | |
64 | } | |
65 | ||
66 | removed(){ | |
67 | ||
68 | this.container.removeChild(this.adjusterContainer); | |
69 | delete this.adjusterContainer; | |
70 | delete this.nodes; | |
71 | } | |
72 | ||
73 | update(){} | |
74 | }; |