Mirror/betaflight
1
0
Fork 0
mirror of https://github.com/betaflight/betaflight.git synced 2025-07-17 13:25:30 +03:00
Code Issues Wiki Activity

add loading indicator between tab switches

Browse source
This commit is contained in:
cTn 2014-07-10 20:09:54 +02:00
parent c1ef5aeead
commit 9fc0fa67cb
5 changed files with 55 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
images/loading.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.7 KiB

1
main.html
View file

@ -18,6 +18,7 @@
<link type="text/css" rel="stylesheet" href="./tabs/cli.css" media="all" />
<link type="text/css" rel="stylesheet" href="./tabs/logging.css" media="all" />
<link type="text/css" rel="stylesheet" href="./tabs/firmware_flasher.css" media="all" />
<link type="text/css" rel="stylesheet" href="./tabs/loading.css" media="all" />
<script type="text/javascript" src="./js/libraries/google-analytics-bundle.js"></script>
<script type="text/javascript" src="./js/libraries/jquery-2.1.1.min.js"></script>

2
main.js
View file

@ -72,6 +72,7 @@ $(document).ready(function() {
// detach listeners and remove element data
$('#content').empty();
$('#content').load("./tabs/loading.html", function() {
switch (tab) {
case 'tab_initial_setup':
tabs.initial_setup.initialize();
@ -107,6 +108,7 @@ $(document).ready(function() {
GUI.tab_switch_in_progress = false;
});
});
}
});

16
tabs/loading.css Normal file
View file

@ -0,0 +1,16 @@
.tab-loading {
width: 100%;
height: 100%;
background-image: url('../images/loading.gif');
background-repeat: no-repeat;
background-position: center;
}
.tab-loading p {
position: relative;
top: calc(50% + 50px);
text-align: center;
font-weight: bold;
}

3
tabs/loading.html Normal file
View file

@ -0,0 +1,3 @@
<div class="tab-loading">
<p>Waiting for data ...</p>
</div>