Skip to content

J
js-e005
Commit 3b6754ba by roshka
Options

Dama 1.0

parents
Showing with 228 additions and 0 deletions
README.md 0 → 100644
## Indicaciones
Las fichas son cuadros coloreados, que, si está coloreado de color rojo, equivale a las fichas rojas,
e igual ocurre con las fichas azules.
En los campos de abajo se colocan los nombres de los jugadores con sus respectivas fichas.
Una vez presionado el botón 'Jugar', comienza el juego. El juego no comienza sin que se cumpla con los requisitos anteriores, sinó, lanzará un alert() pidiendo el requisito necesario.
El botón será reemplazado por un mensaje que dirá el nombre del jugador actual en todo el juego. Los campos y selectores estarán bloqueados.
Siempre comienza primero el rojo.
Cuando se selecciona una ficha o casillero, aparecerá el signo '*' sobre el mismo, y despues de eso, hay que marcar donde se quiere que la ficha
se coloque.
En caso que se marcó una casilla vacia y luego se marca el destino como si hubiera una ficha, lanzara un alert() para avisarte que
su jugada es invalida, y eliminará la selección de la casilla. Se tiene que hacer lo segundo para eliminar la jugada erronea.
Si un jugador intenta comer a su propia ficha, el jugador será avisado por un alert() que está realizando dicho movimiento, se desmarca la ficha seleccionada
y espera que el mismo jugador realice una jugada valida.
En caso que el jugador quiera desplazar como si fuera una 'TORRE', solamente desmarcara la selección. Esto tambien sucede si realiza un saldo con mas de 2 casillas vacias.
En caso que el jugador quiera hacer un salto con 2 casilleros vacios, el jugador recibira un alert(), y esperará que el mismo jugador vuelva a realizar una jugada valida.
Si el jugador tiene la posibilidad de comer mas de una ficha, se lanzará un alert() al jugador actual que tiene la posibilidad de comer otra ficha, o puede omitir la comida, y realiza otro movimiento. El jugador deja de seguir jugando una vez que no tenga mas posibilidades de seguir comiendo.
En caso que una ficha se haga "Dama", en la casilla estará escrito la letra 'D'.
La diferencia entre una ficha normal y la dama es que la reina puede comer en todas las diagonales con todas las direcciones posibles.
Una vez que se un jugador logró comer todas la fichas del oponente, la frase donde decía el nombre del jugador actual cambiará al nombre del jugador.
Si se presiona de nuevo el casillero, aparecerá un mensaje que preguntará si desea jugar de nuevo o finalizar el juego. Las respuestas son 'Si' o 'No'.
Si es 'Si' se crea otro juego, y en caso contrario, lanza un alert() diciendo "Fin del juego'
\ No newline at end of file
dama.css 0 → 100644
.columna{
border: 1px black solid;
width: 50px;
height: 50px;
text-align: center;
background: white;
font-size:30px;
}
body{
background:skyblue;
}
#seccion1{
position: absolute;
left: 510px;
height: 400px;
width: 500px;
}
#seccion11{
margin: 20px;
padding: 0px;
background: white;
}
#tituloJuego{
text-align: center;
font-size: 50px;
margin: 0px;
padding: 0px;
}
.selectores{
font-size: 20px;
}
#resultado{
font-size: 25px;
}
#btnBoton{
margin:10px;
font-size: 35px;
text-align: center;
}
#formulario1{
display: inline-block;
text-align: center;
padding-left:10px;
padding-right:10px;
}
.campos{
width: 100px;
font-size: 15px
}
#tituloConf{
font-size: 20px;
}
.tabla{
position: relative;
left: 25px;
}
\ No newline at end of file
dama.html 0 → 100644
<!DOCTYPE html>
<html lang="es">
<head>
<title>Dama en JS</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="dama.css" rel="stylesheet">
</head>
<body>
<section id="seccion1">
<p id="tituloJuego">Damas en HTML</p>
<table class="tabla">
<tr class="fila">
<td id="00" class="columna" onclick="presionCasilla('00')"></td>
<td id="01" class="columna" onclick="presionCasilla('01')"></td>
<td id="02" class="columna" onclick="presionCasilla('02')"></td>
<td id="03" class="columna" onclick="presionCasilla('03')"></td>
<td id="04" class="columna" onclick="presionCasilla('04')"></td>
<td id="05" class="columna" onclick="presionCasilla('05')"></td>
<td id="06" class="columna" onclick="presionCasilla('06')"></td>
<td id="07" class="columna" onclick="presionCasilla('07')"></td>
</tr>
<tr class="fila">
<td id="10" class="columna" onclick="presionCasilla('10')"></td>
<td id="11" class="columna" onclick="presionCasilla('11')"></td>
<td id="12" class="columna" onclick="presionCasilla('12')"></td>
<td id="13" class="columna" onclick="presionCasilla('13')"></td>
<td id="14" class="columna" onclick="presionCasilla('14')"></td>
<td id="15" class="columna" onclick="presionCasilla('15')"></td>
<td id="16" class="columna" onclick="presionCasilla('16')"></td>
<td id="17" class="columna" onclick="presionCasilla('17')"></td>
</tr>
<tr class="fila">
<td id="20" class="columna" onclick="presionCasilla('20')"></td>
<td id="21" class="columna" onclick="presionCasilla('21')"></td>
<td id="22" class="columna" onclick="presionCasilla('22')"></td>
<td id="23" class="columna" onclick="presionCasilla('23')"></td>
<td id="24" class="columna" onclick="presionCasilla('24')"></td>
<td id="25" class="columna" onclick="presionCasilla('25')"></td>
<td id="26" class="columna" onclick="presionCasilla('26')"></td>
<td id="27" class="columna" onclick="presionCasilla('27')"></td>
</tr>
<tr class="fila">
<td id="30" class="columna" onclick="presionCasilla('30')"></td>
<td id="31" class="columna" onclick="presionCasilla('31')"></td>
<td id="32" class="columna" onclick="presionCasilla('32')"></td>
<td id="33" class="columna" onclick="presionCasilla('33')"></td>
<td id="34" class="columna" onclick="presionCasilla('34')"></td>
<td id="35" class="columna" onclick="presionCasilla('35')"></td>
<td id="36" class="columna" onclick="presionCasilla('36')"></td>
<td id="37" class="columna" onclick="presionCasilla('37')"></td>
</tr>
<tr class="fila">
<td id="40" class="columna" onclick="presionCasilla('40')"></td>
<td id="41" class="columna" onclick="presionCasilla('41')"></td>
<td id="42" class="columna" onclick="presionCasilla('42')"></td>
<td id="43" class="columna" onclick="presionCasilla('43')"></td>
<td id="44" class="columna" onclick="presionCasilla('44')"></td>
<td id="45" class="columna" onclick="presionCasilla('45')"></td>
<td id="46" class="columna" onclick="presionCasilla('46')"></td>
<td id="47" class="columna" onclick="presionCasilla('47')"></td>
</tr>
<tr class="fila">
<td id="50" class="columna" onclick="presionCasilla('50')"></td>
<td id="51" class="columna" onclick="presionCasilla('51')"></td>
<td id="52" class="columna" onclick="presionCasilla('52')"></td>
<td id="53" class="columna" onclick="presionCasilla('53')"></td>
<td id="54" class="columna" onclick="presionCasilla('54')"></td>
<td id="55" class="columna" onclick="presionCasilla('55')"></td>
<td id="56" class="columna" onclick="presionCasilla('56')"></td>
<td id="57" class="columna" onclick="presionCasilla('57')"></td>
</tr>
<tr class="fila">
<td id="60" class="columna" onclick="presionCasilla('60')"></td>
<td id="61" class="columna" onclick="presionCasilla('61')"></td>
<td id="62" class="columna" onclick="presionCasilla('62')"></td>
<td id="63" class="columna" onclick="presionCasilla('63')"></td>
<td id="64" class="columna" onclick="presionCasilla('64')"></td>
<td id="65" class="columna" onclick="presionCasilla('65')"></td>
<td id="66" class="columna" onclick="presionCasilla('66')"></td>
<td id="67" class="columna" onclick="presionCasilla('67')"></td>
</tr>
<tr class="fila">
<td id="70" class="columna" onclick="presionCasilla('70')"></td>
<td id="71" class="columna" onclick="presionCasilla('71')"></td>
<td id="72" class="columna" onclick="presionCasilla('72')"></td>
<td id="73" class="columna" onclick="presionCasilla('73')"></td>
<td id="74" class="columna" onclick="presionCasilla('74')"></td>
<td id="75" class="columna" onclick="presionCasilla('75')"></td>
<td id="76" class="columna" onclick="presionCasilla('76')"></td>
<td id="77" class="columna" onclick="presionCasilla('77')"></td>
</tr>
</table>
<section id="seccion11">
<form id="formulario1">
<p id="tituloConf">Ingrese el nombre de los jugadores, y el color de ficha</p>
<input type="text" name="camp1" id="camp1" class="campos" value="" autofocus> =
<select class="selectores" id="selector1">
<option value="colFichaRoj1">Rojo</option>
<option value="colFichaAzu1">Azul</option>
</select>
<input type="text" name="camp2" id="camp2" class="campos" value=""> =
<select class="selectores" id="selector2">
<option value="colFichaRoj2">Rojo</option>
<option value="colFichaAzu2">Azul</option>
</select>
<input type="button" value="Jugar" id="btnBoton" onclick="iniciarJuego('')">
<p id="resultado"></p>
</form>
</section>
</section>
</body>
<script src="dama.js"></script>
</html>
\ No newline at end of file
dama.js 0 → 100644
This diff is collapsed. Click to expand it.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment