Giter Club home page Giter Club logo

blockcatcher's Introduction

BlockCatcher

This is a WebGL game in which you must catch as many blocks as possible until time runs out. 250 points is considered a win.

Demo:

You can play a demo of the game at http://rauenzi.github.io/BlockCatcher/

Controls:

Move Player Bar Left/Right - Left/Right Arrow Keys
Start Game - SPACE
	
Red Blocks - 1 points
Blue Blocks - 5 points
White Blocks - 25 points

Playing this game is really simple, you play as the green bar at the bottom of the screen. The objective is to catch blocks with the player bar before they fall off the screen using the left and right arrowkeys. To start press the spacebar, youll notice you have a total of 60 seconds to gain as many points as possible before the game ends. There are 3 types of blocks youll encounter; a red block worth 1 point, a blue block worth 5 points, and a white block worth 25 points. The red blocks are big and slow, the blue blocks are medium sized and traval at a moderate pace, while the white blocks are small and move quickly. To win this game, you have to accumulate at least 250 points before the time runs out. Once the game is over you have the ability to restart by repressing the spacebar.

Description of implementation:

To create this game we used classes to implement our player bar as well as the blocks. This allowed us to keep track of their vertices' position as well as color, speed, size, and point value. After the game is started, a timer counts down from 1 minute and a block is generated every second that passes. Interation between the player bar and block is determined when the lower 2 vertices of a block are below the the y value of the player bar's top vertices and within the x values of the player bar. if interaction is successful, the points will be added to the score and the block will be deleted. Even without interaction, the blocks will continue to fall below the canvas before they get deleted at a certain height. Movement of the blocks and player bar is controlled by a translation matrix within the vertex shader and each block type has its own fragment shader.

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.