1 – Acesso sua conta no github e crie um fork do repositório do Bruno em: https://github.com/rochacbruno/web2py-book

2 – Clone o teu repositório na máquina local para criar o repositório local:

~$ git clone git@github.com:<strong>[teu-usuario-aqui]</strong>/web2py-book.git

3 – Adicione o repositório do Bruno como um repositório remoto ao teu repositório local para poder receber as alterações dos outros tradutores:

~$ cd web2py-book
~$ git remote add repo-original https://github.com/rochacbruno/web2py-book.git

Começando os trabalhos.

Antes de começar a tradução, baixe as ultimas alterações do repositório remoto original. Para baixar as atualizações do repositório remoto, basta executar um fetch:

~$ git fetch repo-original

Se houver alguma alteração, é preciso fazer um merge com o seu repositório local:

~$ git merge repo-original/master

Após o merge, envie as alterações para o teu fork. Para enviar as alterações baixadas do repositório original para o teu fork, basta executar um push:

~$ git push origin master

Definindo o que vai traduzir

Edite o arquivo /web2py-book/sources/37-web2py-portuguese-work-in-progress/translation_status.md inserindo o capítulo/parte que vai traduzir. Aqui tu pode ver quem já esta traduzindo o que, sempre olhe esse arquivo antes de iniciar qualquer coisa.

Salve as alterações, e adicione o arquivo ao teu commit:

~$ git add sources/37-web2py-portuguese-work-in-progress/translation_status.md

Crie um commit para enviar para o teu fork, por exemplo:

~$ git commit -m"traduzindo introdução do capítulo 01"

Envie o commit para teu fork:

~$ git push origin master

Após isso, acesse a tua página no github e clique no botão Pull Request:

Preencha com as informações do teu commit e clique em Send Pull Request:

Aguarde o Bruno fazer o merge com o repositório original. Após ele fazer o merge, baixe a atualização do repositório original e comece a tradução.

Após diversas pesquisas e tentativas para solucionar o problema, encontramos o seguinte passo-a-passo no Ubuntu Forums para remover e reinstalar o plugin do Flash manualmente:

(Certifique-se de que o Firefox não esteja rodando)

Removendo os componentes instalados automaticamente:

sudo apt-get remove -y --purge flashplugin-nonfree gnash gnash-common mozilla-plugin-gnash swfdec-mozilla libflashsupport nspluginwrapper

