Added code to collapse div.
Change-Id: I334edd7eb8149159540b7e12a36f422f8acf6029
diff --git a/services/debug/debug/browse.go b/services/debug/debug/browse.go
index 54695ed..015bdc1 100644
--- a/services/debug/debug/browse.go
+++ b/services/debug/debug/browse.go
@@ -562,7 +562,8 @@
parentDuration := parentEnd.Sub(parentStart).Seconds()
start := int(100 * startTime.Sub(parentStart).Seconds() / parentDuration)
- width := int(100 * endTime.Sub(parentStart).Seconds() / parentDuration) - start
+ end := int(100 * endTime.Sub(parentStart).Seconds() / parentDuration)
+ width := end - start
top := &divTree{
Id: n.Span.Id.String(),
Start: start,
@@ -1022,7 +1023,7 @@
`)
tmplBrowseVtrace = makeTemplate("vtrace",`
{{define ".span"}}
-<div style="position:relative;left:{{.Start}}%;width:{{.Width}}%;margin:0px;padding-top:2px;" id="{{.Id}}">
+<div style="position:relative;left:{{.Start}}%;width:{{.Width}}%;margin:0px;padding-top:2px;" id="div-{{.Id}}">
<!-- Root span -->
<div id="root" title="{{.Name}}" style="position:relative;width:100%;background:{{nextColor}};height:15px;display:block;margin:0px;padding:0px"></div>
{{range $i, $child := .Children}}
@@ -1031,13 +1032,29 @@
</div>
{{end}}
{{define ".collapse-nav"}}
-<div id="{{.Id}}" style="position:relative;left:5px">
-<div style="position:relative;height:15px;font:10pt" >{{len .Children}}</div>
+<div id="tree-{{.Id}}" style="position:relative;left:5px">
+<div style="position:relative;height:15px;font:10pt" onclick='javascript:toggleTrace("{{.Id}}")'>{{len .Children}}</div>
{{range .Children}}
{{template ".collapse-nav" .}}
{{end}}
</div>
{{end}}
+<script language="javascript">
+function toggleTrace(id) {
+ console.log('Calling func on ' + id);
+ var treeRoot = document.getElementById("tree-" + id);
+ var on = treeRoot.closed;
+ treeRoot.closed = !treeRoot.closed;
+ var newSetting = on ? "none" : "block";
+ for (var i = 1; i < treeRoot.children.length; i++) {
+ treeRoot.children[i].style.display = newSetting;
+ }
+ var divRoot = document.getElementById("div-" + id);
+ for (var i = 1; i < divRoot.children.length; i++) {
+ divRoot.children[i].style.display = newSetting;
+ }
+}
+</script>
<section class="section--center mdl-grid">
<h5>Vtrace for {{.Id}}</h5>
<pre>{{.DebugTrace}}</pre>
