1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
import { System } from '@serpentity/serpentity';
import Ample from '../nodes/ample';
import { settingsContainer, slider } from '../factories/ui';
const internals = {
symbols: {
a: '𝛢',
b: '𝛣',
c: '𝛧'
}
};
/**
* UI that adjusts the amplitude of any compatible object
*/
export default class AmplitudeAdjuster extends System {
constructor(container) {
super();
this.container = container;
}
added(engine){
this.nodes = engine.getNodes(Ample);
this.adjusterContainer = settingsContainer({
id: 'amplitude-adjuster',
label: 'Amplitude'
});
let i = 0;
for (const node of this.nodes) {
const nodeElement = settingsContainer({
id: `amplitude-adjuster-${i}`,
label: `ɣ${i + 1}`,
level: 3
});
['a', 'b', 'c'].forEach(key => {
nodeElement.appendChild(slider({
id: `amplitude-adjuster-${i}-slider-${key}`,
min: '0',
max: '1',
step: '0.01',
label: internals.symbols[key],
className: `amplitude`,
get: () => node.amplitude[key].toString(),
set: (value) => (node.amplitude[key] = parseFloat(value))
}));
});
this.adjusterContainer.appendChild(nodeElement);
++i;
}
this.container.appendChild(this.adjusterContainer);
}
removed(){
this.container.removeChild(this.adjusterContainer);
delete this.adjusterContainer;
delete this.nodes;
}
update(){}
};
|
