JavaScript - Ayuda, juego parejas JavaScript

 
Vista:
sin imagen de perfil

Ayuda, juego parejas JavaScript

Publicado por Jesuus13ATM (3 intervenciones) el 08/12/2015 18:26:59
Buenas tardes, quiero hacer un juego de memoria en javascript, para ello tengo 8 imagenes mostradas con HTML, y las dibujo con javascript. Tengo 4 imagenes, y quiero que cada imagen salga dos veces con el siguiente codigo, pero no consigo que se me repitan solo 2 veces, se me repiten mas. Aqui esta el codigo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<script languaje="JavaScript">
//Array con todas las imagenes
var Imagenes = ["Numero1.jpg", "Numero2.jpg", "Numero3.jpg", "Numero4.jpg"];
//Array con las imagenes que han salido
var Imagenes_salidas= new Array(8);
var sonido1;
 
function inicio()
{
var i;
var x;
var posicion;
 
	sonido1=document.getElementById('musica');
	//Pongo las cajas a 0
	for (i=1;i<9;i++)
	{
		cajas[i]=0;
	}
	//Recorro las 8 posiciones de las cajas
	for  (x=1;x<=8;x++)
	{
		//Saco un numero aleatorio entre 1 y 4
		imagen=parseInt(Math.random()*4)+1;
 
		//Contador para las imagenes repetidas
		var contador_repetidas=0;
 
		//Recorro el vector de las imagenes que han salido
		for(i=1;i<=Imagenes_salidas.length;i++){
 
			//Si la imagen esta en el vector, aumento el contador de las imagenes repetidas
			if(imagen==Imagenes_salidas[i]){
			contador_repetidas++;
			}
 
			//Si el contador de las repetidas es menor que 2, dibujo la imagen
			if(contador_repetidas<2){
			document.getElementById('IMAGEN'+x).src='Numero'+imagen+'.jpg';
			}
 
		}
	}
}

Que fallo tengo? Muchisimas gracias
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Jordi
Val: 4
Ha aumentado su posición en 10 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda, juego parejas JavaScript

Publicado por Jordi (76 intervenciones) el 08/12/2015 19:58:40
Hola Jesús,

¿Cuándo rellenas Imagenes_salidas? Creo que está vacío y por eso siempre te entra en el último if. Prueba a imprimir la variable contador_repetidas a ver si toma algún valor.

Por otro lado, cuando terminas con la imagen que sea, deberías volver a dejar a cero la variable contador_repetidas para la siguiente iteración.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Jordi
Val: 4
Ha aumentado su posición en 10 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda, juego parejas JavaScript

Publicado por Jordi (76 intervenciones) el 08/12/2015 22:47:34
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
//Array con todas las imagenes
var Imagenes_salidas = ["Numero1.jpg", "Numero2.jpg", "Numero3.jpg", "Numero4.jpg"];
var sonido1;
 
