Google Docs como base de datos. Citas tecnológicas al azar – Virtual – programmers

Como seguro que para algunos me enrollé de más en las anteriores entradas y lo que queréis es menos explicación y más acción, en esta veremos el código completo del ejemplo de frases tecno-informáticas aleatorias que construimos anteriormente. Prácticamente para sólo copiar y pegar.

De todas formas, esto sólo os permitirá ver resultados de mi lista y sacar los datos cómo propuse. Si queréis hacer la vuestra o sacar los datos de otra forma, no os va a quedar más remedio que leer el tutorial completo siguiendo los enlaces que podéis encontrar al final.

Vamos a tomar primero la opción más fácil que es la de incluir el código como gadget HTML/JavaScript. Como anuncié, aquí va el código que vimos en las otras entradas pero todo seguidito, así que sólo tenéis que añadir un gadget nuevo y pegar esto.

style type="text/css"
.frase { display:block; border: 1px solid #666666; background: white; padding: 10px; color: #333333; font-family: Courier, "Courier New", monospace; }
.autor { color: #90000; font-weight: bold; }
.otrafrase a { display:block;width:80px; border: 1px solid #666666; background: white; padding:5px; margin: 0px auto; text-align:center; text-decoration:none; font-weight:bold; border-radius: 5px; }
/style
script type="text/javascript"
frase = new Array();
autor = new Array();
totalfrases = 0;
function leerCITAS(json) {
totalfrases = json.feed.entry.length;
for(i=0; itotalfrases; i++) {
frase[i] = json.feed.entry[i].gsx$citas.$t;
autor[i] = json.feed.entry[i].gsx$autores.$t;
}
}
function mostrarCITAS(donde) {
var salida = "";
var max = totalfrases-1;
var alea = Math.round(Math.random()*max);
var cual = alea;
salida += "span class='frase'";
salida += frase[cual];
salida += " ";
salida += "span class='autor'"+autor[cual]+"/span";
salida += "/span'";
document.getElementById(donde).innerHTML = salida;
}
/script

script src="http://spreadsheets.google.com/feeds/list/0AtzEI6cl1Hv6dG9wMHpqcVdqbzJhZjlWQ1VScXFVSmc/od6/public/values?alt=json-in-script&callback=leerCITAS" type="text/javascript"
/script
div id="frasesaleatorias"/div
script type="text/javascript"mostrarCITAS('frasesaleatorias');/script
p class="otrafrase"
a href="javascript:mostrarCITAS('frasesaleatorias');"Ver otra frase/a
/p

Cambiando la primera parte (estilo) podéis personalizar el formato de salida. Aquí tenéis ese mismo código en unfichero .txt

Como gadget podréis ponerlo en la barra lateral, en la cabecera, encima de las entradas, bajo estas, en el footer... Pero si queréis meterlo en el cuerpo de las entradas esto ya requiere hacerlo por partes.

Para este caso mejor grabamos la parte de estilo y el script hasta el salto de línea en la plantilla, antes de/head, sustituyendo previamente (para Blogger) todas las comillas dobles por simples y viceversa. Luego, la segunda parte tras el salto se inserta en la parte de la entrada que gusteis (también intercambiando las comillas).

Pero para las entradas, mejor todavía podemos incluir el estilo en la parte CSS (ya sin la apertura y cierreSTYLE), alojar el script en otro sitio, añadir delane una llamada a ese alojamiento externo e incluir todo dónde queramos mostrar las citas. Yo lo he alojado en Dropbox y he cambiado las comillas, así que a falta de que le deis estilo, esto sería lo único que habría que insertar:

script src='http://dl.dropbox.com/u/57549161/scripts/citas-aleatorias.js' type='text/javascript'/
script src='http://spreadsheets.google.com/feeds/list/0AtzEI6cl1Hv6dG9wMHpqcVdqbzJhZjlWQ1VScXFVSmc/od6/public/values?alt=json-in-script&callback=leerCITAS' type='text/javascript'
/script
div id='frasesaleatorias'/
script type='text/javascript'mostrarCITAS("frasesaleatorias");/script
p class='otrafrase'
a href='javascript:mostrarCITAS("frasesaleatorias");'Ver otra frase/a
/p

Y si esto anterior todavía no os parece suficientemente fácil, pues pulsáis este botón, aceptais la instalación y luego sólo os resta cambiarlo de sitio desdeDiseño arrastrando y soltando dónde queráis dejarlo.

Pero en fin, si habéis aprovechado laclase, vosotros mismos podréis hacer otras cosas. Aquí tengo otro ejemplo muy parecido en el cual a partir de una hoja con cuatro columnas, aleatoriamente se escoge una frase de cada columna para formar bonitas frases demagógicas. Un artilugio que sin duda haría las delicias de cualquier aspirante a político.

Generar otra frase demagógica

Esta es lahoja de cálculo correspondiente y lo siguiente el código por si a alguien le interesa:

script type="text/javascript" src="http://dl.dropbox.com/u/57549161/scripts/frases-demagogia.js"/scriptscript type="text/javascript" src="http://spreadsheets.google.com/feeds/list/0AtzEI6cl1Hv6dG8zbmtSY2MwdV85emRVcW9QN1hBRWc/od6/public/values?alt=json-in-script&callback=leerFRASES"/scriptblockquote id="demagogia" style="text-align:justify;"/blockquotescript type="text/javascript"mostrarFRASES('demagogia');/scripta href="javascript:mostrarFRASES('demagogia')"Generar otra frase demagógica/a

Parece una tontería, que lo es, pero con esas catorce filas y cuatro columnas, se pueden generar más de 38.000 frases distintas.

Tutorial completo:

Google Docs como base de datos. Preparar hoja de cálculo
Google Docs como base de datos. Leer y mostrar con JavaScript
Google Docs como base de datos. Frases tecnológicas aleatorias

CosasParaMiBlogs

martes, 17 de abril de 2012

Google Docs como base de datos. Citas tecnológicas al azar – Virtual – programmers – Auto

Popular Posts

Blogger news

Labels

Blog Archive