sudo rm -f /usr/lib/mozilla/plugins/*flash*

sudo rm -f ~/.mozilla/plugins/*flash*

sudo rm -f /usr/lib/firefox/plugins/*flash*

sudo rm -f /usr/lib/firefox-addons/plugins/*flash*

sudo rm -rfd /usr/lib/nspluginwrapper

Reinstalando o plugin do Flash:

sudo apt-get install flashplugin-installer

Feito! Problema resolvido!

Até o Próximo!

1 – Abrir um terminal
2 – Fazer o download do web2py
3 – Alterar o arquivo wscgi.py
4 – Rodar a aplicação

O ambiente em si é muito bom, estável e simples. Tu tem a disposição consoles de python em diversas versões, tudo rodando diretamente do navegador.

E ai está meu deploy, sugiro assistir o video em tela cheia.

Para acessar o curso basta entrar no endereço abaixo:

Abaixo a relação completa das aulas disponíveis:

II. HTML and CSS
-XML, HTML, and XHTML
-CSS, Part 1
-CSS, Part 2
-CSS, Part 3
-CSS, Part 4

III. URLs and Links
-URL Encoding
-Issues with URLs
-No Referential Integrity

VI. Introduction to SQL
-Relational Databases, Part 1
-Relational Databases, Part 2
-Joins
-Other Issues About Databases

VII. Active Record
-Basics of ORM
-Examples
-Relationships Between Tables
-Migration

VIII. HTTP and HTTPS
-HTTP Request-Response Protocol
-Redirection and HTTPS

IX. Cookies and Sessions
-Cookies
-Sessions

X. Forms
-Basics
-Page Flow
-Validation and Error Handling
-Rails Forms, Part 1
-Rails Forms, Part 2
-File Uploads with Rails

XI. Javascript
-Basics
-Functions
-Class System, Part 1
-Class System, Part 2
-Class System, Part 3
-Tying It All Together

XII. The Document Object Model (DOM)
-Basics
-Node
-Operations on Elements
-Coordinates and Positioning

XIII. Events
-Basics
-Access to Event Object
-Problems
-Delivering Events
-Timers and Other Issues

IX. AJAX
-Basic Mechanism
-Higher-Level Example
-Other Approaches

X. Security: Network Attacks
-Summary of Problems
-Encryption
-Certificate Authority and SSL/TLS
-SSL Stripping
-Mixed Content
-”Just in Time” HTTPS
-Bad Certificate

XI. Security: Session Attacks
-Choosing Session IDs
-Cross Site Request Forgery, Part 1
-Cross Site Request Forgery, Part 2
-Data Tampering

XII. Security: Isolation
-Cross-Site Scripting (XSS)
-Relaxations, Part 1
-Relaxations, Part 2
-Language-Based Isolation
-Navigation and Cookies

XIII. Security: Code Injection
-Escape Queries
-Stored XSS
-Reflected XSS

XIV. Security: Phishing Attacks
-Basic Idea
-Legitimate v. Illegitimate
-Certificates
-Other Anti-Phishing Measures

XV. Large-Scale Applications
-Load Balancing
-Sessions and Storage
-RAMCloud
-Scaling and Cloud Computing

XVI. Datacenters
-History
-Structure
-Issues, Part 1
-Issues, Part 2

XVII. Deploying Web Applications
-Part 1
-Part 2
-Part 3
-Part 4

XVIII. Course Wrap-Up
-Web Plumbing, Relational Databases, and Languages
-Rails, Security, and Large-Scale Apps
-Themes
-Future of the Web

É verdade que a muito tempo que existem implementações de jogos web utilizando javascript, ou até mesmo applets java, mas somente agora podemos bater de frente com bons recursos de processamento gráfico e outras perfumarias a mais, chegando ao ponto de muitos já terem decretado a morte do Flash. Não vou chegar a tanto, pois creio que as duas tecnologias possam coexistir pacificamente. Quem optar por ter suas aplicações rodando em qualquer dispositivo que tenha um navegador web, sem precisar instalar nenhum aplicativo adicional, optará por utilizar  a dupla HTML5/Javascript, os que ainda preferirem ficar presos a uma tecnologia proprietária, fechada, e que demanda a instalação de players para poder rodar (não em qualquer lugar), vai continuar a utilizar o Flash. Mas vamos ao que interessa.

Depois de algum tempo pesquisando entre engines de jogos em javascript, entre proprietárias e livres, acabei encontrando a  melonJS, que além de atender às minhas necessidades básica tem uma boa integração com o editor de mapas Tiled Map Editor, uma mão na roda para agilizar a construção de fases para os jogos. É uma engine muito boa, apesar de estar em sua fase inicial acredito que tem um grande potencial.

Esse tutorial vai ser publicado em duas partes, devido a extensão do mesmo, e trata-se de uma livre adaptação do tutorial disponível no site da biblioteca publicado aqui, é basicamente um apanhado geral da utilização da engine para a construção de jogos web, portanto não se entrará em muitos detalhes sobre o funcionamento das funções utilizadas, deixaremos isso para mais tarde a fim de não estender muito o post, ademais a documentação de classes da engine é muito boa e pode ser consultada online a qualquer momento aqui. Sugiro seguir o tutorial com essa documentação aberta para qualquer coisa que não fique bem entendida.

Nessa primeira parte veremos o básico para a criação de uma fase do jogo, e na segunda parte iremos implementar mais funcionalidades como pontuação, tela de menus, áudio, novas fases, etc.

As dependências.

Para seguir esse tutorial, além da engine propriamente dita tu vai precisar ter instalado o Tiled Map Editor; para quem usa o Ubuntu existe um ppa disponível, então basta adicionar e instalar com o apt-get:

$ sudo apt-get install tiled

Criei um repositório no git para esse tutorial para compartilhar os recursos utilizados (áudio, imagens, biblioteca, etc.),  e um esqueleto da estrutura de arquivos, basta clonar o repositório, ou baixar o pacote clicando aqui.

Mas tu pode ficar a vontade para utilizar os recursos que quiser, e caso tu seja que nem eu que não tem talento nenhum para artes gráficas, tu pode dar uma passada no Open Game Art que tem diversos materiais livres para o desenvolvimento de jogos prontos, além de alguns efeitos sonoros, tu também pode encontrar bastante material no Open Clipart é bem genérico e tem uma infinidade de gráficos para a utilização livre, com a vantagem de estarem todos no formato SVG, uma mão na roda para edição com o Inkscape, eu peguei alguns gráficos de lá para construir o meu tileset e as sprites para esse tutorial, e um bom lugar para encontrar áudio é o CCMixter.

Vamos por a mão na massa então.

Esse post não pretende ser um tratado completo sobre a criação de jogos, mas vamos tentar seguir uma linha básica de desenvolvimento. Dentro das limitações impostas pela falta de criatividade conhecimento na utilização de ferramentas gráficas,  eu lhes apresento:

1 – A História do Jogo

Indiana Tux é um arqueólogo aventureiro que está a procura do Grande Diamante Vermelho, uma joia raríssima, mas para isso ele vai ter que entrar no território dos Macacos Zumbis Radioativos. Enquanto ele coleta joias e tesouros pelo caminho, ele tem que se esquivar da macacada maldita que fará de tudo para impedir que nosso herói tenha sucesso em sua empreitada.

OK que o personagem não é nem um pouco original, e que a história e meio fru-fru, mas serve para o propósito.

2 – Criando uma fase utilizando Tiled Map Editor.

Vamos então partir para a segunda etapa do projeto que é a criação das fases do jogo utilizando a ferramenta Tiled Map Editor. Primeiramente será necessário alterar as configurações do editor, a engine suporta apenas mapas codificados em XML ou Base64 sem compressão, então acesse o menu Editar->Preferências e altere as configurações conforme a imagem abaixo:

Vamos utilizar Base64 para obter um arquivo de tamanho menor.

Bom, agora tu tem que criar o mapa, vou seguir as dimensões utilizadas no tutorial original. O tamanho da tela do jogo vai ser de 640×480. Também construí um pequeno tileset com as dimensões de 32×32.

Clique no botão para criar um novo mapa e deixe as configurações conforme a imagem abaixo:

O tamanho do mapa é relativo o número de tiles, nesse caso 15 tiles de altura por 40 tiles de largura, e o tamanho do tile é o que tu usou para criar o seu tileset.

Quando tu cria um novo mapa, é criado uma camada de tiles automaticamente. Também já criei uma nova camada para inserir outros elementos do jogo, para dar uma aparência melhor na disposição dos mesmos. Para criar uma nova camada basta selecionar a opção adicionar nova camada, conforme imagem abaixo:

Agora vamos carregar o tileset criado, clique no menu Mapa->Novo Tileset e carregue a imagem do tileset que vai ser utilizada, conforme imagem abaixo:

Feito isso, tu deverá agora ter essa disposição no editor (clique na imagem para ampliar):

Agora é só construir o cenário, o processo é bem simples basta selecionar o tile e posicioná-lo no local do mapa aonde você quer que ele fique posicionado. Apenas atente para o fato de selecionar a camada em que seus tiles ficarão posicionados, nessa caso vamos utilizar a camada frontal para o chão e a vegetação, e as lápides vamos inserir na camada background. O meu mapa ficou assim (clique na imagem para ampliar):

Concluída a inserção dos tiles, vamos definir uma cor de fundo para o mapa. Clique no menu Mapa->Propriedades do Mapa e adicione uma nova propriedade background_color. O valor é no formato CSS:

Estando aqui, tu já concluiu essa etapa. Agora salve o mapa dentro da estrutura de arquivos que foi criada para o jogo, se tu clonou o repositório git, basta salvar o mapa dentro do diretório data.

3 – Carregando o Mapa no Jogo.

Agora iremos carregar o mapa criado em nosso jogo. Se tu clonou o repositório, ou baixou o pacote, tu deve ter um arquivo main.js, caso não tenha feito, crie um arquivo com o seguinte conteúdo:

// game resources
var g_resources = [];
var jsApp = {
    /* --- Initialize the jsApp --- */
    onload: function() {

    // init the video
    if (!me.video.init('jsapp', 640, 480, false, 1.0)) {
        alert("Sorry but your browser does not support html 5 canvas.");
        return;
    }

    // initialize the "audio"
    me.audio.init("mp3,ogg");

    // set all resources to be loaded
    me.loader.onload = this.loaded.bind(this);

    // set all resources to be loaded
    me.loader.preload(g_resources);

    // load everything & display a loading screen
    me.state.change(me.state.LOADING);
},

    /* --- callback when everything is loaded --- */
    loaded: function() {

    // set the "Play/Ingame" Screen Object
    me.state.set(me.state.PLAY, new PlayScreen());

    // start the game
    me.state.change(me.state.PLAY);
}

};
// jsApp

/* the in game stuff*/
var PlayScreen = me.ScreenObject.extend({

onResetEvent: function() {
// stuff to reset on state change
},

/* --- action to perform when game is finished (state change) --- */
onDestroyEvent: function() {
}

});

//bootstrap
window.onReady(function() {
jsApp.onload();
});

O Arquivo em sim não é muito complexo, o que temos aí é o carregamento de áudio, recursos e o desenho da tela do jogo assim que a página é carregada. Também é definido um callback que será chamado quando tudo estiver pronto para ser usado.  Não vou me atentar às classes utilizadas, em um momento vindouro vamos estudar cada uma delas em detalhe, mas tu pode consultar a documentação a qualquer momento através do link passado no início do tutorial.