function inicio() {
	sonido1=document.getElementById('musica');
 
	//Pongo las cajas a 0
	for (var i = 0; i < 8; i++) {
		cajas[i] = 0;
	}
 
	// Array de contadores, uno por imagen
	var contadores = [];
	for (var i = 0; i < Imagenes_salidas.length; i++) {
		contadores.push(0);
	}
	// Ahora tenemos var contadores = [0,0,0,0]
 
	for  (var x = 0; x < 8; x++) {
		//Saco un numero aleatorio entre 1 y 4
 
		var masDeDos = true;
		while(masDeDos) {
			// Sólo sale del while cuando tiene un número que no está más de dos veces
			imagen = parseInt(Math.random()*4) + 1;
			if (contador[imagen-1] > 1) {
                                contador[imagen-1]++;
				masDeDos = false;
				document.getElementById('IMAGEN'+imagen).src=Imagenes_salidas[imagen-1];
			}
		}
	}
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Ayuda, juego parejas JavaScript

Publicado por Jesus (3 intervenciones) el 08/12/2015 23:27:06
No me muestra ninguna imagen, le doy al boton pero no me las muestra. EL array contador del ultimo if hay que declararlo, o en vez de contador es contadores?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Jordi
Val: 4
Ha aumentado su posición en 10 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda, juego parejas JavaScript

Publicado por Jordi (76 intervenciones) el 08/12/2015 23:52:46
Es contadores.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Ayuda, juego parejas JavaScript

Publicado por Jesus (3 intervenciones) el 09/12/2015 00:04:13
Sigue sin funcionar... Me estoy volviendo loco Lo tengo de la siguiente manera, pero no me muestra ninguna imagen. Cuando le doy al boton que activa la funcion inicio no me muestra ninguna.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
//Array con todas las imagenes
var Imagenes_salidas = ["Numero1.jpg", "Numero2.jpg", "Numero3.jpg", "Numero4.jpg"];
var sonido1;
 
function inicio() {
	sonido1=document.getElementById('musica');
 
	// Array de contadores, uno por imagen
	var contadores = [];
	for (var i = 0; i < Imagenes_salidas.length; i++) {
		contadores.push(0);
	}
	// Ahora tenemos var contadores = [0,0,0,0]
 
	for  (var x = 1; x <=Imagenes_salidas.length ; x++) {
		//Saco un numero aleatorio entre 1 y 4
		imagen = parseInt(Math.random()*4) + 1;
		var masDeDos = true;
		while(masDeDos) {
			// Sólo sale del while cuando tiene un número que no está más de dos veces
			imagen = parseInt(Math.random()*4) + 1;
			if (contadores[imagen-1] > 1) {
                contadores[imagen-1]++;
				masDeDos = false;
				document.getElementById('IMAGEN'+imagen).src=Imagenes_salidas[imagen-1];
			}
		}
	}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Jordi
Val: 4
Ha aumentado su posición en 10 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda, juego parejas JavaScript

Publicado por Jordi (76 intervenciones) el 09/12/2015 15:51:38
Añade trazas de los getElementById para ver si se te cogen bien los elementos del DOM que interesan.

1
console.log(document.getElementById('IMAGEN'+imagen));
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Vainas
Val: 95
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Ayuda, juego parejas JavaScript

Publicado por Vainas (258 intervenciones) el 09/12/2015 20:50:29
Buenas:

No sabria explicarme muy bien pero esto funciona:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
// Esto solo lo defines para hacer uso de los nombres de las imagenes.
var Imagenes = ["Numero1.jpg", "Numero2.jpg", "Numero3.jpg", "Numero4.jpg"];
 
// Esto es lo que se conoce como la matriz del juego. Internamente es la matriz donde sabes que hay en cada posicion.
var Matrix= new Array(8);
 
function inicio() {
 
	/*La variable contador tiene que ser del mismo tamaño que el numero de imagenes a mostrar ya que va a ir comprobando que esa imagen no se repita n veces. 
	//Ejemplo: de la imagen Numero1 hay 2 y de la Numero2 hay 1 y de las demas 0
	//[2,1,0,0]
	//Esto puede crear un bucle infinito mas abajo si se rellenan todas a 2 y hay mas de 4 imagenes.
	*/
	var contadores = [];
	for(var i = 0; i < Imagenes.length; i++){
		contadores.push(0);
	}
 
	for(var indice = 0; indice < Matrix.length ; indice++){
		var tag_imagen = document.getElementById('imagen'+indice);
		masDeDos = true;
		while(masDeDos){
		//Creamos un numero aleatorio entre 0 y el numero de imagenes que existe
			var aleatorio = parseInt(Math.random() * (Imagenes.length - 1));
		console.log(aleatorio);
		//Si esa imagen no se ha colocado aun mas de 2 veces
		// Aumentamos el contador en esa imagen
		//Le asignamos la ruta a la imagen
		// Como opcion extra metemos la etiqueta en la Matriz de imagenes
			if(contadores[aleatorio] < 2){
				contadores[aleatorio]++;
				tag_imagen.src = "images/"+Imagenes[aleatorio];
				Matrix[indice] = tag_imagen;
				masDeDos = false;
			}
		}
 
	}
};


Esto tiene un problema de que en algunos casos se queda atascado dentro del while hasta que consigue dar con una imagen que no se repita.

Seguro que existe algun mejor solucion.

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar