diff --git a/db/migrations/0113__left_pane_size_options.sql b/db/migrations/0113__left_pane_size_options.sql new file mode 100644 index 000000000..efbcad860 --- /dev/null +++ b/db/migrations/0113__left_pane_size_options.sql @@ -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); \ No newline at end of file diff --git a/src/public/javascripts/dialogs/options.js b/src/public/javascripts/dialogs/options.js index 5c150dcb1..a50b7f966 100644 --- a/src/public/javascripts/dialogs/options.js +++ b/src/public/javascripts/dialogs/options.js @@ -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 }; diff --git a/src/routes/api/options.js b/src/routes/api/options.js index 9f1c1ad7e..70af33a74 100644 --- a/src/routes/api/options.js +++ b/src/routes/api/options.js @@ -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 (" diff --git a/src/services/app_info.js b/src/services/app_info.js index 0e61c9b98..133bbdba3 100644 --- a/src/services/app_info.js +++ b/src/services/app_info.js @@ -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 = { diff --git a/src/views/index.ejs b/src/views/index.ejs index 1b6adefb7..ac162ea6a 100644 --- a/src/views/index.ejs +++ b/src/views/index.ejs @@ -377,6 +377,23 @@
Zooming can be controlled with CTRL-+ and CTRL-= shortcuts as well.
+ +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.
+