Código de JavaScript - Crear y mezclar una baraja de cartas

Imágen de perfil
Val: 2.206
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear y mezclar una baraja de cartasgráfica de visualizaciones


JavaScript

estrellaestrellaestrellaestrellaestrella(3)
Publicado el 1 de Noviembre del 2016 por xve
7.205 visualizaciones desde el 1 de Noviembre del 2016
Este código muestra como crear y mezclar una baraja de cartas.

baraja-de-cartas

Versión 1.0
estrellaestrellaestrellaestrellaestrella(3)

Publicado el 1 de Noviembre del 2016gráfica de visualizaciones de la versión: Versión 1.0
7.206 visualizaciones desde el 1 de Noviembre del 2016
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style>
	#listado .fila {
		width:580px;
		margin-bottom:5px;
	}
	#listado .fila>div {
		width:90px;
		height:130px;
		border:1px solid #808080;
		border-radius:5px;
		margin-left:-50px;
		background:white;
		display:inline-block;
		padding:5px;
	}
	#listado .fila>div>span {
		font-size:12px;
	}
	#listado .fila>div:first-child {
		margin-left:0px;
	}
	</style>
</head>
 
<body>
 
<div id="listado"></div>
 
<script>
// cartas contendra las cartas con el formato NumeroPalo
// 10o -> 10 de oros
// 3c  -> 3 de copas
var cartas=new Array();
// palos es un array clave:valor que contiene los palos
var palos={"b":"bastos", "e":"espadas", "o":"oros", "c":"copas"}
 
// generamos la baraja de los 4 palos, y 10 cartas en cada palo
// guardamos en el array cartas el numero y palo (10o, 3c, ...)
Object.keys(palos).forEach(function(value) {
	for(var i=1;i<=10;i++)
	{
		cartas.push(i+value);
	}
});
 
// mezclamos las cartas moviendo cada una de ellas a una posición aleatoria
for (i=0;i<40;i++)
{
	posicion1=parseInt(Math.random()*40);
	tmp=cartas[i];
	cartas[i]=cartas[posicion1];
	cartas[posicion1]=tmp;
}
 
// mostramos las cartas
var listado=document.getElementById("listado");
carta="<div class='fila'>";
i=0;
cartas.forEach(function(value){
	if(i++==10)
	{
		carta=carta+"</div><div class='fila'>";
		i=1;
	}
	carta=carta+"<div>";
		carta=carta+value.substring(0,value.length-1)+"<br>";
		carta=carta+"<span>"+palos[value.substring(value.length-1,value.length)]+"</span>";
	carta=carta+"</div>";
});
listado.innerHTML=listado.innerHTML+carta+"</div>";
</script>
 
</body>
</html>



Comentarios sobre la versión: Versión 1.0 (3)

Imágen de perfil
2 de Noviembre del 2016
estrellaestrellaestrellaestrellaestrella
Muy bueno Xve! Me gustaria que tuviera en lugar de las palabras los simbolos, pero es cuestion de estilo nada mas, el funcionamiento una pasada!
Responder
Imágen de perfil
2 de Noviembre del 2016
estrellaestrellaestrellaestrellaestrella
Ya sabes lo que opino de estos códigos... Gracias por compartirlos.
Responder
Manuel
9 de Junio del 2018
estrellaestrellaestrellaestrellaestrella
Excelente.
como Se podria destinguir entre al derechas o al reves???
Gracias de ante mano
Responder

Comentar la versión: Versión 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s3730