hydra/src/root/layout.tt
Eelco Dolstra 9422c9d2a7 Optimise clickable rows
Set a click handler on the table instead of on every row.  This should
be faster on large tables.  Also, it's easier to use: you just set the
clickable-rows class on the table, and the row-link class on the <a>
element that contains the "main" link of the row.
2013-02-22 18:05:04 +01:00

151 lines
4.6 KiB
Plaintext

[% USE date %]
[% USE HTML %]
<?xml version="1.0" encoding="UTF-8"?>
[% PROCESS common.tt %]
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hydra - [% HTML.escape(title) %]</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="/static/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet" />
<script type="text/javascript" src="/static/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/static/js/bootbox.min.js"></script>
<link rel="stylesheet" href="/static/css/hydra.css" type="text/css" />
<link rel="stylesheet" href="/static/css/tree.css" type="text/css" />
<link rel="stylesheet" href="/static/css/logfile.css" type="text/css" />
<!--
<script type="text/javascript" src="/static/js/tablesorter/jquery.tablesorter.js"></script>
-->
<script type="text/javascript">
$(document).ready(function() {
/*** Tree toggles in logfiles. ***/
/* Set the appearance of the toggle depending on whether the
corresponding subtree is initially shown or hidden. */
$(".tree-toggle").map(function() {
if ($(this).siblings("ul:hidden").length == 0) {
$(this).text("-");
} else {
$(this).text("+");
}
});
/* When a toggle is clicked, show or hide the subtree. */
$(".tree-toggle").click(function() {
if ($(this).siblings("ul:hidden").length != 0) {
$(this).siblings("ul").show();
$(this).text("-");
} else {
$(this).siblings("ul").hide();
$(this).text("+");
}
});
/* Implementation of the expand all link. */
$(".tree-expand-all").click(function() {
$(".tree-toggle", $(this).parent().siblings(".tree")).map(function() {
$(this).siblings("ul").show();
$(this).text("-");
});
});
/* Implementation of the collapse all link. */
$(".tree-collapse-all").click(function() {
$(".tree-toggle", $(this).parent().siblings(".tree")).map(function() {
$(this).siblings("ul").hide();
$(this).text("+");
});
});
$("table.clickable-rows").click(function(event) {
if ($(event.target).closest("a").length) return;
link = $(event.target).parents("tr").find("a.row-link");
if (link.length == 1)
window.location = link.attr("href");
});
});
</script>
[% tracker %]
</head>
<body>
<div class="navbar navbar-fixed-top navbar-inverse">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="[% c.uri_for(c.controller('Root').action_for('index')) %]">
[% IF logo == "" %]
Hydra
[% ELSE %]
<img src="[% logo %]" alt="Hydra Logo" class="logo" />
[% END %]
</a>
<div class="nav-collapse collapse navbar-responsive-collapse">
[% PROCESS topbar.tt %]
</div>
</div>
</div>
</div>
<div class="container">
[% IF flashMsg %]
<br />
<p class="btn-info btn-large">[% flashMsg %]</p>
[% END %]
[% IF errorMsg %]
<br />
<p class="btn-warning btn-large">Error: [% errorMsg %]</p>
[% END %]
[% IF !hideHeader %]
<div class="page-header">
<h1><small>[% HTML.escape(title) %]</small></h1>
</div>
[% ELSE %]
<br />
[% END %]
[% content %]
<footer class="navbar">
<hr />
<small>
<em><a href="http://nixos.org/hydra" target="_new">Hydra</a> [% HTML.escape(version) %] (using [% HTML.escape(nixVersion) %]).</em>
[% IF c.user_exists %]
You are logged in as <tt>[% c.user.username %]</tt>.
[% END %]
</small>
</footer>
</div>
</body>
</html>