Hi

I have a p5js sketch, where I want to play back four individual mp3 tracks in sync. I can get them to play, but they are of in terms of sync when I run the sketch. I know that the files themselves are in perfect sync.

Here is my code so far.

var bass, drums, guitar, vox;

function preload() {

bass = loadSound('data/bass.mp3');
drums = loadSound('data/drums.mp3');
guitar = loadSound('data/guitar.mp3');
vox = loadSound('data/vox.mp3');

}

function setup() {
createCanvas(1350, 1045);

bass.play();
drums.play();
guitar.play();
vox.play();
}

function draw() {

}

Any ideas?

This is more of a technical question about drums and their frequencies. Maybe some other forum goer can provide some of their experience. I will suggest exploring previous posts:

https://forum.processing.org/two/search?Search=drums
https://forum.processing.org/two/search?Search=snare

Or do some research in google... I am sure somebody has had the same problem. I wouldn't use the low part of the spectrum to identify my instrument as anything can trigger that part of the spectrum. However, if you are only playing one instrument (ever), then instead of a frequency trigger, you could just focus in amplitude.

Kf

I have my code set up to choose from a random selection of words. Only problem is, it often chooses the same one more than one time in a row. I want a variable to remove itself after I've chosen it. I'm pretty new to this so apologies if this is fairly obvious. I've put my code in it's current state below, encase that helps. Cheers!

int yPos = 40;
int shuffle = 16;

PFont ourFont;

void setup(){
size(500,250);
background(0,0,0);
ourFont = loadFont("Quicksand-Bold-24.vlw");

}



//click to start
void mouseClicked(){
  shuffle = shuffle -15;

}





void draw(){

    if( shuffle > 15){

  textFont(ourFont);
  fill(236 , 0, 140);
  text("Click to start.", 170, 125);
    }

  //move background after 'if( shuffle < 10){' then words stay when integer =10
  if( shuffle < 15){
    background(0,0,0);
  String[] words = {"I've been interviewed on national television dressed as a chicken.", "I've refereed in the world marbles championships.", "I once featured on the TV show 'Animals Do the Funniest Things' getting headbutted by a reindeer.", "I can speak Span(ish).", "I'm learning sign language.", "I like to sea-swim.", "I was once featured in the papers for a book signing when I hadn't read the book.", "My middle name is Nathan.", "I can count to 10 in 5 languages.", "My first TV appearance was at the age of 4.", "I cook a mean Sunday Roast.", "My initials are SnM.", "I can play the drums.", "I skateboard, mountain board and snowboard.", "I'm known for my puns.", "I have a beard.", "I'm 5ft 8 inches tall.", "I like to play table tennis.", "I was once attacked by a fox.", "I like to play pool.", "I like words.", "I've never seen Star Wars.", "I'm a purple belt in Karate", "I can diablo.", "I love hip-hop music.", "I have blue eyes.", "I'm quite hairy.", "I once ran a half marathon with 2 weeks training.",  "I love Stroop Waffles.", "My favourite biscuit is a malted milk." };
  int index = int(random(words.length));
  textFont(ourFont);
   fill(255 , 255, 255);
  text(words[index], 30, 30, 370, 200);
  shuffle = shuffle +1;

    }


  delay(100);

}

The assignment is to create four ellipses that each have a different sound, and to make the code run so that each ellipse plays its sound when clicked (mousepressed). I have managed to get the top two ellipses to work; however, I cannot get the other two to work so I would really appreciate some help. (Down at the very end with my if/else if/else statements).

    // import Minim
     import ddf.minim.*;

     Minim minim;
     AudioSample d1;
     AudioSample d2;
     AudioSample d3;
     AudioSample d4;

     AudioOutput out;

     // track when a drum has been struck
     boolean drum1struck;
     boolean drum2struck;
     boolean drum3struck;
     boolean drum4struck;


     void setup() {
       // initialize the screen
       size(400, 400);
       smooth();

       // initialize sound
       minim = new Minim(this);
     out = minim.getLineOut();

       d1 = minim.loadSample("bongo1.wav");
       d2 = minim.loadSample("bongo7.wav");
       d3 = minim.loadSample("tom1.wav");
       d4 = minim.loadSample("tom2.wav");

       // set boolean variables to initialize the graphics
       drum1struck = false;
       drum2struck = false;
       drum3struck = false;
       drum4struck = false;

     }

     void draw() {
        background(255);

       // draw the drums: if a drum has just been struck
       // then fill its ellipse with color as visual feedback for the user

       // drum 1
       if (drum1struck == true) {
         fill(255,0,0);
         drum1struck = false;
       } 
       else 
       {
         fill(255);
       }
       ellipse(50, 55, 100, 100);

       // drum 2
       if (drum2struck == true) {
         fill(255,0,0);
         drum2struck = false;
       } else {
         fill(255);
       }
       ellipse(160, 55, 100, 100);

       //drum 3
       if (drum3struck == true) {
         fill(255,0,0);
         drum3struck = false;
       } 
       else {
         fill(255);
       }
       ellipse(50, 165, 100, 100);

       //drum 4
       if (drum4struck == true) {
         fill(255,0,0);
         drum4struck = false;
       } else {
         fill(255);
       }
       ellipse(160, 165, 100, 100);


     }
     void keyPressed() {
       if (key == 'a' || key == 'A') {   //note you may have to retype the
         drum1struck = true;             //single quote marks after copying
         d1.trigger();
       }
       else if (key == 'b' || key == 'B') {
         drum2struck = true;
         d2.trigger();
       }
       else if (key == 'c' || key == 'C') {
         drum3struck = true;
         d3.trigger();
       }
       else if (key == 'd' || key == 'D') {
         drum4struck = true;
         d4.trigger();
       }
     }

     void mousePressed() {
       if (mouseX<105)
       {
            d1.trigger();
            //set Boolean for drum1 to true
            drum1struck = true;
       }
       else if (mouseX>105)
            {d2.trigger();
            //set Boolean for drum1 to true
           drum2struck = true;
       }
      else if (mouseY<-200)
       {
            d3.trigger();
            //set Boolean for drum1 to true
            drum3struck = true;
       }
       else  {
            d4.trigger();
            //set Boolean for drum1 to true
            drum4struck = true;
     }
     }

var pg;
var rects = [];
var numRects = 80;
var lives = 0;
var score = 0;
var rateChange;
var soundArray = [5];
var playSoundNumber = 0;
var randomX;

function preload() {
    drums = loadSound('../public/sounds/break.mp3');
    noise0 = loadSound('../public/sounds/pad_flute_select.mp3');
    noise1 = loadSound('../public/sounds/pad_glow_chord.mp3');
    noise2 = loadSound('../public/sounds/pad_glow_welcome2.mp3');
    noise3 = loadSound('../public/sounds/pad_hi_note.mp3');
    noise4 = loadSound('../public/sounds/pad_up.mp3');
    noise5 = loadSound('../public/sounds/pad_space_select_01.mp3');
    noise6 = loadSound('../public/sounds/pad_space_fade_01.mp3');
    noise7 = loadSound('../public/sounds/pad_glow_welcome2.mp3');
    noise8 = loadSound('../public/sounds/pad_glow_power_off_01.mp3');
}

function setup() { // **change** void setup() to function setup()
    // **change** size() to createCanvas()

    if (!!$('#sketch-holder').length) {
        var canvas = createCanvas(windowWidth, windowHeight);
        canvas.parent('sketch-holder');
    }

    drums.loop();

    for (var i = 0; i < soundArray.length; i++) {
        soundArray[0] = noise0;
        soundArray[1] = noise1;
        soundArray[2] = noise2;
        soundArray[3] = noise3;
        soundArray[4] = noise4;
        soundArray[5] = noise5;
        soundArray[6] = noise6;
        soundArray[7] = noise7;
        soundArray[8] = noise8;
    }

    amplitude = new p5.Amplitude();

    for (i = 0; i < numRects; i++) {
        r = new rectObj(random(width), random(height), random(10, 100), random(10, 100)) // generate a rectObj
        rects.push(r); //add it to the array.
    }

    cir = new circleObj(50); // create a new circle object

}


function draw() {

    var level = amplitude.getLevel();
    var levelChange = map(level, 0, 0.5, 0, 300);

    var speed = map(mouseY, 0.1, height, 0.75, 1.5);
    // speed = constrain(speed, 1, 1.5);
    for (var i = 0; i < soundArray.length; i++) {
        soundArray[i].rate(speed);
    }

    background(levelChange);
    //   console.log(mySound.rate);

    // score = ceil(score + 0.01);

    for (i = 0; i < numRects; i++) {
        rects[i].disp();
        rects[i].collide(cir); //collide against the circle object
    }

    cir.disp(mouseX, mouseY); //pass the x,y pos in to the circle.

    textSize(25);
    text("Sound: " + playSoundNumber, 100, 100);
    text("Pitch: " + nfc(speed, 2), 100, 140);

    // textSize(100);
    // text(score,100,100);


    // textSize(25);
    // if (score < 200) {
    //  text("Hit the blocks for fun", 100, 150);
    // }

    // if (score > 1000 && score < 1200) {
    //  text("Well done! Keep going!", 100, 150);
    // }

    // if (score > 3000) {
    //  text("Sorry, I haven't done an end yet. Might as well enter the site.", 100, 150);
    // }

    // if (lives <= 0) {
    //  textSize(200);
    //  // background(0);
    //  text("GAME OVER",100,windowHeight/2);
    //  noLoop();
    //  }
}

