💣 Stage 2: Source Code Showcase

Three files. One refactored bomb. All the TNT improvements, live and readable.

📂 The Stage 2 Files

Stage 2 is a refactoring stage: the bomb looks exactly the same as Stage 1 (click “Stage 1” in the card footer to compare), but every line of code has been improved. Three files make up the complete Stage 2 build:

File What it does Stage 2 changes
bombStg2.html HTML shell — loads p5js, CSS, and the sketch File header added; stylesheet pointer updated
bombStg2Sketch.js The p5.js sketch — all the drawing logic Full TNT overhaul (see Laundry List)
bombStg2Styles.css Minimal CSS reset — canvas flush, no margin File header added; WHY: comments added
🤖 How this page loads the code: This page uses the browser’s Fetch API to load each source file from the server at page-load time — the same technique websites use to load JSON data from an API. The advantage: this page always shows the live source. Edit a file and the showcase updates automatically next time you visit. No copy-paste. No re-escaping HTML entities. Just fetch(url).then(r => r.text()). That’s one of the cleanest patterns in modern web development.
📋 Stage 2 Laundry List
bombStg2.html — running live inside an <iframe>
⛶ Open Full Size ▶ Stage 1 (original)

📜 Source Code

bombStg2.html HTML5 
Loading bombStg2.html…
sketches/bombStg2Sketch.js JavaScript 
Loading bombStg2Sketch.js…
styles/bombStg2Styles.css CSS 
Loading bombStg2Styles.css…

💪 Try It Yourself

Use the Copy button above to grab any file, then:

  1. Create a new project folder with the same sub-folders (sketches/, styles/).
  2. Paste each file into VS Code and save it with the matching filename.
  3. Open bombStg2.html in your browser — you should see Crosby's bomb!
  4. Pick one constant to change — try doubling PARTICLE_COUNT or halving PARTICLE_SPEED_MAX — and observe the effect.
  5. Challenge: add a bombVisible boolean flag and make the bomb disappear when you click. Hint: the Saga Index gives you a spoiler!

⚠️ The Copy button requires a secure context (https:// or localhost). If you’re viewing this file directly from your file system (file://), right-click the Run link above and choose “View Page Source” instead.