diff --git a/app/node_views/launchTest.html b/app/node_views/launchTest.html
index b3f0cd7..494a326 100644
--- a/app/node_views/launchTest.html
+++ b/app/node_views/launchTest.html
@@ -33,20 +33,32 @@
statusElement.innerHTML = 'Waiting behind ' + (position) + ' other tests';
}
sendPositionInQueueToGA(position);
+
+ // Rotate the spinner
+ document.body.className = 'waiting';
});
socket.on('complete', function() {
statusElement.innerHTML = 'Test complete';
window.location.replace('/results/' + testId);
+
+ // Stop the spinner
+ document.body.className = '';
});
socket.on('failed', function() {
statusElement.innerHTML = 'Test failed';
window.location.replace('/results/' + testId);
+
+ // Stop the spinner
+ document.body.className = '';
});
socket.on('404', function() {
statusElement.innerHTML = 'Test not found';
+
+ // Stop the spinner
+ document.body.className = '';
});
askStatus();
diff --git a/app/public/styles/launchTest.css b/app/public/styles/launchTest.css
index 1359e9e..052e038 100644
--- a/app/public/styles/launchTest.css
+++ b/app/public/styles/launchTest.css
@@ -1,4 +1,18 @@
#status {
margin-top: 2em;
font-size: 2.5em;
+}
+
+@-webkit-keyframes rotating {
+ from { -webkit-transform: rotate(0deg); }
+ to { -webkit-transform: rotate(360deg); }
+}
+@keyframes rotating {
+ from { transform: rotate(0deg); }
+ to { transform: rotate(360deg); }
+}
+
+.waiting .icon-lab {
+ -webkit-animation: rotating 3s linear 0s infinite;
+ animation: rotating 3s linear 0s infinite;
}
\ No newline at end of file
diff --git a/app/public/styles/less/main.less b/app/public/styles/less/main.less
index 82b9d99..8de7a3f 100644
--- a/app/public/styles/less/main.less
+++ b/app/public/styles/less/main.less
@@ -26,6 +26,9 @@ input[type=submit] {
}
h1 span {
+ display: inline-block;
+ height: 1em;
+ width: 1em;
color: #ffa319;
}
diff --git a/app/public/styles/main.css b/app/public/styles/main.css
index 7cc5139..c387576 100644
--- a/app/public/styles/main.css
+++ b/app/public/styles/main.css
@@ -26,6 +26,9 @@ input[type=submit] {
cursor: pointer;
}
h1 span {
+ display: inline-block;
+ height: 1em;
+ width: 1em;
color: #ffa319;
}
.footer {