Commit 7abcdb6e by Corey Koval

Added Loading Spinner

parent 3a75550e
......@@ -119,6 +119,27 @@ span {
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #111;}
.loader {
border: 22px solid #e9e9e9; /* Light grey */
border-top: 22px solid #101010; /* Dark Grey */
border-radius: 50%;
width: 160px;
height: 160px;
animation: spin 1s linear infinite;
position: absolute;
top: 50%;
left: 50%;
margin-top: -91px;
margin-left: -91px;
z-index: 0;
visibility: hidden;
opacity: 0.7;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/*Slider Stuff*/
.slidecontainer {
......
......@@ -33,6 +33,7 @@
<link href="/static/menu.css" rel="stylesheet">
</head>
<body onload="loadRx(createReceivers); loadAoi(createAois);">
<div id="loader" class="loader"></div>
<div id="cesiumContainer">
</div>
......@@ -227,14 +228,19 @@
}
function loadTxCzml() {
transmittersDataSource.load('/output.czml');
viewer.dataSources.add(transmittersDataSource);
return transmittersDataSource;
// let promise1 = Cesium.CzmlDataSource.load('/output.czml');
// Cesium.when(promise1, function(dataSource1){
// viewer.dataSources.add(dataSource1);
// return dataSource1;
// });
let spinner = document.getElementById("loader");
spinner.style.visibility = "visible";
spinner.style.zIndex = "10";
// transmittersDataSource.load('/output.czml');
// viewer.dataSources.add(transmittersDataSource);
// return transmittersDataSource;
let promise1 = Cesium.CzmlDataSource.load('/output.czml');
Cesium.when(promise1, function(dataSource1){
viewer.dataSources.add(dataSource1);
spinner.style.visibility = "hidden";
spinner.style.zIndex = "0";
return dataSource1;
});
}
function loadRxCzml() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment