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

Imágen de perfil
Val: 2.985
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

Publicado el 1 de Noviembre del 2016 por Xve (291 códigos)
9.724 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
9.732 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...
CerrarCerrar
CerrarCerrar
Cerrar

Tienes que ser un usuario registrado para poder insertar imágenes, archivos y/o videos.

Puedes registrarte o validarte desde aquí.

Codigo
Negrita
Subrayado
Tachado
Cursiva
Insertar enlace
Imagen externa
Emoticon
Tabular
Centrar
Titulo
Linea
Disminuir
Aumentar
Vista preliminar
sonreir
dientes
lengua
guiño
enfadado
confundido
llorar
avergonzado
sorprendido
triste
sol
estrella
jarra
camara
taza de cafe
email
beso
bombilla
amor
mal
bien
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s3730