Francois Gouget : testbot/web: Add arrows to navigate through the job results.

[Alexandre Julliard]

Module: tools
Branch: master
Commit: af340b505eff1d6d0adcbbb28dad52ac455a08b0
URL:    https://source.winehq.org/git/tools.git/?a=commit;h=af340b505eff1d6d0adcbbb2...

Author: Francois Gouget 
Date:   Thu Aug 30 02:01:31 2018 +0200

testbot/web: Add arrows to navigate through the job results.

The up / down arrows simplify navigation when the long logs are
expanded.

Signed-off-by: Francois Gouget 
Signed-off-by: Alexandre Julliard

---

testbot/web/JobDetails.pl   | 10 ++++++++--
 testbot/web/WineTestBot.css |  2 ++
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/testbot/web/JobDetails.pl b/testbot/web/JobDetails.pl
index d10b98e..8efe5ee 100644
--- a/testbot/web/JobDetails.pl
+++ b/testbot/web/JobDetails.pl
@@ -381,13 +381,19 @@ EOF

print "<div class='Content'>\n";
   my $Keys = $self->SortKeys(undef, $self->{Collection}->GetKeys());
+  my $KeyIndex = 0;
   foreach my $Key (@$Keys)
   {
     my $StepTask = $self->{Collection}->GetItem($Key);
     my $TaskDir = $StepTask->GetTaskDir();
     my $VM = $StepTask->VM;
-    print "<h2><a name='k", $self->escapeHTML($Key), "'></a>" ,
-          $self->escapeHTML($StepTask->GetTitle()), "</h2>\n";
+
+    my $Prev = $KeyIndex > 0 ? "k". $Keys->[$KeyIndex-1] : "PageTitle";
+    my $Next = $KeyIndex + 1 < @$Keys ? "k". $Keys->[$KeyIndex+1] : "PageEnd";
+    $KeyIndex++;
+    print "<h2><a name='k", $self->escapeHTML($Key), "'></a>",
+          $self->escapeHTML($StepTask->GetTitle()),
+          " <span class='right'><a class='title' href='#$Prev'>&uarr;</a><a class='title' href='#$Next'>&darr;</a></span></h2>\n";

print "<details><summary>",
           $self->CGI->escapeHTML($VM->Description || $VM->Name), "</summary>",
diff --git a/testbot/web/WineTestBot.css b/testbot/web/WineTestBot.css
index 88badfe..df683f8 100644
--- a/testbot/web/WineTestBot.css
+++ b/testbot/web/WineTestBot.css
@@ -364,6 +364,8 @@ pre
    background-color: red;
 }

+.right { float: right; }
+
 .queued    { color: black; }
 .running   { color: blue; }
 .success   { color: green; }