Sobre estas líneas se debería ver (¿funciona?) mi último proyecto: la Cita del Día para Blogger. De hecho, debería poder instalarse en cualquier sitio. Sólo necesita que JQuery esté disponible en la página, aunque sería bastante fácil reescribir el código para eliminar la dependencia. Las citas están publicadas en una hoja de cálculo de Google Spreadsheets.
[¡Peligro! ¡Palabrería informática!] El protocolo implementado por las APIs de GData, como extensión de Atom, permite manipular documentos de todo pelaje alojados en los múltiples servicios de Google. Una pequeña adición, la posibilidad de disponer de los resultados en formato JSON, y más concretamente, como JSON evaluado en un script, permite superar gran parte de las limitaciones de seguridad impuestas por los navegadores sobre Ajax. Es posible así realizar cross-site scripting, incorporando contenidos de documentos disponibles mediante feeds de GData en páginas web, sin disponer de control sobre el servidor.
Necesitamos una hoja de cálculo publicada con dos columnas (citas y autores).
Un pequeño script permitirá extraer el contenido de esta hoja conociendo algunos de sus datos:
- Su clave de publicación (key).
- El identificador único de la página a publicar (una hoja puede tener varias páginas).
- El rango de celdas del que se va a extraer la información.
Esos datos pueden obtenerse a partir de la URL de publicación de feeds que aparece en las “opciones adicionales de publicación” de la pestaña “Publicación” de una hoja de cálculo. Armados con la información apropiada, podemos programar algo interesante:
var CiteSpreadsheet = { 'rows': 159, 'getJsonUrl': function(idx) { var baseSpreadsheet = 'http://spreadsheets.google.com/feeds/'; var feedType = 'cells/'; var key = 'o06661241339204957995.1659223542184495700/'; var sheetId = 'od6/'; var feedAccess = 'public/basic?'; var range = 'range=A' + idx + ":B" + idx; var output = '&alt=json-in-script'; var callback = '&callback=CiteSpreadsheet.processJsonResponse'; return baseSpreadsheet + feedType + key + sheetId + feedAccess + range + output + callback; }, 'createScriptElem': function(url) { var html = '<script type="text/javascript" src="' + url + '"></script>'; $(html).appendTo('body'); }, 'getIndex': function() { var today = new Date(); var startDate = new Date(today.getYear(), 0, 1); var delta = today.getTime() - startDate.getTime(); var dayOfYear = Math.ceil(delta / 86400000); return dayOfYear % CiteSpreadsheet.rows; }, 'processJsonResponse': function(jsonData) { var retrievedContent = "<span>" + jsonData.feed.entry[0].content.$t + " <cite>" + jsonData.feed.entry[1].content.$t + "</cite></span>"; $(".cite").append(retrievedContent); } }; CiteSpreadsheet.createScriptElem( CiteSpreadsheet.getJsonUrl( CiteSpreadsheet.getIndex()));
El objeto del código es insertar, dinámicamente, una marca <script>
en el documento actual, que apunte mediante su atributo src
a una URL específica de consulta válida para la hoja de cálculo deseada, con formato de salida json-in-script
, lo que devuelve un script listo para ejecutar con los datos pedidos en un objeto (en el enlace anterior se describe su estructura; Firefox, Firebug y un punto de ruptura ayudan considerablemente).
El feed obtenido ofrecerá información sobre celdas concretas de la hoja en el rango A
n:B
n, donde n es el número de fila deseado. Como en la hoja hay 159 citas, para dar una diferente cada día calculamos el índice como el número del día actual dentro del año módulo el total de filas.
Por último, para incorporar la cita al DOM de la página, necesitamos un elemento al que anclarlo. Para ello, se incluye en la plantilla de la bitácora, en el lugar donde deba aparecer la cita, un módulo HTML/Javascript con el contenido
<span class="cite"/>
(podría valer un <div>
). En otras plataformas de blogging esto se podrá hacer editando directamente la plantilla o de algún otro modo.