Cómo funciona:
La frase que aparece es aleatoria, escogida entre un amplio conjunto de frases típicas del juego del mus. (En esta otra página puedes ver la lista de frases usada).
Hay dos tipos de frases:
- La frase del día, que como su nombre indica, se mantiene fija durante todo el día. La frase que sale cambia concretamente a las 13:31 de cada día (hora "mágica" cuyas cifras forman una jugada con duples y además contiene la 31).
- Una frase aleatoria sin más (la frase cambia cada minuto, pero la que aparece en el widget no cambia sola hasta que no se refresque la página).
Si se pulsa con el ratón sobre la frase o el autor, cambiará a otra frase y a la 3ª ó 4ª vez saltará a esta misma página.
El autor de la frase:
A la frase se le añade al final entre paréntesis el autor. Consiste en un nombre aleatorio que tenga las siglas MUS, en tres modalidades posibles:
- Presentar el autor con nombre (con M) y 2 apellidos (con U y S).
- Mostrarlo con solo nombre (M) y un apellido (U) y añadirle al final una localidad (con S) y un año, que también es simulado y tiene la característica de que sus cifras componen buenas jugadas de mus (medias o duples).
- Sacar solo la frase, sin autor.
(En esta otra página puedes ver la lista de nombres y lugares usados).
Los tipos de letra y colores de la frase y del autor pueden configurarse a gusto de cada uno mediante CSS.
En la barra derecha se muestran algunas de las opciones mencionadas.
En principio sólo se puede usar un único widget de este tipo en cada página porque si se pone más de uno se interferirán al usar las mismas variables y normalmente saldrá solo uno de ellos. Si fuera imprescindible poner más de uno (como por ejemplo se ha hecho en esta página) habría que editar el código de cada widget para ponerle nombres de funciones y variables diferentes.
Cómo poner este widget en tu página o blog:
Copia tal cual el texto de aquí debajo y añádelo en un widget de tipo HTML de tu blog.
<style type="text/css">
#fraseMus {} /* comunes */
.frase {font-size: 150%; font-weight: bold; font-style: italic;}
.autor {font-size: 120%;}
</style>
<div id="fraseMus" onclick="mostrarFrase()"></div>
<script type="text/javascript">
fraseInicial = 0; // 0 frase del dia, 1 frase aleatoria (cada minuto)
tipoAutor = 0.5; // <0: sin autor; 0: 2 apellidos; 1: lugar/año
// entre 0 y 1 (con punto decimal): % aleatorio entre 2 apellidos y lugar/año
frases = new Array();
totalFrases = 0;
function leerFrases(json) {
totalFrases = json.feed.entry.length;
for(i=0; i<totalFrases; i++) {
frases[i] = [];
frases[i][0] = json.feed.entry[i].gsx$frase.$t;
frases[i][1] = json.feed.entry[i].gsx$autor.$t;
frases[i][2] = json.feed.entry[i].gsx$lugar.$t;
}
if (fraseInicial!=0) fraseInicial=1;
}
function mostrarFrase() {
var salida = "<span class='frase'>" + frases[fraseInicial][0] + " </span>";
if (isNaN(tipoAutor)) tipoAutor=-1;
if (tipoAutor>=0) { // cambia formato según tipoAutor
numAutor = (tipoAutor<Math.random())? 1:2;
salida += "<span class='autor'>" + frases[fraseInicial][numAutor] + "</span>";
}
var divFrase = document.getElementById('fraseMus');
divFrase.innerHTML = salida;
fraseInicial++;
if (fraseInicial>=totalFrases) divFrase.onclick=paginaFrases;
}
function paginaFrases() {window.location.href="http://frasesdemus.blogspot.com";}
</script>
<script src="https://spreadsheets.google.com/feeds/list/1cCkR7nCB2unqN58r6MyQ1X3J0w8S42iFWRoF9A6iBG8/od6/public/values?alt=json-in-script&callback=leerFrases" type="text/javascript">
</script>
<script type="text/javascript">mostrarFrase();</script>
#fraseMus {} /* comunes */
.frase {font-size: 150%; font-weight: bold; font-style: italic;}
.autor {font-size: 120%;}
</style>
<div id="fraseMus" onclick="mostrarFrase()"></div>
<script type="text/javascript">
fraseInicial = 0; // 0 frase del dia, 1 frase aleatoria (cada minuto)
tipoAutor = 0.5; // <0: sin autor; 0: 2 apellidos; 1: lugar/año
// entre 0 y 1 (con punto decimal): % aleatorio entre 2 apellidos y lugar/año
frases = new Array();
totalFrases = 0;
function leerFrases(json) {
totalFrases = json.feed.entry.length;
for(i=0; i<totalFrases; i++) {
frases[i] = [];
frases[i][0] = json.feed.entry[i].gsx$frase.$t;
frases[i][1] = json.feed.entry[i].gsx$autor.$t;
frases[i][2] = json.feed.entry[i].gsx$lugar.$t;
}
if (fraseInicial!=0) fraseInicial=1;
}
function mostrarFrase() {
var salida = "<span class='frase'>" + frases[fraseInicial][0] + " </span>";
if (isNaN(tipoAutor)) tipoAutor=-1;
if (tipoAutor>=0) { // cambia formato según tipoAutor
numAutor = (tipoAutor<Math.random())? 1:2;
salida += "<span class='autor'>" + frases[fraseInicial][numAutor] + "</span>";
}
var divFrase = document.getElementById('fraseMus');
divFrase.innerHTML = salida;
fraseInicial++;
if (fraseInicial>=totalFrases) divFrase.onclick=paginaFrases;
}
function paginaFrases() {window.location.href="http://frasesdemus.blogspot.com";}
</script>
<script src="https://spreadsheets.google.com/feeds/list/1cCkR7nCB2unqN58r6MyQ1X3J0w8S42iFWRoF9A6iBG8/od6/public/values?alt=json-in-script&callback=leerFrases" type="text/javascript">
</script>
<script type="text/javascript">mostrarFrase();</script>
Si quieres conocer con más detalle lo que hace cada parte del código, está explicado en esta otra página.
Cómo configurar las opciones en el widget ya instalado:
Por defecto el código anterior va configurado para que saque la frase del día con autor (cambiando al 50% de veces entre nombre y 2 apellidos ó nombre, lugar y año).
En el código tan sólo hay que retocar el valor de 2 variables: fraseInicial y tipoAutor:
- para que saque frase aleatoria en lugar de la frase del día pon fraseInicial = 1.
- para que no saque autor (solo la frase), pon tipoAutor = -1.
- para que saque el autor siempre con 2 apellidos (sin año y lugar), pon tipoAutor = 0.
- para que saque el autor siempre con lugar y año, pon tipoAutor = 1.
- para que saque el autor con otra proporción de casos entre 2 apellidos ó lugar, pon tipoAutor = 0.x (un número entre 0 y 1 ¡decimal con punto, no con coma!. Más cerca de 0, más veces con 2 apellidos).
Si lo que quieres es cambiar el aspecto o tipo de letra de cada parte (frase ó autor), debes ir a la parte CSS (la que hay al principio del código entre etiquetas style) y poner allí el código CSS que quieras.
Por defecto ambos están con el tipo de letra que tenga el blog (la zona en que se ubique el widget) y tan sólo se le aumenta un poco el tamaño de letra y la frase se pone en negrita y cursiva.
Para cambiarlo hay que saber un poco de CSS, pero no es complicado. Lo que modificará a la frase es lo que haya entre las llaves ({ }) que hay tras la indicación .frase mientras que lo que afecta al autor va entre las llaves tras .autor
Si se quiere cambiar algo en ambas partes se puede hacer usando la parte entre las llaves tras #fraseMus
Dentro de cada una de estas llaves van una serie de posibles modificadores separados por ; y en cada uno de ellos está el nombre y su valor, separados por :
Por ejemplo, para que el autor vaya en otra línea separada, la fila de .autor debe quedar:
.autor {display: block; font-size: 120%}
Por supuesto que trabajando un poco más el CSS se puede hacer cualquier tipo de formato que se desee, con sombras, degradados, animaciones, etc. pero eso lo dejamos ya a la imaginación de cada uno.
