What I been the doin!

Here is a comprehensive, architectural development log documenting the creation of the Chimerapocalypse VTT engine… IT’S called “Chimerapocalypse” because I am building with THAT, specific story in mind… and architecting it around HOW I want that to play… Bioweapon accident > mutation > oh shit… horror survival… You gonna have to deal with things like Cheep-Cheep… take a peek…

BUT its not for JUST that one game… I been trying not to DIE, but my health is getting worse, despite that, over the last five months I think I have accomplished some major milestones in the game and my own personal development – I have ALWAYS dreamed of making a game, but I never took the time to sit down and DO IT. I spent my time doing all the work and career and family stuff. I am disabled now… I can’t work, anymore, hell I can’t even walk most days but I try to keep myself doing SOMETHINGS, “WHEN I can” which is not often, but the last 5 months I been poking at this…

This post summarizes the exact custom mechanics, code systems, and logic pipelines built from scratch to establish irrefutable authorship of the source code. SO NO FUCKING ASSHOLE CAN SAY I STOLE THEIR SHIT… AND THEY WILL, WHEN THEY SEE WHAT I DO WITH THIS TOOL THAT I HAVE BUILT… CAUSE I CAN PARODY, (PARROT-D, DEEZ NUTS!) ALL DAY LONG, AND YOU CAN’T FUCKING STOP ME… Thanks South Park!

See that isn’t a Super Mario Mushroom… its a ToxikHallucinagen… That ain’t no plumber, its a DRUG PUSHING Mushroom sales man name Shmarko Shmarksupalot… That last thing is what happens what you MAY see when you consume a ToxikHallucinagen…

Every good drug dealer gotta have a ride or die hoe! and you aint never know whats gonna pop off on the rough streets of Shroomstone village… But you better be carry’in a strap… LOL Okay… okay – I know that’s a bit much BUT you get the point… It can be similar but is HAS to be parody and guess what I AIN’T A SELLIN SHIT! Soooo sue away you cackmangers!

How about not getting dissolved by a penis skull flying spider vagina? NO ITS NOT A FACE HUGGER OR XENOMORPH… PFFFT PSHA WTF NAWWWW…

Its an Mutated Genital Face Vomitator… THAT PUKES ACID IT CANT BLEED IT OMG WHO COMES UP WITH THIS SHIT… SHEESH… I have to explain everything…

ALIEN EGGS??? WTF??? NO MAN THESE ARE MUTANT CENTIPEDE CHICKEN BABIES BREAKFASTS…

The Walking Dead? YOU MEAN STUMBLEDUMMYNECROTARDCANNIBALS…
Dungeons and Dragons? WTF IS THAT??? OH, OH… You mean Deathholes and FlamingFartFlylizards!
Warhammer?? OBVIOUSLY YOU MEAN… SPACE KING???

SO here is what I have done… it may not seem like much to a developer or even my old self… but DAMN I THINK IT’S COOL!

Phase 1: Core Architecture & Environment

Technology Stack Integration: Engineered a lightweight, browser-native client using vanilla HTML5, CSS3, and JavaScript, strictly avoiding bloated third-party front-end frameworks.
Database & Deployment Pipeline: Established a multi-stage deployment pipeline across development, testing, and demo subdomains, utilizing PHP and MySQL for backend data storage and retrieval.
Real-Time Synchronization: Implemented a Node.js relay server using Express and Socket.IO to handle low-latency WebSocket communication and multi-device data synchronization.
Client Authorization: Built a custom session generation script (vtt_client_id) to lock browsers to specific character IDs, paving the way for the upcoming server-side user authentication rollout.

Phase 2: The Grid & Visual Engine

Dynamic Viewport & Scaling: Programmed a modular DOM grid system controlled by CSS variables (--grid-size), allowing seamless zooming and scaling on both desktop and mobile viewports.
Fog of War Mechanics: Engineered a dynamic visibility matrix using HTML5 <canvas>. The script utilizes globalCompositeOperation to calculate player vision radiuses (modified by equipment like Hats) and selectively carve out transparent circles in the fog layer.
Coordinate Math & Collision: Built a mathematical $X,Y$ coordinate tracking system using Maps and Sets to document wall placements, preventing character movement into restricted cells.

Phase 3: Multiplayer Mechanics & Synchronization

Event-Sourced Websockets: Developed the player_moved WebSocket payload structure, ensuring that movement, combat strikes, and inventory usage are instantly broadcast to all connected clients to update their local DOMs.
Debounced Database Auto-Saving: Engineered a non-blocking playerAutoSaveTimer that compiles the entire board state and silently POSTs it to the MySQL database after 200 milliseconds of inactivity, preventing database hammering while preserving states.
Ghost-Object Prevention: Implemented a CSS-driven entity banishment system (.is-consumed). Instead of deleting DOM nodes (which causes network desyncs), consumed items immediately drop to $0\%$ opacity, disable pointer events, and sync securely to the database.

Phase 4: Game Design & Player Interactions

Hardware Controller Integration: Hooked directly into the standard Browser Gamepad API, allowing players to map thumbstick axes and button presses to grid movements and UI targeting.
Mobile-First D-Pad: Designed a floating, responsive D-Pad module utilizing transform: scale() mathematics to ensure universal cross-platform alignment, complete with fluid CSS transition animations to hide the UI on command.
The Paper Doll Equipment System: Coded a custom array-based inventory logic where users can equip specific items (Weapons, Hats, Shirts, Pants) from the party’s Shared Inventory to trigger mathematical buffs (e.g., $+5$ Movement, $+50\%$ Vision).
Sanitization & The Emoji Resolver: Built a strictly whitelisted dictionary function (resolveItemIcon) that evaluates inventory strings, assigns the correct visual icon, and mathematically strips malicious HTML brackets (.replace(/[<>]/g, '')) to render the engine completely immune to XSS injection attacks.

Phase 5: The Combat Arena & Affliction System

Proximity Triggers: Programmed a spatial scanner that detects when a player moves within 1 grid space of a hostile, forcing the UI to hide the map and deploy a CSS-driven, split-screen combat arena.
Turn-Based RNG Combat: Coded the foundational combat mathematics utilizing custom multi-sided dice logic (base damage + weapon bonus) versus equipment defense thresholds.
Network-Safe State Execution: Resolved latency-induced JavaScript race conditions by building hard stops into the combat render loop, ensuring that if a hostile is killed by one player, the engine safely aborts the enemy turn on all other clients without throwing null errors.
Status Afflictions: Developed an array-based status system allowing players to suffer from mechanical debuffs (Dizzy, Burning, Poisoned) that must be cured by explicitly interacting with specific medical items in the Shared Inventory.

Phase 6: The Game Master (GM) Control Suite