SaveGame no disco local Hitskin_logo Hitskin.com

Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema

Aldeia RPG
Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.

Suporte ao desenvolvimento de jogos


SaveGame no disco local

Aldeia RPG :: Centro de aprendizagem :: Programação :: Web

Ir para baixo

SaveGame no disco local Empty SaveGame no disco local

Mensagem por DevWithCoffee Ter Mar 25, 2014 10:27 pm

Existe um método em JavaScript que é compatível apenas com navegadores que aceitam HTML5.

Esse sistema se chama LocalStorage, ele permitem salvar, carregar, apagar ou limpar dados armazenados em pelo Javascript num local do usuário do navegador, para cada site ele salvará um arquivo.
Além de tudo a encriptação é feita para SQL, tornando impossível de ler diretamente os dados armazenados.

Mas lembre-se, não funciona no Internet Explorer, apenas no IE8+ pra frente.



Para salvar alguma informação no objeto será usado esse comando.
Código:
localStorage.setItem(a,b);
Sendo "a" o nome da informação e "b" a informação.

Exemplos:
Salvar apenas uma string  (texto comum):
Código:
localStorage.setItem('Nome','João');
Salvar apenas uma variável:
Código:
var k = 'valor da variável';
localStorage.setItem('Nome',k);



Para ler alguma informação no arquivo será usado esse comando:
Código:
localStorage.getItem(a);

Exemplo:
Código:
alert(localStorage.getItem('Nome'));



Para deletar você usará esse comando:
Código:
localStorage.removeItem(a);

Exemplo:
Código:
localStorage.removeItem('Nome');

Agora se quiser limpar toda a memória bastará simplesmente usar esse comando:
Código:
localStorage.clear();

Isso removerá toda e qualquer informação gerada pela página onde foi executado o comando, não afetará de outros sites, mas se estiver usando em local (C:) removerá de qualquer coisa gerada por todas as páginas que alguma vezes foram executadas pelo protocolo file:// que seria fora da internet e sim no seu computador.

Criando o Save Game:
Mas como salvar várias informações de um jogo num único SLOT separado e recuperar as informações de maneira prática e simples? Foi fácil, eu usei Array, ao invés de salvar várias variáveis, eu salvei todos os DADOs do jogo numa única, com Array.

Faça o teste aqui.

Se quiser o código copie aqui:
Código:
<html>
<head>
<meta charset="utf-8">
<title>Rpg Simulator - JS</title>
<script type="text/javascript">
//-- Global
//Vocab
var empty = '-- Vazio --';

//Heroi padrão
var save = [];
save[0] = "Alex";
save[1] = "Warrior";
save[2] = "300";
save[3] = "Sword";

//--Funcoes
//Salvar no Slot selecionado
function SaveGame(a,b){
 var timeGame = new Date();
 save[4] = timeGame.getFullYear()+"/"+timeGame.getMonth()+"/"+timeGame.getDate()+" "+timeGame.getHours()+":"+timeGame.getMinutes()+":"+timeGame.getSeconds();
 localStorage.setItem(a,b);
 CheckSave();
}
//Verificar todos os Slots
function CheckSave(){
 if(localStorage.getItem('SlotA') === null){
 document.getElementById('SlotA').innerHTML=empty;
 }else{
 document.getElementById('SlotA').innerHTML=localStorage.getItem('SlotA');
 }
 if(localStorage.getItem('SlotB') === null){
 document.getElementById('SlotB').innerHTML=empty;
 }else{
 document.getElementById('SlotB').innerHTML=localStorage.getItem('SlotB');
 }
 if(localStorage.getItem('SlotC') === null){
 document.getElementById('SlotC').innerHTML=empty;
 }else{
 document.getElementById('SlotC').innerHTML=localStorage.getItem('SlotC');
 }
}
//Deletar Slot selecionado
function EraseSlot(b){
 localStorage.removeItem(b);
 CheckSave();
}
//Deletar todos os Slots
function ClearSlots(){
 localStorage.clear();
 CheckSave();
}
//Mostrar Dados do Herói
function Hero(){
 var timeGame = new Date();
 save[4] = timeGame.getFullYear()+"/"+timeGame.getMonth()+"/"+timeGame.getDate()+" "+timeGame.getHours()+":"+timeGame.getMinutes()+":"+timeGame.getSeconds();
 document.getElementById('data0').innerHTML=save[0];
 document.getElementById('data1').innerHTML=save[1];
 document.getElementById('data2').innerHTML=save[2];
 document.getElementById('data3').innerHTML=save[3];
 document.getElementById('data4').innerHTML=save[4];
}
</script>
</head>
<body>
Após salvar em algum dos slots ou todos feche o navegador<br />
e abra novamente para confirmar que os dados foram salvos.
<table border="1">
<tr>
<td>File 1</td><td id="SlotA" align="center" width="320px"></td>
<td><input type="button" onclick="SaveGame('SlotA', save);" value="Save Game"></input></td>
<td><input type="button" onclick="EraseSlot('SlotA')" value="Delete"></input></td>
</tr>
<tr>
<td>File 2</td><td id="SlotB" align="center"></td>
<td><input type="button" onclick="SaveGame('SlotB', save);" value="Save Game"></input></td>
<td><input type="button" onclick="EraseSlot('SlotB')" value="Delete"></input></td>
</tr>
<tr>
<td>File 3</td><td id="SlotC" align="center"></td>
<td><input type="button" onclick="SaveGame('SlotC', save);" value="Save Game"></input></td>
<td><input type="button" onclick="EraseSlot('SlotC')" value="Delete"></input></td>
</tr>
</table>

<input type="button" onclick="ClearSlots();" value="Delete All"></input>
<input type="button" onclick="CheckSave();" value="Verificar Slots"></input>
<script type="text/javascript">CheckSave();</script>

<table border="1">
<tr><td>Nome do Personagem</td><td>Classe</td><td>HP</td><td>Arma</td><td>Tempo de jogo</td></tr>
<tr><td id="data0"></td><td id="data1"></td><td id="data2"></td><td id="data3"></td><td id="data4"></td></tr>
</table>
<input type="button" onclick="Hero();" value="Separar Dados"></input>
</body>
</html>

_________________
SaveGame no disco local Rm2k-i11 SaveGame no disco local Html-j10 ​
DevWithCoffee
DevWithCoffee
Membro Ativo
Membro Ativo

Mensagens : 295
Créditos : 54

Ficha do personagem
Nível: 1
Experiência:
SaveGame no disco local Left_bar_bleue0/0SaveGame no disco local Empty_bar_bleue  (0/0)
Vida:
SaveGame no disco local Left_bar_bleue30/30SaveGame no disco local Empty_bar_bleue  (30/30)

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

Aldeia RPG :: Centro de aprendizagem :: Programação :: Web

 
Permissões neste sub-fórum
Não podes responder a tópicos