O mapa que foi criado para o jogo, será adicionado através do objeto g_resources:

var g_resources = [{
    name: "tile",
    type: "image",
    src: "data/tileset/tile.png"
}, {
    name: "mapa",
    type: "tmx",
    src: "data/mapa.tmx"
}];

O que fizemos aí foi informar o tileset que estamos utilizando, e o mapa no qual ele esta aplicado. Agora, incluiremos na função onResetEvent(), que é chamada a cada mudança de estado, que seja mostrada na tela os elementos de nosso jogo:

onResetEvent: function() {
    me.levelDirector.loadLevel("mapa");
 }

Também tem disponível no pacote um arquivo index.html, que é o arquivo que será chamado para a execução do jogo. Se tudo ocorrer bem, ao carregar o arquivo no teu navegador tu deve ter o mapa carregado conforme imagem abaixo.

NOTA: Devido à questões de segurança do Google Chrome, para rodar o jogo localmente nesse navegador vai ser necessário carregá-lo com o seguinte parâmetro: –allow-file-access-from-files. No Firefox 6 rodou direito, já no Opera não foi possível carregar o mapa, como não é meu navegador padrão vou ter que dar uma pesquisada a respeito, mas segundo o desenvolvedor da biblioteca deveria funcionar sem problemas.

Perceba que ficou uma grade nos encaixes dos tiles inferiores, e um traço do lado da pedra e das lápides, mas não se preocupe, isso é um problema com o tamanho dos elementos do meu tileset, pois fiz isso na corrida, e acabou ficando esse espaçamento; em outro post veremos como construir um tileset de qualidade melhor, aonde iremos consertar esses problemas.

Bola pra frente.

4 – A jornada do herói

Joseph Campbell que me perdoe pela utilização do título de uma de suas obras clássicas (que aliás é leitura obrigatória para quem pretende ingressar nesse universo de criar aventuras), mas cai como uma luva para essa parte do tutorial, pois é aqui que iremos dar vida ao nosso personagem principal do jogo, ele mesmo: o Indiana Tux.

O jogador sera criado estendendo-se a classe me.ObjectEntity da engine. Para a animação do dito cujo, irei usar essa sprite que criei do mesmo:

É um sprite bem simples feito só pra dar uma sensação de movimento, não tive nenhuma intenção de simular um ciclo de caminhada perfeito, mas não quer dizer que tu não devas, se tiveres o dom o faça. Mais uma vez atento aqui para a utilização de um daqueles portais de recursos gráficos livres para quem, assim como eu, não tem muita intimidade com aplicativos de produção gráfica; esse chapéu do Indiana Tux eu não precisei criar, peguei pronto já no Open Clipart. Como todos os gráficos estão disponíveis no formato SVG, foi muito simples utilizá-lo nesse pinguin-ovo que eu criei utilizando o Inkscape.

Nesse tutorial nosso herói irá apenas andar e pular. Nos próximos vamos aplicar mais interatividade, mas para isso teremos que ter um sprite mais elaborado com outras animações.

Bem, vamos carregar o personagem no jogo então. Logo abaixo do carregamento do mapa vamos inserir o seguinte trecho de código:

{
 name: "indiana_tux",
 type: "image",
 src: "data/sprite/indiana_tux.png"
}

Veja que o formato é o mesmo utilizado anteriormente para a inserção do mapa e do tileset.

Agora vamos instanciar nosso personagem:

/*----- a player entity ---------- */
var PlayerEntity = me.ObjectEntity.extend({

     /* ----- constructor ------ */
      init: function(x, y, settings) {
            // call the constructor
            this.parent(x, y, settings);

            // set the walking & jumping speed
            this.setVelocity(3, 15);

           // set the display to follow our position on both axis
            me.game.viewport.follow(this.pos, me.game.viewport.AXIS.BOTH);

 },

 /* ----- update the player pos------ */
 update: function() {

      if (me.input.isKeyPressed('left')) {
              this.doWalk(true);
        }else if (me.input.isKeyPressed('right')) {
              this.doWalk(false);
       } else {
              this.vel.x = 0;
      }
      if (me.input.isKeyPressed('jump')) {
          this.doJump();
      }

       // check & update player movement
       updated = this.updateMovement();

       // update animation
       if (updated) {
          // update objet animation
          this.parent(this);
        }
      return updated;
  }

});

Mais uma vez o código é bem ilustrativo, estendemos a classe para cria nosso personagem, setamos a velocidade do personagem e definimos a posição da câmera do jogo, além de verificar se algumas teclas foram pressionadas para controlar a movimentação do personagem. E finalmente testamos o retorno da função updateMovement(), que faz parte da classe e permite controlar a animação do personagem.

Estou inserindo a codificação do personagem no mesmo arquivo main.js que trata do carregamento do jogo e dos seus recursos, mas para fins de organização é mais indicado que o mesmo seja criado em um arquivo separado e posteriormente lincado. Mas fica a critério de cada um.

Feito  isso vamos agora voltar ao Tiled Map Editor e inserir nosso personagem no mapa. Clique na opção de Adicionar Nova Camada, e adicione uma Camada de Objeto. Renomeie a camada para playerTux, ou o nome que tu quiser.

Agora vamos inserir um objeto na cena, que será o nosso personagem, para tanto clique no botão Inserir Objetos e em seguida clique em algum lugar da tela aonde ficará posicionado o objeto, não se preocupe com o local pois iremos definir nas propriedades, o botão é esse selecionado na imagem abaixo:

Feito isso clique no botão à esquerda do botão Inserir Objetos, esse botão tem a função de Selecionar Objetos, e em seguida selecione o objeto que tu criou. Clique com o botão direito em cima do objeto, selecione a opção Propriedades do Objeto e configure conforme a imagem abaixo:

O Nome não tem muita importância, apenas lembre que tu vai utilizar esse mesmo para carregar o personagem na função de carregamento do jogo, a opção Tipo podes deixar em branco mesmo. A seguir em Posição, tu vai definir aonde quer que o objeto, nesse caso o Indiana Tux, inicie no jogo, definido pela quantidade de tiles no eixo X e a quantidade tiles no eixo Y. O Tamanho do objeto também é apresentado em quantidade de tiles, nesse caso construí o Indiana Tux com 2 tiles de altura por 2 de largura. A propriedade image recebe como valor o nome da imagem do sprite utilizado no objeto, aqui sim o nome é importante, portanto utilize o mesmo que foi utilizado no sprite, a propriedade spritewidth recebe como valor a largura, em pixels, que um elemento da sprite ocupa, como o Indiana Tux tem a largura de 2 tiles de 32 pixels, logo ele ocupa 64 pixels de largura.

Clique em OK e o objeto será reposicionado no mapa, conforme podes ver na imagem abaixo:

Perceba que o indiana ficou meio ‘gordo’ para esse mapa de tiles, mas isso não é problema, pois a nossa intenção aqui é apenas ilustrar o funcionamento da engine, pretendo focar esse, e outros detalhes relacionados à construção gráfica em uma outra ocasião.

