[aur-dev] [PATCH] Show number of selected packages on search page

Johannes Löthberg

28 Jun 2015 28 Jun '15

7:22 p.m.

Fixes FS#45379. Signed-off-by: Johannes Löthberg --- This is an initial version, so might not be perfect. Note that since we have to do it through JS we have to use strings like "1 package(s) selected" instead of properly gettext'ed ones. web/html/packages.php | 11 +++++++++++ web/template/pkg_search_results.php | 6 +++++- 2 files changed, 16 insertions(+), 1 deletion(-) diff --git a/web/html/packages.php b/web/html/packages.php index 75a574e..b4c5c39 100644 --- a/web/html/packages.php +++ b/web/html/packages.php @@ -67,10 +67,21 @@ function collapseDependsList(list) { }); } +function checkboxes() { + document.getElementById("pkglist-checked-count").innerHTML = document.querySelectorAll('input[type="checkbox"]:checked').length; +} + $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + checkboxes(); // Set initial value + + var elements = document.getElementsByClassName('package-checkbox'); + + for (var i = 0, len = elements.length; i < len; i++) { + elements[i].onchange = checkboxes; + } }); </script> diff --git a/web/template/pkg_search_results.php b/web/template/pkg_search_results.php index cce533c..b40c87d 100644 --- a/web/template/pkg_search_results.php +++ b/web/template/pkg_search_results.php @@ -9,6 +9,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?= __('%s%s%s package(s) selected.', + '', '0', '') ?> <?php if (count($templ_pages) > 1): ?> @@ -49,7 +51,7 @@ if (!$result): ?> <?php while (list($indx, $row) = each($searchresults)): ?> <tr class="<?= ($indx % 2 == 0) ? 'odd' : 'even' ?>"> <?php if ($SID): ?> - <td></td> + <td></td> <?php endif; ?> <td><?= htmlspecialchars($row["Name"]) ?></a></td> <?= htmlspecialchars($row["Version"]) ?></td> @@ -89,6 +91,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?= __('%s%s%s package(s) selected.', + '', '0', '') ?> <?php if (count($templ_pages) > 1): ?> -- 2.4.4

Show replies by date

carstene1ns

30 Jun 30 Jun

2:15 p.m.

New subject: [aur-dev] [PATCH] Show number of selected packages on search page

Am 28.06.2015 um 21:22 schrieb Johannes Löthberg:

...

+function checkboxes() { + document.getElementById("pkglist-checked-count").innerHTML = document.querySelectorAll('input[type="checkbox"]:checked').length; +} + $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + checkboxes(); // Set initial value + + var elements = document.getElementsByClassName('package-checkbox'); + + for (var i = 0, len = elements.length; i < len; i++) { + elements[i].onchange = checkboxes; + }

It should be easier to just use the already active jQuery. See the first example here: https://api.jquery.com/checked-selector/ That said, $(".package-checkbox:checked").length should do it. best regards, carstene1ns

Johannes Löthberg

2:21 p.m.

New subject: [aur-dev] [PATCH] Show number of selected packages on search page

On 30/06, carstene1ns wrote:

...

Am 28.06.2015 um 21:22 schrieb Johannes Löthberg:

...
+function checkboxes() { + document.getElementById("pkglist-checked-count").innerHTML = document.querySelectorAll('input[type="checkbox"]:checked').length; +} + $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + checkboxes(); // Set initial value + + var elements = document.getElementsByClassName('package-checkbox'); + + for (var i = 0, len = elements.length; i < len; i++) { + elements[i].onchange = checkboxes; + }

It should be easier to just use the already active jQuery. See the first example here: https://api.jquery.com/checked-selector/

That said, $(".package-checkbox:checked").length should do it.

Yeah, I wrote the thing before I notice that the AUR already used jquery, then didn't feel like switching right away, so wanted some comments first. But I'll switch. -- Sincerely, Johannes Löthberg PGP Key ID: 0x50FB9B273A9D0BB5 https://theos.kyriasis.com/~kyrias/

Marcel Korpel

2:47 p.m.

* Johannes Löthberg (Sun, 28 Jun 2015 21:22:05 +0200):

...

+function checkboxes() { + document.getElementById("pkglist-checked-count").innerHTML = document.querySelectorAll('input[type="checkbox"]:checked').length; +} + $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + checkboxes(); // Set initial value + + var elements = document.getElementsByClassName('package-checkbox'); + + for (var i = 0, len = elements.length; i < len; i++) { + elements[i].onchange = checkboxes; + } });

