357 lines
18 KiB
HTML
357 lines
18 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>wordarr</title>
|
|
<link
|
|
rel="icon"
|
|
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📚</text></svg>" />
|
|
<link rel="stylesheet" href="/style.css" />
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>📚 wordarr</h1>
|
|
<nav>
|
|
<button data-view="search" class="active" data-i18n="nav.search"></button>
|
|
<button data-view="missing">
|
|
<span data-i18n="nav.missing"></span>
|
|
<span id="missing-badge" class="badge" hidden></span>
|
|
</button>
|
|
<button data-view="imported" data-i18n="nav.imported"></button>
|
|
<button data-view="import" data-i18n="nav.import"></button>
|
|
<button data-view="settings" data-i18n="nav.settings"></button>
|
|
<button id="lang-toggle" class="secondary" data-i18n-title="nav.langToggle"></button>
|
|
</nav>
|
|
</header>
|
|
<main>
|
|
<section id="view-search">
|
|
<form id="search-form" class="bar">
|
|
<select id="search-type">
|
|
<option value="ebook">Ebook</option>
|
|
<option value="audiobook">Audiobook</option>
|
|
<option value="comic">Comic/Manga</option>
|
|
</select>
|
|
<select id="search-language" data-i18n-title="search.languageTitle">
|
|
<option value="" data-i18n="search.allLanguages"></option>
|
|
<option value="german" data-i18n="lang.german"></option>
|
|
<option value="english" data-i18n="lang.english"></option>
|
|
</select>
|
|
<input id="search-q" data-i18n-placeholder="search.placeholder" required />
|
|
<button type="submit" id="search-btn" data-i18n="common.search"></button>
|
|
<button type="button" id="manual-btn" class="secondary" data-i18n="search.manual"></button>
|
|
</form>
|
|
<div id="search-results" class="cards"></div>
|
|
|
|
<dialog id="manual-dialog">
|
|
<form id="manual-form" method="dialog">
|
|
<h3 data-i18n="manual.heading"></h3>
|
|
<label
|
|
><span data-i18n="common.type"></span>
|
|
<select name="media_type">
|
|
<option value="ebook">Ebook</option>
|
|
<option value="audiobook">Audiobook</option>
|
|
<option value="comic">Comic/Manga</option>
|
|
</select>
|
|
</label>
|
|
<label><span data-i18n="common.title"></span> <input name="title" required /></label>
|
|
<label><span data-i18n="common.authors"></span> <input name="authors" /></label>
|
|
<label><span data-i18n="common.narrator"></span> <input name="narrator" /></label>
|
|
<label><span data-i18n="common.series"></span> <input name="series" /></label>
|
|
<label><span data-i18n="common.volume"></span> <input name="volume" type="number" min="0" /></label>
|
|
<label
|
|
><span data-i18n="manual.volumeTo"></span>
|
|
<input name="volume_to" type="number" min="0" />
|
|
<span class="muted" data-i18n="manual.bulkHint"></span>
|
|
</label>
|
|
<label><span data-i18n="common.year"></span> <input name="year" type="number" /></label>
|
|
<label><span data-i18n="manual.externalId"></span> <input name="external_id" /></label>
|
|
<label
|
|
><span data-i18n="common.library"></span>
|
|
<select name="library_id" id="manual-library"></select
|
|
></label>
|
|
<div class="row">
|
|
<button value="cancel" class="secondary" data-i18n="common.cancel"></button>
|
|
<button value="ok" id="manual-submit" data-i18n="common.request"></button>
|
|
</div>
|
|
</form>
|
|
</dialog>
|
|
|
|
<dialog id="series-dialog">
|
|
<h3 id="series-title"></h3>
|
|
<p class="muted" id="series-info"></p>
|
|
<div class="bar wrap">
|
|
<label><span data-i18n="series.from"></span> <input id="series-from" type="number" min="0" /></label>
|
|
<label><span data-i18n="series.to"></span> <input id="series-to" type="number" min="0" /></label>
|
|
<button type="button" id="series-all" class="secondary" data-i18n="common.all"></button>
|
|
<button type="button" id="series-none" class="secondary" data-i18n="common.none"></button>
|
|
</div>
|
|
<div id="series-list" class="series-list"></div>
|
|
<div class="row">
|
|
<label><span data-i18n="common.library"></span> <select id="series-library"></select></label>
|
|
</div>
|
|
<div class="row">
|
|
<button type="button" id="series-cancel" class="secondary" data-i18n="common.cancel"></button>
|
|
<button type="button" id="series-submit" data-i18n="common.request"></button>
|
|
</div>
|
|
</dialog>
|
|
</section>
|
|
|
|
<section id="view-missing" hidden>
|
|
<div class="bar wrap">
|
|
<select id="missing-filter-type">
|
|
<option value="" data-i18n="list.allTypes"></option>
|
|
<option value="ebook">Ebook</option>
|
|
<option value="audiobook">Audiobook</option>
|
|
<option value="comic">Comic/Manga</option>
|
|
</select>
|
|
<select id="missing-filter-library">
|
|
<option value="" data-i18n="list.allLibraries"></option>
|
|
</select>
|
|
<input id="missing-search" data-i18n-placeholder="list.filterPlaceholder" />
|
|
<button id="missing-select-all" class="secondary" data-i18n="common.selectAll"></button>
|
|
<button id="missing-bulk-delete" class="danger" hidden data-i18n="common.removeSelected"></button>
|
|
<div class="view-toggle" role="group" data-i18n-aria="list.view">
|
|
<button data-viewmode="list" data-i18n-title="list.viewList">☰</button>
|
|
<button data-viewmode="small" data-i18n-title="list.viewSmall">▦</button>
|
|
<button data-viewmode="large" data-i18n-title="list.viewLarge">⊞</button>
|
|
</div>
|
|
</div>
|
|
<div id="missing-list" class="cards"></div>
|
|
</section>
|
|
|
|
<section id="view-imported" hidden>
|
|
<div class="bar wrap">
|
|
<input id="imported-search" data-i18n-placeholder="list.filterPlaceholder" />
|
|
<button id="imported-select-all" class="secondary" data-i18n="common.selectAll"></button>
|
|
<button id="imported-bulk-delete" class="danger" hidden data-i18n="common.removeSelected"></button>
|
|
<div class="view-toggle" role="group" data-i18n-aria="list.view">
|
|
<button data-viewmode="list" data-i18n-title="list.viewList">☰</button>
|
|
<button data-viewmode="small" data-i18n-title="list.viewSmall">▦</button>
|
|
<button data-viewmode="large" data-i18n-title="list.viewLarge">⊞</button>
|
|
</div>
|
|
</div>
|
|
<div id="imported-list" class="cards"></div>
|
|
</section>
|
|
|
|
<section id="view-import" hidden>
|
|
<div class="bar wrap">
|
|
<button id="scan-btn" data-i18n="import.scan"></button>
|
|
<label class="muted"
|
|
><input type="checkbox" id="split-dirs" /> <span data-i18n="import.splitDirs"></span
|
|
></label>
|
|
<span id="scan-info" class="muted"></span>
|
|
</div>
|
|
<div class="bar wrap" id="import-toolbar" hidden>
|
|
<input id="import-filter-text" data-i18n-placeholder="import.filterPlaceholder" />
|
|
<select id="import-filter-mode">
|
|
<option value="all" data-i18n="common.all"></option>
|
|
<option value="suggested" data-i18n="import.modeSuggested"></option>
|
|
<option value="unassigned" data-i18n="import.modeUnassigned"></option>
|
|
<option value="conflict" data-i18n="import.modeConflict"></option>
|
|
</select>
|
|
<select id="import-filter-format" data-i18n-title="import.formatTitle">
|
|
<option value="" data-i18n="import.allFormats"></option>
|
|
</select>
|
|
<select id="import-sort">
|
|
<option value="none" data-i18n="import.sortScan"></option>
|
|
<option value="score" data-i18n="import.sortScore"></option>
|
|
<option value="name" data-i18n="import.sortName"></option>
|
|
</select>
|
|
<button id="import-select-suggested" class="secondary" data-i18n="import.selectSuggested"></button>
|
|
<button id="import-select-all" class="secondary"
|
|
data-i18n-title="import.selectAllTitle" data-i18n="common.selectAll"></button>
|
|
<button id="import-select-page" class="secondary"
|
|
data-i18n-title="import.selectPageTitle" data-i18n="import.selectPage"></button>
|
|
<button id="import-deselect-all" class="secondary" data-i18n="import.deselectAll"></button>
|
|
<button id="import-merge" class="secondary"
|
|
data-i18n-title="import.mergeTitle" data-i18n="import.merge"></button>
|
|
<button id="import-from-names" class="secondary"
|
|
data-i18n-title="import.fromNamesTitle" data-i18n="import.fromNames"></button>
|
|
</div>
|
|
<div class="table-scroll">
|
|
<table id="import-table" hidden>
|
|
<thead>
|
|
<tr>
|
|
<th></th>
|
|
<th data-i18n="import.colFile"></th>
|
|
<th data-i18n="common.type"></th>
|
|
<th data-i18n="import.colAssignment"></th>
|
|
<th data-i18n="common.library"></th>
|
|
<th id="import-score-head" data-i18n="common.score"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</div>
|
|
<div class="bar" id="import-pager" hidden>
|
|
<button id="import-prev" class="secondary" data-i18n="import.prev"></button>
|
|
<span id="import-page-info" class="muted"></span>
|
|
<button id="import-next" class="secondary" data-i18n="import.next"></button>
|
|
</div>
|
|
<div class="bar">
|
|
<button id="import-btn" hidden data-i18n="import.run"></button>
|
|
<div id="import-progress" hidden>
|
|
<progress max="1" value="0"></progress>
|
|
<span class="muted"></span>
|
|
</div>
|
|
</div>
|
|
<div id="import-summary"></div>
|
|
<div id="import-results"></div>
|
|
|
|
<dialog id="names-dialog">
|
|
<h3 data-i18n="names.heading"></h3>
|
|
<p class="muted" id="names-intro"></p>
|
|
<div class="bar wrap">
|
|
<label><span data-i18n="common.series"></span>
|
|
<input id="names-series" data-i18n-placeholder="common.optionalForAll" /></label>
|
|
<label><span data-i18n="common.author"></span>
|
|
<input id="names-authors" data-i18n-placeholder="common.optionalForAll" /></label>
|
|
<label><span data-i18n="common.library"></span> <select id="names-library"></select></label>
|
|
</div>
|
|
<div id="names-preview" class="series-list"></div>
|
|
<div class="row">
|
|
<button type="button" id="names-cancel" class="secondary" data-i18n="common.cancel"></button>
|
|
<button type="button" id="names-submit" data-i18n="common.createAndLink"></button>
|
|
</div>
|
|
</dialog>
|
|
|
|
<dialog id="conflict-dialog">
|
|
<h3 data-i18n="conflict.heading"></h3>
|
|
<p class="muted" id="conflict-intro"></p>
|
|
<div id="conflict-list" class="series-list"></div>
|
|
<div class="row">
|
|
<button type="button" id="conflict-cancel" class="secondary" data-i18n="common.cancel"></button>
|
|
<button type="button" id="conflict-merge" class="secondary" data-i18n="conflict.merge"></button>
|
|
<button type="button" id="conflict-skip" data-i18n="conflict.skip"></button>
|
|
</div>
|
|
</dialog>
|
|
|
|
<dialog id="quick-dialog">
|
|
<h3 data-i18n="quick.heading"></h3>
|
|
<p class="muted mono" id="quick-file"></p>
|
|
<p class="muted" id="quick-episode"></p>
|
|
<form id="quick-search-form" class="bar">
|
|
<input id="quick-q" data-i18n-placeholder="quick.placeholder" required />
|
|
<button type="submit" data-i18n="common.search"></button>
|
|
</form>
|
|
<label class="muted"
|
|
><span data-i18n="quick.targetLibrary"></span> <select id="quick-library"></select
|
|
></label>
|
|
<label class="muted"
|
|
><span data-i18n="quick.openRequests"></span>
|
|
<input id="quick-req-filter" data-i18n-placeholder="quick.reqFilter" />
|
|
</label>
|
|
<div id="quick-scroll">
|
|
<div id="quick-open-requests"></div>
|
|
<div id="quick-results" class="cards view-list"></div>
|
|
</div>
|
|
<div id="quick-foot">
|
|
<details id="quick-manual">
|
|
<summary id="quick-manual-summary"></summary>
|
|
<p class="muted" id="quick-based-on" hidden></p>
|
|
<div class="quick-manual-fields">
|
|
<label><span data-i18n="common.title"></span> <input id="quick-m-title" /></label>
|
|
<label><span data-i18n="common.author"></span>
|
|
<input id="quick-m-authors" data-i18n-placeholder="common.optional" /></label>
|
|
<label><span data-i18n="common.series"></span>
|
|
<input id="quick-m-series" data-i18n-placeholder="common.optional" /></label>
|
|
<label class="narrow"
|
|
><span data-i18n="quick.episodeVolume"></span>
|
|
<input id="quick-m-volume" type="number" min="0" /></label>
|
|
</div>
|
|
<button type="button" id="quick-m-submit" data-i18n="common.createAndLink"></button>
|
|
</details>
|
|
<div class="row">
|
|
<button type="button" id="quick-close" class="secondary" data-i18n="common.close"></button>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
</section>
|
|
|
|
<section id="view-settings" hidden>
|
|
<h3 data-i18n="lib.heading"></h3>
|
|
<div class="table-scroll">
|
|
<table id="lib-table">
|
|
<thead>
|
|
<tr>
|
|
<th data-i18n="common.name"></th>
|
|
<th data-i18n="common.type"></th>
|
|
<th data-i18n="common.path"></th>
|
|
<th data-i18n="lib.folderTemplate"></th>
|
|
<th data-i18n="lib.fileTemplate"></th>
|
|
<th data-i18n="common.language"></th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</div>
|
|
<h4 id="lib-form-title"></h4>
|
|
<form id="lib-form" class="bar wrap">
|
|
<input name="name" data-i18n-placeholder="lib.namePlaceholder" required />
|
|
<select name="media_type">
|
|
<option value="ebook">Ebook</option>
|
|
<option value="audiobook">Audiobook</option>
|
|
<option value="comic">Comic/Manga</option>
|
|
</select>
|
|
<input
|
|
name="root_path"
|
|
placeholder="/ebooks/kids"
|
|
required
|
|
class="wide"
|
|
list="path-suggestions"
|
|
autocomplete="off" />
|
|
<datalist id="path-suggestions"></datalist>
|
|
<input name="folder_template" data-i18n-placeholder="lib.folderPlaceholder" class="wide" />
|
|
<input name="file_template" data-i18n-placeholder="lib.filePlaceholder" class="wide" />
|
|
<select name="language" data-i18n-title="lib.languageTitle">
|
|
<option value="" data-i18n="lib.anyLanguage"></option>
|
|
<option value="german" data-i18n="lang.german"></option>
|
|
<option value="english" data-i18n="lang.english"></option>
|
|
</select>
|
|
<button type="submit" id="lib-form-submit" data-i18n="common.create"></button>
|
|
<button type="button" id="lib-form-cancel" class="secondary" hidden data-i18n="common.cancel"></button>
|
|
</form>
|
|
<p class="muted" data-i18n="lib.placeholders"></p>
|
|
</section>
|
|
</main>
|
|
|
|
<dialog id="detail-dialog">
|
|
<form id="detail-form" method="dialog">
|
|
<div class="detail-head">
|
|
<img id="detail-cover" alt="" hidden />
|
|
<div class="nocover" id="detail-nocover">?</div>
|
|
<div>
|
|
<h3 id="detail-title"></h3>
|
|
<p class="muted" id="detail-status"></p>
|
|
</div>
|
|
</div>
|
|
<label><span data-i18n="common.title"></span> <input name="title" required /></label>
|
|
<label><span data-i18n="common.authors"></span> <input name="authors" /></label>
|
|
<label><span data-i18n="common.narrator"></span> <input name="narrator" /></label>
|
|
<label><span data-i18n="common.series"></span> <input name="series" /></label>
|
|
<div class="row">
|
|
<label><span data-i18n="common.volume"></span> <input name="volume" type="number" min="0" /></label>
|
|
<label><span data-i18n="common.year"></span> <input name="year" type="number" /></label>
|
|
</div>
|
|
<label><span data-i18n="detail.externalId"></span> <input name="external_id" /></label>
|
|
<label><span data-i18n="common.library"></span>
|
|
<select name="library_id" id="detail-library"></select></label>
|
|
<p class="muted mono" id="detail-path"></p>
|
|
<div class="row">
|
|
<button value="cancel" class="secondary" data-i18n="common.cancel"></button>
|
|
<button type="button" id="detail-retag" class="secondary" hidden data-i18n="detail.retag"></button>
|
|
<button type="button" id="detail-relocate" class="secondary" hidden
|
|
data-i18n-title="detail.relocateTitle" data-i18n="detail.relocate"></button>
|
|
<button value="ok" id="detail-save" data-i18n="common.save"></button>
|
|
</div>
|
|
</form>
|
|
</dialog>
|
|
|
|
<div id="toast" hidden></div>
|
|
<script src="/i18n.js"></script>
|
|
<script src="/app.js"></script>
|
|
</body>
|
|
</html>
|