Note that tree and detail font sizing is relative to the main font size setting.
-
- 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.
-
`;
export default class ApperanceOptions {
@@ -100,8 +69,6 @@ export default class ApperanceOptions {
this.$themeSelect = $("#theme-select");
this.$zoomFactorSelect = $("#zoom-factor-select");
- this.$leftPaneMinWidth = $("#left-pane-min-width");
- this.$leftPaneWidthPercent = $("#left-pane-width-percent");
this.$mainFontSize = $("#main-font-size");
this.$treeFontSize = $("#tree-font-size");
this.$detailFontSize = $("#detail-font-size");
@@ -132,18 +99,6 @@ export default class ApperanceOptions {
this.$zoomFactorSelect.on('change', () => { zoomService.setZoomFactorAndSave(this.$zoomFactorSelect.val()); });
- this.$leftPaneMinWidth.on('change', async () => {
- await server.put('options/leftPaneMinWidth/' + this.$leftPaneMinWidth.val());
-
- this.resizeLeftPanel();
- });
-
- this.$leftPaneWidthPercent.on('change', async () => {
- await server.put('options/leftPaneWidthPercent/' + this.$leftPaneWidthPercent.val());
-
- this.resizeLeftPanel();
- });
-
this.$mainFontSize.on('change', async () => {
await server.put('options/mainFontSize/' + this.$mainFontSize.val());
@@ -188,22 +143,11 @@ export default class ApperanceOptions {
this.$zoomFactorSelect.prop('disabled', true);
}
- this.$leftPaneMinWidth.val(options.leftPaneMinWidth);
- this.$leftPaneWidthPercent.val(options.leftPaneWidthPercent);
-
this.$mainFontSize.val(options.mainFontSize);
this.$treeFontSize.val(options.treeFontSize);
this.$detailFontSize.val(options.detailFontSize);
}
- resizeLeftPanel() {
- const leftPanePercent = parseInt(this.$leftPaneWidthPercent.val());
- const rightPanePercent = 100 - leftPanePercent;
- const leftPaneMinWidth = this.$leftPaneMinWidth.val();
-
- this.$container.css("grid-template-columns", `minmax(${leftPaneMinWidth}px, ${leftPanePercent}fr) ${rightPanePercent}fr`);
- }
-
applyFontSizes() {
this.$body.get(0).style.setProperty("--main-font-size", this.$mainFontSize.val() + "%");
this.$body.get(0).style.setProperty("--tree-font-size", this.$treeFontSize.val() + "%");
diff --git a/src/public/javascripts/dialogs/options/sidebar.js b/src/public/javascripts/dialogs/options/sidebar.js
index 27372345d..9ba36d264 100644
--- a/src/public/javascripts/dialogs/options/sidebar.js
+++ b/src/public/javascripts/dialogs/options/sidebar.js
@@ -3,45 +3,6 @@ import server from "../../services/server.js";
import optionsService from "../../services/options.js";
const TPL = `
-Sidebar width is calculated from the percent of the detail pane, if this is smaller than minimum width, then minimum width is used. If you want to have fixed width sidebar, set minimum width to the desired width and set percent to 0.
-
@@ -58,48 +19,15 @@ export default class SidebarOptions {
constructor() {
$("#options-sidebar").html(TPL);
- this.$sidebarMinWidth = $("#sidebar-min-width");
- this.$sidebarWidthPercent = $("#sidebar-width-percent");
- this.$showSidebarInNewTab = $("#show-sidebar-in-new-tab");
this.$widgetsConfiguration = $("#widgets-configuration");
this.$widgetsEnabled = $("#widgets-enabled");
this.$widgetsDisabled = $("#widgets-disabled");
-
- this.$sidebarMinWidth.on('change', async () => {
- await server.put('options/sidebarMinWidth/' + this.$sidebarMinWidth.val());
-
- this.resizeSidebar();
- });
-
- this.$sidebarWidthPercent.on('change', async () => {
- await server.put('options/sidebarWidthPercent/' + this.$sidebarWidthPercent.val());
-
- this.resizeSidebar();
- });
-
- this.$showSidebarInNewTab.on('change', async () => {
- const flag = this.$showSidebarInNewTab.is(":checked") ? 'true' : 'false';
-
- await server.put('options/showSidebarInNewTab/' + flag);
-
- optionsService.reloadOptions();
- });
}
async optionsLoaded(options) {
this.$widgetsEnabled.empty();
this.$widgetsDisabled.empty();
- this.$sidebarMinWidth.val(options.sidebarMinWidth);
- this.$sidebarWidthPercent.val(options.sidebarWidthPercent);
-
- if (options.showSidebarInNewTab === 'true') {
- this.$showSidebarInNewTab.attr("checked", "checked");
- }
- else {
- this.$showSidebarInNewTab.removeAttr("checked");
- }
-
const widgets = [
{name: 'attributes', title: 'Attributes'},
{name: 'linkMap', title: 'Link map'},
@@ -188,19 +116,4 @@ export default class SidebarOptions {
return null;
}
}
-
- resizeSidebar() {
- const sidebarWidthPercent = parseInt(this.$sidebarWidthPercent.val());
- const sidebarMinWidth = this.$sidebarMinWidth.val();
-
- // need to find them dynamically since they change
- const $sidebar = $("#right-pane");
-
- const $content = $(".note-detail-content");
-
- $sidebar.css("width", sidebarWidthPercent + '%');
- $sidebar.css("min-width", sidebarMinWidth + 'px');
-
- $content.css("width", (100 - sidebarWidthPercent) + '%');
- }
}
\ No newline at end of file
diff --git a/src/public/javascripts/services/tab_row.js b/src/public/javascripts/services/tab_row.js
index dde1d7306..d36f3b956 100644
--- a/src/public/javascripts/services/tab_row.js
+++ b/src/public/javascripts/services/tab_row.js
@@ -5,8 +5,6 @@
* MIT license
*/
-import optionsService from './options.js';
-
!function(i,e){"function"==typeof define&&define.amd?define("jquery-bridget/jquery-bridget",["jquery"],function(t){return e(i,t)}):"object"==typeof module&&module.exports?module.exports=e(i,require("jquery")):i.jQueryBridget=e(i,i.jQuery)}(window,function(t,i){"use strict";var c=Array.prototype.slice,e=t.console,p=void 0===e?function(){}:function(t){e.error(t)};function n(d,o,u){(u=u||i||t.jQuery)&&(o.prototype.option||(o.prototype.option=function(t){u.isPlainObject(t)&&(this.options=u.extend(!0,this.options,t))}),u.fn[d]=function(t){if("string"==typeof t){var i=c.call(arguments,1);return s=i,a="$()."+d+'("'+(r=t)+'")',(e=this).each(function(t,i){var e=u.data(i,d);if(e){var n=e[r];if(n&&"_"!=r.charAt(0)){var o=n.apply(e,s);h=void 0===h?o:h}else p(a+" is not a valid method")}else p(d+" not initialized. Cannot call methods, i.e. "+a)}),void 0!==h?h:e}var e,r,s,h,a,n;return n=t,this.each(function(t,i){var e=u.data(i,d);e?(e.option(n),e._init()):(e=new o(i,n),u.data(i,d,e))}),this},r(u))}function r(t){!t||t&&t.bridget||(t.bridget=n)}return r(i||t.jQuery),n}),function(t,i){"use strict";"function"==typeof define&&define.amd?define("get-size/get-size",[],function(){return i()}):"object"==typeof module&&module.exports?module.exports=i():t.getSize=i()}(window,function(){"use strict";function m(t){var i=parseFloat(t);return-1==t.indexOf("%")&&!isNaN(i)&&i}var e="undefined"==typeof console?function(){}:function(t){console.error(t)},y=["paddingLeft","paddingRight","paddingTop","paddingBottom","marginLeft","marginRight","marginTop","marginBottom","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth"],b=y.length;function E(t){var i=getComputedStyle(t);return i||e("Style returned "+i+". Are you running this code in a hidden iframe on Firefox? See http://bit.ly/getsizebug1"),i}var _,x=!1;function P(t){if(function(){if(!x){x=!0;var t=document.createElement("div");t.style.width="200px",t.style.padding="1px 2px 3px 4px",t.style.borderStyle="solid",t.style.borderWidth="1px 2px 3px 4px",t.style.boxSizing="border-box";var i=document.body||document.documentElement;i.appendChild(t);var e=E(t);P.isBoxSizeOuter=_=200==m(e.width),i.removeChild(t)}}(),"string"==typeof t&&(t=document.querySelector(t)),t&&"object"==typeof t&&t.nodeType){var i=E(t);if("none"==i.display)return function(){for(var t={width:0,height:0,innerWidth:0,innerHeight:0,outerWidth:0,outerHeight:0},i=0;i