Soggy Carrot (GTA)
Erich Jagomägis, Heiki Pärn, Ville Sokk
Repository: https://bitbucket.org/Jorich/gta_project
Current master: http://52.28.104.167:44444/GTA_project/
Report: http://kodu.ut.ee/~erichj/gta_report.pdf
Concept
Basic idea is to implement a gta 2 like game in javascript. Game is initially planned as free for all sandbox game where user is free to roam around the world and just cause chaos.
Features
Moving around, Large environment Animations Shooting Driving Explosions Flame Thrower
Technical Description
World is 3 dimensional and camera is always placed top down. Height of the camera may vary based on how fast character is moving.
World consists of buildings, roads, vehicles and people. Player can interact with all elements. Player can locate weapons around the town and use them as they see fit. As of now, it is open to debate over what is the end goal of the game- possibilities are endless.
Architecture
Graphics Library Main graphics library that is used is THREE.js which utilizes WebGL to render 3d. Root objects or container for all objects is a THREE.Scene object.
Asynchronous Module Loader
Javascript is often being criticized for being poorly structure and having “ugly” code. We found that it would be nice to write nice OOP code. For that we use prototypes and to manage dependencies we use RequireJS library. It allows to separate code in different files, load them on demand and handles script loading without having to litter head tag of the document in script tags.
Threads
Application logic is separated into two different threads- main and worker. Main thread is mostly responsible for rendering and managing models/animations. Worker thread is responsible for game logic (collision detection, creating objects, deleting objects, updating their state etc.). It may be surprising since javascript does not support multi threaded applications naturally. For that we had to use a Worker object, description of which can be read here.
General Overview
We are trying to write OOP code as much as javascript allows to do so. Additionally we are trying to separate functionality into Manager objects to separate the concerns into respective object definitions. Whole Application is running 3 main cycles. First cycle is for Renderer. Second cycle is for application on Main thread and third cycle is for application in Worker thread. Main thread application cycle is responsible for processing messages from worker thread and sending IO input to worker. Worker thread cycle is responsible for application of physics onto objects as well as run updates on objects and perform collision detection. In the future (probably not in the course), worker thread will communicate with Node JS server to get object states and to send IO. In that case game logic will run on both server and client. That is reasonable in order to reduce the effects of lag generated by communication between client and server.
World
Map object
All objects of the world (buildings, vehicles, people, guns, bullets etc.) are held in Map objects. Map object itself is nothing more than a container for something called Segments. Each Segment holds objects that are positioned within its domain (space if you will). Every object that is within a domain of a Segment is placed as a child object for that Segment. Segment domain spaces do not intersect. Each segment checks if camera is within a specific range, then segment adds itself to the Scene, otherwise it omits itself from the scene. Due to the nature of the Environment (cities can be large) it helps to keep irrelevant objects out of the scene thus making it easier to perform culling (less objects to test).
Collision Detection
Typically we might want to detect when two or more objects are in proximity of each other. Even more so we might want to detect when two or more objects are colliding. It is very useful feature if one would like to make the world work real like. In given project Collision Detection is implemented using QuadTree data structure. To perform collision tests, line segment intersection testing is used.
A good article about collision detection using quadtrees can be viewed here.
Progress
Ville My task was to develop the vehicle. So far I’ve spent time reading about physics simulation (I have no experience in this area) and programming the vehicle physics. The car can be driven but the physics don’t account for lateral force so there’s no sliding. There are also issues with integrating the code that need to be solved. I also thought about how to generate roads and skid marks with curves in three.js.
Heiki As the first task I created a simple placeholder model for the player character with animations. I decided that we need at least 5 animations for movement: idle, run forward, run backward, strafe left and strafe right. Others (such as moving at an angle) can be blended from these. To get Blender to export models into Three.js json format the easiest way was to download “Three.js Blender Export” add-on from here. The next bigger issue was blending animations based on mouse direction and buttons pressed. For those interested, the function can be seen here in the repository. Also note that in order to be able to blend the animations correctly they have to start with the same leg/arm.
Add to this page a brief description, links (to repo / webpage), images (screenshots), the final report, anything else you think is cool.