Skip to content

Commit

Permalink
cambios
Browse files Browse the repository at this point in the history
  • Loading branch information
@CarlosSalda
CarlosSalda committed Dec 9, 2020
1 parent 5f1e05c commit f46d7de
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 80 deletions.
11 changes: 9 additions & 2 deletions tpIntegrador/integrador/src/css/Start.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,14 +87,14 @@
margin-top: 20px;
}

#endGame {
#endGameD {
margin-left: 640px;
text-justify: auto;
border-style: double;
border-color: red;
}

#tEndGame {
#tEndGameD {
margin-left: 500px;
font-size: 30px;
font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
Expand All @@ -120,4 +120,11 @@
#last2:hover {
width: 60px;
height: 70px;
}

#end {
font-size: 20px;
font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
margin-top: 600px;
margin-left: 1700px;
}
97 changes: 19 additions & 78 deletions tpIntegrador/integrador/src/jsx/Start.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,11 +52,13 @@ const Start = () => {
const decideWinner = (tarId, imgR) => {

if ((tarId === imgR.value)) {
console.log("entre")
setGane("empate")
console.log(gane)
}

//condiciones si usuario elige tijera
if ((tarId === "Tijera" && imgR.value === "Piedra") || (tarId === "Tijera" && imgR.value === "Spock")) {
if ((tarId === "Tijera" && imgR.value === "Piedra") || (tarId === "Tijera" && imgR.value === "Spock")) {
setPcScore(pcScore + 1)
setGane("false")
}
Expand Down Expand Up @@ -116,7 +118,7 @@ const Start = () => {
//se setea la decision de la pc a traves del valor random, se hace que se muestra en la pagina la decision y se llama añ decideWinner()
// en el cual elige el ganador
const callDecideWinner = (imgR, random, target) => {

const tarId = target.id

if (random <= 20) {
Expand Down Expand Up @@ -349,17 +351,13 @@ const Start = () => {

//Handler de la eleccion del usuario
const callOption = async (event) => {
//seleeciona para esconder la data de "endGame()", para poder seguir jugando
let win = document.getElementById("endGame")
let text = document.getElementById("tEndGame")


//guarda en una variable el valor de textContent del event(seria la eleccion del jugador)
let val = event.target.textContent
let buton = event.target

//esconde la data de endGame()
win.hidden = true
text.hidden = true

buton.disabled = true //poner disable el boton para no hacer elecciones de manera infinita

Expand Down Expand Up @@ -409,76 +407,28 @@ const Start = () => {
return pcScore >= 1 || playerScore >= 1
}

const Decision = () => {

//acciones a tomar si se pierde
if (endGame() && gane === "false") {
setTimeout(function () {
let win = document.getElementById("endGame")
let text = document.getElementById("tEndGame")
text.hidden = false
text.textContent = "Perdiste! Gracias por jugar, podes volver a intentarlo!"


win.hidden = false
win.src = "https://cdn.ticbeat.com/src/uploads/2017/07/5-errores-comunes-entrevistas-de-trabajo-810x540.jpg"

}, 3350);
}

//acciones a tomar si se gana
if (endGame() && gane === "true") {
setTimeout(function () {
let win = document.getElementById("endGame")
let text = document.getElementById("tEndGame")

text.hidden = false
text.textContent = "Ganaste! Gracias por jugar, todavia podes seguir jugando!"

win.hidden = false
win.src = "https://static9.depositphotos.com/1579454/1139/i/950/depositphotos_11399904-stock-photo-first-place-trophy-cup.jpg"

}, 3350);
}

//acciones a tomar si se empata
if(endGame() && gane === "empate") {
setTimeout(function () {
let win = document.getElementById("endGame")
let text = document.getElementById("tEndGame")

text.hidden = false
text.textContent = "Empate! Todavia podes tomarte revancha!"

win.hidden = false
win.src = "https://llevatilde.es/imagetexts/c/c6/empate.png"

}, 3350);

}
}

//seteo la ultima decision de la pc
const pcElection = () => {

if(lastPc) {
return(<img id= "last2" src= {lastPc} width="40" height="50"></img>)
if (lastPc) {
return (<img id="last2" src={lastPc} width="40" height="50"></img>)
}
}

//seteo la ultima decision del jugador
const humanElection = () => {
if(lastHuman) {
return(<img id="last2" src= {lastHuman} width="40" height="50"></img>)

if (lastHuman) {
return (<img id="last2" src={lastHuman} width="40" height="50"></img>)
}
}


return (<>
{/*Muestra la ultima eleccion de la pc y del jugador (como en el trabajo solo decia de cada partida,es decir de cada "eleccion" solo muestro el ultimo valor)*/ }
{/*Muestra la ultima eleccion de la pc y del jugador (como en el trabajo solo decia de cada partida,es decir de cada "eleccion" solo muestro el ultimo valor)*/}
<div id="last">
<div>ultima eleccion PC: {pcElection()}</div>
<div>ultima eleccion PC: {pcElection()}</div>
<div> tu ultima eleccion : {humanElection()}</div>
</div>

Expand All @@ -491,33 +441,24 @@ const Start = () => {
<button type="button" class="btn btn-outline-warning" id="Spock" onClick={callOption}>Spock</button>
</div>

{/*Score de puntuacion actual del juego.*/ }
<div id = "score">
TU: {playerScore} -- PC: {pcScore}
{/*Score de puntuacion actual del juego.*/}
<div id="score">
TU: {playerScore} -- PC: {pcScore}
</div>

{/*imagenes la cuales son luego cargadas con el source para cada decision correspondiente. */}
<img hidden id="photoElection" src="" width="200" height="300"></img>
<img hidden id="response" src="" width="200" height="300"></img>

{/*muestra el resultado si se gano/empato/perdio con una imagen y un texto.*/}
<div hidden={!endGame()}>{Decision()}</div>

<div>
<img hidden id="endGame" src="" width="500" height="600"></img>
</div>

<div>
<p hidden id="tEndGame"> </p>
</div>

{/*Reglas del juego junto con informacion y una imagen explicativa. */}
<div id="infoRules" >
<p id="rulesAndInfo" hidden>Bienvenidos a Tijera, Piedra, Papel, Lagarto, Spock. Es similar a un piedra, papel, tijera tradicional pero con algunas distinciones: </p>
<p id="rulesAndInfo2" hidden>Tijera le gana a Papel y Lagarto. Papel le gana Piedra y a Spock. Piedra le gana a Lagarto y a Tijera </p>
<p id="rulesAndInfo" hidden>Bienvenidos a Tijera, Piedra, Papel, Lagarto, Spock. Es similar a un piedra, papel, tijera tradicional pero con algunas distinciones: </p>
<p id="rulesAndInfo2" hidden>Tijera le gana a Papel y Lagarto. Papel le gana Piedra y a Spock. Piedra le gana a Lagarto y a Tijera </p>
<p id="rulesAndInfo3" hidden> Lagarto le gana a Spock y a Papel. Spock le gana a Tijera y a Piedra, les dejo una imagen explicativa: </p>
<img hidden id="rulesPhoto" src={reglasPNG} width="500" height="600"></img>
</div>

<footer id = "end">by Carlos Saldaña</footer>
</>
);
}
Expand Down

0 comments on commit f46d7de

Please sign in to comment.