문제

I have an oscillator with it's initial frequency, detune, and gain parameters set to the value of the sliders they're attached to. Everything works fine except for a couple strange things I noticed:

  1. Sliders don't move until play button is pressed, but the values still change.
  2. When play is pressed, the correct pitch is played initially, but when the pitch slider is moved to set a new frequency, then paused, and played again, it sounds like it's still at the correct frequency, but an octave higher.
  3. After the first strange "octave change", if it is paused and played once again, it stays at the new unexpected frequency like it should in the first place.

here's my code:

<input type="button" id="play_pause" value="play"/><br/>
<label for="cur_vol">Current Volume:</label><input type="text" id="cur_vol" />
<div id="osc1_vol"></div>
<label for="cur_pitch">Current Pitch:</label><input type="text" id="cur_pitch" />
<div id="osc1_pitch"></div>
<label for="cur_detune">Current Detune:</label><input type="text" id="cur_detune" />
<div id="osc1_detune"></div>


$(document).ready(function(){
//GAIN SLIDER//
$(function() {
    $("#osc1_vol").slider({
        min: 0,
        max: 1,
        value: .5,
        step: .01,
        slide: function(event, ui) {
            $("#cur_vol").val(ui.value);
            gainNode.gain.value = $("#cur_vol").val();
        }
    });
    $("#cur_vol").val($("#osc1_vol").slider("value"));
});
//PITCH SLIDER//
$(function() {
    $("#osc1_pitch").slider({
        min: 0,
        max: 25000,
        value: 440,
        step: 1,
        slide: function(event, ui) {
            $("#cur_pitch").val(ui.value);
            osc.detune.value = $("#cur_pitch").val();
        }
    });
    $("#cur_pitch").val($("#osc1_pitch").slider("value"));
});
//DETUNE SLIDER//
$(function() {
    $("#osc1_detune").slider({
        min: -4800,
        max: 4800,
        value: 0,
        step: 1,
        slide: function(event, ui) {
            $("#cur_detune").val(ui.value);
            osc.detune.value = $("#cur_detune").val();
        }
    });
    $("#cur_detune").val($("#osc1_detune").slider("value"));
});
//PLAY/PAUSE BUTTON//
$('#play_pause').click(function() {
    if ($(this).val() == "play") {
        $(this).val("pause");
        osc1();
    }
    else {
        $(this).val("play");
        osc.disconnect();
    }
});
});
//WEB AUDIO SET UP//
var ctx = new webkitAudioContext();
//CREATE OSCILLATOR//
function osc1(){ 
osc = ctx.createOscillator(), 
osc.type = 0; //0 = sine, 1 = square, 2 = saw, 3 = triangle, 4 = custom
osc.frequency.value = $("#osc1_pitch").slider("value");
osc.detune.value = $("#osc1_detune").slider("value");
gainNode = ctx.createGainNode(); 
osc.connect(gainNode); 
gainNode.connect(ctx.destination);
gainNode.gain.value - $("#osc1_vol").slider("value"); 
osc.noteOn(0); 
};

Here's a working Demo: http://jsfiddle.net/ryanhagz/tvfDZ/

도움이 되었습니까?

해결책

Sliders don't move until play button is pressed, but the values still change.

Your event handlers are throwing errors. That causes the slider to not update properly.

When play is pressed, the correct pitch is played initially, but when the pitch slider is moved to set a new frequency, then paused, and played again, it sounds like it's still at the correct frequency, but an octave higher.

After the first strange "octave change", if it is paused and played once again, it stays at the new unexpected frequency like it should in the first place.

That's a bug:

//PITCH SLIDER//
$(function() {
...
        osc.detune.value = $("#cur_pitch").val();
        //why are you changing detune here?
...
});
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top