mirror of
https://github.com/zadam/trilium.git
synced 2025-06-06 18:08:33 +02:00
fix options dialog which used jquery tabs
This commit is contained in:
azivner
parent
232f135843
commit
c5113eb292
@ -7,7 +7,6 @@ import zoomService from "../services/zoom.js";
|
|||||||
import utils from "../services/utils.js";
|
import utils from "../services/utils.js";
|
||||||
|
|
||||||
const $dialog = $("#options-dialog");
|
const $dialog = $("#options-dialog");
|
||||||
const $tabs = $("#options-tabs");
|
|
||||||
|
|
||||||
const tabHandlers = [];
|
const tabHandlers = [];
|
||||||
|
|
||||||
@ -22,8 +21,6 @@ async function showDialog() {
|
|||||||
|
|
||||||
$dialog.modal();
|
$dialog.modal();
|
||||||
|
|
||||||
$tabs.tabs();
|
|
||||||
|
|
||||||
for (const handler of tabHandlers) {
|
for (const handler of tabHandlers) {
|
||||||
if (handler.optionsLoaded) {
|
if (handler.optionsLoaded) {
|
||||||
handler.optionsLoaded(options);
|
handler.optionsLoaded(options);
|
||||||
|
|||||||
@ -8,186 +8,214 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<div id="options-tabs">
|
<div>
|
||||||
<ul>
|
<ul class="nav nav-tabs">
|
||||||
<li><a href="#appearance">Appearance</a></li>
|
<li class="nav-item">
|
||||||
<li><a href="#change-password">Change password</a></li>
|
<a class="nav-link active" data-toggle="tab" href="#appearance">Appearance</a>
|
||||||
<li><a href="#protected-session-timeout">Protected session</a></li>
|
</li>
|
||||||
<li><a href="#note-revision-snapshot-time-interval">Note revisions</a></li>
|
<li class="nav-item">
|
||||||
<li><a href="#sync-setup">Sync</a></li>
|
<a class="nav-link" data-toggle="tab" href="#change-password">Change password</a>
|
||||||
<li><a href="#advanced">Advanced</a></li>
|
</li>
|
||||||
<li><a href="#about">About Trilium</a></li>
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" data-toggle="tab" href="#protected-session-timeout">Protected session</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" data-toggle="tab" href="#note-revision-snapshot-time-interval">Note revisions</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" data-toggle="tab" href="#sync-setup">Sync</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" data-toggle="tab" href="#advanced">Advanced</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" data-toggle="tab" href="#about">About Trilium</a>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<div id="appearance">
|
<br/>
|
||||||
<p>Settings on this options tab are saved automatically after each change.</p>
|
<div class="tab-content">
|
||||||
|
<div id="appearance" class="tab-pane active">
|
||||||
|
<p><strong>Settings on this options tab are saved automatically after each change.</strong></p>
|
||||||
|
|
||||||
<form>
|
<form>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="theme-select">Theme</label>
|
<label for="theme-select">Theme</label>
|
||||||
<select class="form-control" id="theme-select">
|
<select class="form-control" id="theme-select">
|
||||||
<option value="white">White</option>
|
<option value="white">White</option>
|
||||||
<option value="dark">Dark</option>
|
<option value="dark">Dark</option>
|
||||||
<option value="black">Black</option>
|
<option value="black">Black</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="zoom-factor-select">Zoom factor (desktop build only)</label>
|
<label for="zoom-factor-select">Zoom factor (desktop build only)</label>
|
||||||
|
|
||||||
<input type="number" class="form-control" id="zoom-factor-select" min="0.3" max="2.0" step="0.1"/>
|
<input type="number" class="form-control" id="zoom-factor-select" min="0.3" max="2.0" step="0.1"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p>Zooming can be controlled with CTRL-+ and CTRL-= shortcuts as well.</p>
|
<p>Zooming can be controlled with CTRL-+ and CTRL-= shortcuts as well.</p>
|
||||||
|
|
||||||
<h3>Left pane sizing</h3>
|
<h3>Left pane sizing</h3>
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="left-pane-min-width">Left pane minimum width (in pixels)</label>
|
<label for="left-pane-min-width">Left pane minimum width (in pixels)</label>
|
||||||
|
|
||||||
<input type="number" class="form-control" id="left-pane-min-width" min="100" max="2000" step="1"/>
|
<input type="number" class="form-control" id="left-pane-min-width" min="100" max="2000" step="1"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="left-pane-min-width">Left pane width percent of window size</label>
|
<label for="left-pane-min-width">Left pane width percent of window size</label>
|
||||||
|
|
||||||
<input type="number" class="form-control" id="left-pane-width-percent" min="0" max="99" step="1"/>
|
<input type="number" class="form-control" id="left-pane-width-percent" min="0" max="99" step="1"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p>Left pane width is calculated from the percent of window size, if this is smaller than minimum width, then minimum width is used. If you want to have fixed width left pane, set minimum width to the desired width and set percent to 0.</p>
|
<p>Left pane width is calculated from the percent of window size, if this is smaller than minimum width, then minimum width is used. If you want to have fixed width left pane, set minimum width to the desired width and set percent to 0.</p>
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div id="change-password">
|
|
||||||
<form id="change-password-form">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="old-password">Old password</label>
|
|
||||||
<input class="form-control" id="old-password" type="password">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
<div id="change-password" class="tab-pane">
|
||||||
<label for="new-password1">New password</label>
|
<form id="change-password-form">
|
||||||
<input class="form-control" id="new-password1" type="password">
|
<div class="form-group">
|
||||||
</div>
|
<label for="old-password">Old password</label>
|
||||||
|
<input class="form-control" id="old-password" type="password">
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="new-password2">New password once more</label>
|
<label for="new-password1">New password</label>
|
||||||
<input class="form-control" id="new-password2" type="password">
|
<input class="form-control" id="new-password1" type="password">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button class="btn btn-sm">Change password</button>
|
<div class="form-group">
|
||||||
</form>
|
<label for="new-password2">New password once more</label>
|
||||||
</div>
|
<input class="form-control" id="new-password2" type="password">
|
||||||
<div id="protected-session-timeout">
|
</div>
|
||||||
<p>Protected session timeout is a time period after which the protected session is wiped out from
|
|
||||||
browser's memory. This is measured from the last interaction with protected notes.</p>
|
|
||||||
|
|
||||||
<form id="protected-session-timeout-form">
|
<button class="btn btn-primary">Change password</button>
|
||||||
<div class="form-group">
|
</form>
|
||||||
<label for="protected-session-timeout-in-seconds">Protected session timeout (in seconds)</label>
|
</div>
|
||||||
<input class="form-control" id="protected-session-timeout-in-seconds" type="number">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: space-between;">
|
<div id="protected-session-timeout" class="tab-pane">
|
||||||
<button class="btn btn-sm">Save</button>
|
<p>Protected session timeout is a time period after which the protected session is wiped out from
|
||||||
|
browser's memory. This is measured from the last interaction with protected notes.</p>
|
||||||
|
|
||||||
<button class="btn btn-sm" type="button" data-help-page="Protected-notes">Help</button>
|
<form id="protected-session-timeout-form">
|
||||||
</div>
|
<div class="form-group">
|
||||||
</form>
|
<label for="protected-session-timeout-in-seconds">Protected session timeout (in seconds)</label>
|
||||||
</div>
|
<input class="form-control" id="protected-session-timeout-in-seconds" type="number">
|
||||||
<div id="note-revision-snapshot-time-interval">
|
</div>
|
||||||
<p>Note revision snapshot time interval is time in seconds after which new note revision will be created for the note.</p>
|
|
||||||
|
|
||||||
<form id="note-revision-snapshot-time-interval-form">
|
<div style="display: flex; justify-content: space-between;">
|
||||||
<div class="form-group">
|
<button class="btn btn-primary">Save</button>
|
||||||
<label for="note-revision-snapshot-time-interval-in-seconds">Note revision snapshot time interval (in seconds)</label>
|
|
||||||
<input class="form-control" id="note-revision-snapshot-time-interval-in-seconds" type="number">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: space-between;">
|
<button class="btn btn-default" type="button" data-help-page="Protected-notes">Help</button>
|
||||||
<button class="btn btn-sm">Save</button>
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
<button class="btn btn-sm" type="button" data-help-page="Note-revisions">Help</button>
|
<div id="note-revision-snapshot-time-interval" class="tab-pane">
|
||||||
</div>
|
<p>Note revision snapshot time interval is time in seconds after which new note revision will be created for the note.</p>
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div id="sync-setup">
|
|
||||||
<h4 style="margin-top: 0px;">Sync configuration</h4>
|
|
||||||
|
|
||||||
<form id="sync-setup-form">
|
<form id="note-revision-snapshot-time-interval-form">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="sync-server-host">Server instance address</label>
|
<label for="note-revision-snapshot-time-interval-in-seconds">Note revision snapshot time interval (in seconds)</label>
|
||||||
<input class="form-control" id="sync-server-host" placeholder="https://<host>:<port>">
|
<input class="form-control" id="note-revision-snapshot-time-interval-in-seconds" type="number">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-group">
|
<div style="display: flex; justify-content: space-between;">
|
||||||
<label for="sync-server-timeout">Sync timeout (milliseconds)</label>
|
<button class="btn btn-primary">Save</button>
|
||||||
<input class="form-control" id="sync-server-timeout" min="1" max="10000000" type="number">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
<button class="btn btn-default" type="button" data-help-page="Note-revisions">Help</button>
|
||||||
<label for="sync-proxy">Sync proxy server (optional)</label>
|
</div>
|
||||||
<input class="form-control" id="sync-proxy" placeholder="https://<host>:<port>">
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="display: flex; justify-content: space-between;">
|
<div id="sync-setup" class="tab-pane">
|
||||||
<button class="btn btn-sm">Save</button>
|
<h4 style="margin-top: 0px;">Sync configuration</h4>
|
||||||
|
|
||||||
<button class="btn btn-sm" type="button" data-help-page="Synchronization">Help</button>
|
<form id="sync-setup-form">
|
||||||
</div>
|
<div class="form-group">
|
||||||
</form>
|
<label for="sync-server-host">Server instance address</label>
|
||||||
|
<input class="form-control" id="sync-server-host" placeholder="https://<host>:<port>">
|
||||||
|
</div>
|
||||||
|
|
||||||
<h4>Sync test</h4>
|
<div class="form-group">
|
||||||
|
<label for="sync-server-timeout">Sync timeout (milliseconds)</label>
|
||||||
|
<input class="form-control" id="sync-server-timeout" min="1" max="10000000" type="number">
|
||||||
|
</div>
|
||||||
|
|
||||||
<p>This will test connection and handshake to the sync server. If sync server isn't initialized, this will set it up to sync with local document.</p>
|
<div class="form-group">
|
||||||
|
<label for="sync-proxy">Sync proxy server (optional)</label>
|
||||||
|
<input class="form-control" id="sync-proxy" placeholder="https://<host>:<port>">
|
||||||
|
</div>
|
||||||
|
|
||||||
<button id="test-sync-button" class="btn btn-sm">Test sync</button>
|
<div style="display: flex; justify-content: space-between;">
|
||||||
</div>
|
<button class="btn btn-primary">Save</button>
|
||||||
<div id="advanced">
|
|
||||||
<h4 style="margin-top: 0px;">Sync</h4>
|
|
||||||
<button id="force-full-sync-button" class="btn btn-sm">Force full sync</button>
|
|
||||||
|
|
||||||
<br/>
|
<button class="btn btn-default" type="button" data-help-page="Synchronization">Help</button>
|
||||||
<br/>
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
<button id="fill-sync-rows-button" class="btn btn-sm">Fill sync rows</button>
|
<br/>
|
||||||
|
|
||||||
<h4>Debugging</h4>
|
<h4>Sync test</h4>
|
||||||
|
|
||||||
<button id="anonymize-button" class="btn btn-sm">Save anonymized database</button><br/><br/>
|
<p>This will test connection and handshake to the sync server. If sync server isn't initialized, this will set it up to sync with local document.</p>
|
||||||
|
|
||||||
<p>This action will create a new copy of the database and anonymise it (remove all note content and leave only structure and metadata)
|
<button id="test-sync-button" class="btn btn-default">Test sync</button>
|
||||||
for sharing online for debugging purposes without fear of leaking your personal data.</p>
|
</div>
|
||||||
|
|
||||||
<h4>Vacuum database</h4>
|
<div id="advanced" class="tab-pane">
|
||||||
|
<h4 style="margin-top: 0px;">Sync</h4>
|
||||||
|
<button id="force-full-sync-button" class="btn btn-default">Force full sync</button>
|
||||||
|
|
||||||
<p>This will rebuild database which will typically result in smaller database file. No data will be actually changed.</p>
|
<br/>
|
||||||
|
<br/>
|
||||||
|
|
||||||
<button id="vacuum-database-button" class="btn btn-sm">Vacuum database</button>
|
<button id="fill-sync-rows-button" class="btn btn-default">Fill sync rows</button>
|
||||||
</div>
|
|
||||||
<div id="about">
|
|
||||||
<table class="table">
|
|
||||||
<tr>
|
|
||||||
<th>App version:</th>
|
|
||||||
<td id="app-version"></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>DB version:</th>
|
|
||||||
<td id="db-version"></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Sync version:</th>
|
|
||||||
<td id="sync-version"></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Build date:</th>
|
|
||||||
<td id="build-date"></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
<br/>
|
||||||
<th>Build revision:</th>
|
<br/>
|
||||||
<td><a href="" target="_blank" id="build-revision"></a></td>
|
|
||||||
</tr>
|
<h4>Debugging</h4>
|
||||||
</table>
|
|
||||||
|
<button id="anonymize-button" class="btn btn-default">Save anonymized database</button><br/><br/>
|
||||||
|
|
||||||
|
<p>This action will create a new copy of the database and anonymise it (remove all note content and leave only structure and metadata)
|
||||||
|
for sharing online for debugging purposes without fear of leaking your personal data.</p>
|
||||||
|
|
||||||
|
<h4>Vacuum database</h4>
|
||||||
|
|
||||||
|
<p>This will rebuild database which will typically result in smaller database file. No data will be actually changed.</p>
|
||||||
|
|
||||||
|
<button id="vacuum-database-button" class="btn btn-default">Vacuum database</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="about" class="tab-pane">
|
||||||
|
<table class="table">
|
||||||
|
<tr>
|
||||||
|
<th>App version:</th>
|
||||||
|
<td id="app-version"></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th>DB version:</th>
|
||||||
|
<td id="db-version"></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th>Sync version:</th>
|
||||||
|
<td id="sync-version"></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th>Build date:</th>
|
||||||
|
<td id="build-date"></td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<th>Build revision:</th>
|
||||||
|
<td><a href="" target="_blank" id="build-revision"></a></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user