From b2ddf06db544415e5beb658559840768c588f036 Mon Sep 17 00:00:00 2001 From: Pete Nykanen Date: Sun, 27 Sep 2015 16:34:22 +0300 Subject: [PATCH 1/8] Add flip-view buttons to panel headers --- src/htmlContent/pane.html | 5 +- src/nls/root/strings.js | 3 + src/styles/brackets.less | 52 +++++++++- src/styles/images/flip-view-icons-dark.svg | 67 +++++++++++++ src/styles/images/flip-view-icons.svg | 67 +++++++++++++ src/view/Pane.js | 107 +++++++++++++++++++-- 6 files changed, 292 insertions(+), 9 deletions(-) create mode 100644 src/styles/images/flip-view-icons-dark.svg create mode 100644 src/styles/images/flip-view-icons.svg diff --git a/src/htmlContent/pane.html b/src/htmlContent/pane.html index 92f55abaae6..5069658f742 100644 --- a/src/htmlContent/pane.html +++ b/src/htmlContent/pane.html @@ -1,5 +1,8 @@
-
+
+
+
+
diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 9428f8d6b7e..b521980a16c 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -461,7 +461,10 @@ define({ "BASEURL_ERROR_HASH_DISALLOWED" : "The base URL can't contain hashes like \"{0}\".", "BASEURL_ERROR_INVALID_CHAR" : "Special characters like '{0}' must be %-encoded.", "BASEURL_ERROR_UNKNOWN_ERROR" : "Unknown error parsing Base URL", + + //Strings for Pane.js "EMPTY_VIEW_HEADER" : "Open a file while this pane has focus", + "FLIPVIEW_BTN_TOOLTIP" : "Flip this view to {0} pane", // Strings for themes-settings.html and themes-general.html "CURRENT_THEME" : "Current Theme", diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 6d5f092614f..a63d1217e80 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -486,11 +486,58 @@ a, img { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - + + &-text { + display: inline; + } + .dark & { background-color: #1d1f21; // not using a variable on purpose. border-bottom-color: rgba(255, 255, 255, 0.05); } + + &-flipview-btn { + position: relative; + display: inline-block; + top: 0px; + padding-top: 4px; + padding-right: 4px; + padding-bottom: 2px; + padding-left: 4px; + margin-left: 0; + margin-bottom: 0; + .sprite-icon(0, 0, 13px, 13px, "images/flip-view-icons.svg"); + background-origin: content-box; + -webkit-transform: translateZ(0); // forces GPU mode for better filter rendering on retina + transform: translateZ(0); // future proofing + -webkit-filter: drop-shadow(0 1px 0 rgba(0,0,0,0.36)); + z-index: 1; + vertical-align: middle; + + &.btn-alt-quiet:hover { + border-color: @dark-bc-panel-bg; + } + + &.flipview-icon-none { + display: none; + } + + &.flipview-icon-top { + background-position: center 1px; + } + + &.flipview-icon-right { + background-position: center -18px; + } + + &.flipview-icon-bottom { + background-position: center -35px; + } + + &.flipview-icon-left { + background-position: center -54px; + } + } } .active-pane { @@ -755,6 +802,7 @@ a, img { -webkit-filter: drop-shadow(0 1px 0 rgba(0,0,0,0.36)); z-index: 1; } + .splitview-icon-none { background-position: center 1px; } @@ -765,6 +813,8 @@ a, img { background-position: center -41px; } + + // Show splitview icons on the button's dropdown menu too #splitview-menu ul.dropdown-menu > li { .menu-name::before { diff --git a/src/styles/images/flip-view-icons-dark.svg b/src/styles/images/flip-view-icons-dark.svg new file mode 100644 index 00000000000..638b4e139e0 --- /dev/null +++ b/src/styles/images/flip-view-icons-dark.svg @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/styles/images/flip-view-icons.svg b/src/styles/images/flip-view-icons.svg new file mode 100644 index 00000000000..8666b68b7b7 --- /dev/null +++ b/src/styles/images/flip-view-icons.svg @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/view/Pane.js b/src/view/Pane.js index e20d06eb3c8..4c3f4a1d99c 100644 --- a/src/view/Pane.js +++ b/src/view/Pane.js @@ -159,16 +159,32 @@ define(function (require, exports, module) { EventDispatcher = require("utils/EventDispatcher"), FileSystem = require("filesystem/FileSystem"), InMemoryFile = require("document/InMemoryFile"), + //WorkingSetView = require("project/WorkingSetView"), ViewStateManager = require("view/ViewStateManager"), MainViewManager = require("view/MainViewManager"), DocumentManager = require("document/DocumentManager"), CommandManager = require("command/CommandManager"), Commands = require("command/Commands"), Strings = require("strings"), + StringUtils = require("utils/StringUtils"), ViewUtils = require("utils/ViewUtils"), ProjectManager = require("project/ProjectManager"), paneTemplate = require("text!htmlContent/pane.html"); + /** + * Internal pane id + * @const + * @private + */ + var FIRST_PANE = "first-pane"; + + /** + * Internal pane id + * @const + * @private + */ + var SECOND_PANE = "second-pane"; + /** * Make an index request object * @param {boolean} requestIndex - true to request an index, false if not @@ -200,12 +216,30 @@ define(function (require, exports, module) { var self = this, $el = $container.append(Mustache.render(paneTemplate, {id: id})).find("#" + id), $header = $el.find(".pane-header"), + $headerText = $header.find(".pane-header-text"), + $headerFlipViewBtn = $header.find(".pane-header-flipview-btn"), $content = $el.find(".pane-content"); $el.on("focusin.pane", function (e) { self._lastFocusedElement = e.target; }); + // Flips the current file to the other pane when clicked + $headerFlipViewBtn.on("click.pane", function (e) { + var currentFile = self.getCurrentlyViewedFile(); + var otherPaneId = self.id === FIRST_PANE ? SECOND_PANE : FIRST_PANE; + var otherPane = MainViewManager._getPane(otherPaneId); + + MainViewManager._moveView(self.id, otherPaneId, currentFile).always(function () { + CommandManager.execute(Commands.FILE_OPEN, {fullPath: currentFile.fullPath, + paneId: otherPaneId}).always(function () { + otherPane.trigger("viewListChange"); + self.trigger("viewListChange"); + }); + }); + }); + + this._lastFocusedElement = $el[0]; // Make these properties read only @@ -236,6 +270,24 @@ define(function (require, exports, module) { } }); + Object.defineProperty(this, "$headerText", { + get: function () { + return $headerText; + }, + set: function () { + console.error("cannot change the DOM node of a working pane"); + } + }); + + Object.defineProperty(this, "$headerFlipViewBtn", { + get: function () { + return $headerFlipViewBtn; + }, + set: function () { + console.error("cannot change the DOM node of a working pane"); + } + }); + Object.defineProperty(this, "$content", { get: function () { return $content; @@ -264,6 +316,7 @@ define(function (require, exports, module) { MainViewManager.on(this._makeEventName("workingSetRemove"), _.bind(this.updateHeaderText, this)); MainViewManager.on(this._makeEventName("workingSetAddList"), _.bind(this.updateHeaderText, this)); MainViewManager.on(this._makeEventName("workingSetRemoveList"), _.bind(this.updateHeaderText, this)); + MainViewManager.on(this._makeEventName("paneLayoutChange"), _.bind(this.updateFlipViewIcon, this)); } EventDispatcher.makeEventDispatcher(Pane.prototype); @@ -289,12 +342,26 @@ define(function (require, exports, module) { Pane.prototype.$el = null; /** - * the wrapped DOM node that contains name of current view, or informational string if there is no view + * the wrapped DOM node container that contains name of current view and the switch view button, or informational string if there is no view * @readonly * @type {JQuery} */ Pane.prototype.$header = null; - + + /** + * the wrapped DOM node that contains name of current view, or informational string if there is no view + * @readonly + * @type {JQuery} + */ + Pane.prototype.$headerText = null; + + /** + * the wrapped DOM node that is used to flip the view to another pane + * @readonly + * @type {JQuery} + */ + Pane.prototype.$headerFlipViewBtn = null; + /** * the wrapped DOM node that contains views * @readonly @@ -853,6 +920,30 @@ define(function (require, exports, module) { return ViewUtils.traverseViewArray(this._viewListMRUOrder, index, direction); }; + /** + * Updates flipview icon in pane header + * @private + */ + Pane.prototype.updateFlipViewIcon = function () { + var paneID = this.id, + directionIndex = 0, + ICON_CLASSES = ["flipview-icon-none", "flipview-icon-top", "flipview-icon-right", "flipview-icon-bottom", "flipview-icon-left"], + DIRECTION_STRINGS = ["", Strings.TOP, Strings.RIGHT, Strings.BOTTOM, Strings.LEFT], + layoutScheme = MainViewManager.getLayoutScheme(), + hasFile = this.getCurrentlyViewedFile(); + + if (layoutScheme.columns > 1 && hasFile) { + directionIndex = paneID === FIRST_PANE ? 2 : 4; + } else if (layoutScheme.rows > 1 && hasFile) { + directionIndex = paneID === FIRST_PANE ? 3 : 1; + } + + this.$headerFlipViewBtn.removeClass(ICON_CLASSES.join(" ")) + .addClass(ICON_CLASSES[directionIndex]); + + this.$headerFlipViewBtn.attr("title", StringUtils.format(Strings.FLIPVIEW_BTN_TOOLTIP, DIRECTION_STRINGS[directionIndex].toLowerCase())); + }; + /** * Updates text in pane header * @private @@ -861,22 +952,24 @@ define(function (require, exports, module) { var file = this.getCurrentlyViewedFile(), files, displayName; - + if (file) { files = MainViewManager.getAllOpenFiles().filter(function (item) { return (item.name === file.name); }); if (files.length < 2) { - this.$header.text(file.name); + this.$headerText.text(file.name); } else { displayName = ProjectManager.makeProjectRelativeIfPossible(file.fullPath); - this.$header.text(displayName); + this.$headerText.text(displayName); } } else { - this.$header.html(Strings.EMPTY_VIEW_HEADER); + this.$headerText.html(Strings.EMPTY_VIEW_HEADER); } + + this.updateFlipViewIcon(); }; - + /** * Event handler when a file changes name * @private From 8a8d343fa54b7e265b842d619bff4024e2f46a5b Mon Sep 17 00:00:00 2001 From: petetnt Date: Mon, 28 Sep 2015 08:29:55 +0300 Subject: [PATCH 2/8] Remove commented out line, add non-vendor prefixed filter --- src/styles/brackets.less | 1 + src/view/Pane.js | 1 - 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index a63d1217e80..c4b08e1b626 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -511,6 +511,7 @@ a, img { -webkit-transform: translateZ(0); // forces GPU mode for better filter rendering on retina transform: translateZ(0); // future proofing -webkit-filter: drop-shadow(0 1px 0 rgba(0,0,0,0.36)); + filter: drop-shadow(0 1px 0 rgba(0,0,0,0.36)); z-index: 1; vertical-align: middle; diff --git a/src/view/Pane.js b/src/view/Pane.js index 4c3f4a1d99c..1573c8cad4e 100644 --- a/src/view/Pane.js +++ b/src/view/Pane.js @@ -159,7 +159,6 @@ define(function (require, exports, module) { EventDispatcher = require("utils/EventDispatcher"), FileSystem = require("filesystem/FileSystem"), InMemoryFile = require("document/InMemoryFile"), - //WorkingSetView = require("project/WorkingSetView"), ViewStateManager = require("view/ViewStateManager"), MainViewManager = require("view/MainViewManager"), DocumentManager = require("document/DocumentManager"), From 11905f485e7ffd810560446af014ab540b9028f2 Mon Sep 17 00:00:00 2001 From: Pete Nykanen Date: Tue, 6 Oct 2015 21:26:38 +0300 Subject: [PATCH 3/8] Added unit test --- test/spec/MainViewManager-test.js | 37 +++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) diff --git a/test/spec/MainViewManager-test.js b/test/spec/MainViewManager-test.js index 8be3f9bbbc8..dc203628537 100644 --- a/test/spec/MainViewManager-test.js +++ b/test/spec/MainViewManager-test.js @@ -412,6 +412,43 @@ define(function (require, exports, module) { expect(EditorManager.getCurrentFullEditor().document.file.name).toEqual("test.css"); }); }); + it("should flip the view to the other pane", function () { + runs(function () { + MainViewManager.setLayoutScheme(1, 2); + }); + runs(function () { + promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: testPath + "/test.js", + paneId: "first-pane" }); + waitsForDone(promise, Commands.FILE_OPEN); + }); + runs(function () { + expect(MainViewManager._getPaneIdForPath(testPath + "/test.js")).toEqual("first-pane"); + }); + runs(function () { + MainViewManager.setActivePaneId("first-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE).name).toEqual("test.js"); + MainViewManager.setActivePaneId("second-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE)).toEqual(null); + }); + runs(function () { + MainViewManager._getPane("first-pane").$headerFlipViewBtn.trigger("click"); + }); + runs(function () { + MainViewManager.setActivePaneId("first-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE)).toEqual(null); + MainViewManager.setActivePaneId("second-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE).name).toEqual("test.js"); + }); + runs(function () { + MainViewManager._getPane("second-pane").$headerFlipViewBtn.trigger("click"); + }); + runs(function () { + MainViewManager.setActivePaneId("first-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE).name).toEqual("test.js"); + MainViewManager.setActivePaneId("second-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE)).toEqual(null); + }); + }); it("should merge two panes to the right", function () { runs(function () { MainViewManager.setLayoutScheme(1, 2); From 58e30c22ba43629936d674b7dc0a0166c1b3638e Mon Sep 17 00:00:00 2001 From: Pete Nykanen Date: Sun, 11 Oct 2015 13:53:52 +0300 Subject: [PATCH 4/8] Added close button for split view panes --- src/htmlContent/pane.html | 1 + src/styles/brackets.less | 8 +++++++ src/view/Pane.js | 28 +++++++++++++++++++++++++ test/spec/MainViewManager-test.js | 35 +++++++++++++++++++++++++++++++ 4 files changed, 72 insertions(+) diff --git a/src/htmlContent/pane.html b/src/htmlContent/pane.html index 5069658f742..db16dd836fd 100644 --- a/src/htmlContent/pane.html +++ b/src/htmlContent/pane.html @@ -2,6 +2,7 @@
+
diff --git a/src/styles/brackets.less b/src/styles/brackets.less index c4b08e1b626..d0a936a04af 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -539,6 +539,14 @@ a, img { background-position: center -54px; } } + + &-close-btn { + position: relative; + height: 16px; + width: 16px; + float: right; + margin-top: -2px; + } } .active-pane { diff --git a/src/view/Pane.js b/src/view/Pane.js index 1573c8cad4e..bf6ea27e7e7 100644 --- a/src/view/Pane.js +++ b/src/view/Pane.js @@ -217,6 +217,7 @@ define(function (require, exports, module) { $header = $el.find(".pane-header"), $headerText = $header.find(".pane-header-text"), $headerFlipViewBtn = $header.find(".pane-header-flipview-btn"), + $headerCloseBtn = $header.find(".pane-header-close-btn"), $content = $el.find(".pane-content"); $el.on("focusin.pane", function (e) { @@ -238,6 +239,17 @@ define(function (require, exports, module) { }); }); + // Closes the current view on the pane when clicked. If pane has no files, merge + // panes. + $headerCloseBtn.on("click.pane", function () { + var file = self.getCurrentlyViewedFile(); + + if (file) { + CommandManager.execute(Commands.FILE_CLOSE, {File: file}); + } else { + MainViewManager.setLayoutScheme(1, 1); + } + }); this._lastFocusedElement = $el[0]; @@ -287,6 +299,15 @@ define(function (require, exports, module) { } }); + Object.defineProperty(this, "$headerCloseBtn", { + get: function () { + return $headerCloseBtn; + }, + set: function () { + console.error("cannot change the DOM node of a working pane"); + } + }); + Object.defineProperty(this, "$content", { get: function () { return $content; @@ -361,6 +382,13 @@ define(function (require, exports, module) { */ Pane.prototype.$headerFlipViewBtn = null; + /** + * close button of the pane + * @readonly + * @type {JQuery} + */ + Pane.prototype.$headerCloseBtn = null; + /** * the wrapped DOM node that contains views * @readonly diff --git a/test/spec/MainViewManager-test.js b/test/spec/MainViewManager-test.js index dc203628537..465f89d8932 100644 --- a/test/spec/MainViewManager-test.js +++ b/test/spec/MainViewManager-test.js @@ -502,6 +502,41 @@ define(function (require, exports, module) { expect(MainViewManager._getPaneIdForPath(testPath + "/test.css")).toEqual(null); }); }); + it("should close the view when clicked", function () { + runs(function () { + MainViewManager.setLayoutScheme(1, 2); + }); + runs(function () { + promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: testPath + "/test.js", + paneId: "first-pane" }); + waitsForDone(promise, Commands.FILE_OPEN); + }); + runs(function () { + expect(MainViewManager._getPaneIdForPath(testPath + "/test.js")).toEqual("first-pane"); + }); + runs(function () { + MainViewManager.setActivePaneId("first-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE).name).toEqual("test.js"); + }); + runs(function () { + MainViewManager._getPane("first-pane").$headerCloseBtn.trigger("click"); + }); + runs(function () { + MainViewManager.setActivePaneId("first-pane"); + expect(MainViewManager.getCurrentlyViewedFile(MainViewManager.ACTIVE_PANE)).toEqual(null); + }); + }); + it("should collapse the panes when close button is clicked on a pane with no files", function () { + runs(function () { + MainViewManager.setLayoutScheme(1, 2); + }); + runs(function () { + MainViewManager._getPane("first-pane").$headerCloseBtn.trigger("click"); + }); + runs(function () { + expect(MainViewManager.getLayoutScheme()).toEqual({rows: 1, columns: 1}); + }); + }); it("should activate pane when editor gains focus", function () { var editors = {}, handler = function (e, doc, editor, paneId) { From cb7fa062d281f86c2721383fcd4593637da90c83 Mon Sep 17 00:00:00 2001 From: Pete Nykanen Date: Mon, 12 Oct 2015 22:24:28 +0300 Subject: [PATCH 5/8] Modify button styles, add preferences, fix close button bug --- src/htmlContent/pane.html | 2 +- src/nls/root/strings.js | 2 + src/styles/brackets.less | 21 +++++-- src/styles/images/flip-view-icons-hover.svg | 67 +++++++++++++++++++++ src/view/Pane.js | 31 ++++++++++ 5 files changed, 117 insertions(+), 6 deletions(-) create mode 100644 src/styles/images/flip-view-icons-hover.svg diff --git a/src/htmlContent/pane.html b/src/htmlContent/pane.html index db16dd836fd..87dd1fbf692 100644 --- a/src/htmlContent/pane.html +++ b/src/htmlContent/pane.html @@ -1,7 +1,7 @@
-
+
diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index b521980a16c..3111cab7070 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -770,6 +770,8 @@ define({ "DESCRIPTION_FONT_SMOOTHING" : "Mac-only: \"subpixel-antialiased\" to enable sub-pixel antialiasing or \"antialiased\" for gray scale antialiasing", "DESCRIPTION_OPEN_PREFS_IN_SPLIT_VIEW" : "false to disable opening preferences file in split view", "DESCRIPTION_OPEN_USER_PREFS_IN_SECOND_PANE" : "false to open user preferences file in left/top pane", + "DESCRIPTION_MERGE_PANES_WHEN_LAST_FILE_CLOSED" : "true to collapse panes after the last file from the pane is closed via pane header close button", + "DESCRIPTION_SHOW_PANE_HEADER_BUTTONS" : "Toggle when to show the close and flip-view buttons on the header. Possible values \"hover\", \"always\" and \"never\".", "DEFAULT_PREFERENCES_JSON_HEADER_COMMENT" : "/*\n * This is a read-only file with the preferences supported\n * by {APP_NAME}.\n * Use this file as a reference to modify your preferences\n * file \"brackets.json\" opened in the other pane.\n * For more information on how to use preferences inside\n * {APP_NAME}, refer to the web page at https://github.com/adobe/brackets/wiki/How-to-Use-Brackets#preferences\n */", "DEFAULT_PREFERENCES_JSON_DEFAULT" : "Default" }); diff --git a/src/styles/brackets.less b/src/styles/brackets.less index d0a936a04af..143f6d0f4a5 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -498,11 +498,10 @@ a, img { &-flipview-btn { position: relative; - display: inline-block; + display: none; top: 0px; - padding-top: 4px; + padding-top: 2px; padding-right: 4px; - padding-bottom: 2px; padding-left: 4px; margin-left: 0; margin-bottom: 0; @@ -515,8 +514,8 @@ a, img { z-index: 1; vertical-align: middle; - &.btn-alt-quiet:hover { - border-color: @dark-bc-panel-bg; + &:hover { + background-image: url("images/flip-view-icons-hover.svg") } &.flipview-icon-none { @@ -542,12 +541,24 @@ a, img { &-close-btn { position: relative; + display: none; height: 16px; width: 16px; float: right; margin-top: -2px; } + + &:hover, &.always-show-header-buttons { + > .pane-header-flipview-btn { + display: inline-block; + } + + > .pane-header-close-btn { + display: inline; + } + } } + .active-pane { .pane-header { diff --git a/src/styles/images/flip-view-icons-hover.svg b/src/styles/images/flip-view-icons-hover.svg new file mode 100644 index 00000000000..c37917f8136 --- /dev/null +++ b/src/styles/images/flip-view-icons-hover.svg @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/view/Pane.js b/src/view/Pane.js index bf6ea27e7e7..e4dfbe58173 100644 --- a/src/view/Pane.js +++ b/src/view/Pane.js @@ -161,6 +161,7 @@ define(function (require, exports, module) { InMemoryFile = require("document/InMemoryFile"), ViewStateManager = require("view/ViewStateManager"), MainViewManager = require("view/MainViewManager"), + PreferencesManager = require("preferences/PreferencesManager"), DocumentManager = require("document/DocumentManager"), CommandManager = require("command/CommandManager"), Commands = require("command/Commands"), @@ -184,6 +185,19 @@ define(function (require, exports, module) { */ var SECOND_PANE = "second-pane"; + // Define showPaneHeaderButtons, which controls when to show close and flip-view buttons + // on the header. Possible values "hover", "always" and "never" + PreferencesManager.definePreference("pane.showPaneHeaderButtons", "string", "hover", { + description: Strings.DESCRIPTION_SHOW_PANE_HEADER_BUTTONS + }); + + // Define mergePanesWhenLastFileClosed, which controls if a split view pane should be + // closed when the last file is closed, skipping the "Open a file while this pane has focus" + // step completely. + PreferencesManager.definePreference("pane.mergePanesWhenLastFileClosed", "boolean", false, { + description: Strings.DESCRIPTION_MERGE_PANES_WHEN_LAST_FILE_CLOSED + }); + /** * Make an index request object * @param {boolean} requestIndex - true to request an index, false if not @@ -213,6 +227,7 @@ define(function (require, exports, module) { // Setup the container and the element we're inserting var self = this, + showPaneHeaderButtonsPref = PreferencesManager.get("pane.showPaneHeaderButtons"), $el = $container.append(Mustache.render(paneTemplate, {id: id})).find("#" + id), $header = $el.find(".pane-header"), $headerText = $header.find(".pane-header-text"), @@ -242,10 +257,16 @@ define(function (require, exports, module) { // Closes the current view on the pane when clicked. If pane has no files, merge // panes. $headerCloseBtn.on("click.pane", function () { + //set clicked pane as active to ensure that this._currentView is updated before closing + MainViewManager.setActivePaneId(self.id); var file = self.getCurrentlyViewedFile(); if (file) { CommandManager.execute(Commands.FILE_CLOSE, {File: file}); + + if (!self.getCurrentlyViewedFile() && PreferencesManager.get("pane.mergePanesWhenLastFileClosed")) { + MainViewManager.setLayoutScheme(1, 1); + } } else { MainViewManager.setLayoutScheme(1, 1); } @@ -328,6 +349,16 @@ define(function (require, exports, module) { this.updateHeaderText(); + switch (showPaneHeaderButtonsPref) { + case "always": + this.$header.addClass("always-show-header-buttons"); + break; + case "never": + this.$headerFlipViewBtn.css("display", "none"); + this.$headerCloseBtn.css("display", "none"); + break; + } + // Listen to document events so we can update ourself DocumentManager.on(this._makeEventName("fileNameChange"), _.bind(this._handleFileNameChange, this)); DocumentManager.on(this._makeEventName("pathDeleted"), _.bind(this._handleFileDeleted, this)); From 443aeb1e6779ab9d80baf8808171f7bbf5a5f838 Mon Sep 17 00:00:00 2001 From: petetnt Date: Tue, 13 Oct 2015 08:35:08 +0300 Subject: [PATCH 6/8] Add possible values for the pane header button pref, remove unneeded commentary --- src/nls/root/strings.js | 2 +- src/view/Pane.js | 5 +++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 3111cab7070..7a1f3685e91 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -771,7 +771,7 @@ define({ "DESCRIPTION_OPEN_PREFS_IN_SPLIT_VIEW" : "false to disable opening preferences file in split view", "DESCRIPTION_OPEN_USER_PREFS_IN_SECOND_PANE" : "false to open user preferences file in left/top pane", "DESCRIPTION_MERGE_PANES_WHEN_LAST_FILE_CLOSED" : "true to collapse panes after the last file from the pane is closed via pane header close button", - "DESCRIPTION_SHOW_PANE_HEADER_BUTTONS" : "Toggle when to show the close and flip-view buttons on the header. Possible values \"hover\", \"always\" and \"never\".", + "DESCRIPTION_SHOW_PANE_HEADER_BUTTONS" : "Toggle when to show the close and flip-view buttons on the header.", "DEFAULT_PREFERENCES_JSON_HEADER_COMMENT" : "/*\n * This is a read-only file with the preferences supported\n * by {APP_NAME}.\n * Use this file as a reference to modify your preferences\n * file \"brackets.json\" opened in the other pane.\n * For more information on how to use preferences inside\n * {APP_NAME}, refer to the web page at https://github.com/adobe/brackets/wiki/How-to-Use-Brackets#preferences\n */", "DEFAULT_PREFERENCES_JSON_DEFAULT" : "Default" }); diff --git a/src/view/Pane.js b/src/view/Pane.js index e4dfbe58173..3422cd295b6 100644 --- a/src/view/Pane.js +++ b/src/view/Pane.js @@ -186,9 +186,10 @@ define(function (require, exports, module) { var SECOND_PANE = "second-pane"; // Define showPaneHeaderButtons, which controls when to show close and flip-view buttons - // on the header. Possible values "hover", "always" and "never" + // on the header. PreferencesManager.definePreference("pane.showPaneHeaderButtons", "string", "hover", { - description: Strings.DESCRIPTION_SHOW_PANE_HEADER_BUTTONS + description: Strings.DESCRIPTION_SHOW_PANE_HEADER_BUTTONS, + values: ["hover", "always", "never"] }); // Define mergePanesWhenLastFileClosed, which controls if a split view pane should be From 3ef3b19d860bddc76e06bf5f8d766e5a2b4c55db Mon Sep 17 00:00:00 2001 From: petetnt Date: Thu, 15 Oct 2015 10:58:54 +0300 Subject: [PATCH 7/8] Ensure that header close button is visible on lighter themes --- src/styles/brackets.less | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 143f6d0f4a5..0ce28926e13 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -546,6 +546,24 @@ a, img { width: 16px; float: right; margin-top: -2px; + + &:before { + color: rgba(0, 0, 0, 0.5); + } + + &:hover:before { + color: rgba(0, 0, 0, 0.8); + } + + .dark & { + &:before { + color: rgba(255, 255, 255, 0.5); + } + + &:hover:before { + color: rgba(255, 255, 255, 0.8); + } + } } &:hover, &.always-show-header-buttons { From 750d2bd1ed7bf3c254623bc43c026fbed10c4193 Mon Sep 17 00:00:00 2001 From: petetnt Date: Thu, 15 Oct 2015 12:57:03 +0300 Subject: [PATCH 8/8] Fix regression with .flipview-icon-none caused by the 'always'-pref --- src/styles/brackets.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 0ce28926e13..1ee9b733770 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -567,7 +567,7 @@ a, img { } &:hover, &.always-show-header-buttons { - > .pane-header-flipview-btn { + > .pane-header-flipview-btn:not(.flipview-icon-none) { display: inline-block; }