Help & About
Project: Interactive Turmites
This is a pure JavaScript simulation of "turmites," a type of 2D Turing machine on a grid. Unlike a simple Turing machine, a turmite can turn in multiple directions. They follow a simple set of rules that can lead to incredibly complex, beautiful, and emergent behavior.
The core interaction is your click: it creates a shockwave and spawns a burst of new turmites, letting you "paint" with computational life.
Configuration
- Turmite Count: Sets the target number of turmites. The simulation will add/remove turmites to match this.
- Sim Speed: The number of calculation steps each turmite performs per animation frame. Higher is faster.
- Cell Size: The pixel size of each grid cell. Smaller sizes allow for more detail but may be slower.
- Turmite Rule: Changes the "brain" of the turmites. Each rule creates vastly different patterns.
- Trail Fade: The speed at which the canvas fades to black. A low value creates long, persistent trails. A high value makes them fade quickly. At 0, trails never fade.
- Reset Simulation: Clears the grid and starts over with new turmites.
URL Parameters
You can customize the page by adding parameters to the URL:
?hue=[0-360]: Sets the base color scheme. Try ?hue=0 (red) or ?hue=120 (green).?header=...: Adds a main title. Use multiple times for multiple lines. (e.g., ?header=Hello&header=World)?subheader=...: Adds a smaller subtitle.
Technical Specs
- Frameworks: None. This is 100% vanilla JavaScript, HTML, and CSS.
- Grid: The grid of cells is not a 2D array. It's a JavaScript
Map object. This is extremely memory-efficient for sparse patterns, as it only stores cells that have actually been visited by a turmite. The key is a string like "x,y".
- Rendering: Uses the HTML5 Canvas 2D API. The "glowing" and "fading trail" effects are achieved by drawing a semi-transparent black rectangle over the canvas each frame.
Changelog & AI Context
This document was generated by a large language model based on a user's prompt. Future agents modifying this code should know the original goals were focused on visual flair, interactivity, and self-containment in a single file.
Initial Creation (2023-10-27):
Original user prompt:
Let's write an interactive, beautiful, informative turmites simulation as a single page in html, css, and javascript. Let's not use any external libraries.
I want it to be highly interactive, colorful, informative, and beautiful. Really juice the visuals. The user's click on the canvas should always be the most important and interesting interaction.
Let's use a dark theme, and let's have an optional url parameter "hue" that we use to generate a color scheme. I want the page to take any number of optional "header" and "subheader" url parameters for displaying as text on the canvas. I want the canvas to be full screen, with all configuration and stats behind toggle-able overlays. I want lots of slick animations, and for the action to begin as soon as the page loads. I want it to work well on both desktop and mobile. I want it display the frame rate.
I want a help overlay that includes (but is not limited to) a description of this project, documentation for all configuration, specs, any additional context that would be useful for agents modifying this in the future, and a detailed change log including this entire prompt.