Ir ao conteúdo
  • Cadastre-se

Jogo em javascript


Posts recomendados

Olá,

 

Achei esse código do jogo da cobrinha em JavaScript:

// as variáveis de "saída"var canvas;var context;// as variáveis do jogovar state = 0; // estado do jogovar TILESIZE; // tamanho dos "tiles", apenas para desenhar na telavar pieces; // a cobravar apple; // a maçãvar keyUp, keyRight, keyDown, keyLeft; // teclas pressionadas ou soltasvar UP, DOWN, LEFT, RIGHT; // direção da cobravar velX, velY; // velocidade nos eixosvar collision; // indica colisão da cabeça com alguma parte da cobravar mapWidth, mapHeight; // dimensão do "mapa"// as imagensvar imgApple;var imgPiece;var imgHead;function loadImage ( imgUrl ){    var img = new Image();    img.src = imgUrl;    return img;}function Piece ( x, y, dir ){    this.id = -1;    this.x = x || 0;    this.y = y || 0;    this.dir = dir || 0;}Piece.prototype ={    setPos: function (x, y)    {        this.x = x;        this.y = y;    },    randomPos: function (  )    {        var repeat;        var newPos = {x:0, y:0};        do        {            repeat = false;            newPos.x = Math.floor(Math.random() * mapWidth);            newPos.y = Math.floor(Math.random() * mapHeight);            for (var i = 0; i < pieces.length; i++)                if (pieces[i].id == this.id || (pieces[i].x == newPos.x && pieces[i].y == newPos.y))                    repeat = true;        } while (repeat);        this.x = newPos.x;        this.y = newPos.y;    },    draw: function ( img )    {        context.drawImage(img, this.x * TILESIZE, this.y * TILESIZE);    }}function keyboardDown ( event ){    var ev = event || window.event;    switch (ev.keyCode)    {        case 37: // seta esquerda            keyLeft = true;            break;        case 38: // seta para cima            keyUp = true;            break;        case 39: // seta direita            keyRight = true;            break;        case 40: // seta para baixo            keyDown = true;            break;        case 80: // tecla p = pause game            velX = velY = 0;            break;        default:            break;    }}function keyboardUp ( event ){    var ev = event || window.event;    switch (ev.keyCode)    {        case 37: // seta esquerda            keyLeft = false;            break;        case 38: // seta para cima            keyUp = false;            break;        case 39: // seta direita            keyRight = false;            break;        case 40: // seta para baixo            keyDown = false;            break;        default:            break;    }}function gameInit (  ){    TILESIZE = 32;    mapWidth = 20;    mapHeight = 15;    canvas = document.getElementById("canvas");    context = canvas.getContext("2d");    canvas.width = mapWidth * TILESIZE;    canvas.height = mapHeight * TILESIZE;    imgPiece = loadImage("piece.png");    imgApple = loadImage("apple.png");    imgHead = loadImage("head.png");    pieces = new Array(new Piece(), new Piece(), new Piece());    apple = new Piece();    apple.id = -10;    velX = velY = 0;    collision = false;    // direções a seguir    UP = 0;    RIGHT = 1;    DOWN = 2;    LEFT = 3;    // inicializando a parte A - a cabeça    pieces[2].id = 2;    pieces[2].x = 3;    pieces[2].y = 3;    pieces[2].dir = RIGHT;    // inicializando a parte B    pieces[1].id = 1;    pieces[1].x = 2;    pieces[1].y = 3;    pieces[1].dir = RIGHT;    // inicializando a parte C - o rabo    pieces[0].id = 0;    pieces[0].x = 1;    pieces[0].y = 3;    pieces[0].dir = RIGHT;    // escolhe as coordenadas da maçã    apple.randomPos();    // por fim seta o estado para 1    state = 1;        // atualiza o tamnho atual na pagina html    document.getElementById("currSize").innerHTML = pieces.length;    // atualiza o tamanho anterior na pagina html    document.getElementById("lastSize").innerHTML = 0;}function gameReset (  ){    // atualiza o tamanho anterior na pagina html    document.getElementById("lastSize").innerHTML = pieces.length;    // retira o excesso de elementos deixa só 3 pra reiniciar    while (pieces.length > 3)        pieces.pop();    velX = velY = 0;    collision = false;    // reinicializando as peças    // inicializando a parte A - a cabeça    pieces[2].id = 2;    pieces[2].x = 3;    pieces[2].y = 3;    pieces[2].dir = RIGHT;    // inicializando a parte B    pieces[1].id = 1;    pieces[1].x = 2;    pieces[1].y = 3;    pieces[1].dir = RIGHT;    // inicializando a parte C - o rabo    pieces[0].id = 0;    pieces[0].x = 1;    pieces[0].y = 3;    pieces[0].dir = RIGHT;    apple.randomPos();    // atualiza o tamnho atual na pagina html    document.getElementById("currSize").innerHTML = pieces.length;}function gameLoop (  ){    if (keyLeft)    {        if (pieces[pieces.length - 1].dir != RIGHT)        {            velX = -1;            velY = 0;            pieces[pieces.length - 1].dir = LEFT;        }    }    else if (keyUp)    {        if (pieces[pieces.length - 1].dir != DOWN)        {            velX = 0;            velY = -1;            pieces[pieces.length - 1].dir = UP;        }    }    else if (keyRight)    {        if (pieces[pieces.length - 1].dir != LEFT)        {            velX = 1;            velY = 0;            pieces[pieces.length - 1].dir = RIGHT;        }    }    else if (keyDown)    {        if (pieces[pieces.length - 1].dir != UP)        {            velX = 0;            velY = 1;            pieces[pieces.length - 1].dir = DOWN;        }    }    // atualiza as posições das pieces se estiver movendo    if (velX != 0 || velY != 0)    {        for (var i=0; i < pieces.length - 1; i++)        {            pieces[i].x = pieces[i + 1].x;            pieces[i].y = pieces[i + 1].y;            pieces[i].dir = pieces[i + 1].dir;        }    }    if (pieces[pieces.length - 1].x == apple.x && pieces[pieces.length - 1].y == apple.y)    {        pieces.push(new Piece());        pieces[pieces.length - 1].x = apple.x;        pieces[pieces.length - 1].y = apple.y;        pieces[pieces.length - 1].dir = pieces[pieces.length - 2].dir;        pieces[pieces.length - 1].id = pieces.length - 1;        apple.randomPos();                // atualiza o tamanho atual na pagina html        document.getElementById("currSize").innerHTML = pieces.length;    }    // agora move a cabeça    pieces[pieces.length - 1].x += velX;    pieces[pieces.length - 1].y += velY;    // depois de mover a cabeça limita o movimento no canvas    // Para o eixo X    if (pieces[pieces.length - 1].x >= mapWidth)    {        pieces[pieces.length - 1].x = 0;    }    else if (pieces[pieces.length - 1].x < 0)    {        pieces[pieces.length - 1].x = mapWidth - 1;    }        // Para o eixo Y    if (pieces[pieces.length - 1].y >= mapHeight)    {        pieces[pieces.length - 1].y = 0;    }    else if (pieces[pieces.length - 1].y < 0)    {        pieces[pieces.length - 1].y = mapHeight - 1;    }    // se colidiu com alguma parte da cobra    if (collision)    {        gameReset();    }    // verifica se colidiu com alguma parte da cobra    for (var i=0; i < pieces.length - 2 && !collision; i++)        if (pieces[pieces.length - 1].x == pieces[i].x && pieces[pieces.length - 1].y == pieces[i].y)            collision = true;    context.fillStyle = "#FFFFFF";    context.fillRect(0,0,canvas.width,canvas.height);        // desenha o corpo da cobra (sem a cabeça)    for (var i=0; i < pieces.length - 1; i++)        pieces[i].draw(imgPiece);    // desenha a maçã    apple.draw(imgApple);    // desenha a cabeça    pieces[pieces.length - 1].draw(imgHead);}function gameMain (  ){    switch (state)    {        case 0:            gameInit();            break;        case 1:            gameLoop();            break;        default:            state = 0;            break;    }} 

 

Ele está perfeito! Só gostaria de que ao sair da página e voltar novamente, e jogar novamente, acumulasse os pontos.

 

Até mais!

Link para o comentário
Compartilhar em outros sites

Visitante
Este tópico está impedido de receber novas respostas.

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...