SketchFXR

sliders = [];
sliderSets = [];
sliderHeld = null;
hue = 0.16;
function makeSlider( x, y, scaleX, scaleY, lowValue, highValue, valueScale, markerPeriod, value )
{
    var slider = {};
    slider.value = value;
    slider.x = x;
    slider.y = y;
    slider.scaleX = scaleX;
    slider.scaleY = scaleY;
    slider.lowValue = lowValue;
    slider.highValue = highValue;
    slider.valueScale = valueScale;
    slider.markerPeriod = markerPeriod;
    slider.draw = function( slider )
    {
        crosshairTransform();
        translate( slider.x, slider.y );
        scale( slider.scaleX, slider.scaleY );
        for( mark in slider.lowValue ...( slider.highValue + 1 ) )
        {
            drawRect( hue, 0.6, 0.1, 1, 0, ( mark - slider.lowValue * 1.0 ) / ( slider.highValue - slider.lowValue ) * 2 - 1, ( mark % slider.markerPeriod == 0 ) ? 1.5 : 0.75, 0.003 );
        }
        drawRect( hue, 0.6, 0.3, 1, 0, 0, 0.25, 1 );
        drawBlob( hue, 0.9, slider == sliderHeld || slider.underMouse( slider ) ? 0.9 : 0.1, 1, 0, slider.value * 2 - 1, 1, 0.05, 4 );
    }
    slider.update = function( slider )
    {
        // move the value
        // rect test
        if( sliderHeld == slider )
        {
            // yep! Better update it.
            slider.value = Math.round( Math.max( Math.min( ( ( mouseY - slider.y ) / slider.scaleY ) * 0.5 + 0.5, 1 ), 0 ) * ( slider.highValue - slider.lowValue ) ) / ( slider.highValue - slider.lowValue );
        }
    }
    slider.underMouse = function( slider )
    {
        return mouseX < slider.x + slider.scaleX + 5 && mouseX >= slider.x - slider.scaleX - 5 &&
               mouseY < slider.y + slider.scaleY + 5 && mouseY >= slider.y - slider.scaleY - 5;
    }
    slider.getOutput = function( slider )
    {
        return ( slider.lowValue + slider.value * ( slider.highValue - slider.lowValue ) ) * slider.valueScale;
    }
    return slider;
}

function setSet( index )
{
    sliders = sliderSets[index];
    hue = 0.16 + index / 8.0;
}

function update()
{
    // update the sliders
    for( s in sliders )
    {
        s.update( s );
    }
}

function render()
{
    fillBackground( hue, 0.5, 0.4 );
    crosshairTransform();
    drawRoundedRect( hue, 0.5, 0.45, 1, sliders[4].x / 2 + sliders[5].x / 2, sliders[4].y, Math.abs( sliders[4].x - sliders[5].x ) / 2 + sliders[4].scaleX + 12, sliders[4].scaleY + 12, 10, 10 );
    drawRoundedRect( hue, 0.5, 0.45, 1, sliders[8].x / 2 + sliders[8].x / 2, sliders[8].y, Math.abs( sliders[8].x - sliders[8].x ) / 2 + sliders[8].scaleX + 12, sliders[8].scaleY + 12, 10, 10 );
    drawRoundedRect( hue, 0.5, 0.55, 1, sliders[0].x / 2 + sliders[3].x / 2, sliders[0].y, Math.abs( sliders[0].x - sliders[3].x ) / 2 + sliders[0].scaleX + 12, sliders[0].scaleY + 12, 10, 10 );
    drawRoundedRect( hue, 0.5, 0.55, 1, sliders[6].x / 2 + sliders[7].x / 2, sliders[6].y, Math.abs( sliders[6].x - sliders[7].x ) / 2 + sliders[6].scaleX + 12, sliders[6].scaleY + 12, 10, 10 );
    for( pair in 0...2 )
    {
        var sa = sliders[pair * 2];
        var sb = sliders[pair * 2 + 1];
        for( blob in 1...4 )
        {
            var a = blob / 4.0;
            var ai = 1 - a;
            drawBlob( hue, 0.6, 0.3, 0.5, sa.x * ai + sb.x * a, sa.y * ai + sb.y * a + ( ( sa.value * ai + sb.value * a ) * 2 - 1 ) * ( sa.scaleY * ai + sb.scaleY * a ), blob == 2 ? 5 : 3, blob == 2 ? 5 : 3 );
        }
    }
    for( s in sliders )
    {
        s.draw( s );
    }
    crosshairTransform();
    for( setIndex in 0...sliderSets.length )
    {
        drawRect( 0.16 + setIndex / 8.0, 0.5, 0.4, 1, ( setIndex - 3.5 ) * 60, -140, 30, 20 );
        if( sliderSets[setIndex] != sliders )
        {
            drawRect( 0, 0, 0, 0.125, ( setIndex - 3.5 ) * 60, -122, 30, 2 );
            drawRect( 0, 0, 0, 0.125, ( setIndex - 3.5 ) * 60, -124, 30, 4 );
            drawRect( 0, 0, 0, 0.125, ( setIndex - 3.5 ) * 60, -126, 30, 6 );
        }
    }
}

