//in order to be displayed during the draw cycle

let drum;

let img

​

//it's advisable (but not necessary) to load the images in the preload function

//of your sketch otherwise they may appear with a little delay

function preload() {

  drumsound = loadSound('assets/Boom_Chuk.mp3');

}

​

function setup() {

  createCanvas(800, 300);

   //pass the first and the last file name and it will try to find the ones in between

  let drumming= loadAnimation('assets/drum000.png', 'assets/drum005.png');

  let standing= loadAnimation('assets/drum000.png');

  img = loadImage('assets/drum000.png');

  imageSprite = createSprite(300, 150);

 // imageSprite.addImage(img);

  imageSprite.addAnimation('drumming', drumming);

  imageSprite.addAnimation('standing', standing);

}

​

function draw() {

  background(255, 255, 255);

​

imageSprite.onMouseOver = function() {

    this.changeAnimation('drumming');

  drumsound.loop();

  };

​

 imageSprite.onMouseOut = function() {

    this.changeAnimation('standing');

   drumsound.stop()

  };

  drawSprites()

}

​

// function mouseClicked() {

//   drumsound.playMode('sustain');

//   drumsound.play();

// }

​

​

​