go.tools/cmd/cover: add floating bar with file selector and legend

R=golang-dev, r
CC=golang-dev
https://golang.org/cl/11076043
This commit is contained in:
Andrew Gerrand 2013-07-10 13:22:04 +10:00
parent b8f13c4c9b
commit c659fcb7c8
1 changed files with 34 additions and 20 deletions

View File

@ -2,7 +2,6 @@
// Use of this source code is governed by a BSD-style // Use of this source code is governed by a BSD-style
// license that can be found in the LICENSE file. // license that can be found in the LICENSE file.
// TODO(adg): floating nav bar + legend
// TODO(adg): set-specific legend // TODO(adg): set-specific legend
package main package main
@ -329,34 +328,46 @@ const tmplHTML = `
background: black; background: black;
color: rgb(80, 80, 80); color: rgb(80, 80, 80);
} }
#legend { body, pre, #legend span {
margin: 20px 0; font-family: Menlo, monospace;
font-weight: bold;
} }
#legend .box { #topbar {
display: inline; background: black;
padding: 10px; position: fixed;
border: 1px solid white; top: 0; left: 0; right: 0;
height: 42px;
border-bottom: 1px solid rgb(80, 80, 80);
}
#content {
margin-top: 50px;
}
#nav, #legend {
float: left;
margin-left: 10px;
}
#legend {
margin-top: 12px;
}
#nav {
margin-top: 10px;
} }
#legend span { #legend span {
margin: 0 5px; margin: 0 5px;
} }
pre, #legend span {
font-family: Menlo, monospace;
font-weight: bold;
}
{{colors}} {{colors}}
</style> </style>
</head> </head>
<body> <body>
<div id="nav"> <div id="topbar">
<select id="files"> <div id="nav">
{{range $i, $f := .Files}} <select id="files">
<option value="file{{$i}}">{{$f.Name}}</option> {{range $i, $f := .Files}}
{{end}} <option value="file{{$i}}">{{$f.Name}}</option>
</select> {{end}}
</div> </select>
<div id="legend"> </div>
<div class="box"> <div id="legend">
<span>not tracked</span> <span>not tracked</span>
<span class="cov0">no coverage</span> <span class="cov0">no coverage</span>
<span class="cov1">low coverage</span> <span class="cov1">low coverage</span>
@ -371,9 +382,11 @@ const tmplHTML = `
<span class="cov10">high coverage</span> <span class="cov10">high coverage</span>
</div> </div>
</div> </div>
<div id="content">
{{range $i, $f := .Files}} {{range $i, $f := .Files}}
<pre class="file" id="file{{$i}}" {{if $i}}style="display: none"{{end}}>{{$f.Body}}</pre> <pre class="file" id="file{{$i}}" {{if $i}}style="display: none"{{end}}>{{$f.Body}}</pre>
{{end}} {{end}}
</div>
</body> </body>
<script> <script>
(function() { (function() {
@ -384,6 +397,7 @@ const tmplHTML = `
visible.style.display = 'none'; visible.style.display = 'none';
visible = document.getElementById(files.value); visible = document.getElementById(files.value);
visible.style.display = 'block'; visible.style.display = 'block';
window.scrollTo(0, 0);
} }
})(); })();
</script> </script>