🐕⚖️ Dog Court — A Mock Courtroom for Household Canine "Crimes"

#weekendchallenge #devchallenge #javascript #webdev

DEV Weekend Challenge: Dog Days Edition Submission 🐕

This is a submission for Weekend Challenge: Dog Days Edition

What I Built

Dog Court is a satirical, deadpan courtroom web app where your dog is put on trial for a ridiculous household "crime" — eating an entire left shoe while leaving the right shoe untouched, body-slamming the coffee table during a Zoom call, digging a crater in the flower bed, or barking at the vacuum cleaner for eleven straight minutes.

Type or tap a crime, hit ⚖️ File the Case, and an AI-generated legal drama plays out in real time:

Prosecutor Opening: A dead-serious opening statement treating a chewed slipper like a federal case.
Witness Testimony: 2+ hilarious witnesses testify — inanimate objects and scene characters from the crime (The Living Room Rug, Mr. Whiskers the Cat, The Vacuum Cleaner).
Defense Attorney: Argues with passionate (and absurd) legal logic for the dog's complete innocence.
Judge Verdict & Audio Gavel: A wise judicial verdict with a slamming SVG gavel, Web Audio wooden gavel impact thud, stamped verdict sheet, and the dog's animated reaction (happy wag vs. guilty slump).
📜 1-Click Official Court Certificate: Downloads a vintage parchment judicial decree complete with dog mugshot, wax seal, judge signature (Hon. Sir Barks-a-Lot 🐾), case docket number, and verdict stamp.
🎙️ Multi-Role Voice Acting: Every courtroom role is voiced with distinct ElevenLabs AI voices (with automatic zero-break fallback to browser SpeechSynthesis).

Why Dog Court?

When thinking about the "Dog Days" challenge, I noticed almost every dog project defaults to sentimental — rescue tributes, puppy training logs, adoption calculators. I wanted the exact opposite tone: 100% deadpan legal drama sincerity applied to something completely trivial. The comedy lives in the legal seriousness.

Demo

👉 https://weekend-challenge-dog-days-edition.vercel.app/

Code

https://github.com/pawarshivamd/Weekend-Challenge-Dog-Days-Edition

Code Snippet: Exhibit Keyword Matcher & Schema Prompt

Here is how Dog Court matches evidence icons dynamically to the crime, and constrains Gemini using JSON schema:

// 17 Keyword families matching 100+ household crime synonyms to dynamic evidence icons
const exhibitMap = [
  { keys: ['shoe', 'loafer', 'sneaker', 'boot', 'sandal'], icon: '👟' },
  { keys: ['chicken', 'turkey', 'meat', 'steak', 'sausage'], icon: '🍗' },
  { keys: ['sock'], icon: '🧦' },
  { keys: ['vacuum'], icon: '🧹' },
  { keys: ['table', 'coffee table', 'furniture'], icon: '🛋️' },
  { keys: ['hole', 'garden', 'flower', 'dig', 'yard'], icon: '🕳️' },
  { keys: ['trash', 'garbage', 'bin'], icon: '🗑️' }
];

// Gemini System Prompt Schema
const systemPrompt = `You are a courtroom script generator for a satirical comedy web app called "Dog Court."
Write in the deadpan, self-serious tone of a legal drama — NOT a sentimental dog story.

Respond with ONLY valid JSON:
{
  "case_number": "short case number like DC-2026-114",
  "charge": "one formal legal-sounding charge line",
  "prosecutor_opening": "2-3 dramatic sentences",
  "witnesses": [{"name": "witness name", "testimony": "1-2 sentences"}],
  "defense_argument": "2-3 sentences of absurd legal logic",
  "judge_verdict": "GUILTY or ACQUITTED",
  "verdict_reasoning": "2-3 sentences",
  "sentence": "one absurd sentence"
}`;

How I Built It

Tech Stack & Categories Entered

Google Gemini API (Best Use of Google AI Category): Every courtroom transcript is generated live with structured JSON prompts. Includes an 8-model fallback matrix (gemini-flash-latest, gemini-2.0-flash-001, gemini-2.5-flash-lite, etc.) and exponential backoff retry handling so rate limits never freeze the app.
ElevenLabs API (Best Use of ElevenLabs Category): The prosecutor, witnesses, defense counsel, and judge are all voiced with distinct ElevenLabs voice IDs (eleven_flash_v2_5 model). If an API key isn't present, it seamlessly falls back to SpeechSynthesis.
Vanilla HTML5 / Custom CSS / JavaScript: Zero dependencies, zero build steps. Works out of the box in any browser.
HTML5 2D Canvas API: Renders parchment paper certificates with gold foil seals, case dockets, and judge signatures for 1-click PNG downloading.
Web Audio API: Synthesizes custom wooden gavel strikes and canine bark sounds natively.

Key Features Breakdown

🐕 Dog Mugshot Customizer: Customize coat color (Golden, Black, Grey/Husky, Dalmatian) and accessories (Judge Wig, Bowtie, Detective Hat).
📜 Court Certificate Generator: 1-click download of an official 1200x900 parchment decree image for social media sharing.
📁 Court Docket Archive: LocalStorage history saving up to 20 past cases with 1-click trial replay.
🎲 Random Case Generator: Instant 1-click testing with pre-made criminal dossiers.
⚙️ In-App Settings Panel: Easily enter API keys and toggle ElevenLabs directly in the UI.

Team / Credits

Built solo by @pawar-shivam7. Dedicated to good dogs everywhere 🐕.

DEV Community