Change value on runtime

Question

I'm trying to change a value on runtime via a range input but I do not get it to work. I get no errors. When I change the frequence in onSlide the sound does still play on 800. It should change.

import $ from 'jquery';
import rangeslider from 'rangeslider.js';
import T from 'timbre';

window.$ = $;

    $(document).ready(() => {

        var f = 800;

        T("sin", {freq:f, mul:0.5}).play(); /*plays a continous sound*/

        $('input[type="range"]').rangeslider({
            polyfill : false,
            onSlide: function() {
                var ff = 440; /*changing frequancy, but the tone is still the same.*/
                f = ff;
            }
        });

    });

Answer 1

As shown in Getting Started, you need to store the instance in a variable so that you can call the set method later.

$(document).ready(() => {
    const tone = T("sin", {freq:f, mul:0.5}).play(); /*plays a continous sound*/
    $('input[type="range"]').rangeslider({
        polyfill : false,
        onSlide: function() {
            tone.set( {freq: 440 }); /* changing frequency of the tone */
        }
    });
});