add README
This commit is contained in:
1 parent
8fc5e03758
commit
155d9a608b
1 file changed
+95
@@ -0,0 +1,95 @@
|
|||||||
|
# yt2press
|
||||||
|
|
||||||
|
A tool to convert YouTube videos into press-ready markdown documents with timestamped screenshots.
|
||||||
|
|
||||||
|
## How to Use
|
||||||
|
|
||||||
|
### Step 1: Prepare Your Video
|
||||||
|
|
||||||
|
Download or place a video file in the `/docs/public` directory.
|
||||||
|
|
||||||
|
### Step 2: Create a Markdown File
|
||||||
|
|
||||||
|
Create a markdown file in `/docs` directory. The filename should match the video filename with `[xxx]` removed.
|
||||||
|
|
||||||
|
For example:
|
||||||
|
- Video file: `my-video[abc123].mp4` → Markdown file: `my-video.md`
|
||||||
|
- Video file: `presentation.mp4` → Markdown file: `presentation.md`
|
||||||
|
|
||||||
|
The markdown file content can be:
|
||||||
|
|
||||||
|
**Option A: YAML Frontmatter (for auto-generating timestamps)**
|
||||||
|
```yaml
|
||||||
|
---
|
||||||
|
interval: 5
|
||||||
|
dedup: true
|
||||||
|
---
|
||||||
|
|
||||||
|
Your content here...
|
||||||
|
```
|
||||||
|
|
||||||
|
- `interval`: (Optional) Interval in seconds to auto-generate timestamps
|
||||||
|
- `dedup`: (Optional) Set to `true` to remove similar screenshots (defaults to 0.005), or specify a custom threshold value
|
||||||
|
|
||||||
|
**Option B: Manual Timestamps**
|
||||||
|
```markdown
|
||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
|
Content with timestamps...
|
||||||
|
|
||||||
|
1:30
|
||||||
|
|
||||||
|
2:45
|
||||||
|
|
||||||
|
5:00
|
||||||
|
```
|
||||||
|
|
||||||
|
Timestamps should be in `M:SS` or `MM:SS` format on their own line. They will be converted to timestamped screenshot references.
|
||||||
|
|
||||||
|
### Step 3: Start the Development Server
|
||||||
|
|
||||||
|
Run the following command in the project directory:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
pnpm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
This starts the VitePress development server and WebSocket server for communication.
|
||||||
|
|
||||||
|
### Step 4: Use the Downloader Interface
|
||||||
|
|
||||||
|
1. Open the VitePress website in your browser
|
||||||
|
2. Find the downloader component
|
||||||
|
3. Enter your video filename in the textbox
|
||||||
|
4. Press Enter or Submit
|
||||||
|
|
||||||
|
The app will:
|
||||||
|
- Load the video
|
||||||
|
- Extract screenshots at specified timestamps
|
||||||
|
- Replace timestamp lines with embedded screenshot images
|
||||||
|
- Save the updated markdown file
|
||||||
|
|
||||||
|
## Project Structure
|
||||||
|
|
||||||
|
```
|
||||||
|
docs/ # VitePress documentation root
|
||||||
|
.vitepress/
|
||||||
|
theme/
|
||||||
|
components/
|
||||||
|
Downloader.vue # Vue component for the downloader interface
|
||||||
|
public/ # Video storage directory
|
||||||
|
*.md # Markdown files with content
|
||||||
|
[video-folder]/ # Screenshot folders (auto-generated)
|
||||||
|
*.png # Timestamped screenshots
|
||||||
|
server.js # WebSocket server for handling downloads
|
||||||
|
group-similar.js # Script for deduplicating similar screenshots
|
||||||
|
```
|
||||||
|
|
||||||
|
## Dependencies
|
||||||
|
|
||||||
|
- Node.js and pnpm
|
||||||
|
- VitePress for static site generation
|
||||||
|
- WebSocket for real-time communication between browser and server
|
||||||
|
- gray-matter for parsing YAML frontmatter
|
||||||
|
- Sharp for image processing (screenshot manipulation)
|
||||||
Reference in new issue
Block a user