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

   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         id: `camera-adjuster-${i}-slider-radius`,
  39         min: '2',
  40         max: '10',
  41         step: '0.1',
  42         label: '𝑟',
  43         className: 'radius',
  44         get: () => node.radius.radius.toString(),
  45         set: (value) => (node.radius.radius = parseFloat(value))
  46       }));
  47
  48       ['x', 'y', 'z'].forEach(key => {
  49         nodeElement.appendChild(slider({
  50           id: `camera-adjuster-${i}-slider-${key}`,
  51           min: '0',
  52           max: '0.5',
  53           step: '0.001',
  54           label: internals.symbols[key],
  55           className: `rotation-${key}`,
  56           get: () => node.velocity[key].toString(),
  57           set: (value) => (node.velocity[key] = parseFloat(value))
  58         }));
  59       });
  60
  61       this.adjusterContainer.appendChild(nodeElement);
  62       ++i;
  63     }
  64
  65     this.container.appendChild(this.adjusterContainer);
  66   }
  67
  68   removed(){
  69
  70     this.container.removeChild(this.adjusterContainer);
  71     delete this.adjusterContainer;
  72     delete this.nodes;
  73   }
  74
  75   update(){}
  76 };