Vamos agora criar uma camada de tiles de colisão, pois precisamos dizer para a engine quais são os tiles com os quais nosso personagem deve interagir fisicamente, nesse caso aqui para evitar que ele atravesse paredes ou o chão. Para tanto vamos primeiramente adicionar um novo tileset no mapa. No material que disponibilizei no git, tem um tileset chamado  colisao.png, vamos utilizar essa imagem para a construção do mapa:

O procedimento é o mesmo realizado anteriormente apara caregar o tileset do mapa inicial.

Agora acesse a aba desse novo tileset, clique com o botão direito em cima do primeiro tile e selecione a opção Propriedades do Tile, e vamos inserir uma propriedade conforme a imagem abaixo:

Repita o procedimento com o segundo tile, e defina uma propriedade type com o valor platform.

É isso aí. Existem outras propriedades que não iremos cobrir nesse tutorial. Agora adicione uma Nova Camada de Tiles e renomeie-a para Collision, esse nome é obrigatório para que a engine reconheça a mesma como uma camada de colisão. Feito isso, selecione a camada e comece a posicionar os tiles de acordo com o tu mapa, por aqui as coisas ficaram mais ou menos assim:

Salve o mapa e insira o seguinte código no nosso callbak:

// add our player entity in the entity pool
 me.entityPool.add("indianaTux", PlayerEntity);

 // enable the keyboard
 me.input.bindKey(me.input.KEY.LEFT, "left");
 me.input.bindKey(me.input.KEY.RIGHT, "right");
 me.input.bindKey(me.input.KEY.X, "jump", true);

Salve e abra o projeto no navegador novamente, se tudo ocorreu bem tu já deve ter uma fase completamente acessível, conforme podes ver no vídeo abaixo:

01 – Player do Jogo from Relsi on Vimeo.

Note pelo game play, que realmente o Indiana Tux ficou um pouco desproporcional em relação ao mapa. E também que não existe colisão com os tiles do lago e as estacas, mas isso é pra ser assim mesmo por enquanto, depois arrumaremos. Ele também vai ficar preso sem conseguir sair de uma parte do mapa, mas isso deixo como exercício para vocês encontrar e resolverem.

Em tempo. Quando criamos o personagem automaticamente é criado uma caixa de colisão ao redor do mesmo, podemos observar isso inserindo a seguinte opção no arquivo main.js:

me.debug.renderHitBox = true;

Mas perceba que a caixa de colisão é bem maior que o personagem, sendo assim, o Indiana Tux, propriamente dito, não irá colidir com os objetos do jogo e sim a sua caixa de colisão, mas não primeos cânico isso pode ser resolvido inserindo o seguinte código na instância do personagem:

this.updateColRect(8, 48, -1, 0);

O que fizemos foi ajustar o tamanho da caixa de colisão de acordo com os parâmetros passados, relativos à dimensão do tile:

Agora sim temos uma caixa de colisão do tamanho adequado. Vamos em frente.

5 – Inserindo um fundo com efeito Parallax

Vamos agora criar um fundo para o nosso jogo a fim de substituir a cor azul chapada, isso vai proporcionar um ambiente melhor para o nosso joguinho. A utilização de feitos Parallax é muito comum em jogos desse gênero pois da um efeito de profundidade para o mesmo.

Inserir um fundo com esse efeito é muito fácil utilizando o editor de mapas, e não será necessário uma linha de código sequer para o efeito funcionar, a não ser as necessárias para carregar o elemento gráfico utilizado.

Aqui vou utilizar apenas duas imagens de fundo, mas tu podes utilizar a quantia que desejar para obter um efeito mais complexo, apenas atente para o fato de que isso pode influenciar na performance do jogo, nesse caso menos é mais. A imagem utilizada foi compostas a partir de gráficos baixados do Open Clipart (clique para aumentar):

Vamos excluir a propriedade background_color do mapa, pois ela não será mais necessária. Em seguida crie duas novas camadas de tiles e renomeie-as tendo a atenção para que o nome seja composto pela string Parallax_ pois a mesma serve de identificador para que a engine possa aplicar esse efeito:

Feito isso, adicione às camadas uma propriedade imagesrc tendo como valor o nome da imagem utilizada, sem a extensão:

Agora, temos que inserir os elementos gráficos a serem carregados no jogo através do código:

{
 name: "fundo_01",
 type: "image",
 src: "data/background/fundo_01.png"
},{
 name: "fundo_02",
 type: "image",
 src: "data/background/fundo_02.png"
}

Abaixo um vídeo do efeito em execução:

6 – Inserindo Itens coletáveis

Embora o Indiana Tux esteja atrás do Grande Diamante Vermelho, vamos inserir no cenário do jogo alguns objetos que possam ser coletados pelo mesmo. Itens coletáveis podem ser adicionados facilmente estendendo a classe me.CollectableEntity.

Vamos usar a sprite abaixo para os itens coletáveis:

Devemos carregar a imagem nos recursos do jogo, da mesma forma que fizemos com os outros elementos até então:

{
 name: "rubi",
 type: "image",
 src: "data/sprite/rubi.png"
}

Em seguida devemos criar o elemento no jogo, estendendo a classe me.CollectableEntity:

var RubiEntity = me.CollectableEntity.extend(
 {
     init: function (x, y, settings)
         {
            // call the parent constructor
            this.parent(x, y , settings);
         }

 });

Por enquanto esse é o código necessário para o construtor, vamos definir as propriedades do item no editor, para isso crie uma nova camada de objetos e renomeie como desejar, em seguida crie um novo objeto e defina as suas propriedades conforme a imagem abaixo:

Para inserir mais objetos no mapa, basta clicar com o botão direito no mesmo e escolher a opção Duplicar Objeto. Selecionando vários objetos tu consegue duplicar tantos quanto tiver na seleção.

Agora baste adicionar o item no jogo:

me.entityPool.add("Rubi", RubiEntity);

Execute o jogo, e tu deve ter esse resultado até aqui:

Bem, até o momento os rubis são apenas objetos comuns do cenário, precisamos dizer para o nosso personagem que ele deve colidir com eles, dentro da classe do personagem insira a seguinte função:

me.game.collide(this);

Execute o jogo e veja o efeito, ao colidir com o rubi, o mesmo deverá sumir do mapa.

7 – Adicionando Inimigos

Nem tudo na vida do Indiana Tux vai ser fácil como coletar alguns rubis durante a sua jornada, para chegar até o Grande Diamante Vermelho ele vai ter enfrentar os Macacos Radioativos, que irão tentar impedir o nosso herói de alcançar seu objetivo. Vamos agora adicionar alguns inimigos no jogo. Para fazer isso também iremos estender a classe me.ObjectEntity.extend. A sprite utilizada será essa:

Assim como o Indiana Tux, a sprite é bem simples.

