git.r.bdr.sh - rbdr/lissajous/blob - lib/systems/amplitude_adjuster.js

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