98 lines
4.1 KiB
HTML
98 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
<title>Novela — Edit {{ title or filename }}</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
|
<link href="https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&display=swap" rel="stylesheet"/>
|
|
<link rel="stylesheet" href="/static/editor.css"/>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Header -->
|
|
<div class="editor-header">
|
|
<a class="header-back" href="/library/book/{{ filename | urlencode }}">
|
|
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
<polyline points="15 18 9 12 15 6"/>
|
|
</svg>
|
|
{{ (title or filename) | truncate(30, True) }}
|
|
</a>
|
|
<div class="header-chapter" id="header-chapter">—</div>
|
|
<div class="header-actions">
|
|
<button class="btn-add-page" id="btn-add-page" onclick="addChapter()" title="Add new chapter after current">
|
|
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M12 5v14"/><path d="M5 12h14"/>
|
|
</svg>
|
|
Add page
|
|
</button>
|
|
<button class="btn-del-page" id="btn-del-page" onclick="deleteChapter()" title="Delete current chapter" disabled>
|
|
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M3 6h18"/><path d="M8 6V4h8v2"/><path d="M7 6l1 14h8l1-14"/>
|
|
</svg>
|
|
Delete page
|
|
</button>
|
|
<button class="btn-break" id="btn-break" onclick="insertBreak()" title="Insert scene break at cursor" disabled>
|
|
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<line x1="3" y1="12" x2="9" y2="12"/>
|
|
<circle cx="12" cy="12" r="2" fill="currentColor" stroke="none"/>
|
|
<line x1="15" y1="12" x2="21" y2="12"/>
|
|
</svg>
|
|
Break
|
|
</button>
|
|
<button class="btn-replace" onclick="openReplaceModal()" title="Find & replace across all chapters">
|
|
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/>
|
|
</svg>
|
|
Replace
|
|
</button>
|
|
<span class="save-status" id="save-status"></span>
|
|
<button class="btn-save-all" id="btn-save-all" onclick="saveAllChapters()" style="display:none"></button>
|
|
<button class="btn-save" id="btn-save" onclick="saveChapter()" disabled>Save</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Two-panel body -->
|
|
<div class="editor-body">
|
|
<nav class="chapter-panel">
|
|
<div class="chapter-panel-title">Chapters</div>
|
|
<div class="chapter-list" id="chapter-list"></div>
|
|
</nav>
|
|
<div class="editor-pane" id="editor-pane"></div>
|
|
</div>
|
|
|
|
<!-- Find & Replace modal -->
|
|
<div class="modal-backdrop" id="replace-modal">
|
|
<div class="modal">
|
|
<div class="modal-title">Find & Replace — all chapters</div>
|
|
<div class="modal-field">
|
|
<label class="modal-label">Search</label>
|
|
<input class="modal-input" id="rp-search" type="text" placeholder="Search…" autocomplete="off"/>
|
|
</div>
|
|
<div class="modal-field">
|
|
<label class="modal-label">Replace with</label>
|
|
<input class="modal-input" id="rp-replace" type="text" placeholder="Replace with…" autocomplete="off"/>
|
|
</div>
|
|
<div class="modal-options">
|
|
<label class="modal-opt"><input type="checkbox" id="rp-regex"/> Regex</label>
|
|
<label class="modal-opt"><input type="checkbox" id="rp-case"/> Case sensitive</label>
|
|
</div>
|
|
<div class="modal-progress" id="rp-progress"></div>
|
|
<div class="modal-actions">
|
|
<button class="btn-secondary" onclick="closeReplaceModal()">Cancel</button>
|
|
<button class="btn-primary" id="rp-run" onclick="replaceInAllChapters()">Replace all</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const EDITOR = {
|
|
filename: {{ filename | tojson }},
|
|
title: {{ (title or filename) | tojson }},
|
|
};
|
|
</script>
|
|
<script src="https://cdn.jsdelivr.net/npm/monaco-editor@0.45.0/min/vs/loader.js"></script>
|
|
<script src="/static/editor.js"></script>
|
|
</body>
|
|
</html>
|