Mi App Android en el Play Store: Alolan Pokédex

Recientemente he desarrollado y publicado una app muy sencilla, pero práctica para los jugadores de la más reciente entrega de Pokémon:  Sun y Moon. Se trata de una aplicación de referencia, que lista los diferentes Pokemon capturables en ambos juegos, junto con su respectivo Código QR.

Funcionalidad QR en Sun/Moon

El escanear un Código QR con la Cámara del Nintendo 3DS, permite obtener el registro del Pokemon respectivo, sin necesidad de capturarlo. Esto, entre otras cosas permite que se vea la ubicación exacta donde podemos encontrar a esa determinada especie en su forma salvaje, para poder capturar uno propio.

La idea de la aplicación surgió mientras hacia uso de esta misma característica, pero consultando desde el álbum del sitio web ImGur, donde se publicaron originalmente estos códigos. El proceso de buscar el QR deseado usando este sitio, se me apetecía tediosa y complicada: No existe manera de cargar todas las imágenes a la vez en la ventana del navegador, por lo que una búsqueda con CTRL+F no siempre arrojaba el resultado esperado.

El álbum en Imgur

Fué entonces cuando se me ocurrió descargarlas todas. Pero había un problema: Son mas de 400 imágenes y el nombre del archivo es un texto aleatorio que no sirve para identificar al Pokemon. Y el proceso de guardar manualmente 400 imágenes de internet una a una simplemente no era una opción.

Guardar uno por uno? No gracias!

Como todo buen programador, sabía que debía haber una mejor manera de hacer esta tarea, sólo hacía falta encontrar la herramienta. Fue entonces cuando pude darme cuenta de algo muy importante: El atributo ALT (descripción alternativa) de cada una de las imágenes contiene el número, seguido del nombre de cada Pokemon.  Fue entonces que lo tuve claro. Solo necesitaba una herramienta que permitiese descargar todas las imágenes de un sitio web, usando su atributo ALT como nombre de imagen.

Como se puede ver, el SRC de la imagen es un texto al azar. Pero el ALT es justo lo que necesito!

Luego de buscar en la web, me di cuenta que muchas otras personas han tenido esta necesidad en el pasado, pero sin embargo no existe en el mercado una herramienta que lo haga. Debía hacer mi propia herramienta…

Fué en este momento que encontré una extensión del navegador Google Chrome que permite descargar todas las imágenes de una página web. Y lo mejor: Es de código abierto!. Mi misión era sencilla: Modificar la extensión para que al descargar, en vez del nombre original del archivo, use el nombre del atributo ALT de la imagen en cuestión.

«Image Downloader» en la Chrome Web Store

Asi que aquí estaba, con el código fuente del proyecto original , ahora bifurcado a mi repositorio local. Tuve que aprender cómo se desarrolla una extensión para navegador: El acceso al DOM, el uso de la configuración, el manejo de las acciones, la interacción entre módulos y la instalación local en modo desarrollador, entre otros aspectos muy técnicos.

Al final, solo necesité crear un arreglo con el texto ALT de cada imagen al cual el API tiene acceso, para luego pasarlo a la función que genera las descargas automáticas, como parámetro ‘filename'.

La función que captura el atributo ALT en todas las imágenes.

Para quienes están interesados en ver todos los cambios requeridos, o descargar mi versión de esta extensión. (Que he llamado ALT Image Downloader), el código esta en mi GitHub, desde donde también se pueden ver las diferencias con la rama original.

Una vez que tuve las imágenes descargadas justo como las necesitaba, solo bastó editarlas, generar un listado, crear una base de datos, construir un API, subir todos los recursos al hosting y por supuesto: Desarrollar y publicar el App Android!. Sin embargo, esos detalles los comentaré en la entrega número dos de ésta entrada.

Captura del App: Alolan Pokedex

«Gotta catchem alljust not by hand».