feat: implement Stage 5 (Interactive Reader, EPUB/TXT parser, Bookshelf, Click-to-Translate) and Stage 4.3 (Strict CEFR level calculation)

This commit is contained in:
Antigravity committed 2026-10-05 11:42:13 +03:00
1 parent c51c505b61
commit d8a2c6e34f
9 files changed
+2101 -30

No files matched your search

+116
View File
@@ -67,6 +67,9 @@
</div>
<div class="nav-actions">
<button id="nav-reader-btn" class="btn btn-outline btn-sm" title="Интерактивная читалка и библиотека книг">
<span>📚 Читалка</span>
</button>
<button id="srs-trainer-btn" class="btn btn-trainer" title="Интервальный тренажер (Flashcards, 4 варианта, диктант, ввод)">
<span class="trainer-icon">🎓</span>
<span class="trainer-text">Тренажёр SRS</span>
@@ -517,6 +520,92 @@
</div>
</section>
<!-- VIEW 3: Interactive Reader & Bookshelf View -->
<section id="reader-view" class="reader-view hidden">
<!-- Bookshelf View -->
<div id="bookshelf-container" class="bookshelf-container">
<div class="bookshelf-header">
<div class="bookshelf-title-wrap">
<h2>📚 Библиотека & Интерактивная Читалка</h2>
<p class="subtitle">Читайте тексты и книги с мгновенным клик-переводом, озвучкой и авто-захватом контекста</p>
</div>
<div class="bookshelf-actions">
<button id="add-text-btn" class="btn btn-outline">✏️ Вставить текст</button>
<label for="book-file-input" class="btn btn-primary file-upload-label">
📁 Загрузить EPUB / TXT
<input type="file" id="book-file-input" accept=".epub,.txt,.md" style="display: none;">
</label>
</div>
</div>
<!-- Bookshelf Grid / Empty -->
<div id="bookshelf-empty" class="empty-state hidden">
<div class="empty-icon">📖</div>
<h3>Ваша библиотека пуста</h3>
<p>Загрузите книгу в формате EPUB, текстовый файл TXT/MD или вставьте текст статьи, чтобы начать интерактивное чтение.</p>
</div>
<div id="bookshelf-grid" class="bookshelf-grid"></div>
</div>
<!-- Reading Interface (Active when a book is open) -->
<div id="reader-interface" class="reader-interface hidden">
<header class="reader-toolbar">
<div class="reader-toolbar-left">
<button id="reader-back-btn" class="btn btn-sm btn-outline">← Библиотека</button>
<div class="reader-meta">
<h3 id="reader-book-title" class="reader-title">Книга</h3>
<span id="reader-book-author" class="reader-author">Автор</span>
</div>
</div>
<div class="reader-toolbar-center">
<button id="reader-prev-ch-btn" class="btn btn-xs btn-outline" title="Предыдущая глава">◀</button>
<select id="reader-chapter-select" class="reader-select"></select>
<button id="reader-next-ch-btn" class="btn btn-xs btn-outline" title="Следующая глава">▶</button>
</div>
<div class="reader-toolbar-right">
<div class="font-controls">
<button id="reader-font-dec-btn" class="btn btn-xs btn-outline" title="Уменьшить шрифт">A-</button>
<button id="reader-font-inc-btn" class="btn btn-xs btn-outline" title="Увеличить шрифт">A+</button>
</div>
<button id="reader-toggle-highlight-btn" class="btn btn-xs btn-outline" title="Вкл/Выкл подсветку изучаемых слов">✨ Подсветка</button>
<button id="reader-train-btn" class="btn btn-xs btn-trainer" title="Тренировать слова из этой книги">🎓 Слова книги</button>
</div>
</header>
<!-- Reading Container -->
<div class="reader-scroll-area" id="reader-scroll-area">
<div class="reader-content-body" id="reader-content-body">
<!-- Interactive paragraphs dynamically rendered here -->
</div>
</div>
</div>
<!-- Interactive Click-to-Translate Popup -->
<div id="reader-word-popup" class="reader-word-popup hidden">
<div class="popup-header">
<div class="popup-term-wrap">
<strong id="popup-term" class="popup-term">word</strong>
<span id="popup-phonetic" class="popup-phonetic">/wɜːd/</span>
<button id="popup-audio-btn" class="icon-btn audio-btn" title="Слушать произношение">🔊</button>
</div>
<button id="popup-close-btn" class="popup-close-btn">✕</button>
</div>
<div class="popup-body">
<div id="popup-loading" class="popup-loading hidden">Переводим...</div>
<div id="popup-content" class="popup-content">
<div class="popup-translation" id="popup-translation">перевод</div>
<div class="popup-context" id="popup-context">“Контекст из книги...”</div>
</div>
</div>
<div class="popup-footer">
<button id="popup-save-btn" class="btn btn-primary btn-sm btn-block">💾 Добавить в словарь</button>
<div id="popup-saved-badge" class="popup-saved-badge hidden">✅ Сохранено в словарь!</div>
</div>
</div>
</section>
<!-- Sticky Bulk Action Bar for Batch Selection Mode -->
<div id="batch-action-bar" class="batch-action-bar hidden">
<div class="batch-left">
@@ -800,6 +889,33 @@
<button type="submit" id="change-pwd-save-btn" class="btn btn-primary">Сохранить</button>
</div>
</form>
<!-- Add Book Modal (Paste Text) -->
<div id="add-book-modal" class="modal-backdrop hidden">
<div class="modal-window">
<div class="modal-header">
<h3>✏️ Добавить текст или статью</h3>
<button id="close-add-book-modal-btn" class="icon-btn">✕</button>
</div>
<form id="add-book-form">
<div class="modal-body">
<div class="form-group">
<label for="book-title-input">Название книги / статьи *</label>
<input type="text" id="book-title-input" class="input-styled" required placeholder="Например: Clean Code Principles">
</div>
<div class="form-group">
<label for="book-author-input">Автор / Источник</label>
<input type="text" id="book-author-input" class="input-styled" placeholder="Например: Robert C. Martin">
</div>
<div class="form-group">
<label for="book-content-input">Текст материала (English) *</label>
<textarea id="book-content-input" class="input-styled" rows="10" required placeholder="Вставьте английский текст книги, статьи или документации..."></textarea>
</div>
</div>
<div class="modal-footer">
<button type="button" id="cancel-add-book-btn" class="btn btn-outline">Отмена</button>
<button type="submit" id="submit-add-book-btn" class="btn btn-primary">📚 Сохранить в библиотеку</button>
</div>
</form>
</div>
</div>