Problemas con backface-visibility en Chrome

La otra vez al visitar el sitio de MagmaConf, la parte donde se muestran a los speakers no se estaba mostrando correctamente.

Ya le había pasado a otros compañeros, y al parecer tenía algo que ver con Chrome; lo comprobé al abrir la página en Firefox y ver como en esta todo se mostraba perfectamente.

Me dio curiosidad por saber que era exactamente lo que desencadenaba este comportamiento. Así que con las herramientas de desarrollo de Chrome comencé a alterar los valores para ver si podía producir el diseño correcto. Con sólo encontrar la clase que contiene el comportamiento de flip y los valores establecidos antes de que ocurra el cambio pude notar una propiedad que al parecer no estaba haciendo su trabajo.

La propiedad backface-visibility con el atributo hidden no funciona con Webkit, así que no se estaba ocultando esa parte del elemento antes de hacer el efecto de flip.

Por lo que con solo agregar los atributos que establecieran los valores que backface-visibility no establece en navegadores con webkit bastaría.

... .globes .back {
    ...
    opacity: 0;
    all 0.4s ease-in-out, opacity 0;
    ...
}

... .globes .front{
    ...
    opacity: 1;
    all 0.4s ease-in-out, opacity 0;
    ...
}

Así como modificar los atributos después de hacer el flip

... .globes .back .flip{
    ...
    opacity: 1;
    ...
}

... .globes .front .flip{
    ...
    opacity: 0;
    ...
}

Con esto se pudo lograr el efecto deseado.

Por cierto MagmaConf (anteriormente MagmaRails) es un evento que dura 3 días en los que se realizan sesiones para compartir técnicas, herramientas y experiencias sobre tecnologías web. Dense una vuelta por el sitio, este año habrá varias sorpresas y como siempre grandes personalidades e interesantes pláticas. No falten.

Archivos y directorios en Ruby

Hace unos días, mientras platicaba y me ponía al día con un amigo de la universidad, me asalto con un reto. Me decía que quería hacer un script para renombrar varios archivos repartidos en varias carpetas y renombrar cada uno de los archivos con el nombre de la carpeta que lo contenía; en ese momento estaba reinstalando mi ambiente de desarrollo en la computadora, dentro del cual se encuentra Ruby. Así que le dije que en cuanto terminara de instalar todo, me pondría a ello.

No había tenido contacto con la API de archivos y directorios de Ruby, pero supuse que no sería complicado así que busqué en la documentación y en cuestión de minutos ya tenía el script, que en sí no es nada elaborado pero cumple con lo que se propone, obviamente se puede mejorar; lo que me gustaría resaltar es la facilidad con la que podemos hacer las cosas en Ruby. Incluso cuando le mostré el script a mi amigo y aunque el no había hecho nada en este lenguaje lo entendió perfectamente (o eso creo) y pudo usarlo felizmente en su equipo con Windows. En fin, Ruby no deja de sorprenderme.

Aquí el script:

#!/usr/bin/ruby

def directories
 directories = Dir.entries(Dir.pwd)
 directories.delete(".", "..")
 directories
end

Dir.chdir("dir")

puts directories.join(" ")
directories.sort.each do |directory|

  Dir.chdir(directory)
  File.rename(directories.first, directory << ".txt")
  Dir.chdir("../")
end

puts Dir.pwd

Como dije le falta trabajo, como por ejemplo hacerlo interactivo para que puedas navegar al directorio necesario, o poder escoger las extensiones del archivo así como agregar las correspondientes validaciones.

Ruby Doc: Dir
Ruby Doc: File