script.js

var carta1 = {
  nome: "Elon Musk",
  imagem:
    "https://ted-conferences-speaker-photos-production.s3.amazonaws.com/c9bzt1ahc9iv09uth9oepbetmsuc",
  atributos: {
    creative: 5,
    innovative: 9,
    visionary: 8
  }
};

var carta2 = {
  nome: "Steve Jobs",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTzEKY_9tW45XK-CTtt4kqogy1sb8wHn3-GGarIKtR87naROY90z9NSQwJzSdPKev-qpKw&usqp=CAU",
  atributos: {
    creative: 7,
    visionary: 4,
    innovative: 5
  }
};

var carta3 = {
  nome: "Bill Gates",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT23Dx0SxHhzfpXijw-LCSKZLEx0ktL7wsPiaCgEx-oO0Df3rxt8-GZG-r1fzLWFIVc4K8&usqp=CAU",
  atributos: {
    creative: 8,
    visionary: 5,
    innovative: 4
  }
};

var carta4 = {
  nome: "Mark Zuckerberg",
  imagem:
    "https://www.suno.com.br/wp-content/uploads/2018/11/Mark-Zuckerberg-2.jpg",
  atributos: {
    creative: 7,
    visionary: 7,
    innovative: 8
  }
};

var carta5 = {
  nome: "Linus Torvalds",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSfjV-kLn-RdVVIiX8E5GyPE_2P9SchxtxTow&usqp=CAU",
  atributos: {
    creative: 5,
    visionary: 9,
    innovative: 4
  }
};

var carta6 = {
  nome: "Nilkola Tesla",
  imagem:
    "https://upload.wikimedia.org/wikipedia/commons/thumb/7/79/Tesla_circa_1890.jpeg/460px-Tesla_circa_1890.jpeg",
  atributos: {
    creative: 4,
    visionary: 4,
    innovative: 8
  }
};

var carta7 = {
  nome: "Alan Cooper",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQPrpySibpdUTbYA0WqBEmAQeO9g8z0CCLnqOhFBmbeNdfvfQjPmnqKGwZ5hH7zpZPJV0o&usqp=CAU",
  atributos: {
    creative: 5,
    visionary: 10,
    innovative: 7
  }
};

var carta8 = {
  nome: "Alonzo Church",
  imagem:
"https://upload.wikimedia.org/wikipedia/en/a/a6/Alonzo_Church.jpg",
  atributos: {
    creative: 8,
    visionary: 6,
    innovative: 7
  }
};

var carta9 = {
  nome: "Richard Stallman",
  imagem:
    "https://usesthis.com/images/interviews/richard.stallman/portrait.jpg",
  atributos: {
    creative: 7,
    visionary: 5,
    innovative: 8
  }
};

var carta10 = {
  nome: "James Gosling",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTkYzdcGbJsNbK9AzWEvVoWfVrWfwwRtqynTHpKEW8IxqP054KLfAIetyAfZEQKtwXRihQ&usqp=CAU",
  atributos: {
    creative: 4,
    visionary: 8,
    innovative: 4
  }
};

var carta11 = {
  nome: "Guido Van Rossum",
  imagem: "https://gvanrossum.github.io/images/GuidoByPeterAdams.jpg",
  atributos: {
    creative: 3,
    visionary: 5,
    innovative: 5
  }
};

var carta12 = {
  nome: "Rasmus Lerdorf",
  imagem:
    "https://i.pinimg.com/474x/6d/e8/08/6de8084630cf02a5dbeb02a5e4c630c9--web-programming-languages-november-born.jpg",
  atributos: {
    creative: 6,
    visionary: 4,
    innovative: 7
  }
};

var carta13 = {
  nome: "Ada Lovelace",
  imagem:
    "https://www.ufrgs.br/enigma/wp-content/uploads/2021/02/https-_dynaimage.cdn_.cnn_.com_cnn_x_357y_0w_539h_719c_crop_https3A2F2Fstamp.static.cnn_.io2F5bab86cf4db3d70020c01c3e2Fada2-e1613402491497.jpg",
  atributos: {
    creative: 7,
    visionary: 5,
    innovative: 5
  }
};

var carta14 = {
  nome: "Anders Hejlsberg ",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSxDD3zQcwA9KlnEw7J_HyLHBPpdTGTRTYRBiWNqA0mi3tNDi-QuxqY4RnNMdHkyXUaMSc&usqp=CAU",
  atributos: {
    creative: 6,
    visionary: 4,
    innovative: 9
  }
};

var carta15 = {
  nome: "Grace Murray Hopper",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTkJnlscWpWh4RFjHB5vjWG8WA8WKfumSCw0CJA_lyVx45a4JwvoA4skmvQQcYPSY5QUT0&usqp=CAU",
  atributos: {
    creative: 9,
    visionary: 6,
    innovative: 8
  }
};

var carta16 = {
  nome: "Dennis Ritchie",
  imagem:
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTIPiqr5kCRqggHfGNKFSxiwtSE0nGJQbUt2cL2wQnVXrWeVHgBgpuyZFS7lVrfePxQV3A&usqp=CAU",
  atributos: {
    creative: 5,
    visionary: 6,
    innovative: 7
  }
};

var cartasDoJogador = [];
var cartasDaMaquina = [];

var cartaMaquina;
var cartaJogador;
var cartas = [
  carta1,
  carta2,
  carta3,
  carta4,
  carta5,
  carta6,
  carta7,
  carta8,
  carta9,
  carta10,
  carta11,
  carta12,
  carta13,
  carta14,
  carta15,
  carta16
];
// 0          1           2

