SpongeBob's Mandatory Dental Clinic

A Chrome extension for the cleanliness-obsessed (or the just plain silly). SpongeBob hasn't brushed in 14 business days, and he’s hijacking your browser until you help him out.

Inspiration

Inspired by the sheer absurdity of Gen Alpha internet humor and the nostalgia of early 2000s Flash games. We wanted to create a "productivity interrupter"—a playful, interactive reminder that sometimes you just need to stop what you're doing and scrub some virtual plaque off a 2D sponge.

What it does

The extension operates on a periodic "hygiene cycle." Every few minutes, a "dirty" SpongeBob appears as a mandatory overlay on your active tab. You are given a toothbrush cursor and exactly 10 seconds to physically scrub the grime off his teeth.

  • Success: SpongeBob becomes sparkling clean and happy, granting you his blessing to continue browsing.
  • Failure: If you ignore him or fail to finish in time, he eventually vanishes—but you’ll have to live with the guilt of leaving him in a state of dental distress.

How we built it

We built this using the Chrome Extension Manifest V3 framework:

  • Background Service Worker (background.js): Manages the chrome.alarms to trigger the hygiene events at regular intervals.
  • Content Scripts (content.js & content.css): Injects the interactive SpongeBob game directly into your browsing session.
  • Vanilla JavaScript & CSS: Used for the scrubbing mechanics, mouse-tracking logic, and the transition animations from "dirty" to "sparkling."

Challenges we ran into

  • Interactive Scrubbing: Fine-tuning the "scrubbing" logic was the biggest hurdle. We had to calculate mouse movement delta and ensure that "scrubbing" felt responsive and satisfying rather than just a series of random clicks.
  • Overlay Management: Creating a non-intrusive yet "hijacking" overlay that works across different website layouts required careful CSS z-index and positioning work.
  • Timing Logic: Coordinating the 10-second timer between the background event and the content script to ensure the challenge felt high-stakes but fair.

Accomplishments that we're proud of

  • The Scrubbing Mechanic: It’s surprisingly satisfying to watch the grime disappear in real-time as you move your mouse.
  • The Transformation: Creating a visual feedback loop where SpongeBob goes from "disgusting" to "dentally cleared" with actual progress bars and visual effects.
  • The Aesthetic: Successfully capturing a "chaotic dental clinic" vibe that is both annoying and charming.

What we learned

  • Chrome Alarms & Messaging: We mastered the communication between background service workers and content scripts in the Manifest V3 environment.
  • DOM Injection: We learned how to safely inject complex, interactive UI elements into existing web pages without breaking the underlying site functionality.
  • User Engagement: We discovered that a 10-second "forced" break can actually be a hilarious way to reset your brain during a long browsing session.

What's next for SpongeBob's Dental Clinic

  • More Hygiene Challenges: Adding a "Patrick Star Soap Scrub" or a "Squidward Clarinet Polish" mini-game.
  • Sound Effects: Adding the classic SpongeBob "laugh" or "squeaky clean" sound effects to enhance the victory.
  • Leaderboards: Track how many "Business Days" of dental neglect you've personally resolved.
  • Customizable Frequency: Letting users decide exactly how often SpongeBob needs a cleaning.

Installation

  1. Open Chrome and go to chrome://extensions/.
  2. Enable Developer mode (top right).
  3. Click Load unpacked.
  4. Select the folder containing these files.

How to use

  • Just browse normally.
  • When a "dirty" SpongeBob appears, grab your cursor and start scrubbing!
  • Complete the cleaning before the timer runs out to save Bikini Bottom's favorite sponge.

For the Hackathon Judges

This extension uses:

  • chrome.alarms for background timing and event triggering.
  • content_scripts for DOM injection and interactive mouse-tracking.
  • Pure, unadulterated silliness.

Built With

Share this project:

Updates