178 lines
9.3 KiB
HTML
178 lines
9.3 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="ru">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>ObsidianPad</title>
|
|||
|
|
<link rel="stylesheet" href="style.css">
|
|||
|
|
</head>
|
|||
|
|
<body class="dark-theme">
|
|||
|
|
<div class="app-container" id="drop-zone">
|
|||
|
|
<!-- Title Bar -->
|
|||
|
|
<div class="title-bar">
|
|||
|
|
<div class="drag-region">OBSIDIANPAD</div>
|
|||
|
|
<div class="window-controls">
|
|||
|
|
<div class="win-btn minimize" onclick="window.minimizeApp()" title="Свернуть">
|
|||
|
|
<svg width="10" height="1"><rect width="10" height="1" fill="currentColor"/></svg>
|
|||
|
|
</div>
|
|||
|
|
<div class="win-btn close" onclick="window.closeApp()" title="Закрыть">
|
|||
|
|
<svg width="10" height="10"><path d="M0 0L10 10M10 0L0 10" stroke="currentColor" stroke-width="1.2"/></svg>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Top Toolbar -->
|
|||
|
|
<div class="top-toolbar">
|
|||
|
|
<div class="search-box">
|
|||
|
|
<input type="text" id="note-search" oninput="window.filterNotes(this.value)" placeholder="Поиск...">
|
|||
|
|
<select id="file-list" onchange="window.loadFile(this.value)">
|
|||
|
|
<option value="">Заметки...</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<button class="tool-btn" onclick="window.handleSaveAction()" title="Сохранить / Создать новую заметку (Ctrl+S)">💾</button>
|
|||
|
|
<button class="tool-btn" onclick="window.closeFile()" title="Закрыть текущую заметку (Ctrl+W)">✕</button>
|
|||
|
|
<button class="tool-btn" onclick="window.toggleSettings()" title="Настройки программы">⚙</button>
|
|||
|
|
|
|||
|
|
<div class="spacer"></div>
|
|||
|
|
|
|||
|
|
<button class="tool-btn ai-btn" onclick="window.generateTitleDirect()" title="ИИ: Переименовать текущую заметку">✨</button>
|
|||
|
|
<button class="tool-btn ai-btn" onclick="window.translateText()" title="ИИ: Перевести текст на русский (Ctrl+T)">🌐</button>
|
|||
|
|
<button id="preview-toggle" class="tool-btn" onclick="window.togglePreview()" title="Предпросмотр Markdown (Ctrl+P)">👁</button>
|
|||
|
|
<button class="tool-btn" onclick="window.openAbout()" title="О программе ObsidianPad">ℹ</button>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Markdown Toolbar -->
|
|||
|
|
<div class="md-toolbar">
|
|||
|
|
<button onclick="window.insertText('H1')" title="Заголовок 1">H₁</button>
|
|||
|
|
<button onclick="window.insertText('H2')" title="Заголовок 2">H₂</button>
|
|||
|
|
<button onclick="window.insertText('H3')" title="Заголовок 3">H₃</button>
|
|||
|
|
<span class="separator">|</span>
|
|||
|
|
<button onclick="window.insertText('B')" title="Жирный текст (Ctrl+B)">B</button>
|
|||
|
|
<button onclick="window.insertText('I')" title="Курсив (Ctrl+I)">I</button>
|
|||
|
|
<button onclick="window.insertText('S')" title="Зачеркнутый">S</button>
|
|||
|
|
<span class="separator">|</span>
|
|||
|
|
<button onclick="window.insertText('QUOTE')" title="Цитата">“</button>
|
|||
|
|
<button onclick="window.insertText('CODE')" title="Блок кода (Ctrl+K)">{}</button>
|
|||
|
|
<span class="separator">|</span>
|
|||
|
|
<button onclick="window.insertText('UL')" title="Маркированный список">•≡</button>
|
|||
|
|
<button onclick="window.insertText('OL')" title="Нумерованный список">1≡</button>
|
|||
|
|
<span class="separator">|</span>
|
|||
|
|
<button onclick="window.insertText('LINK')" title="Вставить ссылку">🔗</button>
|
|||
|
|
<button onclick="window.insertImageClick()" title="Вставить изображение">🖼</button>
|
|||
|
|
<button onclick="window.insertText('TABLE')" title="Вставить таблицу">▦</button>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="editor-view">
|
|||
|
|
<textarea id="editor" spellcheck="false" placeholder="Начните писать..."></textarea>
|
|||
|
|
<div id="preview" class="markdown-body hidden"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Modal: New Note -->
|
|||
|
|
<div id="new-note-modal" class="modal hidden">
|
|||
|
|
<div class="modal-content">
|
|||
|
|
<h3 id="modal-head-text">Новая заметка (Ctrl+N)</h3>
|
|||
|
|
<div class="modal-row">
|
|||
|
|
<input type="text" id="new-note-title" placeholder="Название заметки...">
|
|||
|
|
<button class="icon-btn" onclick="window.generateTitleForModal()" title="Сгенерировать название с помощью ИИ">✨</button>
|
|||
|
|
</div>
|
|||
|
|
<div id="modal-status" class="small-info"></div>
|
|||
|
|
<div class="modal-actions">
|
|||
|
|
<button onclick="window.closeNewNoteModal()">Отмена</button>
|
|||
|
|
<button class="save-btn" onclick="window.confirmCreateNote()">ОК</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Modal: About -->
|
|||
|
|
<div id="about-modal" class="modal hidden">
|
|||
|
|
<div class="modal-content about-box">
|
|||
|
|
<h2 id="about-name">ObsidianPad</h2>
|
|||
|
|
<p id="about-desc"></p>
|
|||
|
|
<div class="about-info">
|
|||
|
|
<p>Версия: <span id="about-ver"></span></p>
|
|||
|
|
<p>Автор: <span id="about-auth"></span></p>
|
|||
|
|
</div>
|
|||
|
|
<a href="#" id="about-link" class="github-link">GitHub Repository</a>
|
|||
|
|
<div class="modal-actions" style="margin-top:20px;">
|
|||
|
|
<button class="save-btn" onclick="window.closeAbout()">ОК</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Settings Panel -->
|
|||
|
|
<div id="settings" class="settings-panel hidden">
|
|||
|
|
<h2 data-i18n="settings">Настройки</h2>
|
|||
|
|
<div class="setting-group">
|
|||
|
|
<label data-i18n="lang">Язык</label>
|
|||
|
|
<select id="app-lang" onchange="window.changeLang(this.value)">
|
|||
|
|
<option value="ru">Русский</option>
|
|||
|
|
<option value="en">English</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
<div class="setting-group">
|
|||
|
|
<label data-i18n="theme">Тема</label>
|
|||
|
|
<select id="app-theme" onchange="window.previewTheme(this.value)">
|
|||
|
|
<option value="dark">Темная</option>
|
|||
|
|
<option value="light">Светлая</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
<hr>
|
|||
|
|
<h3>Obsidian API</h3>
|
|||
|
|
<div class="setting-group">
|
|||
|
|
<label>API URL</label>
|
|||
|
|
<input type="text" id="obs-api-url">
|
|||
|
|
<span class="hint">Обычно http://127.0.0.1:27123</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="setting-group">
|
|||
|
|
<label>API Key</label>
|
|||
|
|
<input type="password" id="obs-api-key">
|
|||
|
|
<span class="hint">Ключ из настроек плагина Local REST API</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="setting-group">
|
|||
|
|
<label>Папка (Vault Folder)</label>
|
|||
|
|
<input type="text" id="obs-folder">
|
|||
|
|
<span class="hint">Путь к папке внутри Obsidian (напр. Inbox)</span>
|
|||
|
|
</div>
|
|||
|
|
<hr>
|
|||
|
|
<h3>AI Services</h3>
|
|||
|
|
<div class="setting-group ai-box">
|
|||
|
|
<label>AI Title API</label>
|
|||
|
|
<input type="text" id="ai-title-url">
|
|||
|
|
<input type="password" id="ai-title-key" placeholder="API Key">
|
|||
|
|
<div class="row">
|
|||
|
|
<select id="ai-title-model"></select>
|
|||
|
|
<button class="small-btn" onclick="window.fetchModels('title')">Load</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="setting-group ai-box">
|
|||
|
|
<label>AI Translate API</label>
|
|||
|
|
<input type="text" id="ai-trans-url">
|
|||
|
|
<input type="password" id="ai-trans-key" placeholder="API Key">
|
|||
|
|
<div class="row">
|
|||
|
|
<select id="ai-trans-model"></select>
|
|||
|
|
<button class="small-btn" onclick="window.fetchModels('trans')">Load</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<button class="save-btn" onclick="window.saveSettings()">ОК</button>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Footer -->
|
|||
|
|
<div class="footer">
|
|||
|
|
<div id="status" data-i18n="ready">Ready</div>
|
|||
|
|
<div id="stats"><span data-i18n="lines">стр</span>: 0 <span data-i18n="words">слов</span>: 0</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Context Menu -->
|
|||
|
|
<div id="context-menu" class="context-menu hidden">
|
|||
|
|
<div class="menu-item" onclick="window.handleSaveAction()">Сохранить</div>
|
|||
|
|
<div class="menu-item" onclick="window.insertText('B')">Жирный</div>
|
|||
|
|
<div class="menu-item" onclick="window.insertText('CODE')">Блок кода</div>
|
|||
|
|
<hr>
|
|||
|
|
<div class="menu-item" onclick="window.openNewNoteModal()">Создать заметку...</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<input type="file" id="image-input" style="display:none" accept="image/*">
|
|||
|
|
<script src="renderer.js"></script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|