mdebray/tvl-depot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

* Collapsable trees.

Browse source
This commit is contained in:
Eelco Dolstra 2004-03-18 18:26:22 +00:00
parent c2fc2c13c9
commit 84c617966b
3 changed files with 65 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/log2xml/log2html.xsl
View file

@ -7,6 +7,7 @@
<xsl:template match="logfile"> <xsl:template match="logfile">
<html> <html>
<head> <head>
<script type="text/javascript" src="treebits.js" />
<link rel="stylesheet" href="logfile.css" type="text/css" /> <link rel="stylesheet" href="logfile.css" type="text/css" />
<title>Log File</title> <title>Log File</title>
</head> </head>
@ -23,6 +24,7 @@
</xsl:template> </xsl:template>
<xsl:template match="nest"> <xsl:template match="nest">
<script type='text/javascript'>showTreeToggle("show","hide")</script>
<xsl:apply-templates select='head'/> <xsl:apply-templates select='head'/>
<ul class='nesting'> <ul class='nesting'>
<xsl:for-each select='line|nest'> <xsl:for-each select='line|nest'>

18
src/log2xml/logfile.css
View file

@ -23,7 +23,7 @@ ul.nesting li.line {
} }
ul.nesting li.lastline { ul.nesting li.lastline {
padding-left: 1.2em; padding-left: 1.2em; // for the 0.1em border-left in .lastline > .lineconn
} }
li.line { li.line {
@ -43,15 +43,13 @@ li.lastline > span.lineconn {
} }
em.storeref em.storeref {
{
color: #500000; color: #500000;
position: relative; position: relative;
width: 100%; width: 100%;
} }
em.storeref:hover em.storeref:hover {
{
background-color: #eeeeee; background-color: #eeeeee;
} }
@ -71,3 +69,13 @@ em.storeref:hover
em.storeref:hover span.popup { em.storeref:hover span.popup {
display: inline; display: inline;
} }
.toggle {
text-decoration: none;
}
.showTree, .hideTree {
font-family: monospace;
font-size: larger;
}

50
src/log2xml/treebits.js Normal file
View file

@ -0,0 +1,50 @@
/* Acknowledgement: this is based on the Wikipedia table-of-contents
* toggle. */
var idCounter = 0;
function showTreeToggle(show,hide) {
if (document.getElementById) {
var id = "toggle_" + idCounter;
document.writeln(
'<a href="javascript:toggleTree(\'' + id + '\')" class="toggle" id="' + id + '">' +
'<span class="showTree" style="display: none;">+</span>' +
'<span class="hideTree">-</span>' +
'</a>');
idCounter = idCounter + 1;
}
}
function toggleTree(id) {
var href = document.getElementById(id);
var node = href;
var tree = null;
while (node != null) {
if (node.className == "nesting") tree = node;
node = node.nextSibling;
}
node = href.firstChild;
var hideTree = null;
var showTree = null;
while (node != null) {
if (node.className == "showTree") showTree = node;
else if (node.className == "hideTree") hideTree = node;
node = node.nextSibling;
}
if (tree.style.display == 'none') {
tree.style.display = '';
hideTree.style.display = '';
showTree.style.display = 'none';
} else {
tree.style.display = 'none';
hideTree.style.display = 'none';
showTree.style.display = '';
}
}