sudacode/SubMiner
1
0
Fork 0
mirror of https://github.com/ksyasuda/SubMiner.git synced 2026-02-27 18:22:41 -08:00
Code Issues Packages Projects Releases Wiki Activity

update docs

Browse Source
This commit is contained in:
Kyle Yasuda
2026-02-22 19:35:19 -08:00
parent e0621d042d
commit 64acf22292
23 changed files with 289 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

173
docs/index.md
View File

@@ -7,16 +7,16 @@ titleTemplate: Immersion Mining Workflow for MPV
hero:
name: SubMiner
text: Immersion Mining for MPV
tagline: Look up words, mine to Anki, and enrich cards with context — all without leaving the video.
tagline: Watch media, mine vocabulary, and build cards without leaving the scene.
image:
src: /assets/SubMiner.png
alt: SubMiner logo
actions:
- theme: brand
text: Get Started
text: Install
link: /installation
- theme: alt
text: Mining Workflow
text: Explore workflow
link: /mining-workflow
features:
@@ -24,58 +24,124 @@ features:
src: /assets/mpv.svg
alt: mpv icon
title: Built for mpv
details: Connects via IPC to track subtitles in real time and render a self-contained overlay — everything bundled in a single application.
details: Tracks subtitles through mpv IPC in real time, with a single launch path and no external bridge services.
- icon:
src: /assets/yomitan-icon.svg
alt: Yomitan logo
title: Yomitan Integration
details: Hover over any word in the subtitle overlay to trigger dictionary lookups — instant definitions without leaving the player.
details: Keep your flow moving with instant word lookups and context-aware card creation directly from subtitles.
- icon:
src: /assets/anki-card.svg
alt: Anki card icon
title: Anki Card Enrichment
details: Add a word from Yomitan and SubMiner fills in the sentence, audio clip, screenshot, and translation automatically.
details: Auto-fills card fields with subtitle sentence, clipping, image, and translation so you can focus on learning.
- icon:
src: /assets/dual-layer.svg
alt: Dual layer icon
title: Dual-Layer Subtitles
details: Interactive visible overlay plus an invisible layer aligned with mpv's own rendering for seamless click-through lookup. Both are independently controllable.
title: Three-Plane Overlay Stack
details: Secondary context plane + visible interactive layer + invisible interaction plane, each with independent behavior and startup state.
- icon:
src: /assets/highlight.svg
alt: Highlight icon
title: N+1 Highlighting
details: Marks words you already know from your Anki deck so you can spot new vocabulary and identify N+1 sentences at a glance.
details: Surfaces known words from your deck so unknown targets stand out during immersion sessions.
- icon:
src: /assets/tokenization.svg
alt: Tokenization icon
title: Immersion Tracking
details: Every subtitle line, word, and mined card is logged to local SQLite. Daily and monthly rollups let you measure your progress over time.
details: Captures subtitle and mining telemetry to SQLite, with daily/monthly rollups for progress clarity.
- icon:
src: /assets/subtitle-download.svg
alt: Subtitle download icon
title: Subtitle Download & Sync
details: Search and download Japanese subtitles from Jimaku, then sync to audio with alass or ffsubsync — all from within the player.
details: Pull and synchronize subtitles with Jimaku plus alass/ffsubsync in one cohesive workflow.
- icon:
src: /assets/keyboard.svg
alt: Keyboard icon
title: Keyboard-Driven
details: Mine sentences, copy subtitles, cycle display modes, and trigger field grouping — all from configurable shortcuts.
details: Run lookups, mining actions, clipping, and workflow toggles with one configurable shortcut surface.
- icon:
src: /assets/texthooker.svg
alt: Texthooker icon
title: Texthooker & WebSocket
details: Built-in texthooker page that receives subtitles over WebSocket — use it as a clipboard inserter or connect external tools.
details: Stream subtitles in real time to browser tools via local WebSocket and keep your stack integrated.
---
<div class="landing-shell">
<section class="workflow-section">
<h2>How it fits together</h2>
<div class="workflow-steps">
<div class="workflow-step">
<div class="step-number">01</div>
<div class="step-title">Start</div>
<div class="step-desc">Launch with the wrapper or existing mpv setup and keep subtitles in sync.</div>
</div>
<div class="workflow-step">
<div class="step-number">02</div>
<div class="step-title">Lookup</div>
<div class="step-desc">Hover or click a token in the interactive overlay to open Yomitan context.</div>
</div>
<div class="workflow-step">
<div class="step-number">03</div>
<div class="step-title">Mine</div>
<div class="step-desc">Create cards from Yomitan or mine sentence cards directly from subtitle lines.</div>
</div>
<div class="workflow-step">
<div class="step-number">04</div>
<div class="step-title">Enrich</div>
<div class="step-desc">Automatically attach timing-accurate audio, sentence text, and visual evidence.</div>
</div>
<div class="workflow-step">
<div class="step-number">05</div>
<div class="step-title">Track</div>
<div class="step-desc">Review immersion history and repeat high-value patterns over time.</div>
</div>
</div>
</section>
<section class="demo-section">
<h2>See it in action</h2>
<p>Subtitles, lookup flow, and card enrichment from a real playback session.</p>
<video controls playsinline preload="metadata" poster="/assets/demo-poster.jpg">
<source :src="'/assets/minecard.webm'" type="video/webm" />
<source :src="'/assets/minecard.mp4'" type="video/mp4" />
<a :href="'/assets/minecard.webm'" target="_blank" rel="noreferrer">
<img :src="'/assets/minecard.gif'" alt="SubMiner demo GIF fallback" style="width: 100%; height: auto;" />
</a>
</video>
</section>
</div>
<style>
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');
.landing-shell {
max-width: 1120px;
margin: 0 auto;
padding: 0.5rem 1rem 4rem;
}
.landing-shell,
.landing-shell .step-title,
.landing-shell h1,
.landing-shell h2 {
font-family: 'Manrope', 'Arial', sans-serif;
}
.step-title,
.step-number {
font-family: 'Space Grotesk', 'Manrope', 'Arial', sans-serif;
letter-spacing: -0.01em;
}
.demo-section {
max-width: 960px;
margin: 0 auto;
padding: 0 24px;
padding: 2rem 0 0;
}
.demo-section h2 {
font-size: 1.5rem;
font-size: 1.45rem;
font-weight: 600;
margin-bottom: 0.5rem;
letter-spacing: -0.01em;
@@ -83,7 +149,7 @@ features:
.demo-section p {
color: var(--vp-c-text-2);
margin-bottom: 1.25rem;
margin: 0 0 0.9rem;
line-height: 1.6;
}
@@ -91,19 +157,19 @@ features:
width: 100%;
border-radius: 12px;
border: 1px solid var(--vp-c-divider);
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
animation: card-enter 380ms ease-out;
}
.workflow-section {
max-width: 960px;
margin: 4rem auto 0;
padding: 0 24px 3rem;
margin: 2.4rem auto 0;
padding: 0 0 2.5rem;
}
.workflow-section h2 {
font-size: 1.5rem;
font-size: 1.45rem;
font-weight: 600;
margin-bottom: 1.5rem;
margin-bottom: 1rem;
letter-spacing: -0.01em;
}
@@ -129,8 +195,9 @@ features:
}
.workflow-step {
padding: 1.25rem 1.5rem;
padding: 1.1rem 1.25rem;
background: var(--vp-c-bg-soft);
animation: card-enter 330ms ease-out;
}
.workflow-step .step-number {
@@ -154,52 +221,16 @@ features:
color: var(--vp-c-text-2);
line-height: 1.5;
}
@keyframes card-enter {
from {
opacity: 0.8;
transform: translateY(8px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
</style>
<div class="workflow-section">
## How It Works
<div class="workflow-steps">
<div class="workflow-step">
<div class="step-number">01</div>
<div class="step-title">Watch</div>
<div class="step-desc">Play a video in mpv. SubMiner connects via IPC and captures subtitles in real time.</div>
</div>
<div class="workflow-step">
<div class="step-number">02</div>
<div class="step-title">Look Up</div>
<div class="step-desc">Hover over a word in the subtitle overlay to trigger a Yomitan lookup — no browser or tab-switching needed.</div>
</div>
<div class="workflow-step">
<div class="step-number">03</div>
<div class="step-title">Mine</div>
<div class="step-desc">Add the word to Anki from Yomitan. SubMiner detects the new card automatically.</div>
</div>
<div class="workflow-step">
<div class="step-number">04</div>
<div class="step-title">Enrich</div>
<div class="step-desc">SubMiner fills in the sentence, audio clip, screenshot, and translation — no extra steps.</div>
</div>
<div class="workflow-step">
<div class="step-number">05</div>
<div class="step-title">Track</div>
<div class="step-desc">Every line seen and card mined is logged to local SQLite. Daily and monthly rollups let you measure immersion over time.</div>
</div>
</div>
</div>
<div class="demo-section">
## See It in Action
<video controls playsinline preload="metadata" poster="/assets/demo-poster.jpg">
<source :src="'/assets/minecard.webm'" type="video/webm" />
<source :src="'/assets/minecard.mp4'" type="video/mp4" />
<a :href="'/assets/minecard.webm'" target="_blank" rel="noreferrer">
<img :src="'/assets/minecard.gif'" alt="SubMiner demo GIF fallback" style="width: 100%; height: auto;" />
</a>
</video>
</div>