[Midnightbsd-cvs] mports: www/tmpls: Changed how result details work.
ctriv at midnightbsd.org
ctriv at midnightbsd.org
Sat Nov 3 12:13:57 EDT 2007
Log Message:
-----------
Changed how result details work. We now load them in the background on
demand inside a results list.
Modified Files:
--------------
mports/Tools/magus/www/data/magus:
index.cgi (r1.2 -> r1.3)
mports/Tools/magus/www/data/magus/elements:
magus.css (r1.10 -> r1.11)
mports/Tools/magus/www/tmpls:
header.tmpl (r1.5 -> r1.6)
index.tmpl (r1.5 -> r1.6)
list.tmpl (r1.1 -> r1.2)
port.tmpl (r1.1 -> r1.2)
result-list.tmpl (r1.1 -> r1.2)
Added Files:
-----------
mports/Tools/magus/www/data/magus/elements:
magus.js (r1.1)
-------------- next part --------------
Index: index.cgi
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/data/magus/index.cgi,v
retrieving revision 1.2
retrieving revision 1.3
diff -LTools/magus/www/data/magus/index.cgi -LTools/magus/www/data/magus/index.cgi -u -r1.2 -r1.3
--- Tools/magus/www/data/magus/index.cgi
+++ Tools/magus/www/data/magus/index.cgi
@@ -7,6 +7,7 @@
use Magus;
use CGI;
use HTML::Template;
+use JSON::XS;
eval {
main();
@@ -16,6 +17,7 @@
sub main {
my $p = CGI->new;
+
my $path = $p->path_info;
if ($path eq '' || $path eq '/') {
@@ -24,10 +26,8 @@
list_page($p, $1);
} elsif ($path =~ m:/ports/(.*):) {
port_page($p, $1);
- } elsif ($path =~ m:/results/(\d+)/log:) {
- log_page($p, $1);
- } elsif ($path =~ m:/results/(\d+)/details:) {
- subresults_page($p, $1);
+ } elsif ($path =~ m:/results/async/(\d+):) {
+ result_details_async($p, $1);
} else {
die "Unknown path: $path\n";
}
@@ -90,8 +90,7 @@
machine => $_->machine->name,
arch => $_->arch,
summary => $_->summary,
- has_log => defined $_->logs->next,
- has_subresults => defined $_->subresults->next,
+ has_details => ($_->summary eq 'pass') ? 0 : 1,
}} $port->results;
if (@results) {
@@ -119,43 +118,31 @@
print $p->header, $tmpl->output;
}
-sub subresults_page {
+sub result_details_async {
my ($p, $id) = @_;
-
- my $tmpl = template($p, "subresults.tmpl");
-
+
+ my %details = (id => $id);
+
my $result = Magus::Result->retrieve($id) || die "No such results: $id";
-
+
my @subresults = map { {
phase => $_->phase,
type => $_->type,
name => $_->name,
- msg => $_->msg
+ msg => $_->msg,
}} $result->subresults;
if (@subresults) {
- $tmpl->param(
- subresults => \@subresults,
- );
+ $details{subresults} = \@subresults;
}
-
- print $p->header, $tmpl->output;
-}
-
-
-
-sub log_page {
- my ($p, $id) = @_;
-
- my $result = Magus::Result->retrieve($id) || die "No such result.";
my $log = $result->logs->next;
- my $tmpl = template($p, 'log.tmpl');
-
- $tmpl->param(port => $result->port, log => $log->data);
-
- print $p->header, $tmpl->output;
+ if ($log) {
+ $details{log} = $log->data;
+ }
+# use Data::Dumper
+ print $p->header(-type => 'text/plain'), to_json(\%details);
}
sub list_page {
@@ -166,7 +153,9 @@
port => $_->port,
version => $_->version,
machine => $_->machine->name,
- arch => $_->arch
+ arch => $_->arch,
+ id => $_->id,
+ has_details => ($_->summary eq 'pass') ? 0 : 1,
}} sort { $b->id <=> $a->id } Magus::Result->search(summary => $summary);
my $tmpl = template($p, 'list.tmpl');
Index: magus.css
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/data/magus/elements/magus.css,v
retrieving revision 1.10
retrieving revision 1.11
diff -LTools/magus/www/data/magus/elements/magus.css -LTools/magus/www/data/magus/elements/magus.css -u -r1.10 -r1.11
--- Tools/magus/www/data/magus/elements/magus.css
+++ Tools/magus/www/data/magus/elements/magus.css
@@ -15,12 +15,22 @@
letter-spacing: .1em;
font-size: 2em;
font-family: Verdana, Helvetica, Arial, sans-serif;
- color: white;
margin: 0;
}
+h1 a {
+ color: white;
+ text-decoration: none;
+}
+
+h1 a:visited {
+ color: white;
+}
+
h2 {
font-size: 1.5em;
+ letter-spacing: .05em;
+ color: #555;
}
a {
@@ -41,7 +51,7 @@
}
table tr:hover {
- background: #DBDCE9;
+ background: #FCFCFF;
}
table th {
@@ -52,6 +62,11 @@
background: #eaeaea;
}
+tr.details {
+ display: none;
+}
+
+
*.fail {
color: #C0000B;
}
@@ -81,12 +96,33 @@
}
div.right {
- float: right;
-/* position: relative; */
- bottom: 60px;
- right: 20px
+ position: absolute;
+ top: 60px;
+ right: 0px;
+ width: 20%;
}
+div.full {
+ width: 100%;
+ max-width: 100%;
+}
+
+div.left {
+ width: 75%;
+ max-width: 75%;
+}
+
+table.result-list, table.port-results {
+ max-width: 100%;
+ width: 100%;
+}
+
+pre.log {
+ overflow: auto;
+}
+
+
+
ul.depends li {
list-style: none;
}
--- /dev/null
+++ Tools/magus/www/data/magus/elements/magus.js
@@ -0,0 +1,88 @@
+function details_link(id) {
+ var row = document.getElementById("result_" + id + "_row");
+ var div = document.getElementById("result_" + id + "_details");
+
+ if (!row.style.display || row.style.display == 'none') {
+ if (!div.innerHTML) {
+ sendAsycQuery(id);
+ } else {
+ row.style.display = 'table-row';
+ twiddle_link(id, 'hide');
+ }
+ } else {
+ row.style.display = 'none';
+ twiddle_link(id, 'show');
+ }
+
+ return false;
+}
+
+var url = 'http://cs.emich.edu/magus/index.cgi/results/async/';
+
+function sendAsycQuery(query) {
+ // branch for native XMLHttpRequest object
+ if (window.XMLHttpRequest) {
+ req = new XMLHttpRequest();
+ req.open("GET", url + query, true);
+ req.setRequestHeader('Content-type', 'application/x-json');
+ req.setRequestHeader('Connection', 'close');
+ req.onreadystatechange = processDetailResults;
+ req.send(null);
+ // branch for IE/Windows ActiveX version
+ } else if (window.ActiveXObject) {
+ req = new ActiveXObject("Microsoft.XMLHTTP");
+ if (req) {
+ req.open("GET", url + query, true);
+ req.onreadystatechange = processDetailResults;
+ req.setRequestHeader('Content-Type', 'application/x-json');
+ req.setRequestHeader('Connection', 'close');
+ req.send(null);
+ }
+ } else {
+ return ' ';
+ }
+}
+
+function processDetailResults() {
+ // only if req shows "loaded"
+ if (req.readyState == 4) {
+ // only if "OK"
+ if (req.status == 200) {
+ var result = eval( "(" + req.responseText + ")" );
+
+ var row = document.getElementById("result_" + result.id + "_row");
+ var td = document.getElementById("result_" + result.id + "_details");
+
+ var html = '';
+
+ if (result.subresults) {
+ html = '<ul class="subresults">';
+ for (i=0; i<result.subresults.length; i++) {
+ html = html + '<li class="' + result.subresults[i].type + '">' + result.subresults[i].phase + ': ' + result.subresults[i].msg + '</li>';
+ }
+ html = html + '</ul>';
+ }
+
+ if (result.log) {
+ html = html + '<pre class="log">' + result.log + '</pre>';
+ }
+
+ td.innerHTML = html;
+ twiddle_link(result.id, 'hide');
+ row.style.display = 'table-row';
+ } else {
+ alert("There was a problem retrieving the data:\n" + req.statusText);
+ }
+ }
+}
+
+
+function twiddle_link(id, mode) {
+ var link = document.getElementById("result_" + id + "_link");
+
+ if (mode == 'show') {
+ link.innerHTML = 'Show Details';
+ } else {
+ link.innerHTML = 'Hide Details';
+ }
+}
Index: list.tmpl
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/tmpls/list.tmpl,v
retrieving revision 1.1
retrieving revision 1.2
diff -LTools/magus/www/tmpls/list.tmpl -LTools/magus/www/tmpls/list.tmpl -u -r1.1 -r1.2
--- Tools/magus/www/tmpls/list.tmpl
+++ Tools/magus/www/tmpls/list.tmpl
@@ -1,8 +1,13 @@
<TMPL_INCLUDE NAME="header.tmpl">
-<h1><a href="/magus/">Magus</a> :: <TMPL_VAR name="TITLE"></h1>
+<div class="full">
+
+<h2><TMPL_VAR name="TITLE"></h2>
<p><TMPL_VAR NAME="count"> ports:</p>
<TMPL_INCLUDE NAME="result-list.tmpl">
+
+</div>
+
<TMPL_INCLUDE NAME="footer.tmpl">
Index: result-list.tmpl
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/tmpls/result-list.tmpl,v
retrieving revision 1.1
retrieving revision 1.2
diff -LTools/magus/www/tmpls/result-list.tmpl -LTools/magus/www/tmpls/result-list.tmpl -u -r1.1 -r1.2
--- Tools/magus/www/tmpls/result-list.tmpl
+++ Tools/magus/www/tmpls/result-list.tmpl
@@ -1,13 +1,22 @@
<table class="result-list">
- <tr><th>Port</th><th>Version</th><th>Summary</th><th>Machine</th><th>Arch</th></tr>
+ <tr><th>Port</th><th>Version</th><th>Summary</th><th>Machine</th><th>Arch</th><th></th></tr>
<TMPL_LOOP NAME=results>
- <tr class="<TMPL_VAR NAME=summary>">
+ <tr class="<TMPL_VAR NAME=summary><TMPL_UNLESS NAME=__odd__> even</TMPL_UNLESS>">
<td><a href="<TMPL_VAR name=port_root>/<TMPL_VAR NAME=port>"><TMPL_VAR NAME="port"></a></td>
<td><TMPL_VAR NAME=version></td>
<td><TMPL_VAR NAME=summary></td>
<td><TMPL_VAR NAME=machine></td>
<td><TMPL_VAR NAME=arch></td>
- </tr>
+ <td>
+ <TMPL_IF NAME="has_details">
+ (<a href="#" id="result_<TMPL_VAR NAME=id>_link" onclick="return details_link(<TMPL_VAR NAME=id>);">Show Details</a>)
+ </TMPL_IF>
+ </td>
+ </tr>
+ <tr class="details<TMPL_UNLESS NAME=__odd__> even</TMPL_UNLESS>" id="result_<TMPL_VAR NAME=id>_row">
+ <td colspan="6" id="result_<TMPL_VAR NAME=id>_details"></td>
+ </tr>
+
</TMPL_LOOP>
</table>
Index: port.tmpl
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/tmpls/port.tmpl,v
retrieving revision 1.1
retrieving revision 1.2
diff -LTools/magus/www/tmpls/port.tmpl -LTools/magus/www/tmpls/port.tmpl -u -r1.1 -r1.2
--- Tools/magus/www/tmpls/port.tmpl
+++ Tools/magus/www/tmpls/port.tmpl
@@ -1,6 +1,6 @@
<TMPL_INCLUDE NAME="header.tmpl">
-<h1><a href="/magus/">Magus</a> :: <TMPL_VAR name="port"></h1>
+<h2><TMPL_VAR name="port"></h2>
<div class="right">
<a href="http://cvsweb.midnightbsd.org/mports/<TMPL_VAR NAME=port>">CVSWeb</a>
@@ -31,6 +31,7 @@
</div>
+<div class="left">
<p><TMPL_VAR NAME="desc"></p>
<TMPL_IF name="results">
@@ -41,19 +42,22 @@
<th>Machine</th>
<th>Arch</th>
<th>Summary</th>
- <td></td>
+ <th></th>
</tr>
<TMPL_LOOP name="results">
-<tr class="<TMPL_VAR NAME=summary>">
+<tr class="<TMPL_VAR NAME=summary><TMPL_UNLESS NAME=__odd__> even</TMPL_UNLESS>">
<td><TMPL_VAR NAME="version"></td>
<td><TMPL_VAR NAME="machine"></td>
<td><TMPL_VAR NAME="arch"></td>
<td><TMPL_VAR NAME="summary"></td>
<td>
- <a href="<TMPL_VAR NAME=result_root>/<TMPL_VAR NAME=id>/details">Details</a>
- --
- <a href="<TMPL_VAR NAME=result_root>/<TMPL_VAR NAME=id>/log">Log</a>
- </td>
+ <TMPL_IF NAME="has_details">
+ (<a href="#" id="result_<TMPL_VAR NAME=id>_link" onclick="return details_link(<TMPL_VAR NAME=id>);">Show Details</a>)
+ </TMPL_IF>
+ </td>
+</tr>
+<tr class="details<TMPL_UNLESS NAME=__odd__> even</TMPL_UNLESS>" id="result_<TMPL_VAR NAME=id>_row">
+ <td colspan="5" id="result_<TMPL_VAR NAME=id>_details"></td>
</tr>
</TMPL_LOOP>
</table>
@@ -61,6 +65,6 @@
<p><TMPL_VAR name=port> has not been tested.</p>
</TMPL_IF>
-
+</div>
<TMPL_INCLUDE NAME="footer.tmpl">
Index: index.tmpl
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/tmpls/index.tmpl,v
retrieving revision 1.5
retrieving revision 1.6
diff -LTools/magus/www/tmpls/index.tmpl -LTools/magus/www/tmpls/index.tmpl -u -r1.5 -r1.6
--- Tools/magus/www/tmpls/index.tmpl
+++ Tools/magus/www/tmpls/index.tmpl
@@ -16,7 +16,7 @@
<tbody>
<TMPL_LOOP NAME="locks">
-<tr <TMPL_UNLESS name="__odd__">class="even"</TMPL_UNLESS>>
+<tr<TMPL_UNLESS name="__odd__">class="even"</TMPL_UNLESS>>
<td><a href="<TMPL_VAR name=port_root>/<TMPL_VAR NAME=port>"><TMPL_VAR NAME="port"></a></td>
<td><TMPL_VAR name="machine"></td>
<td><TMPL_VAR name="arch"></td>
@@ -28,7 +28,7 @@
</div>
-
+<div class="left">
<h3>Latest Results</h3>
<table class="result-list">
@@ -53,5 +53,6 @@
</TMPL_LOOP>
</tbody>
</table>
+</div>
<TMPL_INCLUDE NAME="footer.tmpl">
Index: header.tmpl
===================================================================
RCS file: /home/cvs/mports/Tools/magus/www/tmpls/header.tmpl,v
retrieving revision 1.5
retrieving revision 1.6
diff -LTools/magus/www/tmpls/header.tmpl -LTools/magus/www/tmpls/header.tmpl -u -r1.5 -r1.6
--- Tools/magus/www/tmpls/header.tmpl
+++ Tools/magus/www/tmpls/header.tmpl
@@ -5,12 +5,12 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><TMPL_VAR NAME="title"></title>
-
+ <script src="/magus/elements/magus.js" type="text/javascript"></script>
<link rel="stylesheet" href="/magus/elements/magus.css" media="screen" />
</head>
<body><div id="tophead">
-<h1>Magus</h1>
+<h1><a href="/magus/">Magus</a></h1>
<ul class="stats">
<li>Tested: <TMPL_VAR NAME="ports_tested"></li>
More information about the Midnightbsd-cvs
mailing list