What Carsten said; you know you can also declare a function with $(document).ready? That way, it isn't available outside of the function and you don't clutter the global namespace, for what it's worth.

carstene1ns

1 Jul 1 Jul

3:39 a.m.

New subject: [aur-dev] [PATCH] Show number of selected packages on search page

Am 28.06.2015 um 21:22 schrieb Johannes Löthberg:

...

Note that since we have to do it through JS we have to use strings like "1 package(s) selected" instead of properly gettext'ed ones.

What about using the translated string with a placeholder from JS and replace it? Then use an empty element here:

...

diff --git a/web/template/pkg_search_results.php b/web/template/pkg_search_results.php index cce533c..b40c87d 100644 --- a/web/template/pkg_search_results.php +++ b/web/template/pkg_search_results.php @@ -9,6 +9,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?= __('%s%s%s package(s) selected.', + '', '0', '') ?> <?php if (count($templ_pages) > 1): ?> and here: @@ -89,6 +91,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?= __('%s%s%s package(s) selected.', + '', '0', '') ?> <?php if (count($templ_pages) > 1): ?>

var str = <?= __('%NUMBER% package(s) selected.) ?> var res = str.replace("%NUMBER%", count.toStr()); $("%pkglist-checked-count").text(res); (code is untested) This approach has the benefit that users without activated javascript do not see the string at all instead of it not changing, which is a better user experience. best regards, carstene1ns

Johannes Löthberg

7:48 a.m.

New subject: [aur-dev] [PATCH] Show number of selected packages on search page

On 01/07, carstene1ns wrote:

...

Am 28.06.2015 um 21:22 schrieb Johannes Löthberg:

...
Note that since we have to do it through JS we have to use strings like "1 package(s) selected" instead of properly gettext'ed ones.

What about using the translated string with a placeholder from JS and replace it? Then use an empty element here:

...
diff --git a/web/template/pkg_search_results.php b/web/template/pkg_search_results.php index cce533c..b40c87d 100644 --- a/web/template/pkg_search_results.php +++ b/web/template/pkg_search_results.php @@ -9,6 +9,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?= __('%s%s%s package(s) selected.', + '', '0', '') ?> <?php if (count($templ_pages) > 1): ?> and here: @@ -89,6 +91,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?= __('%s%s%s package(s) selected.', + '', '0', '') ?> <?php if (count($templ_pages) > 1): ?> 

var str = <?= __('%NUMBER% package(s) selected.) ?> var res = str.replace("%NUMBER%", count.toStr()); $("%pkglist-checked-count").text(res);

(code is untested)

This approach has the benefit that users without activated javascript do not see the string at all instead of it not changing, which is a better user experience.

That is a good idea, thanks. -- Sincerely, Johannes Löthberg PGP Key ID: 0x50FB9B273A9D0BB5 https://theos.kyriasis.com/~kyrias/

Johannes Löthberg

2 Jul 2 Jul

2:55 p.m.

New subject: [aur-dev] [PATCH v2 1/2] Reindent web/html/packages with tabs

Signed-off-by: Johannes Löthberg --- web/html/packages.php | 42 +++++++++++++++++++++--------------------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/web/html/packages.php b/web/html/packages.php index 75a574e..bf3daf8 100644 --- a/web/html/packages.php +++ b/web/html/packages.php @@ -46,31 +46,31 @@ html_header($title, $details); <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript"> function collapseDependsList(list) { - list = $(list); - // Hide everything past a given limit. Don't do anything if we don't have - // enough items, or the link already exists. - var limit = 20, - linkid = list.attr('id') + 'link', - items = list.find('li').slice(limit); - if (items.length <= 1 || $('#' + linkid).length > 0) { - return; - } - items.hide(); - list.after('<a id="' + linkid + '" href="#">Show More…</a>'); + list = $(list); + // Hide everything past a given limit. Don't do anything if we don't have + // enough items, or the link already exists. + var limit = 20, + linkid = list.attr('id') + 'link', + items = list.find('li').slice(limit); + if (items.length <= 1 || $('#' + linkid).length > 0) { + return; + } + items.hide(); + list.after('<a id="' + linkid + '" href="#">Show More…</a>'); - // add link and wire it up to show the hidden items - $('#' + linkid).click(function(event) { - event.preventDefault(); - list.find('li').show(); - // remove the full node from the DOM - $(this).parent().remove(); - }); + // add link and wire it up to show the hidden items + $('#' + linkid).click(function(event) { + event.preventDefault(); + list.find('li').show(); + // remove the full node from the DOM + $(this).parent().remove(); + }); } $(document).ready(function() { - collapseDependsList("#pkgdepslist"); - collapseDependsList("#pkgreqslist"); - collapseDependsList("#pkgsrcslist"); + collapseDependsList("#pkgdepslist"); + collapseDependsList("#pkgreqslist"); + collapseDependsList("#pkgsrcslist"); }); </script> -- 2.4.5

Johannes Löthberg

2:55 p.m.

New subject: [aur-dev] [PATCH v2 2/2] Show number of selected packages on search page

Fixes FS#45379. Signed-off-by: Johannes Löthberg --- Changes since v1: * Use jQuery * Allow for better localization * Without JS there won't be any counter listed web/html/packages.php | 18 ++++++++++++++++++ web/template/pkg_search_results.php | 5 ++++- 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/web/html/packages.php b/web/html/packages.php index bf3daf8..9d4b34b 100644 --- a/web/html/packages.php +++ b/web/html/packages.php @@ -71,6 +71,24 @@ $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + + function update_checked_count() { + var one_pkg = '<?= __("1 package selected") ?>'; + var pkgs = '<?= __("%s packages selected") ?>'; + + var count = $('.package-checkbox:checked').length; + if (count === 1) { + var res = one_pkg; + } else { + var res = pkgs; + } + $('#pkglist-checked-count').text(res.replace('%s', count.toString())); + } + + var elements = $('.package-checkbox'); + for (var i = 0, len = elements.length; i < len; i++) { + elements[i].onchange = update_checked_count; + } }); </script> diff --git a/web/template/pkg_search_results.php b/web/template/pkg_search_results.php index cce533c..4d99dd6 100644 --- a/web/template/pkg_search_results.php +++ b/web/template/pkg_search_results.php @@ -9,6 +9,7 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?php if (count($templ_pages) > 1): ?> @@ -49,7 +50,7 @@ if (!$result): ?> <?php while (list($indx, $row) = each($searchresults)): ?> <tr class="<?= ($indx % 2 == 0) ? 'odd' : 'even' ?>"> <?php if ($SID): ?> - <td></td> + <td></td> <?php endif; ?> <td><?= htmlspecialchars($row["Name"]) ?></a></td> <?= htmlspecialchars($row["Version"]) ?></td> @@ -89,6 +90,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + + <?php if (count($templ_pages) > 1): ?> -- 2.4.5

carstene1ns

9:30 p.m.

New subject: [aur-dev] [PATCH v2 2/2] Show number of selected packages on search page

Am 02.07.2015 um 16:55 schrieb Johannes Löthberg:

...

Fixes FS#45379.

Signed-off-by: Johannes Löthberg --- Changes since v1: * Use jQuery * Allow for better localization * Without JS there won't be any counter listed

...

+ var elements = $('.package-checkbox'); + for (var i = 0, len = elements.length; i < len; i++) { + elements[i].onchange = update_checked_count; + }

I think a loop is not needed here, this should do the same: $('.package-checkbox').change(update_checked_count); best regards, carstene1ns

Johannes Löthberg

11:52 p.m.

New subject: [aur-dev] [PATCH v3 2/2] Show number of selected packages on search page

Fixes FS#45379. Signed-off-by: Johannes Löthberg --- Changes since v3: * Set the initial string on page load. * Use jQuery method to set the change function instead of looping over the checkboxes. (Thank you carstene1ns for the recommendation.) web/html/packages.php | 16 ++++++++++++++++ web/template/pkg_search_results.php | 5 ++++- 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/web/html/packages.php b/web/html/packages.php index bf3daf8..da7b7de 100644 --- a/web/html/packages.php +++ b/web/html/packages.php @@ -71,6 +71,22 @@ $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + + function update_checked_count() { + var one_pkg = '<?= __("1 package selected") ?>'; + var pkgs = '<?= __("%s packages selected") ?>'; + + var count = $('.package-checkbox:checked').length; + if (count === 1) { + var res = one_pkg; + } else { + var res = pkgs; + } + $('#pkglist-checked-count').text(res.replace('%s', count.toString())); + } + update_checked_count(); // Set initial string + + $('.package-checkbox').change(update_checked_count); }); </script> diff --git a/web/template/pkg_search_results.php b/web/template/pkg_search_results.php index cce533c..4d99dd6 100644 --- a/web/template/pkg_search_results.php +++ b/web/template/pkg_search_results.php @@ -9,6 +9,7 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?php if (count($templ_pages) > 1): ?> @@ -49,7 +50,7 @@ if (!$result): ?> <?php while (list($indx, $row) = each($searchresults)): ?> <tr class="<?= ($indx % 2 == 0) ? 'odd' : 'even' ?>"> <?php if ($SID): ?> - <td></td> + <td></td> <?php endif; ?> <td><?= htmlspecialchars($row["Name"]) ?></a></td> <?= htmlspecialchars($row["Version"]) ?></td> @@ -89,6 +90,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + + <?php if (count($templ_pages) > 1): ?> -- 2.4.5

Lukas Fleischer

4 Jul 4 Jul

9:28 a.m.

New subject: [aur-dev] [PATCH v3 2/2] Show number of selected packages on search page

On Fri, 03 Jul 2015 at 01:52:58, Johannes Löthberg wrote:

...

Fixes FS#45379.

Signed-off-by: Johannes Löthberg --- Changes since v3: * Set the initial string on page load. * Use jQuery method to set the change function instead of looping over the checkboxes. (Thank you carstene1ns for the recommendation.)

web/html/packages.php | 16 ++++++++++++++++ web/template/pkg_search_results.php | 5 ++++- 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/web/html/packages.php b/web/html/packages.php index bf3daf8..da7b7de 100644 --- a/web/html/packages.php +++ b/web/html/packages.php @@ -71,6 +71,22 @@ $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + + function update_checked_count() { + var one_pkg = '<?= __("1 package selected") ?>'; + var pkgs = '<?= __("%s packages selected") ?>'; [...]

Can we use %d here? Looks fine otherwise!

Johannes Löthberg

10:33 a.m.

New subject: [aur-dev] [PATCH v4 2/2] Show number of selected packages on search page

Fixes FS#45379. Signed-off-by: Johannes Löthberg --- Changes since v3: * Accidentally used %s instead of %d in gettext string web/html/packages.php | 16 ++++++++++++++++ web/template/pkg_search_results.php | 5 ++++- 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/web/html/packages.php b/web/html/packages.php index bf3daf8..4b11f09 100644 --- a/web/html/packages.php +++ b/web/html/packages.php @@ -71,6 +71,22 @@ $(document).ready(function() { collapseDependsList("#pkgdepslist"); collapseDependsList("#pkgreqslist"); collapseDependsList("#pkgsrcslist"); + + function update_checked_count() { + var one_pkg = '<?= __("1 package selected") ?>'; + var pkgs = '<?= __("%d packages selected") ?>'; + + var count = $('.package-checkbox:checked').length; + if (count === 1) { + var res = one_pkg; + } else { + var res = pkgs; + } + $('#pkglist-checked-count').text(res.replace('%s', count.toString())); + } + update_checked_count(); // Set initial string + + $('.package-checkbox').change(update_checked_count); }); </script> diff --git a/web/template/pkg_search_results.php b/web/template/pkg_search_results.php index cce533c..4d99dd6 100644 --- a/web/template/pkg_search_results.php +++ b/web/template/pkg_search_results.php @@ -9,6 +9,7 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + <?php if (count($templ_pages) > 1): ?> @@ -49,7 +50,7 @@ if (!$result): ?> <?php while (list($indx, $row) = each($searchresults)): ?> <tr class="<?= ($indx % 2 == 0) ? 'odd' : 'even' ?>"> <?php if ($SID): ?> - <td></td> + <td></td> <?php endif; ?> <td><?= htmlspecialchars($row["Name"]) ?></a></td> <?= htmlspecialchars($row["Version"]) ?></td> @@ -89,6 +90,8 @@ if (!$result): ?> <?= _n('%d package found.', '%d packages found.', $total) ?> <?= __('Page %d of %d.', $current, $pages) ?> + + <?php if (count($templ_pages) > 1): ?> -- 2.4.5

3227

Age (days ago)

3233

Last active (days ago)

List overview

Download

11 comments

4 participants

participants (4)

carstene1ns
Johannes Löthberg
Lukas Fleischer
Marcel Korpel

[aur-dev] [PATCH] Show number of selected packages on search page

tags

participants (4)