Coder Social home page Coder Social logo

kchen0723 / canvasgames Goto Github PK

View Code? Open in Web Editor NEW

This project forked from j-f-liu/canvasgames

0.0 2.0 0.0 23.78 MB

The engine of canvas games.

Home Page: http://CanvasGames.net

License: MIT License

TypeScript 93.33% CSS 0.16% HTML 4.38% Ruby 1.69% JavaScript 0.45%

canvasgames's Introduction

CanvasGames

A web page 2D game engine developed in TypeScript.

How to build

  1. Install Node.js and Ruby
  2. Install TypeScript
 npm install -g typescript
  1. Run build script
 ruby build.rb

Development Tools

  1. Visual Studio 2013
  2. TypeScript 1.4 for VS2013

Example Code

class Sprites {
    background = new StaticImage(new SpriteImage(Game.images['background']));
    cannon = new Cannon();
    can1 = new PaintCan(450, 'red');
    can2 = new PaintCan(582, 'green');
    can3 = new PaintCan(704, 'blue');
    ball = new Ball();
    plusTen = new Particle(new SpriteImage(Game.images['plus_ten']), 1, function () {
        GameWorld.sprites.plusTen.position.set(GameWorld.sprites.ball.right, GameWorld.sprites.ball.top);
        GameWorld.sprites.plusTen.velocity.set(54, -60);
    });
    minusTen = new Particle(new SpriteImage(Game.images['minus_ten']), 1, function () {
        GameWorld.sprites.minusTen.position.set(GameWorld.sprites.ball.right, GameWorld.sprites.ball.top);
        GameWorld.sprites.minusTen.velocity.set(48, 70);
    });
    lives = new Lives(new StaticImage(new SpriteImage(Game.images['lives'])));
    score = new Score(Game.images['scorebar']);
    gameover = new GameOver(
        new StaticImage(new SpriteImage(Game.images['gameover'])),
        new Button(new SpriteImage(Game.images['play_again'])));

    createPlayingScene() {
        var playing = new Scene(
            this.background,
            this.can1, this.can2, this.can3, this.ball, this.cannon,
            this.plusTen, this.minusTen,
            this.lives, this.score, this.gameover
            );
        return playing;
    }
}

class GameWorld {
    static lives: number = 5;
    static score: number = 0;
    static scores = GameSettings.load(ScoreSheet);
    static sprites: Sprites;

    static run() {
        Game.init(800, 480);

        Game.loadImages("image/",
            "background.jpg", "scorebar.jpg",
            "cannon_barrel.png", "cannon_red.png", "cannon_green.png", "cannon_blue.png",
            "ball_red.png", "ball_green.png", "ball_blue.png",
            "can_red.png", "can_green.png", "can_blue.png", "plus_ten.png", "minus_ten.png",
            "lives.png", "gameover.png", "play_again.png");

        Game.loadAudios("audio/", "music", "collect_points", "lose_points", "shoot_paint", "bubble_burst");

        Game.start(function () {
            GameWorld.sprites = new Sprites();
            var playing = GameWorld.sprites.createPlayingScene();
            Game.scenes.switchTo(playing.id);
            Sound.Play(Game.audios['music'], 0.3, true);
        });
    }

    static reset() {
        GameWorld.score = 0;
        GameWorld.lives = 5;
        Game.scenes.currentScene.reset();
    }
};

Contact

Junfeng Liu

License

CanvasGames is available under the MIT license. See the LICENSE file for more info.

canvasgames's People

Contributors

j-f-liu avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.