Vanish a component using jQuery when loading the page. And then appear it after a certain event in a while loop

Asked

Viewed 105 times

1

I created a game of jokenpo and I want to put a while to ask for a value for the user. I need that when the document be charged the texbox scram.

   $(document).ready(function(){

    var choice = null;  
    var vitoriaPlayer = 0;
    var vitoriaComputer = 0;


    $("#nameJogador-index").ready(function(){
        this.hide();
    });

    //Altera o nome do jogador no inicio do index_game
    $("#nameUser").text(localStorage.jogador);

    //Gera a opção do computador
    var computerChoice = Math.random();

    if (computerChoice < 0.34) {
        computerChoice = "Pedra";

    }else if(computerChoice <= 0.67) {
        computerChoice = "Papel";

    }else {
        computerChoice = "Tesoura";

    } 

    //Evento e função responsáveis por comparar as jogadas e mostrar para o usuário
    $('#pedra, #papel, #tesoura').on('click', function(ev){

        //Atribui o valor clicado pelo usuário para variavel choice
        var choice = $(this).prop("id").toLowerCase(); 
        computerChoice = computerChoice.toLowerCase();

        if((computerChoice == choice) || (computerChoice == choice)||(computerChoice == choice)){
                $("#vencedor").text("Empate");
                $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);

        }else if (choice === "pedra"){

                if (computerChoice === "tesoura"){
                    $("#vencedor").text("Jogador "+localStorage.jogador+" venceu");

                    vitoriaPlayer += 1;

                    $("#scoreUser").text(vitoriaPlayer);

                    $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                    $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);


        }else{
                    $("#vencedor").text("Oponente venceu");

                    vitoriaComputer += 1;

                    $("#scoreOponent").text(vitoriaComputer);

                    $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                    $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);
            }

        }else if (choice === "papel"){
                if (computerChoice === "pedra"){

                     $("#vencedor").text("Jogador "+localStorage.jogador+" venceu");

                     vitoriaPlayer += 1;
                     $("#scoreUser").text(vitoriaPlayer);

                     $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                     $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);

        }else{
                     $("#vencedor").text("Oponente venceu");

                     vitoriaComputer += 1;

                     $("#scoreOponent").text(vitoriaComputer);

                     $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                     $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);

            }

        }else if (choice === "tesoura") {

                if (computerChoice === "pedra"){
                     $("#vencedor").text("Oponente venceu");

                     vitoriaComputer += 1;

                     $("#scoreOponent").text(vitoriaComputer);

                     $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                     $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);

        }else{

                     $("#vencedor").text("Jogador "+localStorage.jogador+" venceu");

                     vitoriaPlayer += 1;

                     $("#scoreUser").text(vitoriaPlayer);

                     $("#jogada-jogador").text("Jogada do jogador(a) "+localStorage.jogador+" foi "+choice);
                     $("#jogada-oponente").text("Jogada do oponente foi "+computerChoice);
            }

            if(vitoriaPlayer >= 3){
                alert("Jogador "+localStorage.jogador+" venceu");
            }else if(vitoriaComputer >=3){
                alert("Computador ganhou");
            }
        }

        //Janela modal
        ev.preventDefault();

        var id = $("a[rel=modal]").attr("href");

        var alturaTela = $(document).height();
        var larguraTela = $(window).width();

        //Colocando o fundo preto
        $('#mascara').css({'width':larguraTela,'height':alturaTela});
        $('#mascara').fadeIn(1000); 
        $('#mascara').fadeTo("slow",0.8);

        var left = ($(window).width() /2) - ( $(id).width() / 2 );
        var top = $(window).scrollTop()+10

        $(id).css({'top':top,'left':left});
        $(id).show();   

        });

        $("#mascara").click( function(){
            $(this).hide();
            $(".window").hide();
        });

        $('.fechar').click(function(ev){
            ev.preventDefault();
            $("#mascara").hide();
            $(".window").hide();
            });
        });

HTML code

    <div class="container">
        <input type="text" id="nameJogador-index" placeholder="Nome do Jogador">
        <input type="submit" value="Jogar" id="jogar">  
    </div>
  • With cut code you can’t reproduce to understand how it works.

  • Oops, and now, it’s better?

  • Now improved. =]

  • 1

    But still tah missing some code there after the while.

  • I’m sorry, I had put the while but to get a sense of what I wanted and did not put the variable to catch the click

  • If I understand, you want the form where you put the player’s name?

  • Yes that’s right, if the user’s move equals that of the computer it will generate a tie and then to the right running while will have to ask another value for the user. Only I want this event to be triggered when the tie occurs, otherwise it stays hidden.

  • I couldn’t reproduce your code here... it’s wrong.

  • Another part of the program was missing, I’m sorry. I’m new here, I still can’t get used.

Show 4 more comments

1 answer

0


Browser other questions tagged

You are not signed in. Login or sign up in order to post.