Vamos inserir o Macaco Radioativo no mapa. Para isso crie uma nova Camada de Objetos, renomeie conforme desejar e insira um novo objeto. Nas propriedades desse objeto insira apenas o Nome, as demais propriedades iremos setar via código fonte, para que tu possas ver que ambas as formas são possíveis (lembre que até então inserimos as propriedades no editor).

Também precisaremos aumentar o tamanho do objeto de acordo com a área que queremos que ele ocupe, que nesse caso vai ser a área em que o macaco irá caminhar, para fazer isso basta posicionar o ponteiro do mouse no quadradinho que se encontra no canto inferior direito da moldura do objeto e arrastar para aumentar ou diminuir a área:

Para inserir mais objetos no mapa, repita o mesmo procedimento feito com os rubis.

Salve o mapa e, para criar o inimigo  vamos adicionar o seguinte código no nosso arquivo main.js:

/***** Enemy Entity    ****/
 var MacacoEntity = me.ObjectEntity.extend(
     {
         init: function (x, y, settings)
             {
               // define this here instead of tiled
               settings.image = "macaco_radioativo";
               settings.spritewidth = 64;

               // call the parent constructor
               this.parent(x, y , settings);

               this.startX = x;
               this.endX   = x+settings.width - settings.spritewidth;
               // size of sprite

              // make him start from the right
              this.pos.x = x + settings.width - settings.spritewidth;
              this.walkLeft = true;

              // walking & jumping speed
              this.setVelocity(2, 0);

             // adjust the bounding box
             this.updateColRect(8, 48, -1, 0);

             // make it collidable
             this.collidable = true;
             this.type = me.game.ENEMY_OBJECT;
     },

     // manage the enemy movement
     update : function ()
          {
              if (this.alive)
                 {
                   if (this.walkLeft && this.pos.x <= this.startX)
                      {
                         this.walkLeft = false;
                      }
                   else if (!this.walkLeft && this.pos.x >= this.endX)
                      {
                        this.walkLeft = true;
                       }

                   //console.log(this.walkLeft);
                   this.doWalk(this.walkLeft);
                 }
             else
                 {
                    this.vel.x = 0;
                 }
             // check & update movement
             updated = this.updateMovement();

             if (updated)
                {
                  // update the object animation
                  this.parent();
                }
             return updated;
       }
 });

O mesmo é um pouco mais extenso, pois na classe definimos as propriedades do objeto via código e em seguida a função para o movimento do Macaco. Ffizemos isso dessa forma, apenas para ti ver que existem as duas possibilidades de inserção dessas propriedades do objeto, diretamente no Tiled ou através do código fonte da classe. Tu decide qual a melhor maneira de lidar com isso.

Devemos então carregar os elementos gráficos do macaco:

{
 name: "macaco_radioativo",
 type: "image",
 src: "data/sprite/macaco_radioativo.png"
}

E em seguida carregamos o inimigo no jogo:

me.entityPool.add("macacoMau", EnemyEntity);

Execute o jogo, e se tudo estiver certo, teremos a macacada em ação na tela do jogo:

Agora vamos criar a interação dos macacos com nosso herói, perceba que simplesmente não há nenhum tipo de colisão entre os dois vamos implementar isso agora.

Na classe do Indiana Tux, altere o seguinte trecho:

me.game.collide(this);

Para:

res = me.game.collide(this);

E logo abaixo insira o seguinte código:

if (res)
    {
        if (res.type == me.game.ENEMY_OBJECT)
         {
           // let's flicker in case we touched an enemy
           this.flicker(45);
         }
}

O que fizemos aqui foi simplesmente passar o o retorno da função me.game.collide(this) para a variável res, em seguida verificamos se  o tipo do retorno é igual a  me.game.ENEMY_OBJECT, se for significa que topamos com um inimigo, nesse caso fazemos o Indiana Tux ficar piscando:

Por enquanto é isso que o Indiana Tux irá pagar por topar com um Macaco Radioativo.

Para completar essa etapa, vamos dar ao Indiana Tux a capacidade de causar algum dano ao Macaco Radioativo também.

Insira o seguinte código na classe do macaco:

// call by the engine when colliding with another object
// obj parameter corresponds to the other object (typically the player)
//touching this  one
onCollision : function (res, obj)
     {
        // res.y >0 means touched by something on the bottom
        // which mean at top position for this one
       if (res.y > 0)
           {
              this.flicker(45);
        }
}

Código auto explicativo né?!?

E na classe do Indiana altere o código:

if (res)
    {
        if (res.type == me.game.ENEMY_OBJECT)
            {
                 // let's flicker in case we touched an enemy
                 this.flicker(45);
         }
}

Para:

if (res)
{
    if (res.type == me.game.ENEMY_OBJECT)
        {
            if ((res.y>0) && !this.jumping)
               {
                 // bounce
                 this.forceJump();
                }
            else
               {
                // let's flicker in case we touched an enemy
                this.flicker(45);
               }
       }
}

Aqui adicionamos outra condição que verifica se o Indiana pulou na cabeça do Macaco, e nesse caso vai forçar o indiana a pular novamente, o que ir impedir que ele seja atingido pelo Macaco, nesse caso só o Macaco irá piscar:

Por enquanto é isso pessoal. até aqui deu para ter uma noção básica do funcionamento da engine, e para quem quiser se aprofundar mais sem esperar pela segunda parte, basta consultar a documentação da engine.

Segue a listagem completa do arquivo main.js até então:

// game resources
var g_resources = [{
    name: "tile",
    type: "image",
    src: "data/tileset/tile.png"
}, {
    name: "mapa",
    type: "tmx",
    src: "data/mapa.tmx"
},{
    name: "indiana_tux",
    type: "image",
    src: "data/sprite/indiana_tux.png"
},{
    name: "fundo_01",
    type: "image",
    src: "data/background/fundo_01.png"
},{
    name: "fundo_02",
    type: "image",
    src: "data/background/fundo_02.png"
},{
    name: "rubi",
    type: "image",
    src: "data/sprite/rubi.png"
},
{
   name: "macaco_radioativo",
   type: "image",
   src: "data/sprite/macaco_radioativo.png"
}];

//me.debug.renderHitBox = true;

/*----- a player entity ---------- */
var PlayerEntity = me.ObjectEntity.extend({

    /* ----- constructor ------ */
    init: function(x, y, settings) {
        // call the constructor
        this.parent(x, y, settings);

        // set the walking & jumping speed
        this.setVelocity(3, 15);

        // adjust the bounding box
        this.updateColRect(8, 48, -1, 0);

        // set the display to follow our position on both axis
        me.game.viewport.follow(this.pos, me.game.viewport.AXIS.BOTH);
    },

    /* ----- update the player pos------ */
    update: function() {

        if (me.input.isKeyPressed('left')) {
            this.doWalk(true);
        } else if (me.input.isKeyPressed('right')) {
            this.doWalk(false);
        } else {
            this.vel.x = 0;
        }
        if (me.input.isKeyPressed('jump')) {
            this.doJump();
        }

        // check & update player movement
        updated = this.updateMovement();

          // check for collision
         res = me.game.collide(this);

          if (res)
         {
            if (res.type == me.game.ENEMY_OBJECT)
            {
               if ((res.y>0) && !this.jumping)
               {
                  // bounce
                  this.forceJump();
               }
               else
               {
                  // let's flicker in case we touched an enemy
                  this.flicker(45);
               }
            }
         }

        // update animation
        if (updated) {
            // update objet animation
            this.parent(this);
        }
        return updated;
    }

});

 /*-- Collectable Entity --*/