function rectObj(x, y, w, h) {
    this.x = x
    this.y = y
    this.w = w
    this.h = h
    this.color = color(random(102, 255), random(102, 255), random(102, 255))
    this.hit = false;
    this.isCollisioning = false;

    this.collide = function (obj) {

        this.hit = collideRectCircle(this.x, this.y, this.w, this.h, obj.x, obj.y, obj.dia); //collide the cir object into this rectangle object.

        if (this.hit && !this.isCollisioning) {
            this.color = color(0) //set this rectangle to be black if it gets hit
            lives++
            soundArray[playSoundNumber].play()
            playSoundNumber++
            this.isCollisioning = true
                // console.log(this.isCollisioning)
            if (playSoundNumber > 8) {
                playSoundNumber = 0;
            }
        }

    }

    var randomX = random(1, 5);

    this.disp = function () {
        noStroke();
        fill(this.color);
        this.x += randomX //move to the right!
        if (this.x > width) { //loop to the left!
            this.x = -this.w;
        }
        rect(this.x, this.y, this.w, this.h);

    }

}

function circleObj(dia) {
    this.dia = dia;
    this.color = color(random(255), random(255), random(255))
    this.x;
    this.y;

    this.disp = function (x, y) {
        this.x = x;
        this.y = y;
        noStroke();
        fill(this.color);
        ellipse(this.x, this.y, this.dia, this.dia);
    }

}

Hello!

