Hi, i'm tryng to create a bluetooh devices list, that display in real time the devices nearby .
But unfortunatelly when i remove or add a new device to the list, the select animation stop's working.
Does anyone can tell me what im doing wrong? i have tried so many different ways, but i can't find a solution, and in decomentation
Device:
-Samsung gear S3
this is my code:
Html
<div class="ui-page" id="devicesListPage" >
<header class="ui-header my-header" >Dispositivos</header>
<div class="ui-content" >
<ul class="ui-listview ui-snap-listview" id="listDevices" data-role="listview"></ul>
</div>
</div>
Javascript:
// i use this function do start, remove and add items to the list
createDeviceList = function (device,remove) {
var page = document.querySelector('#devicesListPage'),
list = document.getElementById("listDevices"),
aux = list.getElementsByTagName("li"),
boolAux = true;
// auxilairPageDevices => global variabel of type bool to see if the page was launched previously
if (auxilairPageDevices) {
page.addEventListener("pagebeforeshow", function() {
var snapListComponent = tau.widget.SnapListview(list);
});
}
// searches for the <li> component to see if its requeired to remove any item
for (var i = 0; i < aux.length; i++) {
// this if checks if the item already exists, if exists and var remove is true it will delete, if remove is not true it means that the device is already on the list
if(aux[i].getAttribute('address') == device.address){
boolAux = false;
if (remove === true) {
list.removeChild(aux[i]);
var snapListComponent = tau.widget.SnapListview(list);
snapListComponent.refresh()
}
break;
}
}
// if in the previous for cicle the device wasn't found in the list, it will add now
if (boolAux) {
list.innerHTML+='<li address="'+device.address+'" onclick="connectDevices()"> <div class="ui-marquee">'+ device.name +'</div></li>';
var snapListComponent = tau.widget.SnapListview(list);
snapListComponent.refresh()
}
if(auxilairPageDevices){
tau.changePage(page);
auxilairPageDevices = false;
}
}