piguo45/single-file-wbs

This is a project schedule viewer that runs as a single HTML file in Chrome. There is no server to set up, no build step, and no external libraries to install. You download one file, open it in Chrome, and load your project data from a JSON file sitting next to it. The viewer combines a WBS (work breakdown structure) on the left, which is a collapsible list of tasks grouped under phases and projects, with a Gantt chart on the right that shows planned and actual date ranges as overlapping bars. A distinctive feature is the inazuma line, a Japanese term meaning lightning or zigzag. This line represents the progress boundary as of today. Where the line extends left of the current date column, it marks tasks that started late or finished late, making delays visible at a glance without needing to calculate anything. All data lives in a single JSON file. The JSON holds planned and actual start and end dates for each task. The tool calculates everything else automatically, including work hours, progress percentage, and the inazuma line position, so you never have to update those numbers by hand. Tasks can be nested up to three levels deep. Custom fields can be added with underscore-prefixed keys, such as AI token usage, outsourcing costs, or reference links, and the viewer preserves them through edits. Editing can happen three ways: directly in the browser by toggling edit mode, which auto-saves back to the JSON file every 0.4 seconds using the browser's File System Access API, through any text editor, or by asking an AI assistant like Claude Code to make changes through chat. Because the data is just a plain JSON file, you can tell an AI to shift all June tasks by one week, archive completed items, or summarize workload per person, and it can do that without any plugin or integration. The tool only works in Chrome and other Chromium-based browsers. Firefox and Safari are not supported because they do not implement the File System Access API that enables direct file saving.