Instead of always clearing list and then appending, it's now updated when needed

This commit is contained in:
peteruithoven 2013-10-03 19:08:42 +02:00
parent 5cd5778331
commit a6d35061c2
3 changed files with 37 additions and 17 deletions

5
api/debug_list.php Normal file
View File

@ -0,0 +1,5 @@
{"status":"success","data":[
{"id":"62.216.8.197\/10.0.0.18","0":"62.216.8.197\/10.0.0.18","remoteip":"62.216.8.197","1":"62.216.8.197","localip":"10.0.0.18","2":"10.0.0.18","wifiboxid":"Joopie","3":"Joop","hidden":"0","4":"0","date":"2013-10-03 17:24:33","5":"2013-10-03 17:24:33"},
{"id":"62.216.8.197\/10.0.0.29","0":"62.216.8.197\/10.0.0.29","remoteip":"62.216.8.197","1":"62.216.8.197","localip":"10.0.0.29","2":"10.0.0.29","wifiboxid":"Doodle3D-87354C","3":"Doodle3D-87354C","hidden":"0","4":"0","date":"2013-10-03 17:52:19","5":"2013-10-03 17:52:19"}],
"debug":{"time":1380817181,"hourago":1380813581,"remoteip":"62.216.8.197"}}

View File

@ -17,7 +17,7 @@
<script src="js/libs/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="js/libs/spin.min.js" type="text/javascript"></script>
<script src="js/maixxn.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
</head>
<body>
@ -31,14 +31,7 @@
<div id="settings" class="popup">
<div class="content">
<p id="intro"></p>
<ul id="list">
<li><a href="http://192.168.0.102">Doodle3D-31C2E8</a></li>
<li><a href="http://192.168.0.102">Doodle3D-31C2E8</a></li>
<li><a href="http://192.168.0.102">Doodle3D-31C2E8</a></li>
<li><a href="http://192.168.0.102">Doodle3D-31C2E8</a></li>
<li><a href="http://192.168.0.102">Doodle3D-31C2E8</a></li>
<li><a href="http://192.168.0.102">Doodle3D-31C2E8</a></li>
</ul>
<ul id="list"></ul>
<div id="preloader"></div>
</div>
</div>

View File

@ -46,7 +46,7 @@ function retrieveList() {
//spinner.spin($preloader[0]);
$.ajax({
url: "api/list.php",
url: "api/debug_list.php",
dataType: 'json',
success: function(response){
//console.log("retrieveList response: ",response);
@ -63,9 +63,20 @@ function retrieveList() {
});
}
function updateList(boxes) {
$list.empty();
numBoxesChecking = 0;
numBoxesFound = 0;
// remove displayed, but unlisted boxes
$list.find("a").each(function(index, element) {
var localip = $(element).attr("id");
var wifiboxid = $(element).text();
var found = false;
jQuery.each(boxes, function (index,box) {
if(box.localip == localip && box.wifiboxid == wifiboxid) found = true;
});
if(!found) $(element).parent().remove();
})
jQuery.each(boxes, function (index,box) {
checkBox(box);
});
@ -80,22 +91,33 @@ function checkBox(box) {
success: function(response){
if(response.status == "success") {
numBoxesFound++;
var url = "http://"+box.localip;
if(boxIsListed(url)) return;
$list.append("<li><a href='"+url+"'>"+box.wifiboxid+"</a></li>");
addBox(box);
} else {
removeBox(box);
}
numBoxesChecking--;
updateIntro();
}
}).fail(function() {
numBoxesChecking--;
removeBox(box);
updateIntro();
});
}
function boxIsListed(url){
return $list.find("a[href|='"+url+"']").length > 0;
function addBox(box) {
if(boxExists(box.localip)) return;
var url = "http://"+box.localip;
var element = "<li><a href='"+url+"' id='"+box.localip+"'>"+box.wifiboxid+"</a></li>";
$(element).hide().appendTo($list).fadeIn(500);
}
function boxExists(localip){
return $list.find("a[id|='"+localip+"']").length > 0;
}
function removeBox(box) {
$list.remove("a[id|='"+box.localip+"']");
}
function updateIntro() {
if(numBoxesChecking <= 0) {
if(numBoxesFound > 0) {