Skip to content

Add web-based report visualizer tool#2067

Closed
mohithshuka wants to merge 1 commit intoCCExtractor:masterfrom
mohithshuka:web-report-visualizer
Closed

Add web-based report visualizer tool#2067
mohithshuka wants to merge 1 commit intoCCExtractor:masterfrom
mohithshuka:web-report-visualizer

Conversation

@mohithshuka
Copy link

@mohithshuka mohithshuka commented Jan 27, 2026

In raising this pull request, I confirm the following (please check boxes):

  • I have read and understood the contributors guide.
  • I have checked that another pull request for this purpose does not exist.
  • I have considered, and confirmed that this submission will be valuable to others.
  • I accept that this submission may not be used, and the pull request closed at the will of the maintainer.
  • I give this submission freely, and claim no ownership to its content.
  • I have mentioned this change in the changelog.

My familiarity with the project is as follows (check one):

  • I have never used CCExtractor.
  • I have used CCExtractor just a couple of times.
  • I absolutely love CCExtractor, but have not contributed previously.
  • I am an active contributor to CCExtractor.

{pull request content here}

- Implements HTML/CSS/JS visualization tool for -out=report output
- Parses report.txt and displays subtitle pages as cards
- Shows timestamps, types, and subtitle activity
- Includes Chart.js timeline visualization
- Resolves CCExtractor#1689
@mohithshuka
Copy link
Author

This PR implements the web-based visualization tool as proposed in #1689.
What's included:

  • index.html: Main interface with file upload functionality
  • styles.css: Modern, responsive design with gradient background
  • script.js: Parser for report.txt files with visualization logic
  • README.md: Documentation on usage and features

##How it works:

  1. User uploads a report.txt file generated by ccextractor -out=report
  2. JavaScript parses the file to extract subtitle pages, types, and timestamps
  3. Each page is displayed as a card showing key information
  4. A Chart.js bar chart visualizes subtitle activity across all pages

Features:

Fully client-side - no server required
Works by simply opening index.html in any browser
Responsive design for mobile and desktop
Visual timeline/graph of subtitle occurrences
Clean, modern UI

Testing:

The tool can be tested by:

  1. Running CCExtractor with -out=report on any video file
  2. Opening tools/report-visualizer/index.html in a browser
  3. Uploading the generated report.txt file

Future enhancements (optional):

  • GitHub Pages hosting for live demo
  • Export functionality for filtered data
  • More detailed timeline views with time-based graphs

@cfsmp3 cfsmp3 mentioned this pull request Jan 31, 2026
10 tasks
@cfsmp3
Copy link
Contributor

cfsmp3 commented Jan 31, 2026

Closing this PR due to issues:

  1. No changelog entry: The checkbox for changelog is unchecked, and new features should be documented.

  2. Duplicate submission: This same report visualizer code appears in PR Feature/document timestamp map #2071 as well - please don't submit the same code in multiple PRs.

  3. Not a core feature: While visualization tools can be useful, adding third-party dependencies (Chart.js CDN) and web tools to the repository requires discussion first. Consider hosting this as a separate project or discussing in an issue before submitting.

If you'd like to contribute tools like this, please open an issue first to discuss whether it fits the project scope.

@cfsmp3 cfsmp3 closed this Jan 31, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Proposal]:Web-Based Visualization for -out=report Output

2 participants