Multiple range-sliders in the app

1

Hello, I would like to have sliders for each parameter with different range specification for each.
My range slider is this using noUiSlider lib and the HTML looks like this below:

<div id="range-slider"></div>
        <p>Left value: {{slider.[0]}}, right value: {{slider.[1]}}</p>

JS side is here:

Template.ipsosboard.rendered = function () {
        this.$("#range-slider").noUiSlider({
            start: Session.get("slider"),
            connect: true,
            range: {
                'min': 0.1,
                'max': 10.0
            }
        }).on('slide', function (ev, val) {
            Session.set('slider', [Math.round(val[0]), Math.round(val[1])]);
            var setValues = normalize_scale_offset(Session.get('selected'), val[0], val[1]);
            seq.values = setValues;
        });
    };

I would like to have different range specs for each using this below:

let scaleValue = require('scale-value');

const specs = {
    attack: scaleValue(0, 1, 0.1, 1.0),
    decay: scaleValue(0, 1, 0.1, 1.0 * 11025),
    sustain: scaleValue(0, 1, 0.1, 1.0 * 44100),
    release: scaleValue(0, 1, 0.1, 1.0 * 22050),
    gain: scaleValue(0, 1, 0.1, 0.1, 1.0),
    frequency: scaleValue(0, 1, 120.0, 1220.0)
};

export default specs;