var RubiEntity = me.CollectableEntity.extend(
{
init: function (x, y, settings)
{
// call the parent constructor
this.parent(x, y , settings);

}

});

/***** Enemy Entity	****/
	var MacacoEntity = me.ObjectEntity.extend(
	{
		init: function (x, y, settings)
		{
			// define this here instead of tiled
			settings.image = "macaco_radioativo";
			settings.spritewidth = 64;

			// call the parent constructor
			this.parent(x, y , settings);

			this.startX = x;
			this.endX   = x+settings.width - settings.spritewidth; // size of sprite

			// make him start from the right
			this.pos.x = x + settings.width - settings.spritewidth;
			this.walkLeft = true;

         // walking & jumping speed
			this.setVelocity(2, 0);

          // adjust the bounding box
         this.updateColRect(8, 48, -1, 0);

         // make it collidable
			this.collidable = true;
			this.type = me.game.ENEMY_OBJECT;

		},

	   // call by the engine when colliding with another object
      // obj parameter corresponds to the other object (typically the player)	touching this one
		onCollision : function (res, obj)
		{

			// res.y >0 means touched by something on the bottom
			// which mean at top position for this one
			if (res.y > 0)
			{
		      this.flicker(45);
			}
		},

		// manage the enemy movement
		update : function ()
		{

			if (this.alive)
			{
				if (this.walkLeft && this.pos.x <= this.startX)
				{
					this.walkLeft = false;
				}
				else if (!this.walkLeft && this.pos.x >= this.endX)
				{
					this.walkLeft = true;
				}

				//console.log(this.walkLeft);
				this.doWalk(this.walkLeft);
			}
			else
			{
				this.vel.x = 0;
			}
			// check & update movement
			updated = this.updateMovement();

			if (updated)
			{
				// update the object animation
				this.parent();
			}
			return updated;
		}
	});

var jsApp = {
    /* --- Initialize the jsApp --- */
    onload: function() {

        // init the video
        if (!me.video.init('jsapp', 640, 480, false, 1.0)) {
            alert("Sorry but your browser does not support html 5 canvas.");
            return;
        }

        // initialize the "audio"
        me.audio.init("mp3,ogg");

        // set all resources to be loaded
        me.loader.onload = this.loaded.bind(this);

        // set all resources to be loaded
        me.loader.preload(g_resources);

        // load everything & display a loading screen
        me.state.change(me.state.LOADING);
    },

    /* --- callback when everything is loaded --- */
    loaded: function() {

        // set the "Play/Ingame" Screen Object
        me.state.set(me.state.PLAY, new PlayScreen());

       // add our player entity in the entity pool
		me.entityPool.add("indianaTux", PlayerEntity);
        me.entityPool.add("Rubi", RubiEntity);
        me.entityPool.add("macacoMau", MacacoEntity);

		// enable the keyboard
		me.input.bindKey(me.input.KEY.LEFT, "left");
		me.input.bindKey(me.input.KEY.RIGHT, "right");
		me.input.bindKey(me.input.KEY.X, "jump", true);

        // start the game
        me.state.change(me.state.PLAY);
    }

};
// jsApp

/* the in game stuff*/
var PlayScreen = me.ScreenObject.extend({

    onResetEvent: function() {
        // stuff to reset on state change

        // load a level
        me.levelDirector.loadLevel("mapa");
    },

    /* --- action to perform when game is finished (state change) --- */
    onDestroyEvent: function() {
    }

});

//bootstrap  
window.onReady(function() {
    jsApp.onload();
});

Na segunda parte do tutorial iremos:

• Adicionar um sistema de pontuações.
• Adicionar efeitos sonoros.
• Adicionar outros níveis (fases do jogo).
• Criar uma tela de menu.
• Implementar as ações decorrentes da colisão do Indiana com o Macaco e os Rubis, como criar pontuação, retirar vidas, etc.

Até o Próximo!

Com grande honra convido a Comunidade Debian, e o Nerdedo em geral, a desfrutar de algumas horas no próximo dia 27 de Agosto, Sábado, para a obtenção de conhecimento através de palestras, debate, lighting talks e claro, um bate-papo amistoso, na edição 2011 do Debian Day, promovido pelo Debian-RS em parceria com ASL.org, OpenCode, Esade, TeHospedo e Tchelinux.org

Com o tradicional Welcome Coffee do Debian-RS e Sorteio de Camisetas

O evento será realizado na Esade, unidade Cidade Baixa, à Rua Luis Afonso, 84, a poucos metros do Zaffari da Rua General Lima e Silva.

Grade do evento:

• 9h – 9h 30m – Recepção e Café de Boas-Vindas
• 9h 30m – 10h – Abertura e Sobre Debian-RS
• 11h – 12h – Não sou programador, como posso ajudar o Projeto Debian?
• 12h – 12h 30m – 3 Lighting Talk sobre Software Livre
• 12h 30m – 13h 30m – Almoço (cada um por sí)
• 13h 30m – 14h 30m – Administradores de Sistemas e suas Gambiarras
• 14h 30m – 15h 30m – Uso de ferramentas OpenSource para Análise Forense (pós mortem)
• 15h 30m – 16h – Coffee-break
• 16h – 17h – Comunicação e Software Livre
• 17h – 18h – Debate sobre Comunidades, Oportunidades, Comunicação e Software Livre
• 18h – 18h 30m – 3 Lighting Talk sobre Software Livre
• 18h 30m – 19h – Encerramento

Inscrições:  Clique Aqui

Resumo das Palestras:

Título: Não sou programador, como posso ajudar o Projeto Debian?

Resumo da Palestra: Essa não é uma palestra técnica, mas visa explicar como o Projeto Debian trabalha em diversas frentes, permitindo que qualquer pessoa ajude com suas aptidões e desejos de trabalho. O palestrante deve visitar os sites sugeridos na própria palestra.

Resumo do Palestrante: Luiz Guaraldo é Analista de Suporte GNU/Linux, Líder dos Grupos de Usuários Debian-RS e LTSP-BR, gaúcho por opção. Site pessoal: http://www.universolivre.net.br

Título: 3 Lighting Talk sobre Software Livre

Resumo da Palestra: Espaço aberto a presentes falarem, por 10 minutos no máximo, sobre alguma experiência pessoal ou de terceiros, um relato sobre pesquisa, algum conhecimento útil, ou outra coisa desde que tenha alguma fundamentação em Software Livre, ou sendo mais simplório, pode ser a chance de se lançar fazendo um stand-up comedy mesmo.

