CSS
body{
background-color:#FF8000;
}
body h1{
text-align:center;
}
body button{
background-color:#0174DF;
color: #F2F2F2;
padding:0.7em 1.2em;
margin:0 0.3em 0.3em 0;
border-radius:2em;
font-weight:600;
text-align:center;
}
#resultado{
background-color:black;
color:white;
font-size:1.9em;
text-align:center;
}
body footer{
font-size:10px;
text-align:center;
}
JAVASCRIPT
let moneda = ["AGUILA","SOL"];
let hugo,paco,luis;
let result ="";
const btn = document.getElementById("btn");
const resultado = document.getElementById("resultado");
var label = document.getElementById("texto");
btn.addEventListener("mousedown",()=>{
label.innerHTML ="";
});
btn.addEventListener("mouseover",()=>{
label.innerHTML="<br/><b>Reglas:</b><br/> Tres jugadores lanzan una moneda.<br/>Si una moneda es diferente a las otras dos, el lanzador gana.<br/>Si las monedas son todas iguales, nadie gana.";
});
btn.addEventListener("click", ()=>{
hugo = moneda[Math.floor(Math.random()*2.0)];
paco = moneda[Math.floor(Math.random()*2.0)];
luis = moneda[Math.floor(Math.random()*2.0)];
console.log("Hugo:",hugo);
console.log("Paco:",paco);
console.log("Luis:",luis);
result += "<br/>Hugo: "+hugo;
result += "<br/>Paco: "+paco;
result += "<br/>Luis: "+luis;
if(hugo!=paco && hugo!=luis){
console.log(hugo," : Hugo gana!!");
result +="<br/> <br/>"+hugo+" : Hugo gana!!";
}else if(paco!=hugo && paco!=luis){
console.log(paco," : Paco gana!!");
result +="<br/> <br/>"+paco+" : Paco gana!!";
}else{
if(luis!=hugo && luis!=paco){
console.log(luis," : Luis gana!!");
result +="<br/> <br/>"+luis+" : Luis gana!!";
}else{
console.log("Empate: nadie gana!!");
result +="<br/><br/> Empate: nadie gana!!";
}
}
resultado.innerHTML = "<br/>"+result;
result = "";
});