Diodon: un histórico para el portapapeles

Hoy quiero hablar de uno de esos pequeños programas que cuando se usan por primera vez se pregunta uno dónde han estado toda nuestra vida. Es el equivalente en software de ver por primera vez a Anna Torv o a Claudia Longarte.

Esta joya se llama Diodon, y básicamente lo que hace es ir guardando en un buffer todo lo que copiamos al portapapeles, hasta un máximo de 100 entradas (tanto de texto como de imágenes). Cuando pulsemos la combinación de teclas que le hayamos asignado nos mostrará un menú contextual con todas esas entradas y con el cursor podremos movernos por ellas; al pulsar Enter sobre cualquiera nos la pega en el documento.

Yo lo tengo configurado para 25 entradas, es más que de sobra, y como combinación de teclas CTRL-SHIFT-Z. Ahorra mucho tiempo, porque permite por ejemplo seleccionar varios textos de un documento uno por uno y pegarlos después rápidamente en otro documento, sin tener que andar cambiando de uno a otro.

Además el icono que pone al lado del reloj es de una especie de pez globo inflado muy gracioso.

¿Cómo instalarlo en Ubuntu? Con tres líneas lo tendremos:

sudo add-apt-repository ppa:diodon-team/stable
sudo apt-get update
sudo apt-get install diodon

Actualización del 18/01/2015: he instalado Linux Mint y por algún motivo Diodon no funciona, no aparece el menú con el histórico del portapapeles al pulsar la combinación de teclas. He instalado una alternativa que se llama clipit y que funciona estupendamente.

Bookmarlet para probar el responsive design

Después de probar muchas extensiones al final lo mejor que he encontrado para hacer pruebas de responsive design es este bookmarlet.

Tiene tamaños predeterminados para móviles y tabletas, aparte de permitirte cambiar el tamaño manualmente.

Aquí se puede ver una captura de pantalla del bookmarlet con la estupenda página Ponles Nota, que permite calificar a los profesores de universidades y centros de estudios y saber cuáles son los mejores en cada uno de ellos. ¡De obligada visita si estudias o tienes pensado estudiar en cualquier centro de España!

screenshot

(Atentos al detalle de la foto de la Unhelpful High School Teacher con el bocadillo de ¿Me has calificado ya? xDDDD)

Autobombo: Linux Caller Id

Me voy a permitir un post de autobombo, pero es que (y es horrendo que lo diga yo, ya lo sé) este programita que hice es una maravilla.

Linux Caller Id es un programa que se conecta a un módem que tengamos enchufado a nuestra línea fija y extrae el número que está llamando; si el número lo hemos marcado anteriormente como bloqueado descuelga y cuelga automáticamente, cortando la llamada. Ya está, no tiene nada de misterio, pero gracias a él cada vez pierdo menos tiempo contestando al teléfono de los spammers (sobre todo compañías de telecomunicaciones y bancos, los dos colectivos más cansinos).

Tiene la ventaja añadida de que no solamente se pueden registrar números de spammers, podemos añadir los de amigos y familia y que no los bloquee, y así cuando nos llamen saber quién es sin tener que coger el teléfono para ver quién llama.

Por lo general, a la tercera o cuarta vez que un spammer ve que la llamada se corta se piensa que el número está dado de baja o algo parecido y dejan de llamar. En un futuro, cuando tenga tiempo para investigar cómo reproducir ficheros de sonido a través del módem, lo pienso ampliar para que suene una locución si llama un spammer. Así podría coger la locución clásica de “El número al que llama no se encuentra operativo” y conseguir que los spammers borren mi número de la base de datos antes.

El programa está hecho con Qt/C++ y es libre y gratuito. Hoy a las 11:30 ya me había librado de dos pesaos. 🙂

Screenshot

REPLACE y foreign keys en MySQL

MySQL tiene una extensión al lenguaje SQL muy útil, REPLACE, que es una combinación de INSERT y UPDATE: si en la tabla existe una fila con la misma primary key que la que vamos a insertar, MySQL actualiza la fila con los nuevos datos; si no existe, la introduce. Es muy útil porque así no tenemos que tener una sentencia diferente para insertar un nuevo registro (INSERT) o modificar uno existente (UPDATE), y esto hace que el código sea más sencillo y limpio.

Pero tiene truco. Como dicen en la documentación:

REPLACE works exactly like INSERT, except that if an old row in the table has the same value as a new row for a PRIMARY KEY or a UNIQUE index, the old row is deleted before the new row is inserted.

 

MySQL lo que hace es insertar la fila si no existe esa primary key, pero si existe borra la fila existente y a continuación la inserta.

Esto no es un problema hasta que utilizamos foreign keys: si hacemos REPLACE en una tabla A y hay otra tabla B que tiene una foreign key con ON DELETE CASCADE en A.id, como MySQL elimina la fila de A automáticamente se eliminan todas las filas de B que hacen referencia a ese A.id, y eso es algo que no queremos.

La solución para esto es desactivar la comprobación de foreign keys antes de hacer el REPLACE, y activarlo una vez hecho:

SET FOREIGN_KEY_CHECKS = 0;
REPLACE INTO tabla_A (campo1, campo2, ... campoN) VALUES (valor1, valor2, ... valorN);
SET FOREIGN_KEY_CHECKS = 1;

