de qualquer game desenvolvido! Pertence a propria fisica do jogo ao engine do jogo. Por exemplo, quando dois objetos se encontram (colidem) eles podem:- Aplicar dano ao adversario- Desta colisao podemos definir uma pontuacao- Desta pontuacao podemos avancar de niveis- Definicao entre interacoes entre os personagens, inimigos e/ou obstaculos do game.De acordo com o Livro Desenvolva Jogos com HTML e JavaScript, a colisao e um dos metodos mais simples para detectar as colisoes. A colisao pode ser configurada por meio da criacao de uma caixa delimitadora (bounding box) ao redor de cada sprite e verificar a intersecao entre os retangulos. Quando estes retangulo se tocarem, ocorre a colisao.HitTest e uma classe que verifica se um ou mais objetos se encontram parcialmente dentro da area de um outro. Link1Link2Link3De acordo com o Livro Desenvolva Jogos com HTML e JavaScript, a colisao e um dos metodos mais simples para detectar as colisoes. A colisao pode ser configurada por meio da criacao de uma caixa delimitadora (bounding box) ao redor de cada sprite e verificar a intersecao entre os retangulos. Quando estes retangulo se tocarem, ocorre a colisao.Na imagem acima, estamos vendo a intersecao dos bouding box. Este tipo de colisao no jogo Sonic pode provocar dano aos adversarios.Podemos utilizar tambem, varios bouding box para configurar o nosso personagem, assim conseguiremos controlar de forma mais eficiente os ataques.As colisoes serao configuradas de acordo com as areas de intersecao dos objetos.Pela geometria, dois retangulos se intersectam se:- (x1 + largura1) > x2 E- x1 < (x2 + largura2) E- (y1 + altura1) > y2 E- y1 < (y2 + altura2)Classe Colisor:Classe e uma estrutura que descreve estados e comportamentos de um determinado objeto.No Javascript utilizamos uma funcao para criar a classe. Para criar propriedades podemos usar a palavra var ou this. Se utilizarmos a palavra var o atributo vai ficar privado e se utilizarmos a palavra this o atributo vai ficar publico.function nome_da_classe() { var avatar; this.nome; }function document_OnLoad() { nome_da_classe = new nome_da_classe(); nome_da_classe.nome = 'Maria'; }Neste Tutorial, podemos encontrar facilmente como trabalharmos com Classe no JavaScript!Exemplo de Colisao!HTMLJS - ColisaoJS - BolinhasExemplo 2HTML BrickJS - ColisaoExemplo 3Exemplo de script para colisao:var MB_checkCollides = function() { var loopIndex = MB_collides.length, element, p1, p2, p1Top, p1Bottom, p1Left, p1Right, p2Top, p2Bottom, p2Left, p2Right; while(loopIndex--) { p1 = MB_collides[loopIndex]; p1Top = p1.posY + p1.collisionZone.top; p1Bottom = p1.posY + p1.height - p1.collisionZone.bottom; p1Left = p1.posX + p1.collisionZone.left; p1Right = p1.posX + p1.width - p1.collisionZone.right;for(element in MB_collides[loopIndex].hitEvents){ p2 = MB_fixedIndexColl[element]; p2Top = p2.posY + p2.collisionZone.top; p2Bottom = p2.posY + p2.height - p2.collisionZone.bottom; p2Left = p2.posX + p2.collisionZone.left; p2Right = p2.posX + p2.width - p2.collisionZone.right; /* MB_mainContext.moveTo(p2Right, p2Top); MB_mainContext.lineTo(p2Right, p2Bottom); MB_mainContext.lineTo(p2Left, p2Bottom); MB_mainContext.lineTo(p2Left, p2Top); MB_mainContext.lineTo(p2Right, p2Top); MB_mainContext.stroke(); */ if (!( (p1Top > p2Bottom) || (p1Bottom < p2Top) || (p1Left > p2Right) || (p1Right < p2Left) )){ //console.dir(MB_collides[loopIndex].hitEvents) MB_collides[loopIndex].hitEvents[element](); } } } };_________________________________________________________Na continuacao do exemplo, as areas de colisao, sao configuradas em cada classe dos inimigos! playerConf : { 'filename':'odys', 'width':80, 'height': 90, 'frames': 3, 'animations':1, 'animationSpeed':5, 'shadowDistance':80, 'collisionZone':{top:50, right:23, bottom:0, left:7} }, _________________________________________________________**** codigo base do game Odyssey