Skip to content

D
df-aggregator
Commit 7abcdb6e by Corey Koval
Options

Added Loading Spinner

parent 3a75550e
Showing with 35 additions and 8 deletions
static/style.css
...@@ -119,6 +119,27 @@ span { ...@@ -119,6 +119,27 @@ span {
/* Change the background color of the dropdown button when the dropdown content is shown */ /* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #111;} .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*/ /*Slider Stuff*/
.slidecontainer { .slidecontainer {
......
views/cesium.tpl
...@@ -33,6 +33,7 @@ ...@@ -33,6 +33,7 @@
<link href="/static/menu.css" rel="stylesheet"> <link href="/static/menu.css" rel="stylesheet">
</head> </head>
<body onload="loadRx(createReceivers); loadAoi(createAois);"> <body onload="loadRx(createReceivers); loadAoi(createAois);">
<div id="loader" class="loader"></div>
<div id="cesiumContainer"> <div id="cesiumContainer">
</div> </div>
...@@ -227,14 +228,19 @@ ...@@ -227,14 +228,19 @@
} }
function loadTxCzml() { function loadTxCzml() {
transmittersDataSource.load('/output.czml'); let spinner = document.getElementById("loader");
viewer.dataSources.add(transmittersDataSource); spinner.style.visibility = "visible";
return transmittersDataSource; spinner.style.zIndex = "10";
// let promise1 = Cesium.CzmlDataSource.load('/output.czml'); // transmittersDataSource.load('/output.czml');
// Cesium.when(promise1, function(dataSource1){ // viewer.dataSources.add(transmittersDataSource);
// viewer.dataSources.add(dataSource1); // return transmittersDataSource;
// return dataSource1; 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() { 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