s_i = 0;

function init_synthesis(){
    synthesis = document.getElementById("synthesis");
    var canvas_rect = synthesis.getBoundingClientRect();
    synthesis_draw(0, 0, false);

    synthesis.addEventListener('mousemove', function(e){
        var canvas_rect = synthesis.getBoundingClientRect();
        synthesis_draw(e.clientX - canvas_rect.left, e.clientY - canvas_rect.top, true);
        if(e.buttons == 1){
            synthesis_xs[synthesis_i] = client_to_x(e.clientX - canvas_rect.left);
            