Yes, I tried that, but it crashes the app :( I get an error that there are no more free IDs. I think I'm not doing something right. I am a n00b after all. Here's the code of my app (Note: I am using ReACTIVision to control the filter (and scene changes, etc.):

    import processing.sound.*;
    import TUIO.*;

    SoundFile drums;
    SoundFile bass;
    SoundFile pad;
    SoundFile pluck;

    ArrayList<SoundFile> soundsPlaying = new ArrayList<SoundFile>();

    LowPass lowPass;

    TuioProcessing tuioClient;

    float startAngle;
    float filterFrequency;
    int currentScene = 0;

    void setup() {
      // Load a soundfile from the /data folder of the sketch and play it back
      drums = new SoundFile(this, "loops/drums.wav");
      bass = new SoundFile(this, "loops/bass.wav");
      pad = new SoundFile(this, "loops/pad.wav");
      pluck = new SoundFile(this, "loops/pluck.wav");


      lowPass = new LowPass(this);

      changeScene(0); // DEBU purposes
      // TUIO settings
      tuioClient = new TuioProcessing(this);
    }      

    void draw() {
      lowPass.freq(filterFrequency);
      println(filterFrequency);

      for (int i = 0; i < soundsPlaying.size(); i++) {
        SoundFile sound = soundsPlaying.get(i);
        lowPass.process(sound);
      }
    }

    // TUIO Tracking methods. Those are used to track markers using CV.

    // called when an object is added to the scene
    void addTuioObject(TuioObject tobj) {

      // Symbol with ID 0 will control the filter
      if (tobj.getSymbolID() == 0) {
        println("Initial angle:" + tobj.getAngle());
        startAngle = tobj.getAngle();
      }

      if (tobj.getSymbolID() == 1) {
        changeScene(0);
      }

      // Symbol with ID 1 will control the scenes
    }

    // called when an object is moved
    void updateTuioObject (TuioObject tobj) {
      // Symbol ID 0 is filter cutoff freq control
      if (tobj.getSymbolID() == 0) {
        float angle = abs(startAngle - tobj.getAngle());
        filterFrequency =  map(angle, 0, TWO_PI, 100, 22000);
        // println("Current angle: " + filterFrequency + "Filter feq: " + filterFrequency);
      }

      // Symbol ID 1 is controlling the scenes
      if (tobj.getSymbolID() == 1) {
        // Right now we have 4 scenes: 0 - 3
        int newScene = floor(tobj.getX() * 4); 
        if (newScene != currentScene) {
          currentScene = newScene;
          println("New scene detected: " + newScene);
          changeScene(newScene);
        }
      }
    }

    // Utility methods
    void changeScene(int scene) {
      stopAllSounds();
      println("Just after stopping: " + soundsPlaying);
      switch (scene) {
        case 0:
          soundsPlaying.add(pluck);
          println("Changing to scene 0");
          break;
        case 1:
          soundsPlaying.add(pluck);
          soundsPlaying.add(pad);
          println("Changing to scene 1");
          break;
        case 2:
          stopAllSounds();
          soundsPlaying.add(pluck);
          soundsPlaying.add(pad);
          soundsPlaying.add(bass);
          println("Changing to scene 2");
          break;
        case 3:
          stopAllSounds();
          soundsPlaying.add(pluck);
          soundsPlaying.add(pad);
          soundsPlaying.add(bass);
          soundsPlaying.add(drums);
          println("Changing to scene 3");
          break;
        default:
          break;
      }

      for (int i = 0; i < soundsPlaying.size(); i++) {
        SoundFile sound = soundsPlaying.get(i);
        sound.loop();
        lowPass.process(sound);
      }

      println("Just after playing: " + soundsPlaying);

    }

    void stopAllSounds() {
      for (int i = 0; i < soundsPlaying.size(); i++) {
        SoundFile sound = soundsPlaying.get(i);
        sound.stop();
      }
      soundsPlaying.clear();
    }


    // called when an object is removed from the scene
    void removeTuioObject(TuioObject tobj) {
      // DEBUG comment this out for now
      // if (tobj.getSymbolID() == 1) {
      //   stopAllSounds();
      // }

      // currentScene = 1000; // High number, so when the symbol reenters on scene 0, it plays
    }


    // ------------------Unused TUIO methods-----------------------------
    // called when a cursor is added to the scene
    void addTuioCursor(TuioCursor tcur) {
    }

    // called when a cursor is moved
    void updateTuioCursor (TuioCursor tcur) {
    }

    // called when a cursor is removed from the scene
    void removeTuioCursor(TuioCursor tcur) {
    }
    // --------------------------------------------------------------
    // called when a blob is added to the scene
    void addTuioBlob(TuioBlob tblb) {
    }

    // called when a blob is moved
    void updateTuioBlob (TuioBlob tblb) {
    }

    // called when a blob is removed from the scene
    void removeTuioBlob(TuioBlob tblb) {
    }

    // --------------------------------------------------------------
    // called at the end of each TUIO frame
    void refresh(TuioTime frameTime) { 
    }

I tried commenting the code as well as I could. Please don't hesitate to ask!

Thanks in advance, Hristo.

I have a global variable filterFrequency, which is supposed to control the filter frequency of the sound library.

I have this in my setup() method:

  drums.loop();
  bass.loop();
  pad.loop();
  pluck.loop();

  lowPass = new LowPass(this);

  lowPass.process(drums);
  lowPass.process(bass);
  lowPass.process(pad);
  lowPass.process(pluck);

I have this in my draw() method:

lowPass.freq(filterFrequency);

I am changing the filterFrequency from outside P3. I can see that the variable is changing, but the filter is not responding. Anyone had this problem before?

Hi, we are doing a project on Airdrums using Kinect in Processing. We need to control the volume of the drums, that is we need the volume to vary depending on how hard it is hit. Please help!

I'm using minim BeatDetect object to analyze the incoming microphone signal. BeatDetect uses FFT. In the BeatDetect class, there are 4 functions of interest. isHat(), isKick(), isSnare() and isRange(int, int, int). The first three are customized versions of isRange(). What I'm trying to do is recognize more than just hat, kick and snare drums. In order to do this, I need to understand the math in the methods isHat(), isKick() and isSnare(). I'm hoping someone here can help me. Here is the code for the 4 functions.

`

    public boolean isKick()
{
    if (algorithm == SOUND_ENERGY)
    {
        return false;
    }
    int upper = 6 >= fft.avgSize() ? fft.avgSize() : 6;
    return isRange(1, upper, 2);
}

public boolean isSnare()
{
    if (algorithm == SOUND_ENERGY)
    {
        return false;
    }
    int lower = 8 >= fft.avgSize() ? fft.avgSize() : 8;
    int upper = fft.avgSize() - 1;
    int thresh = (upper - lower) / 3 + 1;
    return isRange(lower, upper, thresh);
}

public boolean isHat()
{
    if (algorithm == SOUND_ENERGY)
    {
        return false;
    }
    int lower = fft.avgSize() - 7 < 0 ? 0 : fft.avgSize() - 7;
    int upper = fft.avgSize() - 1;
    return isRange(lower, upper, 1);
}

public boolean isRange(int low, int high, int threshold)
{
    if (algorithm == SOUND_ENERGY)
    {
        return false;
    }
    int num = 0;
    for (int i = low; i < high + 1; i++)
    {
        if (isOnset(i))
        {
            num++;
        }
    }
    return num >= threshold;
}

` I want to be able to recognize beats accurately across a range of instruments by manipulating the methods above. Can anybody help teach me what I need to recognize? Currently, I understand that the functions return true if a beat is detected within a specified range of frequency bands. What I don't understand is why the values for the parameters [low, high, threshold] in the functions correlate to specific instruments. Thanks for reading and please respond.

I want to use the p5 sound library with p5.Part to play back a composition, but I can't even get it to work properly with the simplest examples. The examples on the p5.js site (like this ) work just fine and throw up no console errors, but if I try to paste this code into my own sketch (obviously using different audio files) it doesn't work. It is loading the files (there is no server issue; I'm hosting it on a local server this is not the problem, and the same thing happens if I actually post it online) because it plays something, but what it plays is a garbled sequence of drums which is slightly different every time the page is loaded. You can see the code below is almost directly from the composition example that works fine on the p5.js site, only with my files and simpler sequences in an effort to get it to work. It should play the low drum four beats, followed by the high drum four beats. It throws the following console error times the length of the sequences (in this case, 8) when I run it:

TypeError: undefined is not an object (evaluating 'phraseArray.length') p5.sound.js:5196

I think this indicates that somehow, when I'm passing boxPat or drumPat to addPhrase(), it's empty/unefined (even though it's clearly defined globally). I'm using the most up-to-date version of both p5.js and the sound library.

Why is this happening? Any ideas or help are greatly appreciated!

var box, drum;
var boxPat = [1,1,1,1,0,0,0,0];
var drumPat = [0,0,0,0,1,1,1,1];
var osc, env;

function preload() {
  box = loadSound('DrumLo.mp3');
  drum = loadSound('DrumHi.mp3');
}

function setup() {
  var myPart = new p5.Part();
  myPart.addPhrase('box', playBox, boxPat);
  myPart.addPhrase('drum', playDrum, drumPat);
  myPart.setBPM(60);
  myPart.start();

  osc = new p5.Oscillator();
  env = new p5.Env(0.01, 1, 0.2, 0);
}

function playBox(playbackRate, time) {
  box.rate(playbackRate);
  box.play(time);
}

function playDrum(playbackRate, time) {
  drum.rate(playbackRate)
  drum.play(time);
}

Hey guys,
so here is my situation - i have got two working processing codes ( only because of all the help i received on this forum, thanks to GoToLoop ). The first code triggers off video clips based on a particular string input. The second code does exactly the same thing, but triggers off audio clips instead. What i need to do now is somehow merge both the codes such that, when i type in a string input ( say 'red' ), processing will, at random, either play the video clip, or the audio clip that is related to that particular string input. I hope i have been clear enough.. [-O<
this is the code for triggering video clips -

import processing.video.Movie;

static final int QTY = 3;
final Movie[] movies = new Movie[QTY];
int idx;
String typing = "";
String saved = "";

void setup() { 
  size(1440, 900, JAVA2D);
  frameRate(30);
  noSmooth();

  movies[0] = new Movie(this, "sin_city.mp4");
  movies[1] = new Movie(this, "blue_velvet.mp4");
  movies[2] = new Movie(this, "finale.mp4");

 }

void draw() { 
  background(0);
  set(0,0,movies[idx] ); 
  //image(films[0],0,0);
  //image(films[1],0,0);
  //image(films[2],0,0);
} 

void movieEvent(Movie m) { 
  m.read(); 
} 

void keyPressed() {


 if (key == '\n' ) {
    saved = typing;
    // A String can be cleared by setting it equal to ""
    typing = ""; 
  } else {
    // Otherwise, concatenate the String
    // Each character typed by the user is added to the end of the String variable.
    typing = typing + key; 
  }

 int k = keyCode, n = getMovieIndex(k) ;

  if (n >= 0){ //& n!= idx) {
    movies[idx].pause();
    movies[idx = n].loop();
  }
}


int getMovieIndex(int k) {
  if ( saved.equals("apple")){
  return 0;
  }else if(saved.equals("blue")){
  return 1;
  }else if(saved.equals("red")){
  return 2;
  }else{
  return -1;
  }
}

and this is the code for triggering the audio clips
import ddf.minim.spi.*; import ddf.minim.signals.*; import ddf.minim.*; import ddf.minim.analysis.*; import ddf.minim.ugens.*; import ddf.minim.effects.*;

Minim minim;

static final int QTY = 3;
final AudioPlayer[] players = new AudioPlayer[QTY];
int idx;
String typing = "";
String saved = "";

void setup() { 
  size(1440, 900, JAVA2D);
  frameRate(30);
  noSmooth();
  minim = new Minim(this);
  //player = minim.loadFile(“drums.wav”);
  players[0] = minim.loadFile("one.mp3");
  players[1] = minim.loadFile("two.mp3");
  players[2] = minim.loadFile("three.mp3");

 }

void draw() { 
  background(0);
  //set(0,0,players[idx] ); 
  //image(films[0],0,0);
  //image(films[1],0,0);
  //image(films[2],0,0);
} 

//void movieEvent(Movie m) { 
  //m.read(); 
//} 

void keyPressed() {


 if (key == '\n' ) {
    saved = typing;
    // A String can be cleared by setting it equal to ""
    typing = ""; 
  } else {
    // Otherwise, concatenate the String
    // Each character typed by the user is added to the end of the String variable.
    typing = typing + key; 
  }

 int k = keyCode, n = getMovieIndex(k) ;

  if (n >= 0){ //& n!= idx) {

    players[idx].pause();  
    players[idx = n].play();

      }
}


int getMovieIndex(int k) {
  if ( saved.equals("apple")){
  return 0;
  }else if(saved.equals("blue")){
  return 1;
  }else if(saved.equals("red")){
  return 2;
  }else{
  return -1;
  }
}

Any kind of help would be GREATLY appreciated :D

So im using minim. What i need to do is, based on different string inputs, i need different sound clips to play. i had used a code very similar to this to get the same functionality to switch between videos. That worked fine. However when im applying this same logic to music clips its not working properly. whats happening is when i type in the string words****("red" for example)**** the first time it works. However the minute i press any other key on the keyboard the soundclip stops playing. that is just one of the problems. Moreover, if i try to type the same string word again ****("red" for example)****, it does not work at all. Can some one please have a look and help me out! here is the code -

import ddf.minim.spi.*;
import ddf.minim.signals.*;
import ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.ugens.*;
import ddf.minim.effects.*;

Minim minim;

static final int QTY = 3;
final AudioPlayer[] players = new AudioPlayer[QTY];
int idx;
String typing = "";
String saved = "";

void setup() { 
  size(1440, 900, JAVA2D);
  frameRate(30);
  noSmooth();
  minim = new Minim(this);
  //player = minim.loadFile(“drums.wav”);
  players[0] = minim.loadFile("one.mp3");
  players[1] = minim.loadFile("two.mp3");
  players[2] = minim.loadFile("three.mp3");

 }

void draw() { 
  background(0);
  //set(0,0,players[idx] ); 
  //image(films[0],0,0);
  //image(films[1],0,0);
  //image(films[2],0,0);
} 

//void movieEvent(Movie m) { 
  //m.read(); 
//} 

void keyPressed() {


 if (key == '\n' ) {
    saved = typing;
    // A String can be cleared by setting it equal to ""
    typing = ""; 
  } else {
    // Otherwise, concatenate the String
    // Each character typed by the user is added to the end of the String variable.
    typing = typing + key; 
  }

 int k = keyCode, n = getMovieIndex(k) ;

  if (n >= 0){ //& n!= idx) {

    players[idx].close();  
    players[idx = n].play();
      }
}


int getMovieIndex(int k) {
  if ( saved.equals("apple")){
  return 0;
  }else if(saved.equals("blue")){
  return 1;
  }else if(saved.equals("red")){
  return 2;
  }else{
  return -1;
  }
}

Hi everyone, this is the first Processing based library that I've made and I'm looking for some feedback.

Showtime is a library I wrote for connecting multiple programs together in a way that lets you discover new program nodes from a central 'stage' and listen to or control methods remotely. The library originated when I was getting frustrated with having to manually connect up OSC addresses when connecting Ableton Live to Unity, so I built a Python to C# connector that let me call methods inside of the Ableton Live API without using any OSC or MIDI messages.

A Java and Processing version version naturally followed straight afterwards. The library is built using ZeroMQ sockets which has made porting it to other languages much easier. Nodes made in any of the available languages are functionally identical.

Here's a demo of it in action.

Interacting with Live using Python version of Showtime.

I'm hoping that this will be useful for anyone looking to hook up multiple Processing apps to other languages. I've been mainly using it to control Ableton Live, but I've got some plans for connecting it to some hardware devices in the future. Some BeagleBone powered lights or drums would be pretty fun to play with!

Anyway, hope this is useful for anyone! I've included instructions for usage in the Showtime-Processing repository and there are a few examples included in the library download as well.

Downloads:

Showtime-Processing Github download

Showtime-Processing Github repository

All language versions of Showtime

main tab

// Load Image Canvas (Instruments)
PImage piano;
PImage drums;
PImage guitar;
PImage pianoReverb;
PImage drumsReverb;
PImage guitarReverb;


// Piano Keys Array
boolean[] pkeys = new boolean[20];
PianoKey[] pianoKey = new PianoKey[20];

//Drum Keys Array
boolean[] dkeys = new boolean[10];
DrumKey[] drumKey = new DrumKey[10];

boolean[] switchButtons = new boolean[8];
Button[] buttons = new Button[7];

int instrument;
int previouseInstrument;

boolean reverbIsOn = false; // new !!!

void setup() {
  size (1024, 576);
  smooth();

  piano = loadImage("piano.jpg");
  pianoReverb = loadImage("pianoReverb.jpg");
  drums = loadImage("drums.jpg");
  drumsReverb = loadImage("drumsReverb.jpg");
  guitar = loadImage("guitar.jpg");
  guitarReverb = loadImage("guitarReverb.jpg");

  imageMode(CORNER);
  instrument = 0;

  //(White Piano Keys) Class Information
  pianoKey[0] = new PianoKey(0, 382, 71, 138, 0, 118, 264, 35, 'q', color(0, 255, 0));
  pianoKey[1] = new PianoKey(160, 382, 80, 138, 197, 118, 264, 43, 'e', color(0, 255, 0));
  pianoKey[2] = new PianoKey(246, 382, 80, 138, 246, 118, 264, 43, 'r', color(0, 255, 0));
  pianoKey[3] = new PianoKey(600, 382, 80, 138, 600, 118, 264, 43, 'i', color(0, 255, 0));
  pianoKey[4] = new PianoKey(854, 382, 80, 140, 854, 118, 264, 43, '[', color(0, 255, 0));
  pianoKey[5] = new PianoKey(76, 382, 80, 139, 95, 118, 264, 41, 'w', color(0, 255, 0));
  pianoKey[6] = new PianoKey(331, 382, 86, 138, 349, 118, 264, 41, 't', color(0, 255, 0));
  pianoKey[7] = new PianoKey(423, 382, 86, 138, 449, 118, 264, 41, 'y', color(0, 255, 0));
  pianoKey[8] = new PianoKey(515, 382, 79, 138, 551, 118, 264, 42, 'u', color(0, 255, 0));
  pianoKey[9] = new PianoKey(684, 382, 79, 139, 703, 118, 264, 40, 'o', color(0, 255, 0));
  pianoKey[10] = new PianoKey(769, 383, 80, 139, 805, 118, 265, 44, 'p', color(0, 255, 0));
  pianoKey[11] = new PianoKey(939, 383, 87, 139, 959, 118, 265, 39, ']', color(0, 255, 0));

  //(Black Piano Keys) Class Information
  pianoKey[12] = new PianoKey(36, 119, 58, 262, 0, 0, 0, 0, '2', color(255, 0, 0));
  pianoKey[13] = new PianoKey(136, 119, 59, 262, 0, 0, 0, 0, '3', color(255, 0, 0));
  pianoKey[14] = new PianoKey(290, 119, 59, 262, 0, 0, 0, 0, '5', color(255, 0, 0));
  pianoKey[15] = new PianoKey(390, 119, 59, 262, 0, 0, 0, 0, '6', color(255, 0, 0));
  pianoKey[16] = new PianoKey(490, 119, 59, 262, 0, 0, 0, 0, '7', color(255, 0, 0));
  pianoKey[17] = new PianoKey(643, 119, 59, 262, 0, 0, 0, 0, '9', color(255, 0, 0));
  pianoKey[18] = new PianoKey(743, 119, 59, 262, 0, 0, 0, 0, '0', color(255, 0, 0));
  pianoKey[19] = new PianoKey(898, 119, 59, 262, 0, 0, 0, 0, '=', color(255, 0, 0));
  noStroke();

  //whiteKey Array Information
  for (int i = 0; i < 11; i++)
    pkeys[i] = false;

  //blackKey Array Information
  for (int i = 12; i < 20; i++)
    pkeys[i] = false;

  //(Drum Keys) Class Information
  drumKey[0] = new DrumKey(199, 422, 85, 80, 'j', color(255, 0, 0));
  drumKey[1] = new DrumKey(450, 433, 85, 80, 'd', color(0, 0, 255));
  drumKey[2] = new DrumKey(325, 344, 70, 65, 'f', color(255, 0, 0));
  drumKey[3] = new DrumKey(465, 313, 75, 70, 'g', color(0, 255, 0));
  drumKey[4] = new DrumKey(730, 423, 85, 80, 'h', color(0, 0, 255));
  drumKey[5] = new DrumKey(590, 410, 85, 80, 'a', color(0, 255, 0));
  drumKey[6] = new DrumKey(440, 188, 86, 80, 'k', color(0, 255, 0));
  drumKey[7] = new DrumKey(775, 208, 85, 80, 'l', color(255, 0, 0));
  drumKey[8] = new DrumKey(639, 215, 50, 45, ';', color(0, 0, 255));
  drumKey[9] = new DrumKey(715, 300, 100, 85, 'p', color(0, 255, 0));
  noStroke();

  //Drum Key Array Information
  for (int i = 0; i < 10; i++)
    dkeys[i] = false;

  buttons[0] = new Button(250, 40, 0);
  buttons[1] = new Button(800, 40, -1); // -1
  buttons[2] = new Button(400, 40, 2);
  buttons[3] = new Button(800, 40, 3);
  buttons[4] = new Button(100, 40, 4);
  buttons[5] = new Button(800, 40, 5);
  buttons[6] = new Button(500, 40, 6);

  for (int i = 0; i < 6; i++)
    ellipse(buttons[i].x, buttons[i].y, 12, 12);

  for (int i = 0; i < 6; i++)
    switchButtons[i] = false;
}

void draw() {
  //
  switch (instrument) {   

    // Handles Piano KeyStrokes and Piano Canvas Switches
  case 0:
    if (!reverbIsOn) {
      // no reverb 
      image(piano, 0, 0, 1026, 577);
      for (int i = 0; i <= 19; i++) { 
        pianoKey[i].render();
      } // for
    } // if 
    else {
      image(pianoReverb, 0, 0, 1026, 577);
      for (int i = 0; i <= 19; i++) { 
        pianoKey[i].render();
      }
    }
    break; // for case 0

  case 1:
    // not in use 
    break;

    //Handles Drum Keystrokes and Drum Canvas Switches
  case 2:
    if (!reverbIsOn) {
      image(drums, -1, 0, 1026, 577);
      for (int i = 0; i <= 9; i++) {
        drumKey[i].render();
      }
    }
    else 
    {
      image(drumsReverb, -1, 0, 1026, 577);   
      for (int i = 0; i <= 9; i++) {
        drumKey[i].render();
      }
    }  
    break; // for cse 2

    //Handles Guitar KeyStrokes and Guitar Canvas Switches
  case 4:
    if (!reverbIsOn) {
      image(guitar, -1, 0, 1026, 577);
    }
    else
    {
      image(guitarReverb, -1, 0, 1026, 577);
    }
    break;

  case 6:
    background(0);
    textSize(32);
    text("Help", 100, 100);    
    text("press mouse", 100, 300);
    break;

  default: 
    println("unknown instr");
    break;
  } //Switch

  //
} // Function

// ---------------------------------------

void keyPressed() {

  //Array Handles Piano KeyStroke on KeyPressed
  for (int i = 0; i <= 19; i++) { 
    pianoKey[i].handleKeyPressed(key);
  }

  //Array handles drum KeyStroke on KeyPressed
  for (int i = 0; i <= 9; i++) { 
    drumKey[i].handleKeyPressed(key);
  }
}

void keyReleased() {

  //Array handles piano KeyStroke on KeyReleased
  for (int i = 0; i <= 19; i++) {
    pianoKey[i].handleKeyReleased(key);
  }

  //Array handles drum KeyStroke on KeyReleased
  for (int i = 0; i <= 9; i++) {
    drumKey[i].handleKeyReleased(key);
  }
}

void mousePressed() {

  if (instrument==6) {
    instrument=previouseInstrument;
  }
  else {
    for (int i = 0; i < buttons.length; i++) {
      if (dist(mouseX, mouseY, buttons[i].x, buttons[i].y) <= buttons[i].distAllowed) {
        if (buttons[i].instrument == -1) 
        {
          // toggle 
          reverbIsOn = ! reverbIsOn;
          println("reverb "+reverbIsOn);
          return;
        }
        else
        {
          previouseInstrument=instrument;
          instrument = buttons[i].instrument; 
          println("button "+i);   
          return;
        }
      }
    }
  }
}

I have edited the sketch to the following below... have added in the final int (currentCanvas) variable and defined the buttons below. Any errors in this?

// Load Image Canvas (Instruments) PImage piano; PImage drums; PImage guitar; PImage pianoReverb; PImage drumsReverb; PImage guitarReverb;

    // Piano Keys Array
    boolean[] pkeys = new boolean[20];
    PianoKey[] pianoKey = new PianoKey[20];
    //Drum Keys Array
    boolean[] dkeys = new boolean[10];
    DrumKey[] drumKey = new DrumKey[10];

    //Switch for canvas/image changes
    Button[] buttons = new Button[6];

    int instrument;

  //
  final int canvasPiano = 0;
  final int canvasPianoReverb = 1;
  final int canvasDrums = 2;
  final int canvasDrumsReverb = 3;
  final int canvasGuitar = 4;
  final int canvasGuitarReverb = 5;

void setup() {
  size (1024, 576);
  smooth();

  piano = loadImage("piano.jpg");
  pianoReverb = loadImage("pianoReverb.jpg");
  drums = loadImage("drums.jpg");
  drumsReverb = loadImage("drumsReverb.jpg");
  guitar = loadImage("guitar.jpg");
  guitarReverb = loadImage("guitarReverb.jpg");

  imageMode(CORNER);
  instrument = 0;

  //(White Piano Keys) Class Information
  pianoKey[0] = new PianoKey(0, 382, 71, 138, 0, 118, 264, 35, 'q', color(0, 255, 0));
  pianoKey[1] = new PianoKey(160, 382, 80, 138, 197, 118, 264, 43, 'e', color(0, 255, 0));
  pianoKey[2] = new PianoKey(246, 382, 80, 138, 246, 118, 264, 43, 'r', color(0, 255, 0));
  pianoKey[3] = new PianoKey(600, 382, 80, 138, 600, 118, 264, 43, 'i', color(0, 255, 0));
  pianoKey[4] = new PianoKey(854, 382, 80, 140, 854, 118, 264, 43, '[', color(0, 255, 0));
  pianoKey[5] = new PianoKey(76, 382, 80, 139, 95, 118, 264, 41, 'w', color(0, 255, 0));
  pianoKey[6] = new PianoKey(331, 382, 86, 138, 349, 118, 264, 41, 't', color(0, 255, 0));
  pianoKey[7] = new PianoKey(423, 382, 86, 138, 449, 118, 264, 41, 'y', color(0, 255, 0));
  pianoKey[8] = new PianoKey(515, 382, 79, 138, 551, 118, 264, 42, 'u', color(0, 255, 0));
  pianoKey[9] = new PianoKey(684, 382, 79, 139, 703, 118, 264, 40, 'o', color(0, 255, 0));
  pianoKey[10] = new PianoKey(769, 383, 80, 139, 805, 118, 265, 44, 'p', color(0, 255, 0));
  pianoKey[11] = new PianoKey(939, 383, 87, 139, 959, 118, 265, 39, ']', color(0, 255, 0));

  //(Black Piano Keys) Class Information
  pianoKey[12] = new PianoKey(36, 119, 58, 262, 0, 0, 0, 0, '2', color(255, 0, 0));
  pianoKey[13] = new PianoKey(136, 119, 59, 262, 0, 0, 0, 0, '3', color(255, 0, 0));
  pianoKey[14] = new PianoKey(290, 119, 59, 262, 0, 0, 0, 0, '5', color(255, 0, 0));
  pianoKey[15] = new PianoKey(390, 119, 59, 262, 0, 0, 0, 0, '6', color(255, 0, 0));
  pianoKey[16] = new PianoKey(490, 119, 59, 262, 0, 0, 0, 0, '7', color(255, 0, 0));
  pianoKey[17] = new PianoKey(643, 119, 59, 262, 0, 0, 0, 0, '9', color(255, 0, 0));
  pianoKey[18] = new PianoKey(743, 119, 59, 262, 0, 0, 0, 0, '0', color(255, 0, 0));
  pianoKey[19] = new PianoKey(898, 119, 59, 262, 0, 0, 0, 0, '=', color(255, 0, 0));
  noStroke();

  //whiteKey Array Information
 for (int i = 0; i < 11; i++)
   pkeys[i] = false;

  //blackKey Array Information
 for (int i = 12; i < 20; i++)
   pkeys[i] = false;

   //(Drum Keys) Class Information
  drumKey[0] = new DrumKey(199, 422, 85, 80, 'j', color(255, 0, 0));
  drumKey[1] = new DrumKey(450, 433, 85, 80, 'd', color(0, 0, 255));
  drumKey[2] = new DrumKey(325, 344, 70, 65, 'f', color(255, 0, 0));
  drumKey[3] = new DrumKey(465, 313, 75, 70, 'g', color(0, 255, 0));
  drumKey[4] = new DrumKey(730, 423, 85, 80, 'h', color(0, 0, 255));
  drumKey[5] = new DrumKey(590, 410, 85, 80, 'a', color(0, 255, 0));
  drumKey[6] = new DrumKey(440, 188, 86, 80, 'k', color(0, 255, 0));
  drumKey[7] = new DrumKey(775, 208, 85, 80, 'l', color(255, 0, 0));
  drumKey[8] = new DrumKey(639, 215, 50, 45, ';', color(0, 0, 255));
  drumKey[9] = new DrumKey(715, 300, 100, 85, 'p', color(0, 255, 0));
  noStroke();

  //Drum Key Array Information
  for (int i = 0; i < 10; i++)
    dkeys[i] = false;

 buttons[0] = new Button(250, 40, 0);
 buttons[1] = new Button(800, 40, 1);

 buttons[2] = new Button(400, 40, 2);
 buttons[3] = new Button(800, 40, 3);

 buttons[4] = new Button(100, 40, 4);
 buttons[5] = new Button(800, 40, 5);

 currentCanvas = canvasPiano;
 currentCanvas = canvasPianoReverb;
 currentCanvas = canvasDrums;
 currentCanvas = canvasDrumsReverb;
 currentCanvas = canvasGuitar;
 currentCanvas = canvasGuitarReverb;

}

void draw() {

 //Handles Piano KeyStrokes and Piano Canvas Switches
  switch (currentCanvas){
  case canvasPiano:
    image(piano, -1, 0, 1026, 577);
    break;

  case :
    image(pianoReverb, -1, 0, 1026, 577);  
    for(int i = 0; i <= 19; i++) { 
      pianoKey[i].render();
  }
   break;

 //Handles Drum Keystrokes and Drum Canvas Switches
  case 2:
    image(drums, -1, 0, 1026, 577);
   break;
  case 3:
    image(drumsReverb, -1, 0, 1026, 577);   
    for(int i = 0; i <= 9; i++){
     drumKey[i].render();    
   }
   break;

   //Handles Guitar KeyStrokes and Guitar Canvas Switches
   case 4:
    image(guitar, -1, 0, 1026, 577);
    break;
   case 5:
    image(guitarReverb, -1, 0, 1026, 577);
    break;

  } //Switch   
} // Function

void keyPressed() {

  switch(instrument){
  //Array Handles Piano KeyStroke on KeyPressed
  case 0:
  for(int i = 0; i <= 19; i++) { 
    pianoKey[i].handleKeyPressed(key);  
  }
  break;

  //Array handles drum KeyStroke on KeyPressed
  case 2:
  for(int i = 0; i <= 9; i++) { 
    drumKey[i].handleKeyPressed(key);

   }
  break; 
  }
}

void keyReleased() {

  switch(instrument){
  //Array handles piano KeyStroke on KeyReleased
  case 0:
  for(int i = 0; i <= 19; i++) {
    pianoKey[i].handleKeyReleased(key);   
  }
  break;

  //Array handles drum KeyStroke on KeyReleased
  case 2:
  for(int i = 0; i <= 9; i++) {
    drumKey[i].handleKeyReleased(key); 

   }
  break;
  }
}

void mousePressed() {

  switch(currentCanvas){
   for (int i = 0; i < buttons.length; i++){
    if (dist(mouseX, mouseY, buttons[i].x, buttons[i].y) <= buttons[i].distAllowed){
      instrument = buttons[i].instrument;    
   return;

  }
}

}

Again thanks everyone for the help but I am still having a few errors.

This code runs fine but ... every time the reverb switch is pressed on any canvas it goes straight to the Drum canvas rather than loading the reverb canvas for the particular instrument it was pressed for...

Also if I run this code... none of my rectangles are rendered over the Piano keys when I try to play it... and the ellipses are only rendered on the drum canvas when the reverb switch is turned on. Basically I need the canvas to switch to the Reverb ON canvas each time I click the reverb switch icon and then have the canvas switch back to the Reverb OFF canvas when it is clicked again.. for each instrument canvas.

And still have functionality of the keystroke array so I can play it.

(I havent yet coded the guitar)

class Button {

  int x;
  int y;
  int distAllowed = 85;
  int instrument;
  Button(int x_, int y_, int instrument_) {

    x = x_;
    y = y_;
    instrument = instrument_;

  } // Constructor
} // Class

class DrumKey

{

  int xPos1;
  int yPos1;
  int xSize1; 
  int ySize1;

  char letter;
  color drumKeyColour;
  boolean pressed;
  //sound

  DrumKey(int x1, int y1, int w1, int h1, char l, color c) {

    xPos1 = x1;
    yPos1 = y1;
    xSize1 = w1;
    ySize1 = h1;

    letter = l;

    drumKeyColour = c;
    pressed = false;
    //sound
  }

  void render() {
    if (pressed){
    fill(drumKeyColour, 70);
    ellipse(xPos1, yPos1, xSize1, ySize1);

    }
  }

  void handleKeyPressed(char co)
  {
    if (co == letter) 
    {
      pressed = true;
    }
  }

  void handleKeyReleased(char co)
  {
    if (co == letter) 
    {
      pressed = false;
    }
  }
}

class PianoKey

{

  int xPos1;
  int yPos1;
  int xSize1; 
  int ySize1;

  int xPos2; 
  int yPos2; 
  int xSize2; 
  int ySize2;

  char letter;
  color keyColour;
  boolean pressed;

  //sound

  PianoKey(int x1, int y1, int w1, int h1, int x2, int y2, int w2, int h2, char l, color c) {

    xPos1 = x1;
    yPos1 = y1;
    xSize1 = w1;
    ySize1 = h1;

    xPos2 = x2;
    yPos2 = y2;
    xSize2 = h2;
    ySize2 = w2;

    letter = l;
    keyColour = c;
    pressed = false;
    //sound
  }

  void render() {
    if (pressed){
    fill(keyColour, 120);
    rect(xPos1, yPos1, xSize1, ySize1);
    rect(xPos2, yPos2, xSize2, ySize2);

    }
  }

  void handleKeyPressed(char c)
  {
    if (c == letter) 
    {
      pressed = true;
    }
  }

  void handleKeyReleased(char c)
  {
    if (c == letter) 
    {
      pressed = false;
    }
  }
}

       // Load Image Canvas (Instruments)
        PImage piano;
        PImage drums;
        PImage guitar;
        PImage pianoReverb;
        PImage drumsReverb;
        PImage guitarReverb;


        // Piano Keys Array
        boolean[] pkeys = new boolean[20];
        PianoKey[] pianoKey = new PianoKey[20];
        //Drum Keys Array
        boolean[] dkeys = new boolean[10];
        DrumKey[] drumKey = new DrumKey[10];

        Button[] buttons = new Button[6];

        int instrument;

    void setup() {
      size (1024, 576);
      smooth();

      piano = loadImage("piano.jpg");
      pianoReverb = loadImage("pianoReverb.jpg");
      drums = loadImage("drums.jpg");
      drumsReverb = loadImage("drumsReverb.jpg");
      guitar = loadImage("guitar.jpg");
      guitarReverb = loadImage("guitarReverb.jpg");

      imageMode(CORNER);
      instrument = 0;

      //(White Piano Keys) Class Information
      pianoKey[0] = new PianoKey(0, 382, 71, 138, 0, 118, 264, 35, 'q', color(0, 255, 0));
      pianoKey[1] = new PianoKey(160, 382, 80, 138, 197, 118, 264, 43, 'e', color(0, 255, 0));
      pianoKey[2] = new PianoKey(246, 382, 80, 138, 246, 118, 264, 43, 'r', color(0, 255, 0));
      pianoKey[3] = new PianoKey(600, 382, 80, 138, 600, 118, 264, 43, 'i', color(0, 255, 0));
      pianoKey[4] = new PianoKey(854, 382, 80, 140, 854, 118, 264, 43, '[', color(0, 255, 0));
      pianoKey[5] = new PianoKey(76, 382, 80, 139, 95, 118, 264, 41, 'w', color(0, 255, 0));
      pianoKey[6] = new PianoKey(331, 382, 86, 138, 349, 118, 264, 41, 't', color(0, 255, 0));
      pianoKey[7] = new PianoKey(423, 382, 86, 138, 449, 118, 264, 41, 'y', color(0, 255, 0));
      pianoKey[8] = new PianoKey(515, 382, 79, 138, 551, 118, 264, 42, 'u', color(0, 255, 0));
      pianoKey[9] = new PianoKey(684, 382, 79, 139, 703, 118, 264, 40, 'o', color(0, 255, 0));
      pianoKey[10] = new PianoKey(769, 383, 80, 139, 805, 118, 265, 44, 'p', color(0, 255, 0));
      pianoKey[11] = new PianoKey(939, 383, 87, 139, 959, 118, 265, 39, ']', color(0, 255, 0));

      //(Black Piano Keys) Class Information
      pianoKey[12] = new PianoKey(36, 119, 58, 262, 0, 0, 0, 0, '2', color(255, 0, 0));
      pianoKey[13] = new PianoKey(136, 119, 59, 262, 0, 0, 0, 0, '3', color(255, 0, 0));
      pianoKey[14] = new PianoKey(290, 119, 59, 262, 0, 0, 0, 0, '5', color(255, 0, 0));
      pianoKey[15] = new PianoKey(390, 119, 59, 262, 0, 0, 0, 0, '6', color(255, 0, 0));
      pianoKey[16] = new PianoKey(490, 119, 59, 262, 0, 0, 0, 0, '7', color(255, 0, 0));
      pianoKey[17] = new PianoKey(643, 119, 59, 262, 0, 0, 0, 0, '9', color(255, 0, 0));
      pianoKey[18] = new PianoKey(743, 119, 59, 262, 0, 0, 0, 0, '0', color(255, 0, 0));
      pianoKey[19] = new PianoKey(898, 119, 59, 262, 0, 0, 0, 0, '=', color(255, 0, 0));
      noStroke();

      //whiteKey Array Information
     for (int i = 0; i < 11; i++)
       pkeys[i] = false;

      //blackKey Array Information
     for (int i = 12; i < 20; i++)
       pkeys[i] = false;

       //(Drum Keys) Class Information
      drumKey[0] = new DrumKey(199, 422, 85, 80, 'j', color(255, 0, 0));
      drumKey[1] = new DrumKey(450, 433, 85, 80, 'd', color(0, 0, 255));
      drumKey[2] = new DrumKey(325, 344, 70, 65, 'f', color(255, 0, 0));
      drumKey[3] = new DrumKey(465, 313, 75, 70, 'g', color(0, 255, 0));
      drumKey[4] = new DrumKey(730, 423, 85, 80, 'h', color(0, 0, 255));
      drumKey[5] = new DrumKey(590, 410, 85, 80, 'a', color(0, 255, 0));
      drumKey[6] = new DrumKey(440, 188, 86, 80, 'k', color(0, 255, 0));
      drumKey[7] = new DrumKey(775, 208, 85, 80, 'l', color(255, 0, 0));
      drumKey[8] = new DrumKey(639, 215, 50, 45, ';', color(0, 0, 255));
      drumKey[9] = new DrumKey(715, 300, 100, 85, 'p', color(0, 255, 0));
      noStroke();

      //Drum Key Array Information
      for (int i = 0; i < 10; i++)
        dkeys[i] = false;

     buttons[0] = new Button(400, 40, 2);
     buttons[1] = new Button(800, 40, 3);
     buttons[2] = new Button(100, 40, 4);
     buttons[3] = new Button(800, 40, 5);
     buttons[4] = new Button(250, 40, 0);
     buttons[5] = new Button(800, 40, 1);


    }

    void draw() {

     //Handles Piano KeyStrokes and Piano Canvas Switches
      switch (instrument){
      case 0:
        image(piano, -1, 0, 1026, 577);
        break;

      case 1:
        image(pianoReverb, -1, 0, 1026, 577);  
        for(int i = 0; i <= 19; i++) { 
          pianoKey[i].render();
      }
       break;

     //Handles Drum Keystrokes and Drum Canvas Switches
      case 2:
        image(drums, -1, 0, 1026, 577);
       break;
      case 3:
        image(drumsReverb, -1, 0, 1026, 577);   
        for(int i = 0; i <= 9; i++){
         drumKey[i].render();    
       }
       break;

       //Handles Guitar KeyStrokes and Guitar Canvas Switches
       case 4:
        image(guitar, -1, 0, 1026, 577);
        break;
       case 5:
        image(guitarReverb, -1, 0, 1026, 577);
        break;

      } //Switch   
    } // Function

    void keyPressed() {

      //Array Handles Piano KeyStroke on KeyPressed
      for(int i = 0; i <= 19; i++) { 
        pianoKey[i].handleKeyPressed(key);  
      }

      //Array handles drum KeyStroke on KeyPressed
      for(int i = 0; i <= 9; i++) { 
        drumKey[i].handleKeyPressed(key);
      }
    }

    void keyReleased() {

      //Array handles piano KeyStroke on KeyReleased
      for(int i = 0; i <= 19; i++) {
        pianoKey[i].handleKeyReleased(key);   
      }

      //Array handles drum KeyStroke on KeyReleased
      for(int i = 0; i <= 9; i++) {
        drumKey[i].handleKeyReleased(key);   
      }
    }

    void mousePressed() {

      for (int i = 0; i < buttons.length; i++){
        if (dist(mouseX, mouseY, buttons[i].x, buttons[i].y) <= buttons[i].distAllowed){
          instrument = buttons[i].instrument;    
       return;

      }
    }

    }

here is a new version, you have to make the buttons in setup() (and there of)

class Button {
  int x;
  int y;
  int distAllowed=85;
  int instrument;
  Button(int x_, int y_, int instrument_) {
    x = x_;
    y = y_;
    instrument=instrument_;
  } // constr
} // class

class PianoKey

{

  int xPos1;
  int yPos1;
  int xSize1;
  int ySize1;

  int xPos2;
  int yPos2;
  int xSize2;
  int ySize2;

  char letter;
  color keyColour;
  boolean pressed;

  PianoKey(int x1, int y1, int w1, int h1, int x2, int y2, int w2, int h2, char l, color c) {

    xPos1 = x1;
    yPos1 = y1;
    xSize1 = w1;
    ySize1 = h1;

    xPos2 = x2;
    yPos2 = y2;
    xSize2 = h2;
    ySize2 = w2;

    letter = l;
    keyColour = c;
    pressed = false;
    //sound
  }

  void render() {
    if (pressed) {
      fill(keyColour, 120);
      rect(xPos1, yPos1, xSize1, ySize1);
      rect(xPos2, yPos2, xSize2, ySize2);
    }
  }

  void handleKeyPressed(char c)
  {
    if (c == letter)
    {
      pressed = true;
    }
  }

  void handleKeyReleased(char c)
  {
    if (c == letter)
    {
      pressed = false;
    }
  }
}



class DrumKey
{

  int xPos1;
  int yPos1;
  int xSize1;
  int ySize1;

  char letter;
  color drumKeyColour;
  boolean pressed;

  DrumKey(int x1, int y1, int w1, int h1, char l, color c) {

    xPos1 = x1;
    yPos1 = y1;
    xSize1 = w1;
    ySize1 = h1;

    letter = l;

    drumKeyColour = c;
    pressed = false;
    //sound
  }

  void render() {
    if (pressed) {
      fill(drumKeyColour, 70);
      ellipse(xPos1, yPos1, xSize1, ySize1);
    }
  }

  void handleKeyPressed(char co)
  {
    if (co == letter)
    {
      pressed = true;
    }
  }

  void handleKeyReleased(char co)
  {
    if (co == letter)
    {
      pressed = false;
    }
  }
}

// Load Image Canvas (Instruments)
PImage piano;
PImage drums;
PImage guitar;
PImage pianoReverb;
PImage drumsReverb;
PImage guitarReverb;


// Piano Keys Array
boolean[] pkeys = new boolean[20];
PianoKey[] pianoKey = new PianoKey[20];
//Drum Keys Array
boolean[] dkeys = new boolean[10];
DrumKey[] drumKey = new DrumKey[10];

Button[] buttons = new Button[9];

//Handles Instrument Canvas Switch on MousePressed
int instrument;

void setup() {
  size (1024, 576);
  smooth();
  piano = loadImage("piano.jpg");
  pianoReverb = loadImage("pianoReverb.jpg");
  drums = loadImage("drums.jpg");
  drumsReverb = loadImage("drumsReverb.jpg");
  guitar = loadImage("guitar.jpg");
  guitarReverb = loadImage("guitarReverb.jpg");

  imageMode(CORNER);
  instrument = 0;

  //(White Piano Keys) Class Information
  pianoKey[0] = new PianoKey(0, 382, 71, 138, 0, 118, 264, 35, 'q', color(0, 255, 0));
  pianoKey[1] = new PianoKey(160, 382, 80, 138, 197, 118, 264, 43, 'e', color(0, 255, 0));
  pianoKey[2] = new PianoKey(246, 382, 80, 138, 246, 118, 264, 43, 'r', color(0, 255, 0));
  pianoKey[3] = new PianoKey(600, 382, 80, 138, 600, 118, 264, 43, 'i', color(0, 255, 0));
  pianoKey[4] = new PianoKey(854, 382, 80, 140, 854, 118, 264, 43, '[', color(0, 255, 0));
  pianoKey[5] = new PianoKey(76, 382, 80, 139, 95, 118, 264, 41, 'w', color(0, 255, 0));
  pianoKey[6] = new PianoKey(331, 382, 86, 138, 349, 118, 264, 41, 't', color(0, 255, 0));
  pianoKey[7] = new PianoKey(423, 382, 86, 138, 449, 118, 264, 41, 'y', color(0, 255, 0));
  pianoKey[8] = new PianoKey(515, 382, 79, 138, 551, 118, 264, 42, 'u', color(0, 255, 0));
  pianoKey[9] = new PianoKey(684, 382, 79, 139, 703, 118, 264, 40, 'o', color(0, 255, 0));
  pianoKey[10] = new PianoKey(769, 383, 80, 139, 805, 118, 265, 44, 'p', color(0, 255, 0));
  pianoKey[11] = new PianoKey(939, 383, 87, 139, 959, 118, 265, 39, ']', color(0, 255, 0));

  //(Black Piano Keys) Class Information
  pianoKey[12] = new PianoKey(36, 119, 58, 262, 0, 0, 0, 0, '2', color(255, 0, 0));
  pianoKey[13] = new PianoKey(136, 119, 59, 262, 0, 0, 0, 0, '3', color(255, 0, 0));
  pianoKey[14] = new PianoKey(290, 119, 59, 262, 0, 0, 0, 0, '5', color(255, 0, 0));
  pianoKey[15] = new PianoKey(390, 119, 59, 262, 0, 0, 0, 0, '6', color(255, 0, 0));
  pianoKey[16] = new PianoKey(490, 119, 59, 262, 0, 0, 0, 0, '7', color(255, 0, 0));
  pianoKey[17] = new PianoKey(643, 119, 59, 262, 0, 0, 0, 0, '9', color(255, 0, 0));
  pianoKey[18] = new PianoKey(743, 119, 59, 262, 0, 0, 0, 0, '0', color(255, 0, 0));
  pianoKey[19] = new PianoKey(898, 119, 59, 262, 0, 0, 0, 0, '=', color(255, 0, 0));
  noStroke();

  //whiteKey Array Information
  for (int i = 0; i < 11; i++)
    pkeys[i] = false;

  //blackKey Array Information
  for (int i = 12; i < 20; i++) 
    pkeys[i] = false;


  //(Drum Keys) Class Information
  drumKey[0] = new DrumKey(199, 422, 85, 80, 'j', color(255, 0, 0));
  drumKey[1] = new DrumKey(450, 433, 85, 80, 'd', color(0, 0, 255));
  drumKey[2] = new DrumKey(325, 344, 70, 65, 'f', color(255, 0, 0));
  drumKey[3] = new DrumKey(465, 313, 75, 70, 'g', color(0, 255, 0));
  drumKey[4] = new DrumKey(730, 423, 85, 80, 'h', color(0, 0, 255));
  drumKey[5] = new DrumKey(590, 410, 85, 80, 'a', color(0, 255, 0));
  drumKey[6] = new DrumKey(440, 188, 86, 80, 'k', color(0, 255, 0));
  drumKey[7] = new DrumKey(775, 208, 85, 80, 'l', color(255, 0, 0));
  drumKey[8] = new DrumKey(639, 215, 50, 45, ';', color(0, 0, 255));
  drumKey[9] = new DrumKey(715, 300, 100, 85, 'p', color(0, 255, 0));
  noStroke();

  //Drum Key Array Information
  for (int i = 0; i < 10; i++) 
    dkeys[i] = false;

  buttons = new Button(440, 40, 2);
  buttons = new Button(800, 40, 3);

  buttons = new Button(100, 40, 4);
  buttons = new Button(800, 40, 3);
}

void draw() {
  //Handles Piano KeyStrokes and Piano Canvas Switches
  switch (instrument) {
  case 0:
    image(piano, -1, 0, 1026, 577);
    break;
  case 1:
    image(pianoReverb, -1, 0, 1026, 577);
    for (int i = 0; i <= 19; i++) {
      pianoKey[i].render();
    }
    break;

  case 2:
    //Handles Drum KeyStrokes and Drum Canvas Switches
    image(drums, -1, 0, 1026, 577);
    break;

  case 3:
    image(drumsReverb, -1, 0, 1026, 577);
    for (int i = 0; i <= 9; i++) {
      drumKey[i].render();
    }
    break;

    //Handles Guitar KeyStrokes and Guitar Canvas Switches
  case 4:
    image(guitar, -1, 0, 1026, 577);
    break;

  case 5:
    image(guitarReverb, -1, 0, 1026, 577);
    break;
  } // switch
} // func 

void keyPressed() {

  //Array Handles Piano KeyStroke on KeyPressed
  for (int i = 0; i <= 19; i++) {
    pianoKey[i].handleKeyPressed(key);
  }

  //Array handles drum KeyStroke on KeyPressed
  for (int i = 0; i <= 9; i++) {
    drumKey[i].handleKeyPressed(key);
  }
}

void keyReleased() {

  //Array handles piano KeyStroke on KeyReleased
  for (int i = 0; i <= 19; i++) {
    pianoKey[i].handleKeyReleased(key);
  }

  //Array handles drum KeyStroke on KeyReleased
  for (int i = 0; i <= 9; i++) {
    drumKey[i].handleKeyReleased(key);
  }
}

void mousePressed() {

  for (int i  ... <buttons.length; i++) {
    if (dist(mouseX, mouseY, buttons[i].x, buttons[i].y) <= buttons[i].distAllowed) {
      instrument = buttons[i].instrument;
      // currentCanvas = buttons[i].canvas;
      // break;   // or return;
      return;
    }
  }

  //  // Drum Canvas Intialise
  //  if (dist(mouseX, mouseY, 400, 40) <= 85) {
  //    instrument = 2;
  //  } 
  //  //Drum Reverb On Canvas Intitalise
  //  else if (dist(mouseX, mouseY, 800, 40) <= 85) {
  //    instrument = 3;
  //  }
  //  //Guitar Canvas Intialise  
  //  if (dist(mouseX, mouseY, 100, 40) <= 85) {
  //    instrument = 4;
  //  }
  //  //Guitar Reverb On Canvas Intitalise
  //  else if (dist(mouseX, mouseY, 800, 40) <= 85) {
  //    instrument = 5;
  //  }
  //  //Piano Canvas Intialise
  //  if (dist(mouseX, mouseY, 250, 40) <= 85) {
  //    instrument = 0;
  //  }
  //  //Piano Reverb On Canvas Intialise
  //  else if (dist(mouseX, mouseY, 800, 40) <= 85) {
  //    instrument = 1;
  //  }
}

//

Hi there guys,

This is a partly completed university project. (I haven't added a class for the guitar instrument yet)

I'm having trouble with the mousePressed. Basically I need the canvas to switch to the Reverb ON canvas each time I click the reverb switch icon and then have the canvas switch back to the Reverb OFF canvas when it is clicked again.. for each instrument canvas. Problem is... is that every time I click on this reverb switch it switches back to the Piano canvas. It needs to be able to switch on for each individual canvas while maintaining individual key strokes to initiate the classes of information for each instrument.

The code needs to be as simple as possible, so making a new class array and for loop for this would be the best option

I really am a novice at this and struggle to understand programming terms, ive needed alot of help with this so far... Would really appreciate if someone could help me rewrite my current code so i can understand the changes better and explain it in simple terms.

Much appreciated! :)

class PianoKey

{

  int xPos1;
  int yPos1;
  int xSize1; 
  int ySize1;

  int xPos2; 
  int yPos2; 
  int xSize2; 
  int ySize2;

  char letter;
  color keyColour;
  boolean pressed;

  PianoKey(int x1, int y1, int w1, int h1, int x2, int y2, int w2, int h2, char l, color c) {

    xPos1 = x1;
    yPos1 = y1;
    xSize1 = w1;
    ySize1 = h1;

    xPos2 = x2;
    yPos2 = y2;
    xSize2 = h2;
    ySize2 = w2;

    letter = l;
    keyColour = c;
    pressed = false;
    //sound
  }

  void render() {
    if (pressed){
    fill(keyColour, 120);
    rect(xPos1, yPos1, xSize1, ySize1);
    rect(xPos2, yPos2, xSize2, ySize2);

    }
  }

  void handleKeyPressed(char c)
  {
    if (c == letter) 
    {
      pressed = true;
    }
  }

  void handleKeyReleased(char c)
  {
    if (c == letter) 
    {
      pressed = false;
    }
  }
}

class DrumKey

{

  int xPos1;
  int yPos1;
  int xSize1; 
  int ySize1;

  char letter;
  color drumKeyColour;
  boolean pressed;

  DrumKey(int x1, int y1, int w1, int h1, char l, color c) {

    xPos1 = x1;
    yPos1 = y1;
    xSize1 = w1;
    ySize1 = h1;

    letter = l;

    drumKeyColour = c;
    pressed = false;
    //sound
  }

  void render() {
    if (pressed){
    fill(drumKeyColour, 70);
    ellipse(xPos1, yPos1, xSize1, ySize1);

    }
  }

  void handleKeyPressed(char co)
  {
    if (co == letter) 
    {
      pressed = true;
    }
  }

  void handleKeyReleased(char co)
  {
    if (co == letter) 
    {
      pressed = false;
    }
  }
}

// Load Image Canvas (Instruments)
PImage piano; 
PImage drums;
PImage guitar;
PImage pianoReverb;
PImage drumsReverb;
PImage guitarReverb;


// Piano Keys Array
boolean[] pkeys = new boolean[20];
PianoKey[] pianoKey = new PianoKey[20];
//Drum Keys Array
boolean[] dkeys = new boolean[10];
DrumKey[] drumKey = new DrumKey[10];

//Handles Instrument Canvas Switch on MousePressed
int instrument;

void setup() {
  size (1024, 576);
  smooth();
  piano = loadImage("piano.jpg");
  pianoReverb = loadImage("pianoReverb.jpg");
  drums = loadImage("drums.jpg");
  drumsReverb = loadImage("drumsReverb.jpg");
  guitar = loadImage("guitar.jpg");
  guitarReverb = loadImage("guitarReverb.jpg");

  imageMode(CORNER);
  instrument = 0;

  //(White Piano Keys) Class Information
  pianoKey[0] = new PianoKey(0, 382, 71, 138, 0, 118, 264, 35, 'q', color(0, 255, 0));
  pianoKey[1] = new PianoKey(160, 382, 80, 138, 197, 118, 264, 43, 'e', color(0, 255, 0));
  pianoKey[2] = new PianoKey(246, 382, 80, 138, 246, 118, 264, 43, 'r', color(0, 255, 0));
  pianoKey[3] = new PianoKey(600, 382, 80, 138, 600, 118, 264, 43, 'i', color(0, 255, 0));
  pianoKey[4] = new PianoKey(854, 382, 80, 140, 854, 118, 264, 43, '[', color(0, 255, 0));
  pianoKey[5] = new PianoKey(76, 382, 80, 139, 95, 118, 264, 41, 'w', color(0, 255, 0));
  pianoKey[6] = new PianoKey(331, 382, 86, 138, 349, 118, 264, 41, 't', color(0, 255, 0));
  pianoKey[7] = new PianoKey(423, 382, 86, 138, 449, 118, 264, 41, 'y', color(0, 255, 0));
  pianoKey[8] = new PianoKey(515, 382, 79, 138, 551, 118, 264, 42, 'u', color(0, 255, 0));
  pianoKey[9] = new PianoKey(684, 382, 79, 139, 703, 118, 264, 40, 'o', color(0, 255, 0));
  pianoKey[10] = new PianoKey(769, 383, 80, 139, 805, 118, 265, 44, 'p', color(0, 255, 0));
  pianoKey[11] = new PianoKey(939, 383, 87, 139, 959, 118, 265, 39, ']', color(0, 255, 0));

  //(Black Piano Keys) Class Information
  pianoKey[12] = new PianoKey(36, 119, 58, 262, 0, 0, 0, 0, '2', color(255, 0, 0));
  pianoKey[13] = new PianoKey(136, 119, 59, 262, 0, 0, 0, 0, '3', color(255, 0, 0));
  pianoKey[14] = new PianoKey(290, 119, 59, 262, 0, 0, 0, 0, '5', color(255, 0, 0));
  pianoKey[15] = new PianoKey(390, 119, 59, 262, 0, 0, 0, 0, '6', color(255, 0, 0));
  pianoKey[16] = new PianoKey(490, 119, 59, 262, 0, 0, 0, 0, '7', color(255, 0, 0));
  pianoKey[17] = new PianoKey(643, 119, 59, 262, 0, 0, 0, 0, '9', color(255, 0, 0));
  pianoKey[18] = new PianoKey(743, 119, 59, 262, 0, 0, 0, 0, '0', color(255, 0, 0));
  pianoKey[19] = new PianoKey(898, 119, 59, 262, 0, 0, 0, 0, '=', color(255, 0, 0));
  noStroke();

  //whiteKey Array Information
  pkeys[0] = false;
  pkeys[1] = false;
  pkeys[2] = false;
  pkeys[3] = false;
  pkeys[4] = false;
  pkeys[5] = false;
  pkeys[6] = false;
  pkeys[7] = false;
  pkeys[8] = false;
  pkeys[9] = false;
  pkeys[10] = false;
  pkeys[11] = false;

  //blackKey Array Information
  pkeys[12] = false;
  pkeys[13] = false;
  pkeys[14] = false;
  pkeys[15] = false;
  pkeys[16] = false;
  pkeys[17] = false;
  pkeys[18] = false;
  pkeys[19] = false;

   //(Drum Keys) Class Information
  drumKey[0] = new DrumKey(199, 422, 85, 80, 'j', color(255, 0, 0));
  drumKey[1] = new DrumKey(450, 433, 85, 80, 'd', color(0, 0, 255));
  drumKey[2] = new DrumKey(325, 344, 70, 65, 'f', color(255, 0, 0));
  drumKey[3] = new DrumKey(465, 313, 75, 70, 'g', color(0, 255, 0));
  drumKey[4] = new DrumKey(730, 423, 85, 80, 'h', color(0, 0, 255));
  drumKey[5] = new DrumKey(590, 410, 85, 80, 'a', color(0, 255, 0));
  drumKey[6] = new DrumKey(440, 188, 86, 80, 'k', color(0, 255, 0));
  drumKey[7] = new DrumKey(775, 208, 85, 80, 'l', color(255, 0, 0));
  drumKey[8] = new DrumKey(639, 215, 50, 45, ';', color(0, 0, 255));
  drumKey[9] = new DrumKey(715, 300, 100, 85, 'p', color(0, 255, 0));
  noStroke();

  //Drum Key Array Information
  dkeys[0] = false;
  dkeys[1] = false;
  dkeys[2] = false;
  dkeys[3] = false;
  dkeys[4] = false;
  dkeys[5] = false;
  dkeys[6] = false;
  dkeys[7] = false;
  dkeys[8] = false;
  dkeys[9] = false;
}

void draw() {

  //Handles Piano KeyStrokes and Piano Canvas Switches
  if(instrument == 0){
  image(piano, -1, 0, 1026, 577);

  if(instrument == 1){
  image(pianoReverb, -1, 0, 1026, 577);

  for(int i = 0; i <= 19; i++) { 
      pianoKey[i].render();
  }  
}
  //Handles Drum KeyStrokes and Drum Canvas Switches
  if(instrument == 2){
  image(drums, -1, 0, 1026, 577);

  if(instrument == 3){
  image(drumsReverb, -1, 0, 1026, 577);

  for(int i = 0; i <= 9; i++){
    drumKey[i].render();
  }
}
  //Handles Guitar KeyStrokes and Guitar Canvas Switches
  if(instrument == 4){
  image(guitar, -1, 0, 1026, 577);

  if(instrument == 5){
  image(guitarReverb, -1, 0, 1026, 577);

  }   
}

void keyPressed() {

  //Array Handles Piano KeyStroke on KeyPressed
  for(int i = 0; i <= 19; i++) { 
    pianoKey[i].handleKeyPressed(key);  
  }

  //Array handles drum KeyStroke on KeyPressed
  for(int i = 0; i <= 9; i++) { 
    drumKey[i].handleKeyPressed(key);
  }
}

void keyReleased() {

  //Array handles piano KeyStroke on KeyReleased
  for(int i = 0; i <= 19; i++) {
    pianoKey[i].handleKeyReleased(key);   
  }

  //Array handles drum KeyStroke on KeyReleased
  for(int i = 0; i <= 9; i++) {
    drumKey[i].handleKeyReleased(key);   
  }
}

void mousePressed() {

  // Drum Canvas Intialise
  if (dist(mouseX, mouseY, 400, 40) <= 85){
    instrument = 2; 
  }  
  //Drum Reverb On Canvas Intitalise
  else if (dist(mouseX, mouseY, 800, 40) <= 85){
    instrument = 3;
  }
  //Guitar Canvas Intialise   
  if (dist(mouseX, mouseY, 100, 40) <= 85){
    instrument = 4;
  }
  //Guitar Reverb On Canvas Intitalise
  else if (dist(mouseX, mouseY, 800, 40) <= 85){
    instrument = 5;
  }
  //Piano Canvas Intialise
  if (dist(mouseX, mouseY, 250, 40) <= 85){
    instrument = 0;
  } 
  //Piano Reverb On Canvas Intialise
  else if (dist(mouseX, mouseY, 800, 40) <= 85){
    instrument = 1;
  }

}

Hi, I have developed a virtual drum kit where the user plays the drums using both hands detected by the webcam. The hands are detected using blob detection. When the coordinates of the blob intersect with the coordinates of the drum, it produces a drum sound. But the problem is, the drum sound will loop non-stop until my hand leaves the drum. Is there a way to make the sound to only play once and only plays the sound again when my hand leaves the drum and touch the drum? thanks

Drums require very low latency, and I think that's hard to achieve when analyzing video. But it can be fun even with some latency.

There are examples included in the Examples menu for using the webcam. What I would try is to maybe overlay 5 rectangles on top of the live web cam image. I would copy() those 5 image areas, and use blend(DIFFERENCE) with previous copies of the same areas to calculate the difference between them. Then one could add the pixels values of each diff'ed area to see if the pixel change is large enough to trigger a sound. I think a time-threshold might be required to avoid samples being played too often.

I'm sure there are many other ways of doing it :)

aBe