Event load within event load?

Question

Event load within event load?

Navigation

#1 by (1 votes)

1

I need the first load to solve the autoload problem of the scripts I do with php where I can not set the order in which they are going to be loaded, and after that I need to load that load into another load. Is it possible to use a load event inside another load event?

INDEX.HTML

<html>
  <head>
    ...
  </head>
  <body>
    ...
    <?php
      $scripts = dir("js");
      while ($script = $scripts->read()) if ($scripts != "." && $scripts != "..") echo "<script src='js/{$script}'></script>";
    ?>
  </body>
</html>

Then I have the files carta.js, funcoes.js, script.js and texto.js. letter and text are classes, functions have a lot of functions that I use in the program and the script depends on these files already being read to work.

SCRIPT.JS

const cnv = document.getElementById("canvas");
cosnt ctx = cnv.getContext("2d");
const imgs = [];
for (let i = 0; i < 10; i++) {
  (imgs[i] = new Image()).src = 'img/imagem${i}.png';
}
window.onload = () => {
    // executa o resto
}

javascript javascript-eventos

asked by anonymous 03.10.2017 / 15:53

1 answer

Save binary variable in list mode How to display loading in multiple requests with Ionic 3 and Angular 4

score 1 · Accepted Answer

Generate an array with these scripts and then do a loader in JavaScript like this:

<script>
const scripts = [
<?php
  $scripts = dir("js");
  while ($script = $scripts->read()) if ($scripts != "." && $scripts != "..") echo $script.",";
?>
];


function loadScript(src, done) {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'ajaxnotxt.txt';
  script.onload = done
  document.body.appendChild(script);
}

function carregarScripts(scripts, done) {
  let carregados = 0;
  scripts.forEach((script) => {
    loadScript(script, () => {
      carregados++;
      if (carregados == scripts.length) done();
    });
  });
}

carregarScripts(scripts, () => {
  // aqui todos os scripts estão carregados
  const cnv = document.getElementById("canvas");
  const ctx = cnv.getContext("2d");
  const imgs = [];
  for (let i = 0; i < 10; i++) {
    (imgs[i] = new Image()).src = 'img/imagem${i}.png';
  }

  // executa o resto

});