133 lines
6.7 KiB
HTML
133 lines
6.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Idle Fantasy Viewer</title>
|
||
<link rel="icon" href="/static/favicon.svg" type="image/svg+xml">
|
||
<link rel="stylesheet" href="/static/style.css">
|
||
{% include '_analytics.html' %}
|
||
<script src="/static/vendor/chart.umd.min.js" defer></script>
|
||
<script src="/static/i18n.js" defer></script>
|
||
<script src="/static/app.js" defer></script>
|
||
</head>
|
||
<body data-viewer-id="{{ viewer_id }}">
|
||
<div class="layout">
|
||
<aside class="sidebar">
|
||
<div class="brand">
|
||
<span class="brand-icon">⚔</span>
|
||
<div>
|
||
<h1 data-i18n="app.title">Idle Fantasy Viewer</h1>
|
||
<p class="subtitle" data-i18n="app.subtitle">Save Viewer</p>
|
||
</div>
|
||
</div>
|
||
<nav class="nav" id="nav">
|
||
<button class="nav-btn active" data-tab="overview" data-i18n="nav.overview">Overview</button>
|
||
<button class="nav-btn" data-tab="skills" data-i18n="nav.skills">Skills</button>
|
||
<button class="nav-btn" data-tab="inventory" data-i18n="nav.inventory">Inventory</button>
|
||
<button class="nav-btn" data-tab="goals" data-i18n="nav.goals">Goals</button>
|
||
<button class="nav-btn" data-tab="equipment" data-i18n="nav.equipment">Equipment</button>
|
||
<button class="nav-btn" data-tab="quests" data-i18n="nav.quests">Quests</button>
|
||
<button class="nav-btn" data-tab="combat" data-i18n="nav.combat">Combat</button>
|
||
<button class="nav-btn" data-tab="history" data-i18n="nav.history">History</button>
|
||
<button class="nav-btn" data-tab="backup" data-i18n="nav.backup">Backup</button>
|
||
</nav>
|
||
<div class="sidebar-footer">
|
||
<label class="lang-label" for="locale-select">
|
||
<span data-i18n="settings.language">Language</span>
|
||
<select id="locale-select" class="select-input lang-select">
|
||
<option value="auto" data-i18n="settings.langAuto">Auto (browser)</option>
|
||
<option value="en" data-i18n="settings.langEn">English</option>
|
||
<option value="de" data-i18n="settings.langDe">Deutsch</option>
|
||
</select>
|
||
</label>
|
||
<label class="upload-btn">
|
||
<span data-i18n="actions.importBackup">Import game backup</span>
|
||
<input type="file" id="file-upload" accept=".json" hidden>
|
||
</label>
|
||
</div>
|
||
</aside>
|
||
|
||
<main class="main">
|
||
<header class="topbar">
|
||
<div id="viewer-link-banner" class="viewer-banner" hidden>
|
||
<div class="viewer-banner-text">
|
||
<strong data-i18n="viewer.linkTitle">Your personal link</strong>
|
||
<p class="viewer-banner-warning" data-i18n="viewer.linkWarning">
|
||
Save this link – there is no login. Without it, your data is lost.
|
||
</p>
|
||
<code id="viewer-link-url" class="viewer-link-url"></code>
|
||
</div>
|
||
<button type="button" class="viewer-copy-btn" id="viewer-copy-link" data-i18n="viewer.copyLink">Copy link</button>
|
||
</div>
|
||
<div id="import-report" class="import-report" hidden></div>
|
||
<div id="goals-completed-banner" class="goals-completed-banner" hidden></div>
|
||
<div class="global-search-wrap">
|
||
<input type="search" class="search-input global-search" id="global-search" placeholder="">
|
||
</div>
|
||
<div id="global-search-results" class="global-search-results" hidden></div>
|
||
<div id="character-header" class="character-header">
|
||
<span class="loading" data-i18n="app.loading">Loading save…</span>
|
||
</div>
|
||
<div class="kpi-row" id="kpi-row"></div>
|
||
</header>
|
||
|
||
<section class="tab-panel active" id="tab-overview"></section>
|
||
<section class="tab-panel" id="tab-skills"></section>
|
||
<section class="tab-panel" id="tab-inventory"></section>
|
||
<section class="tab-panel" id="tab-goals"></section>
|
||
<section class="tab-panel" id="tab-equipment"></section>
|
||
<section class="tab-panel" id="tab-quests"></section>
|
||
<section class="tab-panel" id="tab-combat"></section>
|
||
<section class="tab-panel" id="tab-history"></section>
|
||
<section class="tab-panel" id="tab-backup">
|
||
<div class="card backup-tab-card">
|
||
<h3 data-i18n="viewerDb.title">Viewer backup</h3>
|
||
<p class="backup-tab-lead" data-i18n="viewerDb.helpBody">The viewer stores imported game backups, history charts, and goals in a SQLite database on the server. Export downloads that database as a backup. Import restores it and replaces all current viewer data. This is not the same as importing a game save (.json).</p>
|
||
<p class="backup-tab-note" data-i18n="viewerDb.gameBackupNote">To add a new game save snapshot, use Import game backup in the sidebar.</p>
|
||
<div class="backup-tab-actions">
|
||
<a class="upload-btn export-btn" id="export-viewer" href="#" data-i18n="actions.exportViewer">Export viewer</a>
|
||
<label class="upload-btn">
|
||
<span data-i18n="actions.importViewer">Import viewer</span>
|
||
<input type="file" id="viewer-db-upload" accept=".db,application/octet-stream" hidden>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
</div>
|
||
<div id="goal-modal" class="goal-modal" hidden>
|
||
<div class="goal-modal-backdrop" id="goal-modal-backdrop"></div>
|
||
<div class="goal-modal-card" role="dialog" aria-labelledby="goal-modal-title">
|
||
<h3 id="goal-modal-title"></h3>
|
||
<p class="goal-modal-item" id="goal-modal-item"></p>
|
||
<label class="goal-modal-field">
|
||
<span id="goal-modal-mode-label"></span>
|
||
<select class="select-input" id="goal-modal-mode">
|
||
<option value="absolute"></option>
|
||
<option value="relative"></option>
|
||
</select>
|
||
</label>
|
||
<label class="goal-modal-field">
|
||
<span id="goal-modal-qty-label"></span>
|
||
<input type="number" class="search-input" id="goal-modal-qty" min="1" step="1">
|
||
</label>
|
||
<label class="goal-modal-field">
|
||
<span id="goal-modal-group-label"></span>
|
||
<select class="select-input" id="goal-modal-group"></select>
|
||
</label>
|
||
<label class="goal-modal-field" id="goal-modal-new-group-wrap" hidden>
|
||
<span id="goal-modal-new-group-label"></span>
|
||
<input type="text" class="search-input" id="goal-modal-new-group">
|
||
</label>
|
||
<p class="goal-modal-error landing-hint landing-hint-error" id="goal-modal-error" hidden></p>
|
||
<div class="goal-modal-actions">
|
||
<button type="button" class="viewer-copy-btn" id="goal-modal-cancel"></button>
|
||
<button type="button" class="upload-btn" id="goal-modal-submit"></button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% include '_footer.html' %}
|
||
</body>
|
||
</html>
|