diff --git a/db/migrations/0138__sidebar_sizing.sql b/db/migrations/0138__sidebar_sizing.sql new file mode 100644 index 000000000..2ecb582d4 --- /dev/null +++ b/db/migrations/0138__sidebar_sizing.sql @@ -0,0 +1,5 @@ +INSERT INTO options (name, value, utcDateCreated, utcDateModified, isSynced) +VALUES ('sidebarMinWidth', '350', '2018-07-29T18:31:00.874Z', '2018-07-29T18:31:00.874Z', 0); + +INSERT INTO options (name, value, utcDateCreated, utcDateModified, isSynced) +VALUES ('sidebarWidthPercent', '25', '2018-07-29T18:31:00.874Z', '2018-07-29T18:31:00.874Z', 0); \ No newline at end of file diff --git a/package.json b/package.json index 3763b20e3..5bb2513da 100644 --- a/package.json +++ b/package.json @@ -77,7 +77,6 @@ "xml2js": "0.4.19" }, "devDependencies": { - "devtron": "1.4.0", "electron": "6.0.2", "electron-builder": "21.2.0", "electron-compile": "6.4.4", diff --git a/src/public/javascripts/dialogs/options.js b/src/public/javascripts/dialogs/options.js index 17c47bca0..d50c0746e 100644 --- a/src/public/javascripts/dialogs/options.js +++ b/src/public/javascripts/dialogs/options.js @@ -349,4 +349,43 @@ addTabHandler((async function () { }); return {}; +})()); + +addTabHandler((function() { + const $sidebarMinWidth = $("#sidebar-min-width"); + const $sidebarWidthPercent = $("#sidebar-width-percent"); + + async function optionsLoaded(options) { + $sidebarMinWidth.val(options.sidebarMinWidth); + $sidebarWidthPercent.val(options.sidebarWidthPercent); + } + + function resizeSidebar() { + const sidebarWidthPercent = parseInt($sidebarWidthPercent.val()); + const sidebarMinWidth = $sidebarMinWidth.val(); + + // need to find them dynamically since they change + const $sidebar = $(".note-detail-sidebar"); + + console.log("Resizing to ", sidebarWidthPercent, sidebarMinWidth); + + $sidebar.css("width", sidebarWidthPercent + '%'); + $sidebar.css("min-width", sidebarMinWidth + 'px'); + } + + $sidebarMinWidth.change(async function() { + await server.put('options/sidebarMinWidth/' + $(this).val()); + + resizeSidebar(); + }); + + $sidebarWidthPercent.change(async function() { + await server.put('options/sidebarWidthPercent/' + $(this).val()); + + resizeSidebar(); + }); + + return { + optionsLoaded + }; })()); \ No newline at end of file diff --git a/src/public/stylesheets/style.css b/src/public/stylesheets/style.css index 3a09634d5..2e4851f05 100644 --- a/src/public/stylesheets/style.css +++ b/src/public/stylesheets/style.css @@ -102,7 +102,7 @@ ul.fancytree-container { .note-detail-sidebar { min-width: 350px; - max-width: 350px; + width: 50%; overflow: auto; padding-top: 12px; padding-left: 7px; diff --git a/src/routes/api/options.js b/src/routes/api/options.js index 60783a509..32dc59cab 100644 --- a/src/routes/api/options.js +++ b/src/routes/api/options.js @@ -15,6 +15,8 @@ const ALLOWED_OPTIONS = [ 'syncProxy', 'leftPaneMinWidth', 'leftPaneWidthPercent', + 'sidebarMinWidth', + 'sidebarWidthPercent', 'hoistedNoteId', 'mainFontSize', 'treeFontSize', diff --git a/src/routes/index.js b/src/routes/index.js index d41a3dc74..d92418914 100644 --- a/src/routes/index.js +++ b/src/routes/index.js @@ -21,6 +21,8 @@ async function index(req, res) { leftPaneMinWidth: parseInt(options.leftPaneMinWidth), leftPaneWidthPercent: parseInt(options.leftPaneWidthPercent), rightPaneWidthPercent: 100 - parseInt(options.leftPaneWidthPercent), + sidebarMinWidth: parseInt(options.sidebarMinWidth), + sidebarWidthPercent: parseInt(options.sidebarWidthPercent), mainFontSize: parseInt(options.mainFontSize), treeFontSize: parseInt(options.treeFontSize), detailFontSize: parseInt(options.detailFontSize), diff --git a/src/services/app_info.js b/src/services/app_info.js index 2fe2f4f19..7c6bd436c 100644 --- a/src/services/app_info.js +++ b/src/services/app_info.js @@ -4,7 +4,7 @@ const build = require('./build'); const packageJson = require('../../package'); const {TRILIUM_DATA_DIR} = require('./data_dir'); -const APP_DB_VERSION = 137; +const APP_DB_VERSION = 138; const SYNC_VERSION = 10; const CLIPPER_PROTOCOL_VERSION = "1.0"; diff --git a/src/views/dialogs/options/appearance.ejs b/src/views/dialogs/options/appearance.ejs index f5f6330e1..0be29c4bd 100644 --- a/src/views/dialogs/options/appearance.ejs +++ b/src/views/dialogs/options/appearance.ejs @@ -70,13 +70,25 @@