Update the page automatically when you receive some information - HTML, JS, PHP

Asked

Viewed 108 times

-1

A friend and I are developing an online browser game, but we’re having trouble making real-time updates when a player does an action. I tried to use AJAX to update the page every 1 second, but it seemed to me that it uses a lot of processing, wanted to know if there is any way to update some information only when there is some update in the game. Note: (It would be a card game).

        /* Requisição ajax, essa retorna a atualização */
    var intervalo = window.setInterval(tmp, 1000);
    function tmp() {
        var str = ("?php echo $party; ?>");
        var data_out = {str};
        $.ajax({
            type: 'POST',
            url: '/php/att_sala.php',
            dataType: 'html',
            data: data_out,
            success: function (data){
                document.getElementById("teste").innerHTML = data;
            },
            error: function (data){
            },
            complete: function(){
            }
        });
    }
php javascript html css

1 answer

0

I believe it is possible to do n ways,

If it is a turn-based card game, set a maximum time for each turn and request it whenever turn time runs out.

If you don’t want to wait the whole shift time create a php script that tells you who it is or if you’ve already played, and keep making requests 1 in 1 second (test if ajax isn’t sending more than one request), as this php script won’t process anything it takes little processing. To implement this you only need to know who the pairs are that are playing. Practical example of this:

Table Matches

id INT
id_jogadorA INT
id_jogadorB INT
jogadorAtual CHAR

vezDeQuem.php

<?php
   $jogadorA = $_GET['jogador1'];
   $jogadorB = $_GET['jogador2'];

  // Busca no banco a partida (não sei se você tá usando mysqli ou pdo (recomendo pdo)
  // Retorna o jogador atual

telaDaPartida.php

$.ajax({
   url: 'vezDeQuem.php?jogadorA=id&jogadorB=id',
   success: function(data) {
      if (data.jogadorAtual == A) {
         // minha vez
      } else {
         // continuo esperando
      }
   }
})

important: for this to work is important to have a challenging player (player A) and a challenged player (player B), this can be passed in the url (?challenger=id), this can be put on the table matches, rather than player and playerB, challenging and challenging.

You can also do this in turn, use a counter that increases every turn, whenever it is turn for player A plays, if it is odd turn player B plays.

Table matches

id INT
id_jogadorA INT
id_jogadorB INT
turno INT

vezDeQuem.php

<?php
   $jogadorA = $_GET['jogador1'];
   $jogadorB = $_GET['jogador2'];

  // Busca no banco a partida (não sei se você tá usando mysqli ou pdo (recomendo pdo)
  // Retorna o turno

telaDaPartida.php

// Isso significa que vou jogar sempre em turnos ímpar (pq tô iniciando do 1)
const jogouPrimeiro = true;
$.ajax({
   url: 'vezDeQuem.php?jogadorA=id&jogadorB=id',
   success: function(data) {
      if (data.turno % 2 == 0) {
         // continuo esperando (considerando que iniciei o jogo em turnos ímpar)
      } else {
         // minha vez (considerando que iniciei o jogo em turnos ímpar)
      }
   }
})

Remarks: I’ve abstract a lot of things because it’s a laborious thing to do, but I hope you got the message. Anyway you will need a table for the matches and it is important to know who challenged and who is being challenged because this way you get logic like player and playerB, knowing that the turn passed you can update the screen by calling your script att_sala.php. Waiting the full turn time is much simpler, but it’s not that cool, you can try fast turns, but it all goes from how you want the game to be.

Browser other questions tagged php javascript html css

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