El Blog de Machinarium021

Software libre y tecnología en general.



Javascript más divertido a través de sensores

Firefox OS arquitecture

Como web developers tratamos a los celulares como pequeñas computadoras, nos gusta diseñar interfaces responsive design con botones con buen aspecto, pero podemos hacer mucho más. Nuestros celulares suelen tener una infinidad de sensores que nos ayudan a tener una vida más conectada con el mundo real, podemos utilizar esto a nuestro favor y crear cosas inimaginables con nuestros teléfonos, no necesitamos de placas de desarrollo y módulos de expansión que llegan a tener costos altos, con un teléfono con Firefox OS (el más barato en el mercado ronda los 25 dólares) o con Firefox para Android podemos desde hacer pequeños experimentos con control de sensores hasta complejos proyectos para Internet de las Cosas. Hoy te presentaré dos ideas para empezar a hackear tu smartphone con Firefox OS o con Firefox para Android.

Timbre para puertas:

Es un buen ejemplo de lo que podemos hacer con un sensor de proximidad, el script básico es muy simple:

  
window.onload = function() {  
    window.addEventListener('userproximity', function(event){
    var audio = new Audio(' http://www.soundjay.com/door/sounds/doorbell-6.mp3');
    audio.mozAudioChannelType = 'alarm';
    audio.volume.alarm = 15;

    if (event.near){
        audio.play();
        console.log("activado");
    }

    else {
        audio.pause();
        console.log("desactivado");
    }
    });
    }

Lo que hacemos es reproducir un archivo de audio (nuestro timbre) cada vez que la persona posa su mano cerca del sensor y pausar la reproducción del mismo al alejar nuestra mano, esto es accionado en el evento userproximity. La utilización de los canales de audio es opcional, yo lo he configurado para que trabaje sobre el canal normal (cualquier contenido de audio que cargue en HTML5).

Theremin usando el sensor de luz:

Para quien no sabe, un theremin o ætérfono es un instrumento creado por Leon Theremin en 1919, es un instrumento electrico en donde lo curioso es que el ejecutante no tiene contacto alguno con el.

En este momento de seguro quizás has pensado en esto y has acertado:

Bien luego de habernos ahorrado la explicación, hagamos la aclaración de que no es un theremin real, solo puedes usar una sola mano a la vez, aunque puedes compensar las escalas limitadas utilizando varios celulares al mismo tiempo.

Lo segundo, es posible crear un oscilador que funcione a varias frecuencias a través del Web Audio API (si es posible generar sonido sin ninguna fuente predefinida) e incluso con diferentes tipos de ondas (sine, square, sawtooth, triangle y custom).

Un oscilador simple sería escrito de esta forma:

  
oscillator = context.createOscillator(); // Crea una "fuente" de sonido

oscillator.connect(context.destination); // Conecta el sonido a la salida

oscillator.start(0); // Reproduce automáticamente

El script utilizado para nuestro ejemplo es este:


window.onload = function(){  
    var context = new AudioContext();
    var oscillator = context.createOscillator();

    oscillator.connect(context.destination);
    oscillator.start();

    window.addEventListener('devicelight', function(e){
        oscillator.frequency.value = e.value * 10;
    });
};

Lo único que hemos hecho en este ejemplo es ajustar la frecuencia en el evento devicelight el cual es disparado cada vez que el sensor de luz recibe una señal, ajustando la frecuencia de nuestro theremin en base al valor de iluminación el cual es un entero e 0 a 100 y este multiplicandolo por 10.

¿Podemos ampliar estos ejemplos?:

La imaginación es el límite, podemos conectar nuestro smartphone a un altavoz blutooth para hacerlo más funcional o enviar la salida de nuestros eventos a un servidor utilizando websockets (lo cual quisiera exponer en una segunda parte de este artículo). En el caso del timbre también sería interesante utilizar el Webcam API y así tener una cámara de vigilancia incorporada.

¿Qué más podemos realizar?

Estos ejemplos están basados en aquellos realizados por Jan Jongboom para JSConf Asia 2014, el cual se realizó hace pocos días, en el siguiente video puedes ver otras cosas interesantes y divertidas que podrías hacer con WebAPIs y sensores:

Link del timbre para puertas: Aquí
Link del theremin: Aquí

Blog Logo

Richard Armuelles

Frontend, Mozilla Reps, Blogger, Speaker & Free Software Evangelist

  • Panama
comments powered by Disqus