Jelly Blobs of Doom
Created by Maggie Yan and Caia Soyer
Languages used HTML, CSS, Javascript
Objective This project was for an assignment in my Intro to Front-End Web Development course. The objective of the project was create a survival game on automatic dynamically updating webpage, where the user is the blue blob and tries avoid being eaten by larger blobs while trying to gain in size by eating smaller blobs. The purpose of this project was to create an interactive game using object oriented programming (OOP) and inheritence.
The Process
In addition to the HTML and CSS, four Javascript files were created: three were classes or subclasses, and one was the code that put everything together. Classes included a Blob class, an Enemy class, and a Player class, with the Enemy and Player classes being subclasses of the Blob class. The Blob class has instance variables to keep track of blob color, radius, the x and y location of their center, and the DOM element that corresponds to the blob. The Player object is defined as a class and is able to move by changing and updating the x,y location of the DIV, grow, shrink, and react accoredingly to a collision, in addition to inheriting the behavior of the Blob class. The Enemy class checks for collision between the player blob and an enemy blob. Finally, everything is put together when functions for starting and stopping the game and launching the enemy blobs are written, and event handlers are attached.
A snippet of code that puts everything together for the game, which was written in Javascript. See full code on Github.