Distraction Blocker with Focus Timer

# Distraction Blocker — Focus Timer for the Web ✨ A Chrome extension that helps you stay focused by setting daily time limits per website, giving you a gentle nudge when time is up, and keeping controls at your fingertips via a floating button and right-side sidebar. ## 🌟 Highlights - 🟦 Floating, draggable right-edge button showing remaining time - 🧭 Slide‑in sidebar from the right with quick controls - ⏱️ Per‑site Daily Time Limits (1–1440 minutes) - 🔔 Polite, motivational full‑page modal when time is up - ☕ Temporary break (15 min) blocking when you choose to take a pause - ♻️ Reset Today’s Timer instantly (sidebar and button update immediately) - 🧠 Heartbeat tracking (no tab switching needed; time accrues automatically) - ⚙️ Robust Options page with presets and full settings ## 🧑‍💻 How It Works - The extension tracks time per hostname. You set a daily limit for each site. - A small rectangular floating button sits on the right edge. It shows remaining time and can be dragged vertically. It expands on hover. - Click the button to open a right‑side sidebar with: - Current site: set/remove limit, quick time buttons, usage summary - Today’s usage across your blocked sites - “Open Full Settings” (Options page) - When your time is up, a friendly modal appears in the center of the page with options: - Set New Limit & Continue - Reset Today’s Timer (usage→0 for current site) - Take a 15 min Break (temporarily blocks the site) - Continue without changes - A background heartbeat (every minute) accrues time even when you stay on the same tab, so the time‑up modal shows without needing to switch tabs. ## 🔧 Key Features - 🕹️ Floating Button - Shows remaining time - Draggable on the right edge - Expands on hover - 📊 Sidebar Controls - Set per‑site limit (1–1440 minutes) - Quick add: 15m / 30m / 1h / 2h - Remove limit - See current site usage + remaining time - Open Full Settings - 🧘 Time‑Up Modal (Polite & Motivational) - Clear, friendly language encouraging focus - Choose to continue, reset, take a break, or set a new limit - Blocks page interaction until you choose (persistent modal) - ♻️ Instant UI Refresh - Reset Today’s Timer updates the sidebar and floating button immediately - Background sends a message to refresh visible UI - ⏳ Heartbeat Tracking - A 1‑minute alarm accrues time periodically - Time‑up is detected even without tab switching ## ⚙️ Options (Full Settings) - Add/remove blocked sites - Set reminder block duration (temporary block after reminder) - Preset adders for common distracting sites - Start Fresh: clear all local data (with confirmation) ## 🚀 Quick Start 1. Load the extension (see Install). 2. Visit a site like YouTube. 3. Click the floating button → set a Daily Time Limit (e.g., 15 minutes). 4. Work/browse; when time’s up, you’ll see the modal. 5. Use the sidebar at any time to adjust limits. ## 🧪 Testing Tips - To see the modal quickly, set a 1‑minute limit. The heartbeat will trigger the modal after about a minute even if you don’t leave the tab. - You can also switch tabs briefly to force an immediate time update.