# Por que carregar arquivos de midia para o cache

O iFractions utiliza **imagens**, **audios** e **arquivos de idioma** durante a execucao. Assim, e necessario que antes que qualquer um desses elementos sejam chamados no codigo exista uma garantia de que estes estejam **carregados no cache**.

Levando em consideracao que o iFractions eh um aplicativo de pagina unica (*single page application*), uma "mudanca de tela" dentro do jogo na verdade corresponde a desenhar novos elementos graficos no Canvas (HTML), sobrescrevendo a tela anterior.

Dessa forma, diferente de uma aplicacao de varias paginas, onde a cada carregamento os elementos de midia ficam prontos antes do codigo executar, ele utiliza chamadas assincronas tanto para carregar os arquivos base necessarios no inicio do programa, como para carregar novos elementos durante a execucao.

Para isso, arquivos de idioma e audio sao carregados usando **Fetch API** e imagens usando **HTMLImageElement**, ambos *nativos do Javascript*.

# O que voce vai encontrar nesse pacote

(Este pacote deve ser descarregado no servidor local)

Ele contem um arquivo **index.html** que apresenta uma aplicacao de pagina unica onde voce pode carregar dinamicamente e utilizar os seguintes tipos de midia: 
* imagem
* audio
* arquivos de idioma

*Obs.: um elemento so pode ser usado se tiver sido anteriormente carregado no cache.*

## Carregando e usando imagens

 Em: **carregandoImagem.js** 

| funcao       | nome             |
| ------------ | ---------------- |
| carregamento | **loadImages()** |
| uso          | **drawImages()** | 

usa HTMLImageElement

## Carregando e usando audio

Em: **carregandoAudio.js**

| funcao       | nome             |
| ------------ | ---------------- |
| carregamento | **loadAudios()** |
| uso          | **playAudio()**  |

usa Fetch API

## Carregando arquivos de idioma

Em: **carregandoLinguagem.js**

| funcao       | nome             |
| ------------ | ---------------- |
| carregamento | **loadLangs()**  | 
| uso          | **printLangs()** |

usa Fetch API

#### Sobre o formato dos arquivos de linguagem usados no ifractions

Os formato dos arquivos de idioma usados pelo iFractions (como pode ser visto aqui em **/lang**) seguem a seguinte estrutura:

* os arquivos nao possuem extensao
* seguem o padrao **chave=traducao** 
* a quebra de linha indica fim da traducao

Assim, a funcao de tratamento de linguagem trata os arquivos que seguem essa formatacao.

## Uso no iFractions

No iFractions, as funcoes de carregamento e uso estao definidas em **/js/gameMechanics.js**:

Carregamento:

* game.load.<**tipo de midia**>(<**urls**>)
	* Carrega arquivos no cache

Uso:

* game.add.image(<**args**>) e game.add.sprite(<**args**>)
	* adiciona imagem na tela
* game.audio.<**nome**>.play()
	* toca audio
* game.lang.<**chave**>
	* retorna frase associada a aquela chave na linguagem selecionada

Para cada estado, se for necessario, arquivos de midia sao carregados dentro da funcao **preload()**, para serem usados no resto do codigo. Essa funcao aguarda que tudo seja carregado antes de continuar o codigo.