[Rt-commit] rt branch, 4.4/search-results-header-order-indicator, created. rt-4.4.3-53-gfea44e765
? sunnavy
sunnavy at bestpractical.com
Mon Nov 26 16:08:30 EST 2018
The branch, 4.4/search-results-header-order-indicator has been created
at fea44e765a92c2a33534fa7cf93e9cf4d2d5dcff (commit)
- Log -----------------------------------------------------------------
commit 6ad62daccf618bac589bd9f8ffb29af5db3ebd5d
Author: sunnavy <sunnavy at bestpractical.com>
Date: Tue Oct 2 02:38:06 2018 +0800
Add order indicator to search results header
diff --git a/devel/third-party/README b/devel/third-party/README
index 8d151d357..b29436d3d 100644
--- a/devel/third-party/README
+++ b/devel/third-party/README
@@ -49,3 +49,7 @@ Description: keyboard shortcuts
Origin: https://github.com/ccampbell/mousetrap
License: Apache
+* noun_arrow_1920806.svg
+Description: arrow
+Origin: https://thenounproject.com/search/?q=arrow&i=1920806 (Arrow by Rose Alice Design from the Noun Project)
+License: CC BY 3.0
diff --git a/devel/third-party/noun_arrow_1920806.svg b/devel/third-party/noun_arrow_1920806.svg
new file mode 100644
index 000000000..5d77cdb4f
--- /dev/null
+++ b/devel/third-party/noun_arrow_1920806.svg
@@ -0,0 +1 @@
+<svg xmlns:x="http://ns.adobe.com/Extensibility/1.0/" xmlns:i="http://ns.adobe.com/AdobeIllustrator/10.0/" xmlns:graph="http://ns.adobe.com/Graphs/1.0/" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 125" style="enable-background:new 0 0 100 100;" xml:space="preserve"><switch><foreignObject requiredExtensions="http://ns.adobe.com/AdobeIllustrator/10.0/" x="0" y="0" width="1" height="1"/><g i:extraneous="self"><path d="M95.4,45L66.1,15.7c-2.7-2.7-7.2-2.7-9.9,0c-2.7,2.7-2.7,7.2,0,9.9L73.5,43h-64c-3.9,0-7,3.1-7,7s3.1,7,7,7h64L56.2,74.3 c-2.7,2.7-2.7,7.2,0,9.9c1.4,1.4,3.2,2.1,5,2.1s3.6-0.7,5-2.1L95.4,55c1.3-1.3,2.1-3.1,2.1-5C97.5,48.1,96.8,46.3,95.4,45z"/></g></switch><text x="0" y="115" fill="#000000" font-size="5px" font-weight="bold" font-family="'Helvetica Neue', Helvetica, Arial-Unicode, Arial, Sans-serif">Created by Rose Alice Design</text><text x="0" y="120" fill="#000000" font-size="5px" font-weight
="bold" font-family="'Helvetica Neue', Helvetica, Arial-Unicode, Arial, Sans-serif">from the Noun Project</text></svg>
\ No newline at end of file
diff --git a/share/html/Elements/CollectionAsTable/Header b/share/html/Elements/CollectionAsTable/Header
index 6ab35b485..8a9529841 100644
--- a/share/html/Elements/CollectionAsTable/Header
+++ b/share/html/Elements/CollectionAsTable/Header
@@ -70,6 +70,20 @@ my $generic_query_args = $GenericQueryArgs || {map { $_ => $ARGS{$_} } @PassArgu
$generic_query_args->{'Format'} = $FormatString if grep $_ eq 'Format', @PassArguments;
my $item = 0;
+
+my %order_desc = (
+ 1 => loc('first'),
+ 2 => loc('second'),
+ 3 => loc('third'),
+ 4 => loc('fourth'),
+);
+
+my %order_by;
+for my $i ( 0 .. $#OrderBy ) {
+ $order_by{ $OrderBy[ $i ] }{index} = $i + 1;
+ $order_by{ $OrderBy[ $i ] }{class} = ( $Order[ $i ] || 'ASC' ) =~ /ASC/i ? 'asc' : 'desc';
+}
+
foreach my $col ( @Format ) {
my $attr = $col->{'attribute'} || $col->{'last_attribute'};
@@ -149,6 +163,16 @@ foreach my $col ( @Format ) {
), 'h')
. '">'. $loc_title .'</a>'
);
+
+ if ( $order_by{$attr} ) {
+ my $title = loc(
+ "Results are [_1] ordered by [_2] in [_3] order.",
+ $order_desc{ $order_by{$attr}{index} } || $order_by{$attr}{index},
+ loc( $attr ),
+ $order_by{$attr}{class} eq 'asc' ? loc('ascending') : loc('descending')
+ );
+ $m->out( qq! <span class="order" title="$title">($order_by{$attr}{index}<i class="$order_by{$attr}{class}"></i>)</span>! );
+ }
}
else {
$m->out( $loc_title );
diff --git a/share/static/css/base/collection.css b/share/static/css/base/collection.css
index a06199977..44974ac24 100644
--- a/share/static/css/base/collection.css
+++ b/share/static/css/base/collection.css
@@ -24,3 +24,18 @@ table.collection td:first-child, table.collection th:first-child {
.results-count::before {
content: '\a0\a0\a0\a0';
}
+
+th.collection-as-table span.order i {
+ display: inline-block;
+ background-size: 6px;
+ width: 6px;
+ height: 8px;
+}
+
+th.collection-as-table span.order i.asc {
+ background-image: url(../../../static/images/css/arrow-up.png);
+}
+
+th.collection-as-table span.order i.desc {
+ background-image: url(../../../static/images/css/arrow-down.png);
+}
diff --git a/share/static/images/css/arrow-down.png b/share/static/images/css/arrow-down.png
new file mode 100644
index 000000000..7e299f9c5
Binary files /dev/null and b/share/static/images/css/arrow-down.png differ
diff --git a/share/static/images/css/arrow-up.png b/share/static/images/css/arrow-up.png
new file mode 100644
index 000000000..9e93775d1
Binary files /dev/null and b/share/static/images/css/arrow-up.png differ
commit fea44e765a92c2a33534fa7cf93e9cf4d2d5dcff
Author: sunnavy <sunnavy at bestpractical.com>
Date: Tue Oct 2 02:53:31 2018 +0800
Test order indicator in search results header
diff --git a/t/web/query_builder.t b/t/web/query_builder.t
index 89e89f570..cc79d5077 100644
--- a/t/web/query_builder.t
+++ b/t/web/query_builder.t
@@ -312,6 +312,7 @@ diag "make sure skipped order by field doesn't break search";
$agent->follow_link_ok({id => 'page-edit_search'});
$agent->form_name('BuildQuery');
+ $agent->field('Order', 'DESC', 1);
$agent->field("OrderBy", 'Requestor.EmailAddress', 3);
$agent->submit;
$agent->form_name('BuildQuery');
@@ -320,6 +321,11 @@ diag "make sure skipped order by field doesn't break search";
is $agent->value('OrderBy', 3), 'Requestor.EmailAddress';
$agent->follow_link_ok({id => 'page-results'});
+ $agent->text_contains('# (1', 'order number 1');
+ $agent->content_contains('1<i class="desc"></i>', 'arrow 1');
+ $agent->text_contains('Requestor (2', 'order number 2');
+ $agent->content_contains('2<i class="asc"></i>', 'arrow 2');
+
ok( $agent->find_link(
text => $t->id,
url_regex => qr{/Ticket/Display\.html},
-----------------------------------------------------------------------
More information about the rt-commit
mailing list