diff --git a/src/extensionsIntegrated/NavigationAndHistory/main.js b/src/extensionsIntegrated/NavigationAndHistory/main.js index 620043be23..91bd168af2 100644 --- a/src/extensionsIntegrated/NavigationAndHistory/main.js +++ b/src/extensionsIntegrated/NavigationAndHistory/main.js @@ -221,7 +221,7 @@ define(function (require, exports, module) { } function _createFileEntries($mrofList) { - var data, fileEntry, $link, $newItem; + var data, fileEntry, $link, $newItem, $removeBtn; // Iterate over the MROF list and create the pop over UI items // If we are in split view we might want to show the panes corresponding to the entries @@ -239,33 +239,72 @@ define(function (require, exports, module) { // Try to see if we have same doc split // Check existing list for this doc path and active pane entry var entryIndex = _.findIndex(_mrofList, function (record) { - return (record && record.file === value.file && record.paneId === MainViewManager.getActivePaneId()); + return ( + record && + record.file === value.file && + record.paneId === MainViewManager.getActivePaneId() + ); }); // If found don't process this entry, as the document is already present in active pane if (entryIndex >= 0) { return true; } - // Process this for active pane id + // Process this for active pane id value.paneId = MainViewManager.getActivePaneId(); } var indxInWS = MainViewManager.findInWorkingSet(value.paneId, value.file); - data = {fullPath: value.file, + data = { + fullPath: value.file, name: FileUtils.getBaseName(value.file), - isFile: true}; + isFile: true + }; fileEntry = FileSystem.getFileForPath(value.file); // Create new list item with a link - $link = $("").html(ViewUtils.getFileEntryDisplay({name: FileUtils.getBaseName(value.file)})); + $link = $("").html( + ViewUtils.getFileEntryDisplay({name: FileUtils.getBaseName(value.file)}) + ); + + // Create remove button only for files not in working set + $removeBtn = null; + if (indxInWS === -1) { + $removeBtn = $("×").on("click", function(e) { + e.preventDefault(); + e.stopPropagation(); + + // Find and remove the entry from _mrofList + var filePath = $(this).parent().data("path"); + var paneId = $(this).parent().data("paneId"); + + _mrofList = _mrofList.filter(function(entry) { + return !(entry && entry.file === filePath && entry.paneId === paneId); + }); + + // Remove the list item from UI + $(this).parent().remove(); + + // Update preferences + PreferencesManager.setViewState( + OPEN_FILES_VIEW_STATE, + _mrofList, + PreferencesManager.STATE_PROJECT_CONTEXT + ); + }); + } // Use the file icon providers WorkingSetView.useIconProviders(data, $link); + // Create list item with link and conditionally add remove button $newItem = $("
  • ").append($link); + if ($removeBtn) { + $newItem.append($removeBtn); + } if (indxInWS !== -1) { // in working set show differently $newItem.addClass("working-set"); @@ -285,7 +324,7 @@ define(function (require, exports, module) { // Use the class providers(git e.t.c) WorkingSetView.useClassProviders(data, $newItem); - // If a file is dirty , mark it in the list + // If a file is dirty, mark it in the list if (_isOpenAndDirty(fileEntry)) { $(dirtyDotTemplate).prependTo($newItem); } diff --git a/src/styles/Extn-NavigationAndHistory.less b/src/styles/Extn-NavigationAndHistory.less index 1e7a1567f4..950fc4a891 100644 --- a/src/styles/Extn-NavigationAndHistory.less +++ b/src/styles/Extn-NavigationAndHistory.less @@ -84,7 +84,7 @@ line-height: 15px; padding: 3px; cursor: default; - padding-left: 10px; + padding-left: 20px; width: 100%; box-sizing: border-box; text-overflow: ellipsis; @@ -104,14 +104,14 @@ background: transparent; color:#8fddff; box-shadow: none !important; - padding-left: 10px; + padding-left: 20px; } #mrof-container #mrof-list > li.highlight > a.mroitem { background: transparent; color:#8fddff; box-shadow: none !important; - padding-left: 10px; + padding-left: 20px; } #mrof-container #mrof-list > li.highlight > a.mroitem > .extension { @@ -236,4 +236,27 @@ #mrof-container .footer { background-color: #2c2c2c; border-top: 1px solid #343434; +} + +#mrof-container #mrof-list > li .remove-file { + color: #adb9bd; + position: absolute; + left: 6px; + top: 50%; + transform: translateY(-50%); + cursor: pointer; + opacity: 0.6; + font-size: 20px; + font-weight: 500; + display: none; +} + +#mrof-container #mrof-list > li:hover .remove-file { + color: #fff; + display: block; +} + +#mrof-container #mrof-list > li .remove-file:hover { + color: #fff; + opacity: 1; } \ No newline at end of file