Título: Administradores de Sistemas e suas Gambiarrasr

Resumo da Palestra: Palestra voltado a SysAdmins com técnicas que não devem ser feitas para administração de sistemas e servidores, palestra com didática divertida e muito bom humor.

Resumo do Palestrante: João Fracassi é Técnico de Suporte N2 na empresa Kenta Informática, com experiência em SysAdmin, resolução de problemas em ambiente de sistema (software/hardware), redes. É acadêmico na área de técnologia da informação e Dell Certified System Expert Certification, Microsoft Certified Professional, Novell Certified Linux Administrator e Linux User#524982 e Daniel Lara é Administrador rede na empresa Rede Host, com experiência em administração de redes Linux. É Acadêmico na área de técnologia da informação, System Administrator, Network Administrator e Linux User #452387r

Título: Uso de ferramentas OpenSource para Análise Forense (pós mortem)

Resumo da Palestra: Uso de ferramentas OpenSource para Análise Forense (pós mortem)

Resumo do Palestrante: Leandro Godoy é Consultor da OpenCode Consulting com anos de experiência na área de Software Livre, com vários clientes e contribuições a comunidade Debian, dentre outras

Título: Comunicação e Software Livre

Resumo da Palestra: Grande parte das informações absorvidas pelas sociedade se dá através da veiculação de informações em órgãos de imprensa. Para que as tecnologias de código aberto e a filosofia do software livre sejam introduzidas com maior facilidade no universo de conhecimento da sociedade de uma maneira geral, é importante que as informações sejam familiares aos profissionais de comunicação, que, em última análise, tornam-se formadores de opinião.

Dessa forma, nota-se a importância de que comunidades que fomentam o uso de software livre e empresas que atuam nesse ramo de negócios se apropriem também de conhecimentos em comunicação social. Esta palestra pretende apresentar, através de pesquisa, o entendimento de jornalistas de diversos veículos de imprensa do RS, além de cases de projetos de comunicação em software livre e dicas sobre procedimentos na área de comunicação.

Resumo do Palestrante: Rochele Prass é graduada em Letras, foi professora de Literatura e Língua Portuguesa. Atualmente, é acadêmica de Jornalismo, área em que atua desde 2004. Passou pela Agência de Notícias do curso de Comunicação da Universidade do Vale do Rio dos Sinos, foi âncora do programa de Rádio Reunião de Pauta da Rádio Unisinos.

Atuou na Rádio do Governo do Estado do RS, na Comunicação Social da Assembleia Legislativa do RS. Também foi repórter e produtora nas Rádios Bandeirantes AM e Band News FM de Porto Alegre e atuou na área de Assessoria de Imprensa Empresarial. Foi co-editora da Revista BrOffice.org e atuou na Assessoria de Imprensa do BrOffice.org – Projeto Brasil. Recentemente, fundou e edita o www.iniciativalivre.com.br, portal de notícias de Tecnologia da Informação.

Título: Debate sobre Comunicação e Software Livre, Comunidades, Oportunidades, Negócios em Software Livre

Resumo da Palestra: Um reunião aberta dos palestrantes anteriores, em conjunto com participantes, para debater sobre os assuntos títulos, seguindo uma continuação da palestra anterior com o acréscimo de informações e diálogo sobre, O que é a Comunidade Software Livre (que por incrivel que parece, há dúvidas), Oportunidades da área para quem está, ou não, em começo de carreira, e um pouco sobre Negócios e como se obter ter uma vida profissional trabalhando-se com Software Livre.

Resumo do Palestrante: Todos os anteriores, com o acréscimo de Luiz Henrique Rauber Rodrigues, que é Profissional Liberal na Área de TI, atualmente prestando serviço de consultoria a clientes da VSV Sistemas, já tendo atuado com serviços in company para clientes como Araujo Abreu Engenharia. Foco trabalho em Gerenciamento de Projetos, Gestão de TI, Gestão Empresarial, Melhorias de Processos, Organização de Equipes, e o que mais for constatado que aumente a produtividade empresarial. Já contribuiu palestrando/organizando eventos sobre Linux, Metodologias Ágeis (Agile), OpenOffice (BrOffice) e Negócios com Software Livre, em eventos como os da Tchelinux, Debian-RS, fisl, IIBA, PMI-RS, FLISOL, Latinoware dentro outros.

Título: 3 Lighting Talk sobre Software Livre

Resumo da Palestra: Espaço aberto a presentes falarem, por 10 minutos no máximo, sobre alguma experiência pessoal ou de terceiros, um relato sobre pesquisa, algum conhecimento útil, ou outra coisa desde que tenha alguma fundamentação em Software Livre, ou sendo mais simplório, pode ser a chance de se lançar fazendo um stand-up comedy mesmo.

Baixe a sua agora clicando aqui.

O funcionamento é bem simples, tu passa como parâmetro uma localização e o geocode te retorna a latitude e longitude da localização.

Para esse exemplo vamos criar uma nova aplicação no web2py chamada google_maps e editar o controlador default da aplicação alterando a função index():

def index():
    from gluon.tools import geocode
    coordenadas = geocode("Avenida Nestor Jardim filho, Eldorado do Sul, Brasil")

    return dict(coordenadas=coordenadas)

Bom, acredito que o código se explique por si só, na linha 2 estamos importando o geocode para poder utilizar na função, e na linha 3 a variável coordenadas receberá da função geocode a latitude e longitude do endereço passado como parâmetro, nesse caso a minha rua.

Concluída a alteração do controlador, devemos fazer o mesmo com a view index.html.

{{extend 'layout.html'}}
{{=coordenadas}}

Bueno, agora acessando a url da aplicação, http://localhost:8000/google_maps/default/index, deveremos ter o seguinte resultado:

Temos aí então a longitude e latitude do meu endereço. Eu posso aumentar a exatidão inserindo o CEP, bairro, etc. Bem como posso definir apenas a cidade e o país.

Caso seja passado como parâmetro um endereço inválido, o geocode ira retornar (0.0, 0.0). Por exemplo, se alguém passasse a localização da Bailanta do sem Fim, que todo mundo sabe que fica lá no fim do mundo pra diante dos cafundós, não ia ter sucesso:

def index():
    from gluon.tools import geocode
    coordenadas = geocode("fim do mundo, cafundó, Brasil")

    return dict(coordenadas=coordenadas)

Agora que já sabemos que entrando um endereço válido é retornado as coordenadas geográficas do endereço, e que um endereço inválido retorna (0.0, 0.0), vamos preparar o controlador para receber a entrada do usuário.

Primeiramente, devemos criar um simples formulário na view index.html a fim de receber a localização que será passada para o controlador:

{{extend 'layout.html'}}

<form enctype="multipart/form-data" method="post">
    <input type="text" size="30" name="local" />
    <input type="submit" name="submit" value="enviar" />
</form>

<br />

{{=coordenadas}}

Também temos que alterar o controlador para processar as informações do formulário que acabamos de criar:

