addInteraction()

in charts/shared/sonic.js [1020:1100]


  addInteraction(container_id, button_id=null) {

    let self = this

    let app = document.getElementById("app")

    function test() {
      console.log("yep")
    }

    let buttons = [
      {id:'play', text:"play/pause", function:() => self.playPause()},
      {id:'restart', text:"restart", function:() => self.restart()},
      {id:'datumNext', text: "cursor forward", function:() => self.moveCursor(1)},
      {id:'datumPrevious', text: "cursor back", function:() => self.moveCursor(-1)},
      {id:'seriesNext', text: "series forward", function:() => self.moveSeries(1)},
      {id:'seriesBack', text: "series back", function:() => self.moveSeries(1)}
    ]

    let container = document.getElementById(container_id);
    container.innerHTML = ""

    if (!self.interactionAdded) {
      app.addEventListener('keypress', this.handleKeyPress)
      app.addEventListener('click', (e) => {
        if (!self.synthLoaded) {
          self.setupSonicData(self.data, self.keys)
        }
      })
  
      buttons.forEach((button) => {
        let newButton = document.createElement('button');
        newButton.textContent = button.text;
        newButton.onclick = button.function;
        newButton.id = button.id;
        newButton.id = button.id;
        container.appendChild(newButton);
    });
      
      let btn = document.getElementById("play");
    
      btn.addEventListener('keyup', (e) => {
  
        if (e.code === "Space") {
          e.preventDefault();
        }
  
      })
    
      if (button_id) {

        if (!self.synthLoaded) {
          self.setupSonicData(self.data, self.keys)
        }

        let playButton = document.getElementById(button_id)
        
        playButton.addEventListener('click', () => {
          self.playPause();
        })
  
        playButton.addEventListener('keyup', (e) => {
    
          if (e.code === "Space") {
            e.preventDefault();
          }
    
        })
      
      }
    
    }

  
    



    self.interactionAdded = true;

  }