// Effervescence de notes is a side project as Manifestation de bouteilles is. 

// Notes bubble to the top of the canvas, wriggle left to right, and reappear.

// In the background, cords or partitions play in rhythm : made of Bezier curves,

// they breathe to calm the notes, the scene itself is disordered, disoriented.

​

///-- A propos de Effervescence de notes ---///

// Tout comme Manifestation de bouteilles, Effervescence de notes est un projet

// secondaire. Des notes bullent, gigotent et effervent, de droite à gauche.

// Elles disparaissent et rapparaissent, tandis qu'à l'arrière plan, 

// des cordes ou des partitions jouent en rythme. Faites de courbes de Bézier,

// elles respirent pour calmer les notes, la scène est par essence désordonnée.

​

// Hamon Ewann 02/2024

let note_factors = [0.62,1.9,0.10,0.65]

let partition_factors = [0.30,0.2,0.7,-0.2,0.1]

​

let notes = [];

let partitions = [];

let time = 0;

​

var main_color;

var background_color;

const overflow = 1;

const screen_width = 900;

const screen_height = screen_width*9/16;

​

function setup() {

  createCanvas(screen_width, screen_height);

  noStroke()

​

  main_color = color(0,0,0);

  background_color = color(238,229,229)

  generateMusic()

}

​

function draw() {

  background(background_color)

​

  // Draw and update the music elements

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

    updateNote(i)

    drawNote(...notes[i])

  }

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

    drawPartition(...partitions[i])

  }

  // Update time variable

  time += 0.1;

}

​

function generateMusic(){

  // Notes generation 

  for(let i=0;i<80;i+=1){

    notes.push([random(0,screen_width),random(-100,screen_height+100),random(20,30),random([0,1]),random([false,true]),random()*PI])

  }

  // Partition generation

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

    partitions.push([200+25*i,screen_width])

  }

}

​

function updateNote(index){

    // X-axis oscillation of the note

    notes[index][0] += cos(time*cos(notes[index][4])+notes[index][4]);

    // Y ascension of the note

    notes[index][1] -= 0.5

    // Bringing back too up notes

    if (notes[index][1]<-100){

      notes[index][1] = screen_height+100

    } 

}

​

function drawNote(x,y,w,hollowed,reversed){

  //--- Draw the notehead ---// 

  push()

  // Set the color as main one

  fill(main_color)

  // Draw the rotated ellipse 

  translate(x,y)

  rotate(-PI/13)

  ellipse(0,0,w,w*note_factors[0])

  pop()

  fill(main_color)

  //--- Draw the stem ---//

  if (reversed){

    rect(x+cos(-PI/13)*w/2-w*note_factors[2],y-w*note_factors[1]-overflow,w*note_factors[2],w*note_factors[1])

    arc(x+cos(-PI/13)*w/2-w*note_factors[2]/2,y-w*note_factors[1],w*note_factors[2],w*note_factors[2]/1.5,PI,0)

  }

  else{

    rect(x+cos(-PI/13)*w/2-w*note_factors[2],y+w*note_factors[1]-overflow,w*note_factors[2],-w*note_factors[1]-overflow)

    arc(x+cos(-PI/13)*w/2-w*note_factors[2]/2,y+w*note_factors[1]-overflow,w*note_factors[2],w*note_factors[2]/1.5,0,PI)

  }

  if (!hollowed){

    return 0

  }

  push()

  // Set the color back to background color

  fill(background_color)

  // Draw an inner rotated ellipse, to hollow the notehead

  translate(x,y)

  rotate(PI/13)

  ellipse(0,0,w*note_factors[3],w*note_factors[0]*note_factors[3])

  pop()

}

​

function drawPartition(y,dx){

  push()

  // Set the drawing parameters

  noFill()

  strokeWeight(4)

  stroke(main_color)

  // Save the bezier curve points of the curve

  var py1 = y+dx*(partition_factors[1]+cos(time*0.3)/15);

  var py2 = y+dx*(partition_factors[3]+cos(time*0.1)/15);

  var py3 = y+dx*partition_factors[4]

  var px1 = dx*partition_factors[0]

  var px2 = dx*partition_factors[2]

  var px3 = dx

  // draw the partition's curve

  bezier(0,y,px1,py1,px2,py2,px3,py3)

  pop()

}