auto create markdown file from parser interface
This commit is contained in:
polv committed
1 parent
f143f1e511
commit
8434cf78ed
8 files changed
+2446
-866
No files matched your search
@@ -15,16 +15,37 @@ Download or place a video file in the `/docs/public` directory. Several options
|
||||
|
||||
Choose any method to download your video and save it to `/docs/public` directory.
|
||||
|
||||
### Step 2: Create a Markdown File
|
||||
### Step 2: Start the Development Server
|
||||
|
||||
Create a markdown file in `/docs` directory. The filename should match the video filename with `[xxx]` removed and spaces replaced with underscores.
|
||||
Run the following command in the project directory:
|
||||
|
||||
```bash
|
||||
pnpm run dev
|
||||
```
|
||||
|
||||
This starts the VitePress development server and WebSocket server for communication.
|
||||
|
||||
### Step 3: Use the Downloader Interface
|
||||
|
||||
1. Open the VitePress website in your browser
|
||||
2. Enter your video filename in the textbox (e.g. `my video [abc123].mp4`, `presentation.webm`, `my-video [xyz].mpeg`)
|
||||
3. Press Enter or click Submit
|
||||
|
||||
The app will:
|
||||
- Load the markdown matching the submitted video filename.
|
||||
- If it exists: process the video — extract screenshots for timestamps, insert images, and save the markdown.
|
||||
- If it does not exist: create the markdown and exit. Edit the new file (add frontmatter or timestamps), then run the Downloader again.
|
||||
|
||||
#### Create/Edit the Markdown File
|
||||
|
||||
You may let the Downloader create the markdown file automatically, or create it yourself by placing a file in the `/docs` directory. The filename should match the video filename with any bracketed ID removed and spaces replaced with underscores, for example:
|
||||
|
||||
For example:
|
||||
- Video file: `my video [abc123].mp4` → Markdown file: `my_video.md`
|
||||
- Video file: `presentation.webm` → Markdown file: `presentation.md`
|
||||
- Video file: `my-video [xyz].mpeg` → Markdown file: `my-video.md`
|
||||
|
||||
The markdown file content can be:
|
||||
If the file is newly created by the Downloader, you will need to edit the markdown to provide the content or timestamps the app will use. After editing, run the Downloader again to regenerate screenshots and update image references.
|
||||
|
||||
The markdown file content can be one of the following:
|
||||
|
||||
**Option A: YAML Frontmatter (for auto-generating timestamps)**
|
||||
|
||||
@@ -58,28 +79,6 @@ Velit euismod blandit proin arcu magna.
|
||||
|
||||
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. Enter your video filename in the textbox (e.g. `my video [abc123].mp4`, `presentation.webm`, `my-video [xyz].mpeg`)
|
||||
3. Press Enter or click 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
|
||||
|
||||
```
|
||||
@@ -100,7 +99,7 @@ group-similar.js # Script for deduplicating similar screenshots
|
||||
## Dependencies
|
||||
|
||||
- Node.js and pnpm
|
||||
- VitePress for web UI
|
||||
- [VitePress](https://vitepress.dev) for web UI
|
||||
- WebSocket for real-time communication between browser and server
|
||||
- gray-matter for parsing YAML frontmatter
|
||||
- [Sharp](https://github.com/lovell/sharp) for image processing (screenshot manipulation)
|
||||
- `gray-matter` for parsing YAML frontmatter
|
||||
- [`sharp`](https://github.com/lovell/sharp) for image processing (screenshot manipulation)
|
||||
@@ -9,6 +9,8 @@ hero:
|
||||
|
||||
<Downloader />
|
||||
|
||||
- [什么是深圳？｜ WHAT IS SHENZHEN？【星球研究所】](/什么是深圳？｜_WHAT_IS_SHENZHEN？【星球研究所】)
|
||||
- [意大利为什么没有赶上现代化这趟二路汽车？](/意大利为什么没有赶上现代化这趟二路汽车？)
|
||||
- [みんなうっかり間違える！？中国語 様態補語と程度補語の文法の注意点とは](/みんなうっかり間違える！？中国語_様態補語と程度補語の文法の注意点とは)
|
||||
- [【剥茧The Truth Within】EP02](/qVVhBGT0K7Y)
|
||||
- [15萬緬甸人在台灣的背後，是一段顛沛流離的故事](/15萬緬甸人在台灣的背後，是一段顛沛流離的故事)
|
||||
|
||||
File diff suppressed because it is too large.
Load diff
+786
@@ -0,0 +1,786 @@
|
||||
---
|
||||
interval: 2
|
||||
dedup: true
|
||||
video: >-
|
||||
/那個幾乎成為泰國總理的男人皮塔：不是「政治金童」，而是「指定倖存者」｜Pita： The Man Who Almost Became Thailand’s
|
||||
Prime Minister [LQ5NuIjEFxE].mp4
|
||||
---
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>0:56</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>1:00</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>1:52</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>2:18</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>2:44</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>3:08</summary>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>4:08</summary>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>4:32</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>4:36</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>5:26</summary>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>5:34</summary>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>5:40</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>5:44</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details>
|
||||
<summary>5:48</summary>
|
||||
|
||||
|
||||
</details>
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+1
-1
@@ -13,7 +13,7 @@
|
||||
"ws": "^8.19.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.19.30",
|
||||
"@types/node": "24",
|
||||
"@types/ws": "^8.18.1",
|
||||
"concurrently": "^9.2.1"
|
||||
},
|
||||
|
||||
Generated
+407
-819
File diff suppressed because it is too large.
Load diff
@@ -1,2 +0,0 @@
|
||||
onlyBuiltDependencies:
|
||||
- sharp
|
||||
@@ -33,9 +33,10 @@ wss.on("connection", (ws) => {
|
||||
console.log(`Start ${q}`);
|
||||
|
||||
const md = loadMdFile(q);
|
||||
const q_stem = make_q_stem(q);
|
||||
|
||||
try {
|
||||
mkdirSync(joinPath(ROOT_DIR, md.q_stem));
|
||||
mkdirSync(joinPath(ROOT_DIR, q_stem));
|
||||
} catch (e) {}
|
||||
|
||||
let isChanged = false;
|
||||
@@ -63,7 +64,7 @@ wss.on("connection", (ws) => {
|
||||
const { min, sec } = m.groups;
|
||||
const t = `${min}_${sec}`;
|
||||
ts.push(t);
|
||||
newContent += `\n\n\n`;
|
||||
newContent += `\n\n\n`;
|
||||
isChanged = true;
|
||||
} else {
|
||||
newContent += `${line}\n`;
|
||||
@@ -80,10 +81,7 @@ wss.on("connection", (ws) => {
|
||||
case "timed_q":
|
||||
{
|
||||
const { q, t } = payload;
|
||||
const q_stem = q
|
||||
.replace(/\.[a-z0-9]+$/, "")
|
||||
.replace(/\[.+?\]/g, "")
|
||||
.trim();
|
||||
const q_stem = make_q_stem(q);
|
||||
filename = t ? joinPath(q_stem, `${t}.png`) : "";
|
||||
}
|
||||
break;
|
||||
@@ -92,7 +90,7 @@ wss.on("connection", (ws) => {
|
||||
const { q } = payload;
|
||||
const md = loadMdFile(q);
|
||||
|
||||
console.log(`Done timestamp ${q}`);
|
||||
console.log(`Done basic parsing ${q}`);
|
||||
|
||||
const { dedup } = md.data;
|
||||
if (dedup) {
|
||||
@@ -104,7 +102,7 @@ wss.on("connection", (ws) => {
|
||||
typeof dedup === "number" ? dedup : undefined,
|
||||
).then((stats) => {
|
||||
// Don't log a thing yet.
|
||||
console.log(`Done duduping ${md.filename}`);
|
||||
console.log(`Done deduping ${md.filename}`);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -125,16 +123,30 @@ wss.on("connection", (ws) => {
|
||||
* @returns
|
||||
*/
|
||||
function loadMdFile(q) {
|
||||
const q_stem = q
|
||||
.replace(/\.[a-z0-9]+$/, "")
|
||||
.replace(/\[.+?\]/g, "")
|
||||
.trim()
|
||||
.replace(/\s+/g, "_");
|
||||
const q_stem = make_q_stem(q);
|
||||
|
||||
try {
|
||||
mkdirSync(joinPath(ROOT_DIR, q_stem));
|
||||
} catch (e) {}
|
||||
|
||||
const filename = joinPath(ROOT_DIR, `${q_stem}.md`);
|
||||
return { q_stem, filename, ...matter(readFileSync(filename, "utf-8")) };
|
||||
try {
|
||||
// create a blank md file if not exists
|
||||
readFileSync(filename, { flag: "a" });
|
||||
} catch (e) {}
|
||||
|
||||
return { filename, ...matter(readFileSync(filename, "utf-8")) };
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {string} q
|
||||
* @returns
|
||||
*/
|
||||
function make_q_stem(q) {
|
||||
return q
|
||||
.replace(/\.[a-z0-9]+$/, "")
|
||||
.replace(/\[.+?\]/g, "")
|
||||
.trim()
|
||||
.replace(/\s+/g, "_");
|
||||
}
|
||||
Reference in new issue
Block a user