laira
/
iFractions-utilitarios


			
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
							<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <link rel="shortcut icon" href="#">
  <title>Testando fetch API</title>
  <style>
    * { font-family: sans-serif; }
    canvas { border: 3px solid gray; }
    span { 
      color: gray;
      font-size: 12px;
    }
  </style>
</head>

<body>

  <h2>Carregando/usando arquivos de mídia</h2>
  <span>Por: Laira Almas [2020]</span>
  
  <p>
    Arquivos de linguagem e audio usam Fetch API (<a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">documentação oficial</a>)<br>
    Arquivos de imagem usam Image() (<a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement">documentação oficial</a>)
  </p>

  <div>
    <canvas id="canvas" width="700" height="400"></canvas>
  </div>

  <span>* Toda mídia precisa ser carregada antes de ser usada</span><br><br>

  Imagem:
  <button onclick="loadImages()">Carregar no cache</button>
  <button onclick="drawImages()">Desenhar </button><br><br>

  Audio:
  <button onclick="loadAudios()">Carregar no cache</button>
  <button onclick="playAudio()">Tocar</button><br><br>

  Idioma:
  <button onclick="loadLangs()">Carregar no cache</button>
  <button onclick="printLangs()">imprimir</button><br><br>

  <textarea id="texto" rows="4" cols="20" readonly=true placeholder="algumas palavras do idioma selecionado sairão aqui"></textarea>
  <span> *dicionario completo no console </span><br><br>

  Alterar idioma:
  <button onclick="escolherIdioma('pt_BR')">Pt_BR</button>
  <button onclick="escolherIdioma('en_US')">En_US</button>

  <script src="carregandoImagem.js"></script>
  <script src="carregandoAudio.js"></script>
  <script src="carregandoLinguagem.js"></script>

  <script>
    let canvas = document.getElementById("canvas");
  </script>

</body>


</html>