From 26c5092963da50f44ec0491e145b82ddeb7ca6d2 Mon Sep 17 00:00:00 2001 From: Advay Tandon Date: Mon, 30 Jan 2023 12:57:16 -0800 Subject: [PATCH 1/4] fixed a UI issue --- src/Bootstrap/dist/css/bootstrap-theme.css | 15 ++------------- .../less/theme/page-list-packages.less | 17 ++--------------- 2 files changed, 4 insertions(+), 28 deletions(-) diff --git a/src/Bootstrap/dist/css/bootstrap-theme.css b/src/Bootstrap/dist/css/bootstrap-theme.css index f2fd116726..e4ccccbb34 100644 --- a/src/Bootstrap/dist/css/bootstrap-theme.css +++ b/src/Bootstrap/dist/css/bootstrap-theme.css @@ -1773,19 +1773,6 @@ p.frameworktableinfo-text { .page-list-packages .no-margin { margin: 0 !important; } -.page-list-packages .btn-filter { - margin-top: 33px; - margin-bottom: 33px; - width: 90px; - height: 45px; - font-weight: 500; - font-size: medium; - background-color: transparent; - border: none; -} -.page-list-packages .btn-filter:hover { - background-color: #f4f4f4; -} @media (max-width: 992px) { .page-list-packages .btn-filter { text-align: left; @@ -1863,6 +1850,7 @@ p.frameworktableinfo-text { .page-list-packages .advanced-search-panel .collapsible { color: #494949; background-color: #f4f4f4; + position: relative; padding-top: 0px; padding-bottom: 0px; border: none; @@ -1875,6 +1863,7 @@ p.frameworktableinfo-text { } .page-list-packages .advanced-search-panel .collapsible:focus { outline: solid; + z-index: 1; } .page-list-packages .advanced-search-panel .tfmTab { max-height: 0; diff --git a/src/Bootstrap/less/theme/page-list-packages.less b/src/Bootstrap/less/theme/page-list-packages.less index 6fc788c59a..00351ab841 100644 --- a/src/Bootstrap/less/theme/page-list-packages.less +++ b/src/Bootstrap/less/theme/page-list-packages.less @@ -11,21 +11,6 @@ margin: 0 !important; } - .btn-filter { - margin-top: 33px; - margin-bottom: 33px; - width: 90px; - height: 45px; - font-weight: 500; - font-size: medium; - background-color: transparent; - border: none; - } - - .btn-filter:hover { - background-color: #f4f4f4; - } - @media (max-width: @screen-md) { .btn-filter { text-align: left; @@ -118,6 +103,7 @@ .collapsible { color: rgb(73, 73, 73); background-color: @alert-info-bg; + position: relative; padding-top: 0px; padding-bottom: 0px; border: none; @@ -131,6 +117,7 @@ .collapsible:focus { outline: solid; + z-index: 1; } .tfmTab { From 14b32ddb26d06e6d1a7a73b32b0cbd63179512c7 Mon Sep 17 00:00:00 2001 From: Advay Tandon Date: Wed, 1 Feb 2023 17:25:31 -0800 Subject: [PATCH 2/4] fixed multiple bugs from bug bash --- .../Scripts/gallery/page-list-packages.js | 46 ++++++++++++------- .../Views/Shared/ListPackages.cshtml | 8 ++-- 2 files changed, 34 insertions(+), 20 deletions(-) diff --git a/src/NuGetGallery/Scripts/gallery/page-list-packages.js b/src/NuGetGallery/Scripts/gallery/page-list-packages.js index 754dd629dc..32c878dac3 100644 --- a/src/NuGetGallery/Scripts/gallery/page-list-packages.js +++ b/src/NuGetGallery/Scripts/gallery/page-list-packages.js @@ -23,12 +23,10 @@ $(function() { function clickFrameworkCheckbox() { this.indeterminate = false; - updateFrameworkFilters(searchForm.frameworks, this.id, this.checked); const tfms = document.querySelectorAll('[parent=' + this.id + ']'); tfms.forEach((tfm) => { tfm.checked = false; - updateFrameworkFilters(searchForm.tfms, tfm.id, false); }); } @@ -40,25 +38,12 @@ $(function() { framework.checked = false; framework.indeterminate = checkedCount !== 0; - updateFrameworkFilters(searchForm.frameworks, framework.id, false); - - updateFrameworkFilters(searchForm.tfms, this.id, this.checked); - } - - // Update the query string with the selected Frameworks and Tfms - function updateFrameworkFilters(searchField, frameworkName, add) { - if (add) { - searchField.value += frameworkName + ","; - } - else { - searchField.value = searchField.value.replace(frameworkName + ",", "") - } } // Submit the form when a user changes the selected 'sortBy' option searchForm.sortby.addEventListener('change', (e) => { searchForm.sortby.value = e.target.value; - searchForm.submit(); + submitSearchForm(); }); // Accordion/collapsible logic @@ -95,6 +80,28 @@ $(function() { } } + searchForm.addEventListener('submit', submitSearchForm); + + function submitSearchForm() { + constructFilterParameter(searchForm.frameworks, allFrameworks); + constructFilterParameter(searchForm.tfms, allTfms); + searchForm.submit(); + } + + // Update the query string with the selected frameworks and tfms + function constructFilterParameter(searchField, checkboxList) { + searchField.value = ""; + + checkboxList.forEach((framework) => { + if (framework.checked) { + searchField.value += framework.id + ","; + } + }); + + // trim trailing commas + searchField.value = searchField.value.replace(/,+$/, ''); + } + // Initialize state for Framework and Tfm checkboxes // NOTE: We first click on all selected Framework checkboxes and then on the selected Tfm checkboxes, which // allows us to correctly handle cases where a Framework AND one of its child Tfms is present in the query @@ -107,5 +114,12 @@ $(function() { inputFrameworkFilters.map(id => document.getElementById(id)).forEach(checkbox => checkbox.click()); inputTfmFilters.map(id => document.getElementById(id)).forEach(checkbox => checkbox.click()); + + // expand TFM section if a TFM from that generation has been selected + allFrameworks.forEach((checkbox) => { + if (checkbox.indeterminate) { + document.querySelector('[tab=' + checkbox.id + ']').click(); + } + }); } }); diff --git a/src/NuGetGallery/Views/Shared/ListPackages.cshtml b/src/NuGetGallery/Views/Shared/ListPackages.cshtml index 1375eb608f..0e4ee4823d 100644 --- a/src/NuGetGallery/Views/Shared/ListPackages.cshtml +++ b/src/NuGetGallery/Views/Shared/ListPackages.cshtml @@ -76,6 +76,8 @@ @if (Model.IsAdvancedSearchFlightEnabled) {
+ + @if (Model.IsFrameworkFilteringEnabled) {
@@ -108,7 +110,7 @@
Package type @foreach (var packageType in UiSupportedPackageTypes) - { + { @AddPackageFilterOption(packageType.Value, packageType.Key, isDefault: packageType.Key == DefaultPackageType) }
@@ -133,9 +135,7 @@
- - - + } From a3715622ce0c3f178d949d85e9e32826e8bb3744 Mon Sep 17 00:00:00 2001 From: Advay Tandon Date: Wed, 1 Feb 2023 18:19:29 -0800 Subject: [PATCH 3/4] whitespace --- src/NuGetGallery/Views/Shared/ListPackages.cshtml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/NuGetGallery/Views/Shared/ListPackages.cshtml b/src/NuGetGallery/Views/Shared/ListPackages.cshtml index 0e4ee4823d..de1aa9080e 100644 --- a/src/NuGetGallery/Views/Shared/ListPackages.cshtml +++ b/src/NuGetGallery/Views/Shared/ListPackages.cshtml @@ -110,7 +110,7 @@
Package type @foreach (var packageType in UiSupportedPackageTypes) - { + { @AddPackageFilterOption(packageType.Value, packageType.Key, isDefault: packageType.Key == DefaultPackageType) }
From 720788ad3e4b9f1297448051ceba66639c5ca059 Mon Sep 17 00:00:00 2001 From: Advay Tandon Date: Mon, 6 Feb 2023 14:15:32 -0800 Subject: [PATCH 4/4] Search bar only removed from search page, not others (like the profiles page) + no search bar flicker on rendering --- src/NuGetGallery/Scripts/gallery/page-list-packages.js | 4 ---- src/NuGetGallery/Views/Shared/ListPackages.cshtml | 1 + 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/src/NuGetGallery/Scripts/gallery/page-list-packages.js b/src/NuGetGallery/Scripts/gallery/page-list-packages.js index 32c878dac3..ae93177ac0 100644 --- a/src/NuGetGallery/Scripts/gallery/page-list-packages.js +++ b/src/NuGetGallery/Scripts/gallery/page-list-packages.js @@ -8,10 +8,6 @@ $(function() { const allFrameworks = document.querySelectorAll('.framework'); const allTfms = document.querySelectorAll('.tfm'); - // Hide the default search bar in the page header - const defaultSearchBarHeader = document.getElementById("search-bar-header"); - defaultSearchBarHeader.parentNode.removeChild(defaultSearchBarHeader); - // Checkbox logic for Framework and Tfm filters for (const framework of allFrameworks) { framework.addEventListener('click', clickFrameworkCheckbox); diff --git a/src/NuGetGallery/Views/Shared/ListPackages.cshtml b/src/NuGetGallery/Views/Shared/ListPackages.cshtml index de1aa9080e..97615b4303 100644 --- a/src/NuGetGallery/Views/Shared/ListPackages.cshtml +++ b/src/NuGetGallery/Views/Shared/ListPackages.cshtml @@ -4,6 +4,7 @@ ViewBag.SortText = String.IsNullOrWhiteSpace(Model.SearchTerm) ? "recent installs" : "relevance"; ViewBag.Tab = "Packages"; ViewBag.BlockSearchEngineIndexing = !String.IsNullOrWhiteSpace(Model.SearchTerm) || Model.PageIndex != 0; + ViewBag.ShowSearchInNavbar = false; } @helper AddPackageFilterOption(string optionName, string optionValue, bool isDefault = false)