Cloud Storage

Se o aplicativo estiver hospedado no App Engine, um serviço de armazenamento em nuvem estará disponível para que os usuários salvem, carreguem, compartilhem e publiquem os próprios programas.

Como configurar o App Engine

O primeiro objetivo é ter sua própria cópia do Blockly em execução no App Engine.

  1. Faça o download e instale o SDK do Python.
  2. Faça login no Google App Engine e crie um aplicativo.
  3. Edite appengine/app.yaml e mude o ID do aplicativo de blockly-demo para o nome do aplicativo que você criou na etapa anterior.
  4. Copie (ou soft-link) os seguintes arquivos e diretórios em appengine/static/:
    • demos/
    • msg/
    • media/
    • *_compressed.js
  5. Opcional: se quiser usar blockly_uncompressed.js no servidor, copie também esse arquivo em appengine/static/, e core em appengine/static/.
  6. Opcional: para executar o Playground Blockly, é necessário copiar os diretórios blocks, generators e tests, além dos arquivos na etapa 5.
  7. Execute o Google App Engine Launcher na GUI, adicione seu diretório appengine como um aplicativo existente e pressione o botão "Implantar". Se você preferir usar a linha de comando, execute: appcfg.py --oauth2 update appengine/.

Depois do upload do Blockly, será possível apontar um navegador para o URL criado na etapa 2. Você verá uma lista de demonstrações, incluindo a demonstração do Cloud Storage.

Como falar com a nuvem

Analise a origem da demonstração do armazenamento em demos/storage/index.html e observe os recursos a seguir. Primeiro, há uma inclusão de script que carrega a API Cloud Storage:

<script src="/storage.js"></script>

Esse script pressupõe que há apenas um espaço de trabalho do Blockly na página. Também há estas definições de mensagem, que você deve modificar conforme desejar:

BlocklyStorage.HTTPREQUEST_ERROR = 'There was a problem with the request.\n';
BlocklyStorage.LINK_ALERT = 'Share your blocks with this link:\n\n%1';
BlocklyStorage.HASH_ERROR = 'Sorry, "%1" doesn\'t correspond with any saved Blockly file.';
BlocklyStorage.XML_ERROR = 'Could not load your saved file.\n' +
    'Perhaps it was created with a different version of Blockly?';

As traduções dessas mensagens para outros idiomas podem ser encontradas no Blockly Games, no diretório JSON (link em inglês).

Salvar os blocos atuais é uma única chamada para BlocklyStorage.link():

<button onclick="BlocklyStorage.link()">Save Blocks</button>

Para restaurar bloqueios salvos no carregamento de página, basta chamar BlocklyStorage.retrieveXml com o hash do URL depois que o Blockly for injetado:

if ('BlocklyStorage' in window && window.location.hash.length > 1) {
  BlocklyStorage.retrieveXml(window.location.hash.substring(1));
}

Armazenamento local

A API storage.js também oferece a capacidade de salvar um único conjunto de blocos no armazenamento local do navegador. Isso pode ser implementado em vez do armazenamento em nuvem, além do armazenamento em nuvem (embora, no último caso, seja preciso ter cuidado com os dois tipos de armazenamento ao tentar restaurar de uma só vez).

Para restaurar blocos do armazenamento local, chame BlocklyStorage.restoreBlocks em um tempo limite logo depois que o Blockly for injetado.

setTimeout(BlocklyStorage.restoreBlocks, 0);

Para fazer backup automático dos blocos no armazenamento local quando o usuário sair da página, chame BlocklyStorage.backupOnUnload. Isso registrará um listener de eventos no evento de descarregamento da página.

BlocklyStorage.backupOnUnload();

Exemplo

Veja uma demonstração em tempo real do armazenamento em nuvem.