From 3ef73904c1ddaddba42a19a6d133d23ddf294ee3 Mon Sep 17 00:00:00 2001 From: Daniel <71837281+darmiel@users.noreply.github.com> Date: Fri, 21 Oct 2022 09:05:11 +0200 Subject: [PATCH 1/3] feat: search bar for plugin catalogue Adds a search bar to the `Catalogue` section, allowing you to filter the available plugins --- .../dashboard/plugins/available/index.html | 4 +++ .../dashboard/plugins/available/index.js | 27 +++++++++++++++++++ 2 files changed, 31 insertions(+) diff --git a/src/controllers/dashboard/plugins/available/index.html b/src/controllers/dashboard/plugins/available/index.html index 6c9b89c26d..b659b9ec97 100644 --- a/src/controllers/dashboard/plugins/available/index.html +++ b/src/controllers/dashboard/plugins/available/index.html @@ -1,6 +1,10 @@
+
+ + +
${MessageNoAvailablePlugins}
diff --git a/src/controllers/dashboard/plugins/available/index.js b/src/controllers/dashboard/plugins/available/index.js index b10518bc74..75055fe35f 100644 --- a/src/controllers/dashboard/plugins/available/index.js +++ b/src/controllers/dashboard/plugins/available/index.js @@ -86,10 +86,37 @@ function populateList(options) { options.noItemsElement.classList.remove('hide'); } + const searchBar = document.getElementById('txtSearchPlugins'); + if (searchBar) { + searchBar.addEventListener('input', () => onSearchBarType(searchBar)); + } + options.catalogElement.innerHTML = html; loading.hide(); } +function onSearchBarType(searchBar) { + const filter = searchBar.value.toLowerCase(); + for (const header of document.querySelectorAll("div .verticalSection")) { + // keep track of shown cards after each search + let shown = 0; + for (const card of header.querySelectorAll("div .card")) { + if (filter && filter != '' && !card.textContent.toLowerCase().includes(filter)) { + card.style.display = 'none'; + } else { + card.style.display = 'unset'; + shown += 1; + } + } + // hide title if no cards are shown + if (shown <= 0) { + header.style.display = 'none'; + } else { + header.style.display = 'unset'; + } + } +} + function getPluginHtml(plugin, options, installedPlugins) { let html = ''; let href = plugin.externalUrl ? plugin.externalUrl : '#/addplugin.html?name=' + encodeURIComponent(plugin.name) + '&guid=' + plugin.guid; From dba3b81c8119527b92ec9b0522d5d891fdfa3ef6 Mon Sep 17 00:00:00 2001 From: Daniel <71837281+darmiel@users.noreply.github.com> Date: Fri, 21 Oct 2022 09:19:31 +0200 Subject: [PATCH 2/3] refactor: eslint (single-quotes) --- src/controllers/dashboard/plugins/available/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/controllers/dashboard/plugins/available/index.js b/src/controllers/dashboard/plugins/available/index.js index 75055fe35f..bb63fcf6ef 100644 --- a/src/controllers/dashboard/plugins/available/index.js +++ b/src/controllers/dashboard/plugins/available/index.js @@ -97,10 +97,10 @@ function populateList(options) { function onSearchBarType(searchBar) { const filter = searchBar.value.toLowerCase(); - for (const header of document.querySelectorAll("div .verticalSection")) { + for (const header of document.querySelectorAll('div .verticalSection')) { // keep track of shown cards after each search let shown = 0; - for (const card of header.querySelectorAll("div .card")) { + for (const card of header.querySelectorAll('div .card')) { if (filter && filter != '' && !card.textContent.toLowerCase().includes(filter)) { card.style.display = 'none'; } else { From b384c5a1af6fc6a61172dfb82ca4f363f1931fb5 Mon Sep 17 00:00:00 2001 From: Daniel Date: Tue, 25 Oct 2022 21:35:03 +0200 Subject: [PATCH 3/3] fix: implemented PR feedback --- src/controllers/dashboard/plugins/available/index.html | 3 +-- src/controllers/dashboard/plugins/available/index.js | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/controllers/dashboard/plugins/available/index.html b/src/controllers/dashboard/plugins/available/index.html index b659b9ec97..68567db744 100644 --- a/src/controllers/dashboard/plugins/available/index.html +++ b/src/controllers/dashboard/plugins/available/index.html @@ -2,8 +2,7 @@
- - +
${MessageNoAvailablePlugins}
diff --git a/src/controllers/dashboard/plugins/available/index.js b/src/controllers/dashboard/plugins/available/index.js index bb63fcf6ef..095bbb8659 100644 --- a/src/controllers/dashboard/plugins/available/index.js +++ b/src/controllers/dashboard/plugins/available/index.js @@ -105,7 +105,7 @@ function onSearchBarType(searchBar) { card.style.display = 'none'; } else { card.style.display = 'unset'; - shown += 1; + shown++; } } // hide title if no cards are shown