Let me start off, I am no pro in any of the following you are about to see. I have spent the past few weeks trying to learn about HTML5 and some of the cool new things its brings. First off, you can see a demo of all my work on GitHub.io. I should tell you right now, I think it will only function on chrome. I know there are some styling issues on Firefox and the last time I tried running it in firefox it didn’t run at all.
All of the source code can be viewed an GitHub. Please feel free to clone the project and see what you can figure out on your own.
So what is it? Well, its a pond with 4 map types. Empty (dark dark blue), resources (dark blues and purples), materials (lighter blues and purples), and organisms (green and red). The organisms can either be producers (green), or consumers (red). Producers convert resources to materials. Consumers eat the materials. There are 3 type of each resource, and 3 types of each material. Each resource converts to exactly 1 corresponding material, and each organism will only desire 1 type. Producers are designed to work together, sharing resources and materials in a simple attempt to keep the entire pack alive. Consumers are greedy, not caring at all about the heard in general. Each mitosis that occurs has a chance of mutation. Mutations change color as well as a variety of attributes about that organism. Some configurable options include goal resources on board as well as organism spawn rates.
The application which runs the simulation is separated into three primary pieces. The UI, the worker, and the drawer. The UI is the master controller. It start, stops, and communicates with the webworker. It asks for data from the worker, and when it receives a reply, it renders it to the screen as well as passes it along to the drawer. The Webworker does all the heaving lifting. This includes processing the flow of the pond, the spawning of resources, and the life and death of organisms. Anything pertaining directly to the pond other than the rendering is done in the webworker. The drawer does the canvas drawing. This includes the pre and post filtering.
Next Time I will talk about in depth the different flow algorithms that are implemented so far, as well as a couple that are up and coming.