Overfit
← Back to Blog

Devlog 1 - Citas Aesthetic

Published on by Mauro3 min read

Hace poco publiqué mi primer post, una reflexión sobre Her (2013) que quería expresar.
Mi artículo depende de unas citas textuales clave. Por cuestiones de estilo y atribución, quería darles el formato de un libreto.
Sabía que todo es posible con la ayuda de CSS -con la ayuda de CSS todo es posible-, pero no quería tener que esperar a renderear mi texto por completo para darle formato rico. Tampoco quería que la sintaxis de Markdown tan linda que uso en el día a día quedara arruinada con un choclo de etiquetas y clases. Busqué una solución acorde.

Por suerte, los nerds del mundo somos muchos y nos ayudamos. Encontré Fountain, un lenguage de Markup dirigido a escribir documentos con la apriencia de un guion o un libreto. Ahora bien, un problema: sus desarrolladores lo hicieron en algo llamado "Objective-C", lenguaje que desconozco por completo. Al menos egresaron de la etapa de hacer plugins para WordPress, donde parece ser que Fountain pasó sus primeras etapas.
Busqué un poco más y encontré Fountain.js, un proyecto que interpreta Fountain y se basa en JavaScript. El código era un nudo, pero leyendo y releyendo el README entendí que Fountain.js "como viene" acepta y devuelve documentos enteros a través de una interfaz web local. Lo opuesto de lo que yo precisaba, que era una función o como mucho una CLI que no se complicara tanto. Tenía sentido para el uso intencionado de Fountain, que es ayudar a lxs jóvenes cineastas a escribir en el estandar industrial sin tener que ir a alquilar una Underwood. Yo, en cambio, precisaba algo que pudiera generar fragmentos independientes y que fuera fácil correr cada vez que el sitio se auto-reconstruyera a partir de plantillas, reglas, y texto bruto.

Así que hice hice mi propia copia del proyecto -no me miren mal, lleva once años sin tocar- y le metí cuchillo. Agarré la función interna, y terminé pudiendo hacerla correr cuando un "bloque de código" en el post original en Markdown está marcado como Fountain. Esto me dejó con las etiquetas correctas, y hasta las clases de CSS, pero todavía faltaba definir estas clases de CSS para convertir el HTML en fragmentos bien renderizados de Fountain. Bien vibeable, bien modificable. Lo testeé, y funcionó sin errores mayores. El clásico, error en modo oscuro, pero todo arreglable.

Esto en mi versión local, claro. Después de armar el post con esta nueva implementación, publiqué la nueva versión del sitio y abrí el enlace para confirmar que la versión canónica había quedado igual. No fue el caso.
Mi Fountain.js lobotomizado estaba renderizando el texto bien en el ambiente de desarrollo, pero en producción hay como tres pases de Markdown a HTML. Alguno estaba forzando la apariencia por defecto de mi plantilla al sobreescribir las clases que yo estaba declarando para el texto en formato Fountain-esco. Entrando a la configuración de Eleventy, haciendo casi overkill, suplanté todas las instancias de interpretación de markdown por mi conjunto específico de reglas. Espero poder parchearla con una solución más elegante, menos parecida a ponerle a Eleventy un chaleco de fuerza. de fuerza. De momento, mi proveedor de hosting tira un mensaje a la consola cada vez que se encuentra un bloque de Fountain. Logré lo que quería, y gané material para otro post en el proceso.

Fountain es Copyright de Quote-Unquote Apps, y Fountain.js fue escrito por Matt Daly.

Share: LinkedIn Mastodon
Mauro Fitermann

About Mauro Fitermann

I'm a tech enthusiast and tech worker, a lifelong geek, and an aspiring sociologist. All of this makes me think every day about the information systems that nudge our daily lives

Responses

Loading webmentions...