mirror of
https://github.com/denoland/deno.git
synced 2024-12-23 07:44:48 -05:00
Fix anchor links and add spinner to the benchmarks page (#2205)
This commit is contained in:
parent
e725b26b28
commit
098d6fffab
3 changed files with 52 additions and 3 deletions
|
@ -194,7 +194,7 @@ export function drawCharts(dataUrl) {
|
||||||
if (window["location"]["hostname"] != "deno.github.io") {
|
if (window["location"]["hostname"] != "deno.github.io") {
|
||||||
dataUrl = "https://denoland.github.io/deno/" + dataUrl;
|
dataUrl = "https://denoland.github.io/deno/" + dataUrl;
|
||||||
}
|
}
|
||||||
drawChartsFromBenchmarkData(dataUrl);
|
return drawChartsFromBenchmarkData(dataUrl);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -9,6 +9,9 @@
|
||||||
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div id="spinner-overlay">
|
||||||
|
<div class="spinner"></div>`
|
||||||
|
</div>
|
||||||
<main>
|
<main>
|
||||||
<a href="/"><img src="images/deno_logo_3.svg" width=200></a>
|
<a href="/"><img src="images/deno_logo_3.svg" width=200></a>
|
||||||
<h1>Deno Continuous Benchmarks</h1>
|
<h1>Deno Continuous Benchmarks</h1>
|
||||||
|
@ -153,10 +156,26 @@
|
||||||
<script type="module">
|
<script type="module">
|
||||||
import { drawCharts } from "./app.js";
|
import { drawCharts } from "./app.js";
|
||||||
window.chartWidth = 800;
|
window.chartWidth = 800;
|
||||||
|
const overlay = document.getElementById("spinner-overlay")
|
||||||
|
|
||||||
let u = window.location.hash.match("all") ? "./data.json" : "recent.json";
|
function showSpinner () {
|
||||||
|
overlay.style.display = "block";
|
||||||
|
}
|
||||||
|
|
||||||
drawCharts(u);
|
function hideSpinner () {
|
||||||
|
overlay.style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateCharts () {
|
||||||
|
const u = window.location.hash.match("all") ? "./data.json" : "recent.json";
|
||||||
|
|
||||||
|
showSpinner()
|
||||||
|
|
||||||
|
drawCharts(u).finally(hideSpinner)
|
||||||
|
}
|
||||||
|
updateCharts()
|
||||||
|
|
||||||
|
window.onhashchange = updateCharts
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -101,3 +101,33 @@ code {
|
||||||
.hljs {
|
.hljs {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#spinner-overlay {
|
||||||
|
display: none;
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spinner {
|
||||||
|
to {transform: rotate(360deg);}
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner:before {
|
||||||
|
content: '';
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
margin-top: -10px;
|
||||||
|
margin-left: -10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 2px solid #ccc;
|
||||||
|
border-top-color: #000;
|
||||||
|
animation: spinner .6s linear infinite;
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue