CheckColor Juego: Color Letra

Ya que hace poco comentamos la opción de cambiar los colores de las celdas de una tabla, hoy os presento el Ejemlo: Checkcolor, que nos permitirá cambiar los colores de los textos.

El proyecto consiste en asociar colores a los Nombres de los colores, es decir la palabra amarillo con el fondo rojo, y tenéis que 'clicar' que el color de fondo es rojo no amarillo.
Si se tarda más de 3 segundos en contestar entonces queda marcado como 'llegáis tarde'.

El juego transcurre durante 60 segundos en los cuales van apareciendo textos-colores de forma aleatoria (pueden coincidir color y texto).

Checkcolor nos permite seleccionar el idioma de los textos de los colores a elegir entre:

* Español
* Català
* English
* Français

También podéis seleccionar el nivel de dificultad:

* Fácil
* Difícil (el texto sólo aparece 2 centésimas de segundo

El juego está desarrollado con Javascript y Css, aprovechando la clase Math.random() para generar aleatoriamente números, que serán los que determinen el color a usar.

Se disponen de dos matrices que contienen los datos :colores y nombres; en el caso de los Nombres, una matriz por cada Idioma.

var aColor= new Array("#000000","#ff0000","#00ff00","#0000ff","#FF9933","#ffff00","#ff00ff","#CCCCCC");
//Nombres de los colores según idioma
var aNameColorEs= new Array("NEGRO","ROJO","VERDE","AZUL","NARANJA","AMARILLO","ROSA","GRIS");//español
var aNameColorCa= new Array("NEGRE","VERMELL","VERD","BLAU","TARONJA","GROC","ROSA","GRIS");//catala
var aNameColorEn= new Array("BLACK","RED","GREEN","BLUE","ORANGE","YELLOW","PINK","GRAY");//English
var aNameColorFr= new Array("NOIR","ROUGE","VERT","BLEU","ORANGE","JAUNE","ROSE","GRIS");//français

Aprovechando la clase Math.random() para generar aleatoriamente números, elegiremos las posiciones de ambas matrices de forma aleatoria.

var idColor=Math.round(Math.random()*(7));//elegimos numero de la posicion del color de forma aleatoria
var idTextoAleatorio=Math.round(Math.random()*(7));//elegimos numero de la posicion del texto de forma aleatoria
var sColor=aColor[idColor];//recogemos el color
var sNameColor=eval("aNameColor"+sIdioma+"["+idTextoAleatorio+"]");//recogemos el texto
var sPalabra=""+sNameColor+"" ;//lo establecemos en un enlace

Se realiza una cuenta atrás usando las funciones de setTimeout

function CountDown()
{
//Vamos realizando la cuenta atras
if(TimeUp>0)
{
TimeUp--;
TimeUpRespuesta--;//restamos al tiempo de respuesta.
document.getElementById("dvSegundos").innerHTML=TimeUp+" Segundos";//mostramos el texto con los segundos que quedan
timeOut=window.setTimeout("CountDown()",1000);//cada segundo realizamos esta accion
}
else
EvaluarJuego();//finaliza el juego

}

Estos Mini-proyectos o Juegos, no tienen digamos... una presentación espectacular, algo que se puede dejar para un futuro post sobre css y/o aprovechar la buena aportación de algún Pixelover ;)

Como planteamientos hay muchos: Guardar Puntuaciones, sacar estadísticas, Rankings, el mejor en menos tiempo,etc...

Checkcolor 1.0
http://ejemplos.develovers.net/3/colores.htm

¿Cuantas has fallado?