osc.amp() issue

Hi all

I’m trying to do some first steps in the sound library in p5js. The idea is simple: press a button, start an osc. Press it again, turn it off. I started with the example in the reference. When running the code, the osc.amp(0,0.05) runs once with a hearable sine tone which fades out (when increasing the 0.05, it fades out longer). From then, everything works at it should. But: there shouldn’t be any sound when starting, as osc.amp is set to 0 in setup.

Is this a bug, or what am I doing wrong?

Here is the code:

var startX, startY;
var faderY;
var buttonClicked = false;
var isPlaying = false;
var osc;

function setup() {
  createCanvas(windowWidth, windowHeight);
  startX = 50;
  startY = 50;
  faderY = startY+200;

  osc = new p5.Oscillator();
  osc.setType('sine');
  osc.freq(240);
  osc.amp(0);
  osc.start();
}

function draw() {
  background(190);
  fill(80);
  rect(startX, startY, 10, 200);
  fill(255);
  rect(startX-5, faderY, 20, 10);

  if (buttonClicked) {
    fill(10);
  } else {
    fill(230);
  }
  rect(startX+100, startY, 50, 50);



  if (buttonClicked) {
    //osc.amp(((faderY-(startY+190))/200), 0.05);
    osc.amp(0.5, 0.05);
  } else {
    osc.amp(0, 0.05);
  }

}

function mouseDragged() {
   if (mouseX > startX-5 && mouseX < startX+15 && mouseY > startY-5 && mouseY < startY+200) {
  faderY = mouseY-5;
  }
}


function mouseClicked() {
  if (mouseX > startX+100 && mouseX < startX+150 && mouseY > startY && mouseY < startY+50) {
    buttonClicked = !buttonClicked;
  }
}

Best, Joghurt

Answers

  • edited November 2015

    Ok, I uploaded it to my page. Now, the tone always restarts during the draw-circle (what didn’t happen in the p5-editor). This makes it even worse.

  • As a general rule avoid the p5 editor b/c it's always a very OLD version! :P

  • This means, you think it is a compiler problem in the p5-editor? What is the solution then?

  • I tried your online editors. The same problems occure.

    I also downloaded the latest library from the p5.js website and used Sublime Text 2. It's also not working as intended.

    So, maybe a bug? Or is something wrong with my code?

  • Answer ✓

    You better tell the devs about this bug then:
    https://GitHub.com/processing/p5.js-sound/issues

  • So, as it seems to be a bug, I will report it. Thanks.

  • I'm not at a PC to test this but I'm uneasy about the direct reversal of buttonClicked in the mouseClicked method. I'm sure we've had questions on here about odd behaviour around click events. Change to using mouseReleased() to test if the sound issue is still occurring: that's definitely a one-shot event...

  • edited November 2015

    Thanks. But mouseReleased() didn't help. Let's see if it's a bug then.

  • Just tested the code you posted: works fine for me in Chrome (running on Linux, but I wouldn't expect that to make a difference): when the sketch starts there's no sound. It starts/stops when I hit the button as I would expect.

    Include your browser and platform in that bug report as I suspect it will be relevant...

  • Hi blindfish

    Thanks. I just updated my bug report.

    I may also check it with my windows machine (as soon as my Surface 4 arrives).

  • Hi Joghurt,

    The solution here will be to think in terms of events, rather than control the amplitude of the oscillator in draw() using the buttonClicked variable, trigger volume changes at the moment that the button press event occurs.

    You said "there shouldn’t be any sound when starting, as osc.amp is set to 0 in setup."

    This seems right, but I think what's happening under the hood is that before osc.amp(0) can go into effect in setup, the draw loop runs for the first time, and at that point osc.amp is being set to 0 with a fade of 0.05 seconds (because buttonClicked is false). When you set amplitude to fade over time, it cancels any previously scheduled fades, so it fades to zero from the oscillator's default amplitude. This is something that should be tweaked in the library.

    In the meantime, this should do the trick:

    function mouseClicked() {
      if (mouseX > startX+100 && mouseX < startX+150 && mouseY > startY && mouseY < startY+50) {
        if (isPlaying) {
          osc.amp(0, 0.05);
        } else {
          osc.amp(0.5, 0.05);
        }
    
        isPlaying = !isPlaying;
      }
    }
    
Sign In or Register to comment.