jueves, 18 de septiembre de 2014

45 lineas de Javascript hacen un pianito

El API de Web Audio esta como pidiendo que alguien haga algo con eso, ofrece infinidad de posibilidades, es mas o menos nueva pero posiblemente lo suficiente madura para poder empezar a probar cosas con eso (para mis informacion ver la tabla de compatibilidades)

Por ahora las teclas son Z, X, C, V.. etc... Codigo fuente:
(function() {

    var audio = new window.webkitAudioContext();
    var oscillators = {};

    function createOscillator(freq) {
        var osc = audio.createOscillator();

        osc.frequency.value = freq;
        osc.type = "square";
        osc.connect(audio.destination);
        return osc;
    };

    var frequency = function(notenum) {
        return 293.66 * Math.pow(2, notenum/12);
    };

    var keyCodeToNote = {90: 'C', 88: 'D',  67: 'E', 86: 'F', 66: 'G', 78: 'A', 77: 'B'};
    var noteToNum = {C: 0, D: 2, E: 4, F: 5, G: 7, A: 9, B: 11};
    document.getElementById("pianito").onkeydown = function(e) {
        var osc = oscillators[e.keyCode];
        if (osc) return;

        var note = keyCodeToNote[e.keyCode];
        if (note == undefined) return;
        var noteNum = noteToNum[note];
        var freq = frequency(noteNum);
        var osc = createOscillator(freq);

        oscillators[e.keyCode] = osc;
        osc.start(0);
    };
    document.getElementById("pianito").onkeyup = function(e) {
        var osc = oscillators[e.keyCode];
        if (!osc) return;
        osc.stop(0);
        osc.disconnect(audio.destination);

        oscillators[e.keyCode] = undefined;
    };
})();


Bastante rudimentario, pero es algo para empezar


1 comentario:

Megan Valish dijo...

I just found your blog and want to say thank you! What an enjoyable time looking
through so many Entertainment sites. Thanks for sharing
Pepperfry Coupons Code
Indian Gifts Portal Coupons Code
Tata CLiQ Coupons & Offers
Myntra Coupons & Offers