De esta forma mantenemos el comportamiento habitual de las foreign keys para borrado de filas y actualización de índices pero lo anulamos cuando queramos usar  REPLACE.

Problema: lighttpd cachea ficheros en VirtualBox cuando no debería

He estado un buen rato fruteado con esto, y por suerte he encontrado la solución en ServerFault, la copio aquí por si me vuelve a pasar en el futuro.

Tengo una máquina virtual con VirtualBox que tiene Ubuntu Server 12.04, para simular el entorno donde se instalará una web que estoy haciendo. El servidor web es lighttpd, y me estaba haciendo unas cosas rarísimas: yo modificaba un fichero JS y al lighttpd no le daba la gana de actualizarlo, seguía sirviendo la versión antigua pero no solo eso, además solamente enviaba tantos bytes de la versión antigua como bytes tuviera la nueva versión del fichero. Vamos, un WTF en toda regla.

Al parecer esto se debe al VirtualBox, y la forma de solucionarlo es añadiendo esta línea al fichero lighttpd.conf

server.network-backend = "writev"

Y con esto el problema está solucionado. La verdad es que no sé por qué así funciona, pero después del mal rato que me ha hecho pasar ya no me quedan muchas ganas de investigarlo.

Aprovecho para copiar aquí también las reglas de redirección que he utlizado para que cualquier URL que no lleve a un fichero existente se envíe al fichero index.php:

url.rewrite-final = (
"^/([^.?]*)\?(.*)$" => "/index.php?__q__=$1&$2",
"^/([^.?]*)$" => "/index.php?__q__=$1"
)

Vídeos en páginas web

Ahora que prácticamente todos los navegadores soportan las etiquetas audio y video de HTML5 meter vídeos en las páginas es muy sencillo. Yo utilizo VideoJS, que funciona estupendamente.

Para convertir los vídeos a los formatos mp4 y webm estos son los programas que uso:

WinFF: este tiene versión para Windows y Linux. Seleccionas el vídeo a convertir  y le pones como salida MPEG-4 y como Preset FullScreen o WideScreen según el aspect ratio sea cuadradote o panorámico. Convierte el fichero a .mp4 y además aprovecha todos tus procesadores, así que va como un tiro.

Transmageddon: este es sólo para Linux. Le enchufas el video y seleccionas de Preset “HTML5 WebM” y te genera el .webm, aunque es bastante más lento que el otro.

Si se quiere hacer por línea de comandos hay que utilizar ffmpeg:

ffmpeg -i filename.flv -vcodec libvpx -acodec libvorbis filename.webm

ffmpeg -i filename.flv -qscale 0 -ar 22050 -vcodec libx264 filename.mp4

– Actualizado 19/03/14: según el comentario de Manu he actualizado la línea de comandos para convertir a mp4, ¡gracias bro!

– Actualizado 25/09/14: he encontrado otro programa (solamente para Linux) que permite convertir a los dos formatos. Se llama Arista Transcoder y trae un montón de configuraciones predefinidas para convertir vídeos para distintos dispositivos.

Capturar imagen de una web desde el servidor

Empiezo el blog con un programa para capturar una imagen de una web desde el servidor. Después de investigar algunas opciones que hay para hacerlo desde el navegador (por ejemplo html2canvas) he encontrado una forma mucho más sencilla y que muestra una captura perfecta de cualquier página web, incluyendo animaciones flash.

El programa que nos permite hacer esto se llama PhantomJS y aunque permite hacer muchísimas más cosas (es un navegador webkit completo) aquí voy a contar el proceso de generar una imagen de cualquier página web.

Nos descargamos el programa y subimos a nuestro servidor el ejecutable correspondiente a nuestro sistema operativo. Una vez hecho esto ya podemos crearnos el script que capturará la imagen:

var page   = require('webpage').create();
var system = require('system');
var url    = system.args[1];
var path   = system.args[2];
var width  = system.args[3];
var height = system.args[4];

page.viewportSize = { width: width, height: height };
page.open(url, function () 
{
    setTimeout(function()
    {
        page.render(path);
        phantom.exit();
    }, 1000);
});

Guardamos este script como webSnap.js, por ejemplo. El script recibe cuatro parámetros: la URL de la página a capturar, el path del fichero donde queremos guardar la imagen y el ancho y el alto de la ventana del navegador con el que se simulará estar viendo la página. Con estos datos crea una página, ajusta el tamaño del navegador y la abre, guardando después la captura en el fichero que le hayamos dicho (soporta PNG, GIF, JPG y PDF, dependiendo de la extensión del nombre que le pasemos).

El timeout a la función render() lo he puesto porque en unas pruebas que he estado haciendo con un visor de publicaciones me aparecía la imagen en blanco, lo más seguro es que para una página web normal no haga falta.

Con esto ya lo tenemos todo, solamente nos faltaría invocar al programa pasando los parámetros que queramos:

phantomjs webSnap.js http://www.yahoo.es yahoo.jpg 1024 768

Y tendremos la captura de la página web en su totalidad. Posteriormente si queremos podremos recortarla o hacer cualquier otra cosa con ella.

Esta es la imagen resultante del comando anterior:

yahoo