Using a sound input to affect text.

sam_strudwick

I'm trying to self teach the Processing language, and struggling with something I'm trying to do for university.

This is probably quite simple for someone who knows what they're doing... I'm trying to use sound input to change the opacity of text. The louder the sound, the greater the opacity. Could someone help with the coding?

Many thanks hope someone can help!

Chrisir

hello,

great idea!

are you using minim?

see here

http://code.compartmental.net/minim/audioplayer_method_play.html

you can easily use

getvolume

http://code.compartmental.net/minim/audioplayer_method_getvolume.html

then for text use e.g.

I don't know whether getVolume gives values from 0 to 1 or from 0 to 100 or so. But map can re-calculate this range of values to another range (0 to 255).

I think the opacity range is from 0 to 255 (or maybe 0 to 100).

Once you have the opacity calculated as myOpacity you can use it with fill.

float myOpacity = map (player.getVolume() 0,100, 0,255);
fill (255,0,0,myOpacity);
text(..........................

sam_strudwick

Hey,

Yeah I have the Minim library installed Great!! Very grateful for this, a big help. Will try this out.

Sam

sam_strudwick

Chrisir

Apologies - I think I might almost be there. Any pointers from this point though?

Sam

import ddf.minim.*;


float myOpacity;
float getVolume;
PFont font;

void setup(){
 font = loadFont("GothamBold-48.vlw");
 textAlign(CENTER);
 textFont(font, 100);
 smooth();
 size(1200, 800);
 background(255); 

 new Minim(this); //INITIALISE MINIM LIBRARY

}

void draw(){

  myOpacity = map (player.getVolume() 0,100, 0,255);

  fill(255,0,0, myOpacity);
  text("SAM STRUDWICK", width/2, height/2);


}

Chrisir

you need background(255); in setup() and at the beginning of draw()

I would put the size()-command always at the start of setup()

at the end of setup() you need to load a file and play it?

see my 1st link above.

  // loadFile will look in all the same places as loadImage does.
  // this means you can find files that are in the data folder and the 
  // sketch folder. you can also pass an absolute path, or a URL.
  player = minim.loadFile("marcus_kellis_theme.mp3");

  // play the file from start to finish.
  // if you want to play the file again, 
  // you need to call rewind() first.
  player.play();

Greetings, Chrisir

Chrisir

float getVolume;

is not needed

sam_strudwick

Sorry Im trying to say If any audio input at all, opacity is at 100%, if none, then opacity is at 0% - So the text will appear and disappear with sound. Does this make sense?

Sam

sam_strudwick

Sorry Im trying to say If any audio input at all, opacity is at 100%, if none, then opacity is at 0% - So the text will appear and disappear with sound. Does this make sense?

Sam

Chrisir

don't mark a thread as answered when it's not...

Chrisir

as said, you need background

and check this line:

I don't know the ranges

myOpacity = map (player.getVolume(), 0,100, 0,255);

when getVolume delivers values between 0 and 100 - fine

when it gives something between 0 and 1 change it!!!!

same for opacity:

when its getting evaluated between 0 and 255 - fine

when its getting stuff between 0 and 100 - change it please....

Chrisir

map (player.getVolume(), 0,100, 0,255);

means

map (player.getVolume(), 0,100, 0,255);

ok, convert the value of getVolume to another value so that if

it has a certain percentage of the range from 0 to 100 , my new value

should have the same percentage on the range of 0 to 255

so it's mapping the value from one range to another range

Chrisir

this is working

// I replaced getvolume with abs(player.mix.get(i))

// I replaced the for-loop with a loop that uses the // looping of draw() itself. // Disavantage: pretty fast; advantage: pretty accurate.

// Alternatively: use for but with myOpacity = map ( abs(player.mix.get(i)), 0, 100, 0, 255); // 100 instead of .7 because then they got printed all over one another.

// Alternatively: use for-loop but only till 10 and not i < player.bufferSize() - 1

// see http://code.compartmental.net/minim/audioplayer_method_play.html 
// see http://code.compartmental.net/minim/audioplayer_method_getvolume.html


import ddf.minim.*;


float myOpacity;
//float getVolume;
PFont font;

Minim minim;
AudioPlayer player;
float bufferSizeMy;
int i = 0; 

void setup() {
  font = createFont("GothamBold-48.vlw", 14);
  textAlign(CENTER);
  textFont(font, 100);
  smooth();
  size(1200, 800);
  background(255); 

  minim = new Minim(this); //INITIALISE MINIM LIBRARY


  // loadFile will look in all the same places as loadImage does.
  // this means you can find files that are in the data folder and the
  // sketch folder. you can also pass an absolute path, or a URL.
  player = minim.loadFile("1-01 Back & Forth.mp3");

  // play the file from start to finish.
  // if you want to play the file again,
  // you need to call rewind() first.
  player.play();

  bufferSizeMy = player.bufferSize() - 1;
}

void draw() {
  background(255); 

  // I replaced the for-loop with a loop that uses the 
  // looping of draw() itself. 
  // Disavantage: pretty fast; advantage: pretty accurate.
  // Alternatively: use for but with myOpacity = map ( abs(player.mix.get(i)), 0, 100, 0, 255);
  // 100 instead of .7 because then they got printed all over one another. 
  // Alternatively: or use for-loop but only till 10 and not i < player.bufferSize() - 1

  // for (int i = 0; i < player.bufferSize() - 1; i++) {
  // player.mix.get(i)
  myOpacity = map ( abs(player.mix.get(i)), 0, .7, 0, 255);
  // myOpacity = 255;  
  println ( abs(player.mix.get(i)) 
    + " -> " 
    + myOpacity ); 
  fill(255, 0, 0, myOpacity);
  text("SAM STRUDWICK", width/2, height/2);
  // }
  if (i < player.bufferSize() - 1) 
  {
    i++;
  }
  else
  {
    i=0;
    bufferSizeMy = player.bufferSize() - 1;
  }
}
//

bloomboy

Hi,

I am trying to follow the existing code above, but I would like to use two separate instances of text, one which reduces to an opacity of 0% with sound input and one which increases to an opacity of 100%.

I am trying to add another int ii=100 and another float myOpacit1 and duplicating the relevant section son the code but not working, can anyone offer any help to me?

my change to the code below - after line 47 mostly - thanks..

import ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.effects.*;
import ddf.minim.signals.*;
import ddf.minim.spi.*;
import ddf.minim.ugens.*;
//
float myOpacity;
float myOpacity1;
//float getVolume;
PFont font;
Minim minim;
//AudioPlayer player;
float bufferSizeMy;
int i = 0;
int ii = 100; 
AudioInput in;
void setup() {
  font = createFont("LucidaHandwriting-Italic", 14);
  textAlign(CENTER);
  textFont(font, 100);
  smooth();
  size(1200, 800);
  background(255); 
  minim = new Minim(this); //INITIALISE MINIM LIBRARY
in = minim.getLineIn();
}
void draw() {
  background(255); 
  myOpacity = map ( abs(in.mix.get(i)), 0, .7, 0, 255);
  // myOpacity = 255;  
  println ( abs(in.mix.get(i)) 
    + " -> "
    + myOpacity ); 
  fill(255, 0, 0, myOpacity);
  text("‘It was the Devil . . .’", width/2, height/2);
  // }
  if (i < in.bufferSize() - 1) 
  {
    i++;
  }
  else
  {
    i=0;
    bufferSizeMy = in.bufferSize() - 1;
  }
  myOpacity1 = map ( abs(in.mix.get(ii)), 0, .7, 0, 255);
  //myOpacity1 = 255;  
  println ( abs(in.mix.get(ii)) 
    + " -> "
    + myOpacity1 ); 
  fill(0, 0, 255, myOpacity1);
  text("‘looking like herons or swans or just women'", width/2, height/2);
  // }
  if (ii < in.bufferSize() - 1) 
  {
    i++;
  }
  else
  {
    ii=0;
    bufferSizeMy = in.bufferSize() - 1;
  }
}

Chrisir

make sure size(1200, 800); is the first line in setup(). There is quite a bit going on behind the scenes in size.

This makes no sense I think:

 if (ii < in.bufferSize() - 1) 
  {
    i++;
  }
  else
  {
    ii=0;
    bufferSizeMy = in.bufferSize() - 1;
  }

Instead

you have this now

  myOpacity1 = map ( abs(in.mix.get(ii)), 0, .7, 0, 255);

  fill(0, 0, 255, myOpacity1);
  text("‘looking like herons or swans or just women'", width/2, height/2);

just add the same differently with myOpacity2 and with different parameters for map!!!!!! :

  myOpacity2 = map ( abs(in.mix.get(ii)), 0, .7, 255, 0);

  fill(0, 33, 255, myOpacity2);
  text("Some test ..... ", width/2, height/2+77);

bloomboy

Thanks, seems to be a much neater way of achieving this process thanks.. I can see what you are doing with the values in the map, I have tweaked my parameters and all is good.

Chrisir

What happens if

you println abs(in.mix.get(ii))

?

The code is aimed on a mic input afaik. Do you have mic input?

The code to monitor a song you play on your computer is different afaik