function sortearCarta() {
  var numeroCartaMaquina = parseInt(Math.random() * 16);
  cartaMaquina = cartas[numeroCartaMaquina];

  var numeroCartaJogador = parseInt(Math.random() * 16);
  while (numeroCartaJogador == numeroCartaMaquina) {
    numeroCartaJogador = parseInt(Math.random() * 16);
  }
  cartaJogador = cartas[numeroCartaJogador];
  console.log(cartaJogador);

  document.getElementById("btnSortear").disabled = true;
  document.getElementById("btnJogar").disabled = false;
  exibirCartaJogador();
}

function obtemAtributoSelecionado() {
  var radioAtributo = document.getElementsByName("atributo");
  for (var i = 0; i < radioAtributo.length; i++) {
    if (radioAtributo[i].checked) {
      return radioAtributo[i].value;
    }
  }
}

function jogar() {
  console.log("chamou");
  var atributoSelecionado = obtemAtributoSelecionado();
  var divResultado = document.getElementById("resultado");

  if (
    cartaJogador.atributos[atributoSelecionado] >
    cartaMaquina.atributos[atributoSelecionado]
  ) {
    htmlResultado = "<p class='resultado-final'>You Won!</p>";
    cartasDoJogador.push(cartaMaquina);
  } else if (
    cartaJogador.atributos[atributoSelecionado] <
    cartaMaquina.atributos[atributoSelecionado]
  ) {
    htmlResultado = "<p class='resultado-final'>You Lost!</p>";
    cartasDaMaquina.push(cartaJogador);
  } else {
    htmlResultado = "<p class='resultado-final'>Tied!</p>";
  }

  if (cartasDaMaquina.length == 5 || cartasDoJogador.length == 5) {
    document.getElementById("btnJogar").disabled = true;
    document.getElementById("btnProxima").disabled = true;
    document.getElementById("btnSortear").disabled = true;

    if (cartasDaMaquina.length == 5) {
      htmlResultado = `<p class='resultado-final'> End of the game ! The winner was the machine by ${cartasDaMaquina.length} to ${cartasDoJogador.length}.</p>`;
      document.getElementById("btnReiniciar").innerHTML =
        "<button type='button' onclick='reiniciar()'>Restart</button>";
    } else {
      htmlResultado = `<p class='resultado-final'>End of the game ! The winner was you by ${cartasDoJogador.length} to ${cartasDaMaquina.length}.</p>`;
      document.getElementById("btnReiniciar").innerHTML =
        "<button type='button' onclick='reiniciar()'>Restart</button>";
    }
  } else {
    document.getElementById("btnProxima").disabled = false;
  }

  divResultado.innerHTML = htmlResultado;

  document.getElementById("btnJogar").disabled = true;
  exibirCartaMaquina();
  exibirPontuacao();
}

function exibirCartaJogador() {
  var divCartaJogador = document.getElementById("carta-jogador");

  divCartaJogador.innerHTML = `
      <div class="card">
        <img class="card-imagem" src="${cartaJogador.imagem}" alt="">
        <div class="card-info">
          <p class="info-titulo">${cartaJogador.nome}</p>  
          <div id="opcoes-jogador" class="opcoes"></div>
      </div>
      </div>
`;
  var opcoes = document.getElementById("opcoes-jogador");

  var opcoesTexto = "";
  for (var atributo in cartaJogador.atributos) {
    opcoesTexto += `<div class="atributo"><span><input type="radio" name="atributo" value="${atributo}" checked> ${atributo}</span><span>${cartaJogador.atributos[atributo]}</span></div>`;
  }
  opcoes.innerHTML = opcoesTexto;
}

function exibirCartaMaquina() {
  var divCartaMaquina = document.getElementById("carta-maquina");

  divCartaMaquina.innerHTML = `
  <div class="card">
        <img class="card-imagem" src="${cartaMaquina.imagem}" alt="">
        <div class="card-info">
          <p class="info-titulo">${cartaMaquina.nome}</p>  
          <div id="opcoes-maquina" class="opcoes"></div>
      </div>
      </div>
  `;
  var opcoes = document.getElementById("opcoes-maquina");

  var opcoesTexto = "";

  for (var atributo in cartaMaquina.atributos) {
    opcoesTexto += `<div class="atributo"><span><p name="atributo">${atributo}</p></span><span>${cartaMaquina.atributos[atributo]}</span></div>`;
  }

  opcoes.innerHTML = opcoesTexto;
}

function proximaRodada() {
  document.getElementById("btnSortear").disabled = false;
  document.getElementById("btnProxima").disabled = true;
  document.getElementById("resultado").innerHTML = "";
  document.getElementById("carta-jogador").innerHTML = "";
  document.getElementById("carta-maquina").innerHTML = "";
  document.getElementById("carta-jogador").style.backgroundImage = "";
  document.getElementById("carta-maquina").style.backgroundImage = "";

  sortearCarta();
}

function exibirPontuacao() {
  var pontuacao = document.getElementById("pontuacao");
  pontuacao.innerHTML = `<span>Player- ${cartasDoJogador.length}</span> | <span>Machine - ${cartasDaMaquina.length}</span>`;
}

function reiniciar() {
  document.getElementById("btnSortear").disabled = false;
  document.getElementById("btnProxima").disabled = true;
  document.getElementById("resultado").innerHTML = "";
  document.getElementById("pontuacao").innerHTML = "";
  document.getElementById("carta-jogador").innerHTML = "";
  document.getElementById("carta-maquina").innerHTML = "";
  document.getElementById("carta-jogador").style.backgroundImage = "";
  document.getElementById("carta-maquina").style.backgroundImage = "";

  cartasDaMaquina = [];
  cartasDoJogador = [];
}