Vexflow time signature offset Solution

Align time signature when used on a percussion stave in conjunction with staves with other clefs

HTML

<script src="https://rawgithub.com/Nairam/vexflow/feature/customPadding_TimeSignature/build/vexflow/vexflow-min.js"></script>
<canvas width="700" height="500"></canvas>

JavaScript

$(document).ready(function() {
        var canvas = $('canvas')[0];
        var renderer = new Vex.Flow.Renderer(canvas, Vex.Flow.Renderer.Backends.CANVAS);

        var ctx = renderer.getContext();

        var stave = new Vex.Flow.Stave(15, 0, 300);

        for (var i = 0; i < 5; i++) {
            if (i == 2) continue;
            stave.setConfigForLine(i, {visible: false} );
        }

        stave.addClef("percussion"); 
        // passing the custom padding as second parameter
        stave.addTimeSignature("4/4", 25);
        stave.setContext(ctx).draw();

        var stave2 = new Vex.Flow.Stave(15, 110, 300);
        stave2.addClef("treble");
        stave2.addTimeSignature("4/4");
        stave2.setContext(ctx).draw();

        var connector = new Vex.Flow.StaveConnector(stave, stave2);
        connector.setType(Vex.Flow.StaveConnector.type.SINGLE);
        connector.setContext(ctx).draw();

        var stave3 = new Vex.Flow.Stave(15, 220, 300);
        stave3.addClef("bass");
        stave3.addTimeSignature("4/4");
        stave3.setContext(ctx).draw();

        var connector2 = new Vex.Flow.StaveConnector(stave2, stave3);
        connector2.setType(Vex.Flow.StaveConnector.type.SINGLE);
        connector2.setContext(ctx).draw();

        var connector3 = new Vex.Flow.StaveConnector(stave2, stave3);
        connector3.setType(Vex.Flow.StaveConnector.type.BRACE);
        connector3.setContext(ctx).draw();


});