saving options for left pane sizing

This commit is contained in:
azivner 2018-09-06 11:17:30 +02:00
parent bdc2fa1019
commit ff086569f2
5 changed files with 41 additions and 2 deletions

View file

@ -0,0 +1,5 @@
INSERT INTO options (name, value, dateCreated, dateModified, isSynced)
VALUES ('leftPaneMinWidth', '300', '2018-07-29T18:31:00.874Z', '2018-07-29T18:31:00.874Z', 0);
INSERT INTO options (name, value, dateCreated, dateModified, isSynced)
VALUES ('leftPaneWidthPercent', '20', '2018-07-29T18:31:00.874Z', '2018-07-29T18:31:00.874Z', 0);

View file

@ -48,6 +48,8 @@ export default {
addTabHandler((function() {
const $themeSelect = $("#theme-select");
const $zoomFactorSelect = $("#zoom-factor-select");
const $leftPaneMinWidth = $("#left-pane-min-width");
const $leftPaneWidthPercent = $("#left-pane-width-percent");
const $html = $("html");
function optionsLoaded(options) {
@ -59,6 +61,9 @@ addTabHandler((function() {
else {
$zoomFactorSelect.prop('disabled', true);
}
$leftPaneMinWidth.val(options.leftPaneMinWidth);
$leftPaneWidthPercent.val(options.leftPaneWidthPercent);
}
$themeSelect.change(function() {
@ -75,6 +80,18 @@ addTabHandler((function() {
zoomService.setZoomFactorAndSave(newZoomFactor);
});
$leftPaneMinWidth.change(function() {
const newMinWidth = $(this).val();
server.put('options/leftPaneMinWidth/' + newMinWidth);
});
$leftPaneWidthPercent.change(function() {
const newWidthPercent = $(this).val();
server.put('options/leftPaneWidthPercent/' + newWidthPercent);
});
return {
optionsLoaded
};

View file

@ -6,7 +6,7 @@ const log = require('../../services/log');
// options allowed to be updated directly in options dialog
const ALLOWED_OPTIONS = ['protectedSessionTimeout', 'noteRevisionSnapshotTimeInterval',
'zoomFactor', 'theme', 'syncServerHost', 'syncServerTimeout', 'syncProxy'];
'zoomFactor', 'theme', 'syncServerHost', 'syncServerTimeout', 'syncProxy', 'leftPaneMinWidth', 'leftPaneWidthPercent'];
async function getOptions() {
const options = await sql.getMap("SELECT name, value FROM options WHERE name IN ("

View file

@ -3,7 +3,7 @@
const build = require('./build');
const packageJson = require('../../package');
const APP_DB_VERSION = 112;
const APP_DB_VERSION = 113;
const SYNC_VERSION = 1;
module.exports = {

View file

@ -377,6 +377,23 @@
</div>
<p>Zooming can be controlled with CTRL-+ and CTRL-= shortcuts as well.</p>
<h3>Left pane sizing</h3>
<div class="form-group">
<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"/>
</div>
<div class="form-group">
<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"/>
</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>
</form>
</div>
<div id="change-password">