function onMouseDown()
{
    sliderHeld = null;
    for( slider in sliders )
    {
        if( slider.underMouse( slider ) )
        {
            sliderHeld = slider;
        }
    }
    if( mouseY < -120 )
    {
        setSet( Math.min( Math.max( Math.floor( ( mouseX + 240 ) / 60 ), 0 ), 7 ) );
    }
}

function onMouseUp()
{
    var textOut = "";
    var delay = 0;
    for( set in sliderSets )
    {
        playNote(    set[0].getOutput( set[0] ) + set[1].getOutput( set[1] ), 
                     set[2].getOutput( set[2] ) + set[3].getOutput( set[3] ), 
                     set[4].getOutput( set[4] ), 
                     set[5].getOutput( set[5] ), 
                     set[6].getOutput( set[6] ), 
                     set[7].getOutput( set[7] ),
                     0, 
                     delay,
                     set[8].getOutput( set[8] ) );
         if( set[4].value != 0 || set[5].value != 0 )
         {
             textOut += "playNote( " + ( set[0].getOutput( set[0] ) + set[1].getOutput( set[1] ) ) + ", " +
                         ( set[2].getOutput( set[2] ) + set[3].getOutput( set[3] ) ) + ", " +
                         set[4].getOutput( set[4] ) + ", " +
                         set[5].getOutput( set[5] ) + ", " +
                         set[6].getOutput( set[6] ) + ", " +
                         set[7].getOutput( set[7] ) + ", " +
                         "0, " +
                         delay + ", " +
                         set[8].getOutput( set[8] ) + " );\n";
         }
         delay += set[8].getOutput( set[8] );
     }
     sliderHeld = null;
     setClipboard( textOut );
 }

// create slider objects
var ranges = [ [ -5, 5, 12, 5 ], [ -12, 12, 1, 12 ], [ -5, 5, 12, 5 ], [ -12, 12, 1, 12 ], [ 0, 20, 0.2, 5 ], [ 0, 20, 0.2, 5 ], [ 0, 20, 0.1, 5 ], [ 0, 20, 0.1, 5 ], [ 1, 40, 1, 4 ] ];
for( ss in 0...8 )
{
    var newSliders = [];
    for( s in 0...( ranges.length ) )
    {
        newSliders.push( makeSlider( ( s - 4 ) * 51, 20, 15, 120, ranges[s][0], ranges[s][1], ranges[s][2], ranges[s][3], ss == 0 ? 0.5 : 0 ) );
    }
    sliderSets.push( newSliders );
}
setSet( 0 );
[/gamesketch]

Here is a thing! You can use it to make beepy noises, and you may notice that it fills your clipboard with chunks of code. That code is what I use to then play the beepy noises in GameSketch, so yeah, it's a tool for me that I've published here even though you can't really use it for anything. Um... sorry? Anyhow it's pretty fun, and if you're interested in such things it'll give you a good idea of how the GameSketch synthesizer works.

Tips:

The tabs down the bottom select individual beeps that are played back in sequence. Combining these together can create more complex sounds and short melodies.

Enjoy!

<3
Farbs