lunes, 30 de abril de 2012

JavaScript: Parar/Iniciar un Gif animado


Hace un poco surgió la pregunta en el equipo si se podría controlar con JavaScript el ciclo de un Gif animado. Controlar al menos el parar y reiniciar la animación.

En mi búsqueda por Internet encontré que no se puede hacer directamente, pero sí se puede usar un truco que es reemplazar la imagen del Gif animado con una imagen estática. Inclusive encontré un código con Canvas que permite generar dinámicamente una imagen estática de un Gif animado. Solo funciona si el browser soporta HTML5.

Este sería el código:

<html>
<head>
<script>
function is_gif_image(i) {
    return /^(?!data:).*\.gif/i.test(i.src);
}

function freeze_gif(src) {
 i = document.getElementById(src);
    var c = document.createElement('canvas');
    var w = c.width = i.width;
    var h = c.height = i.height;
    c.getContext('2d').drawImage(i, 0, 0, w, h);
    try {
        i.src = c.toDataURL("image/gif"); // if possible, retain all css aspects
    } catch(e) { // cross-domain -- mimic original with all its tag attributes
        for (var j = 0, a; a = i.attributes[j]; j++)
            c.setAttribute(a.name, a.value);
        i.parentNode.replaceChild(c, i);
    }
}

function unfreeze_gif(id, src) {
 i = document.getElementById(id);
    i.src = src;
}

</script>
</head>
<body>
<img id="rotator" src="rotation.gif" />
<br />
<input value="Freeze!" type="button" onclick="freeze_gif('rotator')" />
<input value="Unfreeze!" type="button" onclick="unfreeze_gif('rotator', 'rotation.gif')" />
</body>
</html> 

martes, 24 de abril de 2012

Linux Shell: Uso en disco duro

Este comando de Unix/Linux está genial para listar el espacio usado en disco duro de todas las carpetas del primer nivel donde se ejecuta. En particular me fue útil para averiguar el espacio que estamos usando en una cuenta FTP.

du -hc --max-depth=1