​

let buttons = [];

let definedValues = [{

  sound: 'ARP-008TeleFax.wav',

  text: 'hey',

  beats: 2,

}, {

  sound: 'Perc-Maroc.wav',

  text: 'lala',

  beats: 10,

}]

​

let loadedSounds = []

​

​

​

function preload() {

​

  for (let i = 0; i < definedValues.length; i++) {

    if (definedValues[i].sound)

      loadedSounds[i] = loadSound(definedValues[i].sound)

  }

​

}

​

​

function setup() {

  //console.log('LOADED SOUNDS', loadedSounds)

  createCanvas(400, 400);

  for (let i = 0; i < loadedSounds.length; i++) {

    buttons[i] = new sound(200, 200 + i * 100, loadedSounds[i], definedValues[i].beats, definedValues[i].text)

​

​

​

  }

​

}

​

function draw() {

​

  // sounds

  for (let i = 0; i < buttons.length; i++) {

    buttons[i].place();

​

    if (buttons[i].lip1) {

      buttons[i].music();

​

    } else {

      buttons[i].no();

    }

​

  }

​

​

}

​

class sound {

​

  constructor(oneX, oneY, oneM, oneB, oneW) {

    // positionX, positionX, music, beats, words on buttons

    this.x = oneX;

    this.y = oneY;

    this.m = oneM;

    this.b = oneB;

    this.w = oneW;

    this.button = createButton(this.w);

    this.lip1 = false;

    this.slide = createSlider(0, 1, 0, 0.1);

​

​

  }

​

  place() {

​

    this.button.position(this.x, this.y);

    this.slide.position(this.x - 3, this.y + 30);

    this.slide.style('width', '40px');

    this.slide.style('height', '2px');

​

​

​

    this.button.mouseClicked(() => {

      this.lip1 = !this.lip1;

​

    })

  }

​

  music() {

    //console.log('AM I CALLED')

    this.pit = this.slide.value()

​

    if (frameCount % beat < this.b) {

​

      this.m.play();

​

    }

​

  }

​

  no() {

    this.m.stop();

  }

​

}