Starship Troopers Game

Single Player 2D Canvas games based on the Starship Troopers Movie. Built with HTML5, CSS, JavaScript and extra side of awesome.

Demo

https://bjulliana.github.io/StarshipTroopers-JS-Game/

HOW TO PLAY

• Move the player using the arrow keys until he reaches the ship to scape Planet P.
• You have 5 lives and you lose one each time you touches a bug.
• Each level increases the Bug speed and the hero speed.
• At game over you start at level one again.
• Up to what level can you reach?

SUPPORTED BROWSERS

• Chrome 24+
• Firefox 18+
• IE 9+

KNOWN ISSUES

• No support for touch/mobile devices

REFERENCE MATERIAL

• Google Docs - Game Outline: https://docs.google.com/document/d/1rVt0Ha27pt-djT9bWT4tZZd377Im8h0IIJjnfU_QLz4/edit?usp=sharing
• Canva: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API
• Using Tiles to Draw the Canvas: https://developer.mozilla.org/en-US/docs/Games/Techniques/Tilemaps
• Collision Detection: https://developer.mozilla.org/en-US/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Collision_detection
• Draw Canvas, Hero and Bugs: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage
• Hero Movements on Keypress: https://developer.mozilla.org/en-US/docs/Games/Techniques/Control_mechanisms/Desktop_with_mouse_and_keyboard
• Game Loop: https://developer.mozilla.org/en-US/docs/Games/Anatomy
• Sprite Movement: https://stackoverflow.com/questions/40324351/how-to-move-a-sprite-forward-in-javascript
• HTML5 Game Course: https://devdojo.com/course/html5-platform-game/introduction
• HTML5 Game Example: https://www.creativebloq.com/html5/build-tile-based-html5-game-31410992
• Javascript Game Book:https://books.google.ca/books?id=E_amBAAAQBAJ&lpg=PR23&pg=PR31#v=onepage&q&f=false
• Book Advanced Game Design with HTML5 and JavaScript - Authors: van der Spuy, Rex

Created By

• Julliana Bauer
• John Robertson