def index():
    from gluon.tools import geocode
    coordenadas = geocode('%s' % request.vars.local)

    return dict(coordenadas=coordenadas)

Temos agora um pequeno form que vai receber uma localidade e passar o valor para o controlador, que irá devolver as coordenadas respectivas, ou 0.0 caso a localização seja desconhecida:

Um exemplo disso interagindo com o Google Maps ficaria dessa forma:

{{extend 'layout.html'}}

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  function initialize() {
    var myLatlng = new google.maps.LatLng({{=coordenadas[1]}},{{=coordenadas[0]}});
    var myOptions = {
      zoom: 15,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title:"Hello World!"
    });
  }
</script>

<form enctype="multipart/form-data" method="post">
    <input type="text" size="30" name="local" />
    <input type="submit" name="submit" value="enviar" />
</form>

<br />

<div id="map_canvas" style="width: 400px; height: 400px;"></div>

<script>initialize();</script>

É um código básico da própria documentação da API do Google Maps, nesse exemplo estamos passando as coordenadas para o script renderizar o mapa (linha 6). Não é o intuito desse se aprofundar na API do Google Maps, isso fica para um próximo post, mais informações podem ser conseguidas na documentação da mesma clicando aqui.

Abaixo o mapa renderizado:

Bueno, para quem não tinha utilizado ainda a funcionalidade no web2py fica aí dica. Os usos para o geocode são os mais variados, como por exemplo um cadastro de clientes geo-localizado, muito útil para empresas de tele-entrega, um cadastro de eventos, etc.

Qualquer dúvida é só prenderem o grito!

A seguir vou ilustrar os passos para fazer o deploy da sua aplicação. Em apenas alguns minutos o ambiente está rodando.

Primeiramente acesse o site e faça o seu cadastro:

O nome de usuário vai ser o seu endereço, no formato http://nome-do-usuario.alwaysdata.net/. Escolha o plano gratuito e clique em Next step.

Serão solicitados alguns dados para criação da conta, insira um email válido e defina um senha para acessar o painel de controle da hospedagem.

Confirme seus dados e clique em Sign up. Aguarde finalizar o processo e serão exibidos os dados de acesso de ftp e ssh.

Bem, se tu quiser efetuar as operações via SSH, primeiro vai ter que entrar no painel de controle e habilitar o teu usuário. Aqui fiz via FTP, então primeira coisa que tu vai fazer é dar uma enxugada no web2py. Eu eliminei todas as aplicações padrão e deixei apenas a minha aplicação e subi os arquivos para a raiz do servidor (se preferir pode enviar os arquivos para um diretório).

Feito isso crie um diretório chamado /public na raiz do servidor (ou no diretório do web2py, caso tenha subido para um diretório). Após criar o diretório, crie um arquivo chamado web2py.fcgi com o seguinte conteúdo:

#!/usr/bin/python

import os, sys
_PROJECT_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
sys.path.insert(0, _PROJECT_DIR)
os.chdir(_PROJECT_DIR)

import gluon.main
import gluon.contrib.gateways.fcgi as fcgi
fcgi.WSGIServer(gluon.main.wsgibase, environ={'web2py_path': _PROJECT_DIR}).run()

Envie o arquivo para o diretório /public e de permissão de execução (775)

Agora crie um arquivo .htaccess com o seguinte conteúdo:

AddHandler fcgid-script .fcgi
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ web2py.fcgi/$1 [QSA,L]

Envie o arquivo para o diretório /public também.

Estamos quase lá.

Agora acesse o painel administrativo da hospedagem e, no menu lateral esquerdo, clique na opção Domains. Na tela que se abre, tu vai ver o caminho para a raiz de sua aplicação, clique em Edit e altere o caminho para o teu diretório /public. Se tu enviou os arquivos do web2py para a raiz, a configuração deve ficar assim:

Caso tenha subido os arquivos para outro diretório, basta inserir o caminho de acordo com o teu diretório.

Feito isso, já pode acessar a aplicação no teu domínio, para ver a aplicação que eu instalei basta acessar: http://tuxtilt.alwaysdata.net/

E isso aí, espero que a dica possa ser útil, assim como foi pra mim que tive que testar uma aplicação fora do GAE e não tive sucesso com os hosts nacionais (de forma rápida e simples). Caso precise de mais espaço, como por exemplo para colocar uma app em produção, basta contratar um plano pago, que estão bem em conta. em relação à performance do host não sei dizer, pois conheci hoje também, vou fazer mais uns testes e se for o caso volto a publicar por aqui.

Os passos realizados aqui foram retirados do wiki da hospedagem:http://migre.me/53ypX . Dica originalmente publicada no grupo oficial do web2py: http://migre.me/53ytO

Estou fazendo um sistema de gestão para uma instituição de caridade, e dentre as tarefas vou migrar um sistema desenvolvido em Clipper para o sistema que estou desenvolvendo em PHP/MySQL.

Bem a primeira coisa que necessitava era converter as bases de dados DBF para Mysql, fui direto no PHPClasses [1], de primeira encontrei essa interessante classe dbf2mysql [2].

Muito tri, só que tem um porém. No Ubuntu, o PHP não vem com suporte ao dbase, então seria necessário compilar a extensão.

Abaixo segue a receita do bolo para quem por ventura vier a precisar.

Primeiramente baixe o fonte do PHP e salve em algum diretório.

Tu vai precisar ter instalado o pacote de desenvolvimento:

sudo apt-get install php5-dev

Feito isso, precisamos do fonte da extensão dbase, pois ele foi removido do PHP 5.3+.

Navegue até o diretório /ext do código fonte que tu baixou do PHP e crie um diretório para o código fonte da extensão:

mkdir dbase

Agora baixe o fonte através do svn:

svn co http://svn.php.net/repository/pecl/dbase/trunk dbase

Entre no diretório dbase:

cd dbase

Execute o comando:

phpize

Execute o comando:

./configure

Espere terminar o processo e execute o comando make:

make

Agora copie a extensão para o diretório /usr/lib/php5/20090626+lfs/

sudo cp modules/dbase.so /usr/lib/php5/20090626+lfs/

(PHP 5.3.2)

Abra o php.ini

sudo gedit /etc/php5/apache2/php.ini

E insira a seguinte linha:

 extension=dbase.so

Salve e feche o arquivo, agora reinicie o apache:

sudo /etc/init.d/apache2 restart

Agora seu PHP já tem suporte a bases DBF.

Bueno, o uso da classe dbf2mysql é bem simples, segue um exemplo abaixo:

//inclui a classe dbf2mysql
include 'dbf2mysql';

//abre o arquivo DBF
$filename = "ARQUIVO.DBF";

//exibe o resultado do sql na tela
dbf2mysql::mostrarSQL($filename);

A partir daqui é só automatizar o trabalho, como por exemplo lêr todos os arquivos DBF e já fazer a inserção no banco de dados.

A base desse artigo foi tirada do zenware [3]

[1] PHPClasses
[2] dbf2mysql
[3] Zenware