Automatic php refresh system

Question

Automatic php refresh system

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

Hi boy @ s I'm looking for a way to generate a random content sheet (chunks of lyrics) that refreshes every x seconds.

So far I have managed to get the system to visualize the random content (great) every time I update the page and also refresh it automatically.

The issue is that I am seeing that it consumes too many resources and that it seems excessive to reload all the code blocks when I only need the songs.

To refresh I am using a javascript code that I have found on the net although it is very crazy because I can not generate a button that deactivates it and becomes a bit heavy. I have seen that with ajax it can be done much more efficiently.

I do not control much programming and for this project I am using a content manager.

I'm posting here the code in case it turns out to be helpful.

    function reFresh()
  {
  window.open(location.reload(true))
  }
var repeticion = window.setInterval("reFresh()",30000);

<div class="uk-grid-collapse uk-child-width-expand@m uk-margin" uk-grid uk-scrollspy="cls: uk-animation-fade; target: > div > delay: 500; repeat: true">
  <div class="uk-flex uk-flex-middle uk-flex-center">
    <div class="uk-card-body uk-width-expand uk-text-center uk-light">
    <!-- Contenido letras -->
      <?php if ($this->checkPosition('copla')) : ?>
         <div class="magia"><?php echo $this->renderPosition('copla'); ?></div><?php endif; ?>
    </div>
  </div>
</div>


<div class="uk-position-small uk-position-bottom-right uk-overlay uk-overlay-default">
  <a id="actualizar"  href="javascript:location.reload()"  onclick="UIkit.notification({message: 'Volai-vai OUTRA!...', pos: 'top-center'})"><span uk-icon="icon: refresh; ratio: 1.5" uk-tooltip="Refrescar cantiga"></span></a>
</div>

<div><form class="toogle-dn" action="" onclick="window.clearInterval(repeticion);"><input class="toogle-dni" type="checkbox" id="toogle" /><label class="toogle-dni" for="toogle"></label></form></div>

javascript html php joomla3

asked by Diego Pintos 21.09.2018 в 12:34

source

2 answers

Problem with Error 403 Forbidden in certain cases My viewcontroller does not show the texts

score 0 · Answer 1

What I would do:

Load several random songs into hidden items; this would do with PHP.

By clicking on update, change the content of your card by the content of some of the hidden elements. This I would do with JavaScript.

Here is a very basic example:

let ocultos = Array.from(document.querySelectorAll("#ocultos .cancion"));

function contenidoAleatorio(){
  contenido.innerHTML = ocultos[~~(Math.random()*ocultos.length)].innerHTML;
}

contenidoAleatorio();
actualizar.addEventListener("click", contenidoAleatorio)

#ocultos{display:none}

<div class="uk-grid-collapse uk-child-width-expand@m uk-margin" uk-grid uk-scrollspy="cls: uk-animation-fade; target: > div > delay: 500; repeat: true">
  <div class="uk-flex uk-flex-middle uk-flex-center">
    <div class="uk-card-body uk-width-expand uk-text-center uk-light">
      
      
      <div id="contenido"><!-- Contenido letras --></div>
  
         
    </div>
  </div>
</div>


<div class="uk-position-small uk-position-bottom-right uk-overlay uk-overlay-default">
  <button id="actualizar">actualizar</button>
</div>


<div id="ocultos">
  <!--Generado con php-->
  <p class="cancion">aaaaaaa</p>
  <p class="cancion">bbbbbbb</p>
  <p class="cancion">ccccccc</p>
  <p class="cancion">ddddddd</p>
  <p class="cancion">eeeeeee</p>
  <p class="cancion">fffffff</p>
  <p class="cancion">gggggg</p>
  <p class="cancion">hhhhhh</p>
  <p class="cancion">iiiiii</p>
  <p class="cancion">jjjjjj</p>
  <p class="cancion">kkkkkk</p>
  <p class="cancion">llllll</p>   
</div>

score 0 · Answer 2

My recommendation is to use something type SSE (Server Send Events). I'll give you an example.

Our PHP script.

<?php
#Funcion que envia los datos
function enviar($id, $msg) {
  echo "id: $id" . PHP_EOL;
  echo "data: $msg" . PHP_EOL;
  echo PHP_EOL;
  ob_flush();
  flush();
}

  //Para esta prueba cada 3 segundos vamos a enviar datos.
    $i = 1;
    while(true){
      $i += 1;
        enviar($i, "Data $i");
        sleep(3);
    }

?>

In your client you simply have to instantiate the EventSource class, which receives the file where we have the php script.

var evtSource = new EventSource('sse.php');
var eventList = document.querySelector('ul');

evtSource.onmessage = function(e) {
  var newElement = document.createElement("li");

  newElement.textContent = "message: " + e.data;
  eventList.appendChild(newElement);
}

This way we are receiving every 3 seconds every 3 seconds. The only thing that you would like to distribute the information that comes to you.

For more information you can see it here

I recommend you look at this link for more info

Link 1