https://github.com/hackjutsu/screenshotcapturer
A toy project to get a taste of Chrome extension
https://github.com/hackjutsu/screenshotcapturer
Last synced: 13 days ago
JSON representation
A toy project to get a taste of Chrome extension
- Host: GitHub
- URL: https://github.com/hackjutsu/screenshotcapturer
- Owner: hackjutsu
- Created: 2025-03-01T04:06:38.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-01T05:14:41.000Z (about 1 year ago)
- Last Synced: 2025-03-01T06:19:54.505Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 14.6 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Screenshot Extension
A Chrome extension that allows you to take screenshots of web pages in two ways:
1. Capture the visible area only
2. Capture the full webpage by automatically scrolling and stitching
## Features
- **Visible Area Screenshot**: Captures what's currently visible in the browser tab
- **Full Page Screenshot**: Captures the entire webpage by scrolling and stitching multiple screenshots together
- Automatic filename generation with timestamps
- Progress indicator for full page captures
## Installation
### Development Mode
1. Clone or download this repository
2. Open Chrome and navigate to `chrome://extensions/`
3. Enable "Developer mode" using the toggle in the top-right corner
4. Click "Load unpacked" and select the folder containing the extension files
5. The extension icon should appear in your Chrome toolbar
### From Chrome Web Store (Coming Soon)
1. Visit the Chrome Web Store page for this extension (link to be added)
2. Click "Add to Chrome"
3. Confirm the installation
## Usage
1. Navigate to the webpage you want to capture
2. Click the extension icon in your Chrome toolbar
3. Choose one of the following options:
- **Capture Visible Area**: Takes a screenshot of what's currently visible
- **Capture Full Page**: Takes a screenshot of the entire webpage (may take a moment for long pages)
4. The screenshot will be automatically downloaded with a timestamp in the filename
## How It Works
- **Visible Area Screenshot**: Uses Chrome's `captureVisibleTab` API
- **Full Page Screenshot**:
- Creates a canvas the size of the entire webpage
- Scrolls through the page, taking screenshots at each position
- Draws each screenshot onto the canvas at the appropriate position
- Converts the final canvas to a PNG image
## Requirements
- Google Chrome browser (version 88 or later recommended)
## Known Limitations
- Some websites with complex layouts or dynamic content may not capture perfectly
- Very large webpages may require significant memory during the capture process
- Websites that block content scripts may not work with the full page capture feature
## License
MIT