song = loadSound("sounds/Andre.mp3");

  fr = 30;

  rame = 1;

  Playbutton = createButton("PLAY");

  Playbutton.mousePressed(toggleSong);

  dataRaw = loadTable("data/S10-data.csv", "csv");

}

​

var dataRaw = [];

var data = [];

var data1 = [];

​

let fft;

let w;

let breathDotsPlot = 0;

let breathShapePlot = 0;

​

// Session's Start and End

var sStart = 383;

var sEnd = 766;

var sSize = (sEnd - sStart);

​

var sType = 1; // 1 or 3 - breath shape size (Buttons TYPE 1 / TYPE 2)

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  angleMode(DEGREES);

  colorMode(HSB);

  translate(width / 2, height / 2);

​

  resetCanvas();

  breathShape();

​

  fft = new p5.FFT(0, 32);

  frameRate(fr);

​

  w = height / 64;

​

  Stopbutton = createButton("STOP");

  Stopbutton.mousePressed(stopSong);

  Resetbutton = createButton("RESET");

  Resetbutton.mousePressed(resetCanvas);

  Dotsbutton = createButton("BREATH DOTS");

  Dotsbutton.mousePressed(breathDotsSwitch);

  Shapebutton = createButton("BREATH SHAPE");

​

  Type1button = createButton("TYPE 1");

  Type1button.mousePressed(shapeType1);

  Type2utton = createButton("TYPE 2");

  Type2utton.mousePressed(shapeType2);

​

  Shapebutton.mousePressed(breathShape);

  Savebutton = createButton("SAVE");

  Savebutton.mousePressed(saveArt);

​

  // blendMode(LIGHTEST)

  // drawingContext.shadowColor = '#FFFFFF';

  // drawingContext.shadowBlur = 5;

}

​

function resetCanvas() {

  background(0);

  song.stop();

  Playbutton.html("PLAY");

  a = 360 / (song.duration() * fr);

  b = a;

  breathShapePlot = 0;

  breathDotsPlot = 0;

}

​

function breathShape(){

  breathShapePlot = 1;

  let minRaw = 2000;

  let maxRaw = 0;

​

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

    let newData = int(dataRaw.rows[i].arr[0]);

    data.push(newData);

    if (newData < minRaw) minRaw = newData;

    if (newData > maxRaw) maxRaw = newData;

  }

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

  data1[i] = (data[i] - minRaw) / (maxRaw - minRaw)

  }

​

  // Session's data = prefix 's'

​

  var sMean = d3.mean(data.slice(sStart,sEnd));

  var sDeviation = d3.deviation(data.slice(sStart,sEnd));

  var sVariance = d3.variance(data.slice(sStart,sEnd))

​

  var sdataMax = max(data.slice(sStart,sEnd));

  var sdataMin = min(data.slice(sStart,sEnd));

  var dataMax = max(data);

  var dataMin = min(data);

​

  var hueGrad = map(sVariance, 1, 1000, 350, 0);  // Hue gradient change

  var aMean = map(sMean, dataMin, dataMax, 1, 20);  // Alpha

  var rMean = map(sMean, sdataMin, sdataMax, 1.5, 3);  // Rotation

  var innerC = map(sdataMin, dataMin, dataMax, 100, 190);  // Inner Circle

  var outerC = map(sdataMax, dataMin, dataMax, 200, 290);  // Outer Circle

  var wavesD = map(sDeviation, 0, ((dataMax-dataMin)/4), 2, 15);  // Corners

​

  // background (0);

  // translate(width / 2, height / 2);

  noFill();

  stroke(255);

​

 for (n = 0; n < round(sDeviation); n++) { // if Deviation is higher = more lines (or elements) - until it gets like a filled ring

   stroke(round(hueGrad/10)*10, n * (aMean), 100, 1);

   strokeWeight(n/10);

   beginShape();

   for (i = 0; i < 360; i ++) {

     var rad = map(sin(i * round(wavesD)), -1, 1, round(sdataMin/10)*sType, round(outerC));

     // Waves -> Deviation is higher = more waves/parts within the ring

     var x = rad * cos(i);

     var y = rad * sin(i);

     vertex(x, y);

   }

   endShape(CLOSE);

   rotate(rMean);

 }

​

  print('Mean', sMean);

  print('Deviation', sDeviation, ' /  Deviation range', ((dataMax-dataMin)/4));

  print('Variance', sVariance);

  print('Hue Gradiante', hueGrad, ' /  rounded(dec)', round(hueGrad/10)*10);

  print('Alpha Mean', aMean);

  print('Session data min', sdataMin, ' /  Full data min', dataMin);

  print('Session data max', sdataMax, ' /  Full data max', dataMax);

  // print('Inner circle dataMin', round(sdataMin/10), ' / InnerC map', innerC);

  print('Inner circle dataMin', round(sdataMin/10), ' / InnerC 3x', round(sdataMin/10)*3);

  print('Outer c. dataMax*2', round(sdataMax/10)*2,  ' / OuterC map', round(outerC));

  print('Corners n factor (wavesD)', wavesD, ' /  rounded =', round(wavesD));

  print('Rotate value', rMean);

  print('Session Size', sSize);

 }

​

function breathDots()  {

  push();

  translate(-width / 2, -height / 2);

  for (let i = sStart; i < sEnd; i++) {

  let angle = 270 - i/(sSize)*360;

  let radius = data[i] - 850;

  // stroke(255);

  circle(width/2+radius*cos(angle), height/2-radius*sin(angle), 1);

  }

  pop();

}

​

function drawSpec() {

    translate(width / 2, height / 2);

    fill(255);

    // noStroke();

​

  let spectrum = fft.analyze();

  push();

  // translate(width / 2, height / 2);

  rotate(a);

  if (song.isPlaying()) {

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

      {

        //stroke(spectrum[i]);

        stroke(255 - spectrum[i], spectrum[i], spectrum[i]);

        strokeWeight((3 * spectrum[i]) / 150);

        line(0, i * w, 0, i * w + 1);

      }

  }

  pop();

  if (song.isPlaying()) a += b;

  }

}

​

function draw() {

  drawSpec();

}

​

function toggleSong() {

  if (song.isPlaying()) {

    song.pause();

    Playbutton.html("PLAY");

  } else {

    song.play();

    Playbutton.html("PAUSE");

  }

}

​

function stopSong() {

  song.stop();

  Playbutton.html("PLAY");

}

​

function breathDotsSwitch() {

    breathDots();

    breathDotsPlot = !breathDotsPlot;

  if (!breathDotsPlot) {

    background (0);

  if (breathShapePlot == 1) {

    breathShape();

    }

  }

}

​

// function breathShapePlot() {

    // breathShape();

    // breathShapePlot = !breathShapePlot;

  // if (!breathShapePlot) {

    // background (0);

  // }

// }

​

function shapeType1() {

    resetCanvas();

    sType = 1;

    breathShape();

     if (breathDotsPlot == 1){

       breathDots();

     }

}

​

function shapeType2() {

    resetCanvas();

    sType = 3;

    breathShape();

}

​

function saveArt() {

  saveCanvas("Breath_Painting_Art", "png");

}

​

//function title() {

//  let stxt = 'Breath Painting art generated from the breath data during the listening of the audio stimulus 1 "Andre".';

//  fill(75);

//  text(stxt, -450, -350, 170, 200);

//}