From d5b32c92cccdaa66cedeb025015e89e9230eaf66 Mon Sep 17 00:00:00 2001 From: Pluto Date: Thu, 22 May 2025 04:39:30 +0530 Subject: [PATCH 1/3] feat: add preferences to toggle the working set visibility --- src/nls/root/strings.js | 3 +++ src/project/SidebarView.js | 36 +++++++++++++++++++++++++++--------- src/styles/brackets.less | 5 +++++ 3 files changed, 35 insertions(+), 9 deletions(-) diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 4f4fe37d5d..f3fba15e90 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -1279,6 +1279,9 @@ define({ // Emmet "DESCRIPTION_EMMET": "true to enable Emmet, else false.", + // Hide/Show working set (that is displayed in the sidebar) + "DESCRIPTION_SHOW_WORKING_SET": "true to show the working set, false to hide it.", + // Tabbar "DESCRIPTION_TABBAR": "Set the tab bar settings.", "DESCRIPTION_SHOW_TABBAR": "true to show the tab bar, else false.", diff --git a/src/project/SidebarView.js b/src/project/SidebarView.js index fb609cfbe6..734c8b259b 100644 --- a/src/project/SidebarView.js +++ b/src/project/SidebarView.js @@ -38,15 +38,16 @@ define(function (require, exports, module) { - var AppInit = require("utils/AppInit"), - ProjectManager = require("project/ProjectManager"), - WorkingSetView = require("project/WorkingSetView"), - MainViewManager = require("view/MainViewManager"), - CommandManager = require("command/CommandManager"), - Commands = require("command/Commands"), - Strings = require("strings"), - Resizer = require("utils/Resizer"), - _ = require("thirdparty/lodash"); + var AppInit = require("utils/AppInit"), + ProjectManager = require("project/ProjectManager"), + PreferencesManager = require("preferences/PreferencesManager"), + WorkingSetView = require("project/WorkingSetView"), + MainViewManager = require("view/MainViewManager"), + CommandManager = require("command/CommandManager"), + Commands = require("command/Commands"), + Strings = require("strings"), + Resizer = require("utils/Resizer"), + _ = require("thirdparty/lodash"); // These vars are initialized by the htmlReady handler // below since they refer to DOM elements @@ -244,6 +245,23 @@ define(function (require, exports, module) { // Tooltips $splitViewMenu.attr("title", Strings.GEAR_MENU_TOOLTIP); + + // Define the preference to decide whether to show the working set or not + PreferencesManager.definePreference("showWorkingSet", "boolean", true, { + description: Strings.DESCRIPTION_SHOW_WORKING_SET + }) + .on("change", function () { + // 'working-set-list-container' is the id of the main working set element which we need to hide/show + const $workingSet = $(document.getElementById("working-set-list-container")); + const getPref = PreferencesManager.get("showWorkingSet"); + + if(getPref) { + // refer to brackets.less file for styles + $workingSet.removeClass("working-set-hidden"); + } else { + $workingSet.addClass("working-set-hidden"); + } + }); }); ProjectManager.on("projectOpen", _updateProjectTitle); diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 2d09b8f41d..b7a211f244 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -1168,12 +1168,17 @@ a, img { #working-set-list-container { background: @bc-sidebar-bg; + display: block; > div:last-child ul { padding-bottom: 21px; // Adds working set bottom padding to the last UL. } } +#working-set-list-container.working-set-hidden { + display: none !important; +} + .working-set-header { position: relative; height: 19px; From d4a630a68e51762a5d9c1c1d292549ac7a7156a3 Mon Sep 17 00:00:00 2001 From: Pluto Date: Thu, 22 May 2025 04:52:14 +0530 Subject: [PATCH 2/3] feat: toggle tab bar and working set from sidebar --- src/command/Commands.js | 6 ++++++ src/command/DefaultMenus.js | 3 +++ src/nls/root/strings.js | 3 +++ src/project/SidebarView.js | 41 ++++++++++++++++++++++++++++++++++++- 4 files changed, 52 insertions(+), 1 deletion(-) diff --git a/src/command/Commands.js b/src/command/Commands.js index 2314c47e32..d94c550fd2 100644 --- a/src/command/Commands.js +++ b/src/command/Commands.js @@ -451,6 +451,12 @@ define(function (require, exports, module) { /** Toggles automatic working set sorting */ exports.CMD_WORKING_SORT_TOGGLE_AUTO = "cmd.sortWorkingSetToggleAuto"; // WorkingSetSort.js _handleToggleAutoSort() + /** Toggles working set visibility */ + exports.CMD_TOGGLE_SHOW_WORKING_SET = "cmd.toggleShowWorkingSet"; // SidebarView.js _handleToggleWorkingSet() + + /** Toggles file tabs visibility */ + exports.CMD_TOGGLE_SHOW_FILE_TABS = "cmd.toggleShowFileTabs"; // SidebarView.js _handleToggleFileTabs() + /** Opens keyboard navigation UI overlay */ exports.CMD_KEYBOARD_NAV_UI_OVERLAY = "cmd.keyboardNavUI"; // WorkingSetSort.js _handleToggleAutoSort() diff --git a/src/command/DefaultMenus.js b/src/command/DefaultMenus.js index b488abbe9b..5a1e8febaa 100644 --- a/src/command/DefaultMenus.js +++ b/src/command/DefaultMenus.js @@ -345,6 +345,9 @@ define(function (require, exports, module) { splitview_menu.addMenuDivider(); splitview_menu.addMenuItem(Commands.CMD_WORKING_SORT_TOGGLE_AUTO); splitview_menu.addMenuItem(Commands.FILE_SHOW_FOLDERS_FIRST); + splitview_menu.addMenuDivider(); + splitview_menu.addMenuItem(Commands.CMD_TOGGLE_SHOW_WORKING_SET); + splitview_menu.addMenuItem(Commands.CMD_TOGGLE_SHOW_FILE_TABS); var project_cmenu = Menus.registerContextMenu(Menus.ContextMenuIds.PROJECT_MENU); project_cmenu.addMenuItem(Commands.FILE_NEW); diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index f3fba15e90..681ec04f45 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -328,6 +328,9 @@ define({ "SPLITVIEW_MENU_TOOLTIP": "Split the editor vertically or horizontally", "GEAR_MENU_TOOLTIP": "Configure Working Set", + "CMD_TOGGLE_SHOW_WORKING_SET": "Show Working Set", + "CMD_TOGGLE_SHOW_FILE_TABS": "Show File Tab Bar", + "SPLITVIEW_INFO_TITLE": "Already Open", "SPLITVIEW_MULTIPANE_WARNING": "The file is already open in another pane. {APP_NAME} will soon support opening the same file in more than one pane. Until then, the file will be shown in the pane it's already open in.

(You'll only see this message once.)", diff --git a/src/project/SidebarView.js b/src/project/SidebarView.js index 734c8b259b..4d47285c60 100644 --- a/src/project/SidebarView.js +++ b/src/project/SidebarView.js @@ -59,7 +59,9 @@ define(function (require, exports, module) { var _cmdSplitNone, _cmdSplitVertical, - _cmdSplitHorizontal; + _cmdSplitHorizontal, + _cmdToggleWorkingSet, + _cmdToggleFileTabs; /** * @private @@ -179,6 +181,30 @@ define(function (require, exports, module) { MainViewManager.setLayoutScheme(2, 1); } + /** + * Handle Toggle Working Set Command + * @private + */ + function _handleToggleWorkingSet() { + const isCurrentlyShown = PreferencesManager.get("showWorkingSet"); + PreferencesManager.set("showWorkingSet", !isCurrentlyShown); + CommandManager.get(Commands.CMD_TOGGLE_SHOW_WORKING_SET).setChecked(isCurrentlyShown); + } + + /** + * Handle Toggle File Tabs Command + * @private + */ + function _handleToggleFileTabs() { + const prefs = PreferencesManager.get("tabBar.options"); + const willBeShown = !prefs.showTabBar; + PreferencesManager.set("tabBar.options", { + showTabBar: willBeShown, + numberOfTabs: prefs.numberOfTabs + }); + CommandManager.get(Commands.CMD_TOGGLE_SHOW_FILE_TABS).setChecked(willBeShown); + } + // Initialize items dependent on HTML DOM AppInit.htmlReady(function () { $sidebar = $("#sidebar"); @@ -246,6 +272,17 @@ define(function (require, exports, module) { // Tooltips $splitViewMenu.attr("title", Strings.GEAR_MENU_TOOLTIP); + _cmdToggleWorkingSet.setChecked(PreferencesManager.get("showWorkingSet")); + _cmdToggleFileTabs.setChecked(PreferencesManager.get("tabBar.options").showTabBar); + + // to listen for tab bar preference changes from the preferences file + // because if user toggles the state of tab bar visibility either from the view menu or the preferences file + // we need to update the checked state here too + PreferencesManager.on("change", "tabBar.options", function () { + const prefs = PreferencesManager.get("tabBar.options"); + _cmdToggleFileTabs.setChecked(prefs.showTabBar); + }); + // Define the preference to decide whether to show the working set or not PreferencesManager.definePreference("showWorkingSet", "boolean", true, { description: Strings.DESCRIPTION_SHOW_WORKING_SET @@ -273,6 +310,8 @@ define(function (require, exports, module) { _cmdSplitNone = CommandManager.register(Strings.CMD_SPLITVIEW_NONE, Commands.CMD_SPLITVIEW_NONE, _handleSplitViewNone); _cmdSplitVertical = CommandManager.register(Strings.CMD_SPLITVIEW_VERTICAL, Commands.CMD_SPLITVIEW_VERTICAL, _handleSplitViewVertical); _cmdSplitHorizontal = CommandManager.register(Strings.CMD_SPLITVIEW_HORIZONTAL, Commands.CMD_SPLITVIEW_HORIZONTAL, _handleSplitViewHorizontal); + _cmdToggleWorkingSet = CommandManager.register(Strings.CMD_TOGGLE_SHOW_WORKING_SET, Commands.CMD_TOGGLE_SHOW_WORKING_SET, _handleToggleWorkingSet); + _cmdToggleFileTabs = CommandManager.register(Strings.CMD_TOGGLE_SHOW_FILE_TABS, Commands.CMD_TOGGLE_SHOW_FILE_TABS, _handleToggleFileTabs); CommandManager.register(Strings.CMD_TOGGLE_SIDEBAR, Commands.VIEW_HIDE_SIDEBAR, toggle); CommandManager.register(Strings.CMD_SHOW_SIDEBAR, Commands.SHOW_SIDEBAR, show); From f9accf90c830d7af6d46051e5e14c53e664f24df Mon Sep 17 00:00:00 2001 From: Pluto Date: Thu, 22 May 2025 05:12:43 +0530 Subject: [PATCH 3/3] fix: working set flashing issue on reload when its set to hidden --- src/project/SidebarView.js | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/project/SidebarView.js b/src/project/SidebarView.js index 4d47285c60..0ac1c63274 100644 --- a/src/project/SidebarView.js +++ b/src/project/SidebarView.js @@ -188,7 +188,7 @@ define(function (require, exports, module) { function _handleToggleWorkingSet() { const isCurrentlyShown = PreferencesManager.get("showWorkingSet"); PreferencesManager.set("showWorkingSet", !isCurrentlyShown); - CommandManager.get(Commands.CMD_TOGGLE_SHOW_WORKING_SET).setChecked(isCurrentlyShown); + CommandManager.get(Commands.CMD_TOGGLE_SHOW_WORKING_SET).setChecked(!isCurrentlyShown); } /** @@ -213,6 +213,12 @@ define(function (require, exports, module) { $projectFilesContainer = $sidebar.find("#project-files-container"); $workingSetViewsContainer = $sidebar.find("#working-set-list-container"); + // apply working set visibility immediately + // this is needed because otherwise when the working set is hidden there is a flashing issue + if (!PreferencesManager.get("showWorkingSet")) { + $workingSetViewsContainer.addClass("working-set-hidden"); + } + // init $sidebar.on("panelResizeStart", function (evt, width) { $sidebar.find(".sidebar-selection-extension").css("display", "none"); @@ -298,6 +304,9 @@ define(function (require, exports, module) { } else { $workingSet.addClass("working-set-hidden"); } + + // update the menu item checked state to match the preference + _cmdToggleWorkingSet.setChecked(getPref); }); });