var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
function lpf(input, samplerate, freq) {
    var q = 1.0;
    var omega = 2.0 * 3.14159265 * freq / samplerate;
    var alpha = Math.sin(omega) / (2.0 * q);
    var a0 = 1.0 + alpha;
    var a1 = -2.0 * Math.cos(omega);
    var a2 = 1.0 - alpha;
    var b0 = (1.0 - Math.cos(omega)) / 2.0;
    var b1 = 1.0 - Math.cos(omega);
    var b2 = (1.0 - Math.cos(omega)) / 2.0;
    var output = new Float32Array(1000);
    var size = 1000;
    var in1 = 0;
    var in2 = 0;
    var out1 = 0;
    var out2 = 0;
    for (var i = 0; i < size; i++)
    {
        output[i] = b0 / a0 * input[i] + b1 / a0 * in1 + b2 / a0 * in2 - a1 / a0 * out1 - a2 / a0 * out2;
        in2 = in1;
        in1 = input[i];
        out2 = out1;
        out1 = output[i];
    }
    return output;
}
function draw(data, n) {
    var hcenter = n * 150 + 100;
    ctx.strokeStyle = "#0f0";
    ctx.lineWidth = 2;
    ctx.moveTo(0, hcenter);
    for (var i = 1; i < canvas.width; i++) 
    {
        ctx.lineTo(i, data[i] * 15 + hcenter);
    }
    ctx.stroke();
}
function make() {
    var t;
    var src = new Float32Array(1000);
    var am = new Float32Array(1000);
    var I = new Float32Array(1000);
    var Q = new Float32Array(1000);
    var I2;
    var Q2;
    var o = new Float32Array(1000);
    for (t = 0; t < 1000; t++)
    {
        src[t] = Math.sin(t / 8000 * 2 * Math.PI * 220) * 2 - 1;
    }
    draw(src, 0);
    for (t = 0; t < 1000; t++)
    {
        am[t] = (0.6 * Math.sin(t / 8000 * 2 * Math.PI * 220) + 1.0) * Math.sin(t / 8000 * 2 * Math.PI * 3000) * 2 - 1;
    }
    draw(am, 1);
    for (t = 0; t < 1000; t++)
    {
        I[t] = am[t] * Math.cos(t / 8000 * 2 * Math.PI * 2800);
        Q[t] = am[t] * Math.sin(t / 8000 * 2 * Math.PI * 2800);
    }
    I2 = lpf(I, 8000, 300);
    Q2 = lpf(Q, 8000, 300);
    for (t = 0; t < 1000; t++)
    {
        o[t] = Math.sqrt(I2[t] * I2[t] + Q2[t] * Q2[t]) * 4 - 6;
    }
    draw(o, 2);
} 
make();