Porch Web Project Timeline Overlay

WHAT IT DOES

Porch Web Project Timeline Overlay reads project timeline and milestone status from your Porch account and displays a floating project timeline overlay showing milestone progress and estimated completion dates. The badge shows the number of completed milestones out of total, a progress bar with percentage, and a list of milestones with their status—Done (green), In Progress (yellow), or Pending (gray). Each milestone shows its name, status, and date when available. An estimated completion date counter shows days remaining or the estimated date. The extension tracks milestone history per project, storing each progress change with a timestamp. When all milestones are completed, a desktop notification is triggered. The panel displays your current progress, milestone list, and project name.

WHERE IT RUNS

This extension works on all Porch pages at porch.com and its subdomains, specifically on account pages where project timelines and milestone status are displayed. It runs on the main account page, the project page, the timeline page, and any page displaying project information. The extension operates entirely within your browser and does not access Porch's servers directly—it reads only what is visible on the page you are viewing. It works alongside the free BotGentz extension, which provides the necessary scripting environment.

HOW TO USE

Install the extension, then navigate to porch.com and log in to your account. The extension automatically creates a floating project timeline overlay on the page. Click the extension's icon in your browser toolbar to open the settings panel. Use the "Show Overlay" / "Hide Overlay" button to toggle the badge visibility. The overlay shows your milestone progress, status list, and estimated completion date. Use the "Refresh" button to manually update the overlay with the latest timeline information. The "Show completed milestones" toggle controls whether completed milestones appear in the list. The "Completion notifications" toggle controls desktop notifications when all milestones are completed. Adjust the overlay transparency using the opacity dropdown (70%, 82%, 92%, or 100%). Drag the badge by clicking and holding anywhere inside it. Resize it by dragging the bottom-right corner. Close the badge with the × button.

MILESTONE EXTRACTION WITH STATUS DETECTION AND PROGRESS TRACKING

Unlike simple progress display tools, this extension uses a multi-selector extraction engine to find milestone items and status from Porch's varying page structures. It searches for milestone items using multiple selector patterns (.milestone-item, .timeline-item, .project-milestone) and falls back to text parsing. Status is detected using status elements and keyword matching (completed, done, finished, in progress, active, ongoing). Dates are parsed from date-related elements using date parsing that handles multiple formats. Progress is calculated as the ratio of completed milestones to total milestones. Per-project milestone history is stored as a key-value object where keys are project identifiers and values are arrays of progress records with timestamps, limited to 20 entries per project. Completion notifications trigger when all milestones are complete, with a once-per-day cooldown.

THE PANEL

The panel supports drag-to-move anywhere on the page. It remembers its position per site, so it stays where you placed it on porch.com. Click the panel header to collapse it down to just the minimized bubble, or click the expand handle to show the full panel. The panel can be resized by dragging the bottom-right corner. Press the Escape key to close the expanded panel and return to the minimized state. All panel settings, including position, size, collapsed state, opacity, completed milestones visibility, notification preference, and per-project milestone history, are saved per site and persist across browsing sessions.

PLEASE NOTE

This extension requires the free BotGentz extension to be installed and active, as it provides the underlying DOM injection and script execution environment. Porch's website changes periodically, and timeline element structures, class names, and page layouts may be updated. When that happens, the extension may stop detecting milestone data until an update is released. The extension stores your overlay position, size, opacity, visibility, completed milestones preference, notification preference, and per-project milestone history locally in your browser's storage using GM_setValue. Milestone history is stored as a key-value object where keys are project identifiers and values are arrays of progress records. The milestone data displayed is read from the page—the extension does not access Porch's internal project data. Always verify with Porch directly for the most accurate project timeline information. No data is ever sent to any server, and no personal information is collected. You can clear all stored settings at any time by clearing your browser data for porch.com.