​

let mano_x = [];

let mano_y = [];

let index_dita = [4, 8, 12, 16, 20]; //pollice, indice, medio, anulare, mignolo

​

​

let osc0, osc1, osc2, osc3, osc4, osc5, osc6, osc7, osc8, osc9;

let mod0, mod1, mod2, mod3, mod4, mod5, mod6, mod7, mod8, mod9;

​

let freq_1 = [];

let freq_2 = [];

let amp_1 = [];

let amp_2 = [];

​

let freq_mod_1 = [];

let freq_mod_2 = [];

let amp_mod_1 = [];

let amp_mod_2  = [];

​

let audio_attivo = false;

​

​

let sketch = function(p) {

​

  p.setup = function() {

    canvas = p.createCanvas(window.innerWidth, window.innerHeight);

    canvas.id("canvas");

    canvas.mouseClicked(p.attiva_audio);

​

    p.getAudioContext().suspend();

    p.colorMode(p.HSB);

   for (let i = 0; i < 3; i++) { 

     mano_x[i] = [];

     mano_y[i] = [];

    for (let j = 0; j < 22; j++) {

       mano_x[i][j] = 0;

       mano_y[i][j] = 0;

     }

   } 

     p.osc0 = new p5.Oscillator('sine');

     p.osc0.freq(0);

     p.osc0.amp(0);

     p.osc0.start();

     p.osc1 = new p5.Oscillator('sine');

     p.osc1.freq(0);

     p.osc1.amp(0);

     p.osc1.start();

     p.osc2 = new p5.Oscillator('sine');

     p.osc2.freq(0);

     p.osc2.amp(0);

     p.osc2.start();

     p.osc3 = new p5.Oscillator('sine');

     p.osc3.freq(0);

     p.osc3.amp(0);

     p.osc3.start();

     p.osc4 = new p5.Oscillator('sine');

     p.osc4.freq(0);

     p.osc4.amp(0);

     p.osc4.start();

     p.osc5 = new p5.Oscillator('sine');

     p.osc5.freq(0);

     p.osc5.amp(0);

     p.osc5.start();

     p.osc6 = new p5.Oscillator('sine');

     p.osc6.freq(0);

     p.osc6.amp(0);

     p.osc6.start();

     p.osc7 = new p5.Oscillator('sine');

     p.osc7.freq(0);

     p.osc7.amp(0);

     p.osc7.start();

     p.osc8 = new p5.Oscillator('sine');

     p.osc8.freq(0);

     p.osc8.amp(0);

     p.osc8.start();

     p.osc9 = new p5.Oscillator('sine');

     p.osc9.freq(0);

     p.osc9.amp(0);

     p.osc9.start();

     p.mod0 = new p5.Oscillator('sine');

     p.mod0.freq(0);

     p.mod0.amp(0);

     p.mod0.start();

     p.mod0.disconnect();

     p.mod1 = new p5.Oscillator('triangle');

     p.mod1.freq(0);

     p.mod1.amp(0);    

     p.mod1.start();

     p.mod1.disconnect();

     p.mod2 = new p5.Oscillator('square');

     p.mod2.freq(0);

     p.mod2.amp(0);

     p.mod2.start();

     p.mod2.disconnect();

     p.mod3 = new p5.Oscillator('sawtooth');

     p.mod3.freq(0);

     p.mod3.amp(0);    

     p.mod3.start();

     p.mod3.disconnect();

     p.mod4 = new p5.Oscillator('sine');

     p.mod4.freq(0);

     p.mod4.amp(0);

     p.mod4.start();

     p.mod4.disconnect();

     p.mod5 = new p5.Oscillator('sine');

     p.mod5.freq(0);

     p.mod5.amp(0);

     p.mod5.start();

     p.mod5.disconnect();

     p.mod6 = new p5.Oscillator('triangle');

     p.mod6.freq(0);

     p.mod6.amp(0);

     p.mod6.start();

     p.mod6.disconnect();

     p.mod7 = new p5.Oscillator('square');

     p.mod7.freq(0);

     p.mod7.amp(0);

     p.mod7.start();

     p.mod7.disconnect();

     p.mod8 = new p5.Oscillator('sawtooth');

     p.mod8.freq(0);

     p.mod8.amp(0);

     p.mod8.start();

     p.mod8.disconnect();

     p.mod9 = new p5.Oscillator('sine');

     p.mod9.freq(0);

     p.mod9.amp(0);

     p.mod9.start();

     p.mod9.disconnect();   

​

  } //fine del setup

​

  p.draw = function() {

    p.clear();

    if (audio_attivo == false) {

        p.fill(255);

        p.strokeWeight(1);

        p.stroke(0);

        p.rectMode(p.CENTER);

        p.rect(p.width * 0.5, p.height * 0.5 - 12, p.width * 0.5, 40);

        p.fill(0);

        p.stroke(0);

        p.strokeWeight(1);

        p.textSize(24);

        p.textFont('Helvetica Neue');

        p.textAlign(p.CENTER);

        p.text("CLICCA SULLO SCHERMO PER ATTIVARE L'AUDIO", p.width * 0.5, p.height * 0.5);

    }

    if(detections != undefined) {

      if(detections.multiHandLandmarks != undefined) {

        //p.drawHands();

          //p.drawParts();

          p.drawLines([0, 5, 9, 13, 17, 0]);//palmo

          p.drawLines([0, 1, 2, 3 ,4]);//pollice

          p.drawLines([5, 6, 7, 8]);//indice

          p.drawLines([9, 10, 11, 12]);//medio

          p.drawLines([13, 14, 15, 16]);//anulare

          p.drawLines([17, 18, 19, 20]);//mignolo

​

          p.drawLandmarks([0, 1], 0);//palmo

          p.drawLandmarks([1, 5], 60);//pollice

          p.drawLandmarks([5, 9], 120);//indice

          p.drawLandmarks([9, 13], 180);//medio

          p.drawLandmarks([13, 17], 240);//anulare

          p.drawLandmarks([17, 21], 300);//mignolo

​

//------- memorizzo variabili dei punti delle mani---------//

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

      for(let j = 0; j < 21; j++) {

        mano_x[i][j] = detections.multiHandLandmarks[i][j].x * p.width;

        mano_y[i][j] = detections.multiHandLandmarks[i][j].y * p.height;

      }

    }

  //----------sintesi video-----------//

​

  if (detections.multiHandLandmarks.length > 1) {   //se l'algoritmo legge due mani      

    p.stroke(0, 0, 0);

    p.strokeWeight(2);

 /*  

    p.line(mano_x[0][4], mano_y[0][4], mano_x[1][4], mano_y[1][4]); //collego pollici

    p.line(mano_x[0][8], mano_y[0][8], mano_x[1][8], mano_y[1][8]); //collego indici

    p.line(mano_x[0][12], mano_y[0][12], mano_x[1][12], mano_y[1][12]); //collego medi

    p.line(mano_x[0][16], mano_y[0][16], mano_x[1][16], mano_y[1][16]); //collego anulari

    p.line(mano_x[0][20], mano_y[0][20], mano_x[1][20], mano_y[1][20]); //collego mignoli

   */

    p.colorMode(p.RGB);

    p.fill(255, 0, 50, 50);

    p.triangle(mano_x[0][0], mano_y[0][0], mano_x[0][4], mano_y[0][4], mano_x[1][4], mano_y[1][4]);

    p.fill(50, 0, 255, 50);

    p.triangle(mano_x[0][0], mano_y[0][0], mano_x[0][8], mano_y[0][8], mano_x[1][8], mano_y[1][8]);

    p.fill(150, 0, 55, 50);

    p.triangle(mano_x[0][0], mano_y[0][0], mano_x[0][12], mano_y[0][12], mano_x[1][12], mano_y[1][12]);

    p.fill(55, 25, 155, 50);

    p.triangle(mano_x[0][0], mano_y[0][0], mano_x[0][16], mano_y[0][16], mano_x[1][16], mano_y[1][16]);

    p.fill(150, 55, 155, 50);

    p.triangle(mano_x[0][0], mano_y[0][0], mano_x[0][12], mano_y[0][20], mano_x[1][20], mano_y[1][12]);

    p.fill(0, 255, 50, 50);

    p.triangle(mano_x[1][0], mano_y[1][0], mano_x[1][4], mano_y[1][4], mano_x[0][4], mano_y[0][4]);

    p.fill(0, 50, 255, 50);

    p.triangle(mano_x[1][0], mano_y[1][0], mano_x[1][8], mano_y[1][8], mano_x[0][8], mano_y[0][8]);

    p.fill(0, 150, 55, 50);

    p.triangle(mano_x[1][0], mano_y[1][0], mano_x[1][12], mano_y[1][12], mano_x[0][12], mano_y[0][12]);

    p.fill(25, 55, 155, 50);

    p.triangle(mano_x[1][0], mano_y[1][0], mano_x[1][16], mano_y[1][16], mano_x[0][16], mano_y[0][16]);

    p.fill(50, 155, 155, 50);

    p.triangle(mano_x[1][0], mano_y[1][0], mano_x[1][12], mano_y[1][20], mano_x[0][20], mano_y[0][12]);

​

  }

//----------------------- sintesi audio -------------------//

     if (detections.multiHandLandmarks.length > 0) {   //se l'algoritmo legge almeno una mano

      for (let i = 0; i < 5; i ++) {

        freq_1[i] = p.map(mano_x[0][index_dita[i]], 0, p.width, 30, 72);

        freq_1[i] = p.midiToFreq(freq_1[i]);

         amp_1[i] = p.map(mano_y[0][index_dita[i]], 0, p.height, 0.2, 0);

        freq_2[i] = p.map(mano_x[1][index_dita[i]], 0, p.width, 30, 72);

        freq_2[i] = p.midiToFreq(freq_2[i]);

         amp_2[i] = p.map(mano_y[1][index_dita[i]], 0, p.height, 0.2, 0);

    if (detections.multiHandLandmarks.length == 2) {

        freq_mod_1[i] = freq_2[i] * 4;

         amp_mod_1[i] = amp_2[i] * 500;

        freq_mod_2[i] = freq_1[i] * 0.25;

         amp_mod_2[i] = amp_1[i] * 500;

      }  

        else {

         freq_mod_1[i] = 0;

         amp_mod_1[i] = 0;

        freq_mod_2[i] = 0;

         amp_mod_2[i] = 0;

        }

       }

      //---- mano 1 -----//

        p.mod0.freq(freq_mod_1[0]);

        p.mod0.amp(amp_mod_1[0]);

        p.osc0.freq(freq_1[0]);

        p.osc0.freq(p.mod0);

        p.osc0.amp(amp_1[0], 0.1);

​

        p.mod1.freq(freq_mod_1[1]);

        p.mod1.amp(amp_mod_1[1]);

        p.osc1.freq(freq_1[1]);

        p.osc1.freq(p.mod1);

        p.osc1.amp(amp_1[1], 0.1);

        p.mod2.freq(freq_mod_1[2]);

        p.mod2.amp(amp_mod_1[2]);

        p.osc2.freq(freq_1[2]);

        p.osc2.freq(p.mod2);

        p.osc2.amp(amp_1[2], 0.1);

        p.mod3.freq(freq_mod_1[3]);

        p.mod3.amp(amp_mod_1[3]);

        p.osc3.freq(freq_1[3]);

        p.osc3.freq(p.mod3);

        p.osc3.amp(amp_1[3], 0.1);

        p.mod4.freq(freq_mod_1[4]);

        p.mod4.amp(amp_mod_1[4]);

        p.osc4.freq(freq_1[4]);

        p.osc4.freq(p.mod4);

        p.osc4.amp(amp_1[4], 0.1);

      //---- mano 2 -----//

        p.mod5.freq(freq_mod_2[0]);

        p.mod5.amp(amp_mod_2[0]);

        p.osc5.freq(freq_2[0]);

        p.osc5.freq(p.mod5);

        p.osc5.amp(amp_2[0], 0.1);

        p.mod6.freq(freq_mod_2[1]);

        p.mod6.amp(amp_mod_2[1]);

        p.osc6.freq(freq_2[1]);

        p.osc6.freq(p.mod6);

        p.osc6.amp(amp_2[1], 0.1);

        p.mod7.freq(freq_mod_2[2]);

        p.mod7.amp(amp_mod_2[2]);

        p.osc7.freq(freq_2[2]);

        p.osc7.freq(p.mod7);

        p.osc7.amp(amp_2[2], 0.1);

        p.mod8.freq(freq_mod_2[3]);

        p.mod8.amp(amp_mod_2[3]);

        p.osc8.freq(freq_2[3]);

        p.osc8.freq(p.mod8);

        p.osc8.amp(amp_2[3], 0.1);

        p.mod9.freq(freq_mod_2[4]);

        p.mod9.amp(amp_mod_2[4]);       

        p.osc9.freq(freq_2[4]);

        p.osc9.freq(p.mod9);

        p.osc9.amp(amp_2[4], 0.1);

     }

        else  {

          p.osc0.amp(0, 0.5);

          p.osc1.amp(0, 0.5);

          p.osc2.amp(0, 0.5);

          p.osc3.amp(0, 0.5);

          p.osc4.amp(0, 0.5);

          p.osc5.amp(0, 0.5);

          p.osc6.amp(0, 0.5);

          p.osc7.amp(0, 0.5);

          p.osc8.amp(0, 0.5);

          p.osc9.amp(0, 0.5);

          p.mod0.amp(0, 0.5);

          p.mod1.amp(0, 0.5);

          p.mod2.amp(0, 0.5);

          p.mod3.amp(0, 0.5);

          p.mod4.amp(0, 0.5);

          p.mod5.amp(0, 0.5);

          p.mod6.amp(0, 0.5);

          p.mod7.amp(0, 0.5);

          p.mod8.amp(0, 0.5);

          p.mod9.amp(0, 0.5);

​

            }

      }//fine if mani presenti

    } //fine if algoritmo funzionante

​

  } //fine del draw

​

  p.drawHands = function() { //stampo i numeri relativi ai punti delle dita

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

      for (let j = 0; j < detections.multiHandLandmarks[i].length; j++) {

        let x = detections.multiHandLandmarks[i][j].x * p.width;

        let y = detections.multiHandLandmarks[i][j].y * p.height;

        let z = detections.multiHandLandmarks[i][j].z;

        p.strokeWeight(0);

        p.textFont('Helvetica Neue');

        p.text(j, x, y);

        p.stroke(255);

        p.strokeWeight(10);

        p.point(x, y);

      }

    }

  }

​

  p.drawLandmarks = function(indexArray, hue) {

    p.noFill();

    p.strokeWeight(8);

    p.colorMode(p.HSB);

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

      for(let j = indexArray[0]; j < indexArray[1]; j++) {

        let x = detections.multiHandLandmarks[i][j].x * p.width;

        let y = detections.multiHandLandmarks[i][j].y * p.height;

        // let z = detections.multiHandLandmarks[i][j].z;

        p.stroke(hue, 40, 255);

        p.ellipse(x, y, 1, 1);

      }      

    }

  }

​

  p.drawLines = function(index) {

    p.stroke(0, 0, 255);

    p.strokeWeight(0.5);

      p.colorMode(p.HSB);

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

      for(let j=0; j<index.length-1; j++){

        let x = detections.multiHandLandmarks[i][index[j]].x * p.width;

        let y = detections.multiHandLandmarks[i][index[j]].y * p.height;

​

        let _x = detections.multiHandLandmarks[i][index[j+1]].x * p.width;

        let _y = detections.multiHandLandmarks[i][index[j+1]].y * p.height;

        p.line(x, y, _x, _y);

      }

    }

  }

p.attiva_audio = function () {

 if (audio_attivo == false) {

   audio_attivo = true;

     if (p.getAudioContext().state !== 'running') {

          p.userStartAudio();

     }   

   }

  else {

    audio_attivo = false;

    p.getAudioContext().suspend();

  }

 }

} //fine sketch

​

let myp5 = new p5(sketch);

​

​

​

​