178 lines
6.3 KiB
JavaScript
178 lines
6.3 KiB
JavaScript
|
var scanInterval = 3000;
|
||
|
|
// Bouttons de commande
|
||
|
|
addEventListener("DOMContentLoaded", function() {
|
||
|
|
sendCmd("/scan");
|
||
|
|
sendCmd("/browse");
|
||
|
|
sendCmd("/all/rssi");
|
||
|
|
// Tous les elements avec la classe ".command"
|
||
|
|
var commandButtons = document.querySelectorAll(".command");
|
||
|
|
for (var i=0, l=commandButtons.length; i<l; i++) {
|
||
|
|
var button = commandButtons[i];
|
||
|
|
// Sur un click
|
||
|
|
button.addEventListener("click", function(event) {
|
||
|
|
// On intercepte le signal
|
||
|
|
event.preventDefault();
|
||
|
|
// On recupere la valeur de value="" sur le bouton
|
||
|
|
var clickedButton = event.currentTarget;
|
||
|
|
var command = clickedButton.value;
|
||
|
|
if (( command == "/10.42.0.135/reboot" ) || ( command == "/10.42.0.135/poweroff" )) {
|
||
|
|
if ( !confirm("Êtes vous certain de vouloir effectuer cette action ?") ) {
|
||
|
|
return 0;
|
||
|
|
}
|
||
|
|
} else if ( command == "/scan" ) {
|
||
|
|
document.getElementById("status_all").innerHTML = "Searching network for live hosts...";
|
||
|
|
} else if ( command.indexOf("/sort") > -1 ){
|
||
|
|
if (command.indexOf('/1/') > -1 ) {
|
||
|
|
clickedButton.value = clickedButton.value.replace('/1/','/0/')
|
||
|
|
} else {
|
||
|
|
clickedButton.value = clickedButton.value.replace('/0/','/1/')
|
||
|
|
}
|
||
|
|
} else if ( command.indexOf("/move") > -1 ) {
|
||
|
|
const test_array = [5,6,7,8];
|
||
|
|
for (i=test_array.length, l=0;i>l;i--){
|
||
|
|
console.log(test_array[i-1]);
|
||
|
|
sendCmd("/all/move/" + test_array[i-1] + "/1");
|
||
|
|
|
||
|
|
};
|
||
|
|
//setInterval( sendCmd, scanInterval, "/all/move/16/1");
|
||
|
|
};
|
||
|
|
|
||
|
|
// On envoie la commande en AJAX
|
||
|
|
var request = new XMLHttpRequest();
|
||
|
|
if ( command == "/scan" ) {
|
||
|
|
request.onload = refreshInfos(command);
|
||
|
|
}
|
||
|
|
// On construit la commande
|
||
|
|
request.open("GET", command, true);
|
||
|
|
// et on l'envoie
|
||
|
|
request.send();
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}, true);
|
||
|
|
|
||
|
|
// Affichage des infos
|
||
|
|
function parseResult(command, infos_array) {
|
||
|
|
//~ var request = new XMLHttpRequest();
|
||
|
|
//~ request.onload = function() {
|
||
|
|
//~ if (request.readyState === request.DONE) {
|
||
|
|
//~ if (request.status === 200) {
|
||
|
|
//~ // responseText is a string, use parse to get an array.
|
||
|
|
//~ const infos_array = JSON.parse(request.responseText);
|
||
|
|
switch (command) {
|
||
|
|
case "/all/status":
|
||
|
|
// Iterate over array
|
||
|
|
for (var i = 0, l=infos_array.length; i<l; i++) {
|
||
|
|
document.getElementById("status_"+infos_array[i].host).innerHTML = "Playing " + infos_array[i].file + " : " + infos_array[i].time + " / " + infos_array[i].leng;
|
||
|
|
if (infos_array[i].loop == "true") { document.getElementById("loop_ind_" + infos_array[i].host).style.backgroundColor = "#0f0"} else {document.getElementById("loop_ind_" + infos_array[i].host).style.backgroundColor = "#f00"};
|
||
|
|
if (infos_array[i].repeat == "true") { document.getElementById("repeat_ind_" + infos_array[i].host).style.backgroundColor = "#0f0"} else {document.getElementById("repeat_ind_" + infos_array[i].host).style.backgroundColor = "#f00"};
|
||
|
|
};
|
||
|
|
break;
|
||
|
|
case "/all/list":
|
||
|
|
for (var i = 0, l=infos_array.length; i<l; i++) {
|
||
|
|
document.getElementById("playlist_"+infos_array[i].host).innerHTML = infos_array[i].leng + " item(s) in playlist - " + infos_array[i].duration;
|
||
|
|
var items_array = Array.from(infos_array[i].items);
|
||
|
|
var html_table = "<table>" +
|
||
|
|
"<tr>" +
|
||
|
|
"<th>Id</th>" +
|
||
|
|
"<th>Filename</th>" +
|
||
|
|
"<th>Duration</th>" +
|
||
|
|
"</tr>";
|
||
|
|
for (var j = 0, k=items_array.length; j<k; j++) {
|
||
|
|
item_meta = items_array[j].split(';');
|
||
|
|
html_table += "<tr>" +
|
||
|
|
"<td>" + item_meta[0] + "</td>" +
|
||
|
|
"<td>" + item_meta[1] + "</td>" +
|
||
|
|
"<td>" + item_meta[2] + "</td>" +
|
||
|
|
"</tr>" ;
|
||
|
|
}
|
||
|
|
html_table += "</table>";
|
||
|
|
document.getElementById("playlist_"+infos_array[i].host).innerHTML += html_table;
|
||
|
|
};
|
||
|
|
break;
|
||
|
|
case "/scan":
|
||
|
|
var host_up = infos_array[0];
|
||
|
|
var host_down = infos_array[1];
|
||
|
|
for ( var i=0, l=host_up.length; i<l; i++){
|
||
|
|
document.getElementById(host_up[i]).style.display = 'initial';
|
||
|
|
}
|
||
|
|
for ( var i=0, l=host_down.length; i<l; i++){
|
||
|
|
document.getElementById(host_down[i]).style.display = 'none';
|
||
|
|
}
|
||
|
|
//~ if (host_up.length) {
|
||
|
|
//~ scanInterval = 10000;
|
||
|
|
//~ document.getElementById("status_all").innerHTML = "Scan intarvel set to " + scanInterval;
|
||
|
|
//~ }
|
||
|
|
document.getElementById("status_all").innerHTML = host_up.length + " client(s) found.";
|
||
|
|
break;
|
||
|
|
case "/browse":
|
||
|
|
var html_table = "<table>" +
|
||
|
|
"<tr>" +
|
||
|
|
"<th>Filename</th>" +
|
||
|
|
"<th>Duration</th>" +
|
||
|
|
"</tr>";
|
||
|
|
for (var j = 0, k=infos_array.length; j<k; j++) {
|
||
|
|
html_table += "<tr>" +
|
||
|
|
"<td>" + infos_array[j] + "</td>" +
|
||
|
|
"<td>" + "00:00" + "</td>" +
|
||
|
|
"</tr>" ;
|
||
|
|
}
|
||
|
|
html_table += "</table>";
|
||
|
|
document.getElementById("filelist").innerHTML += html_table;
|
||
|
|
break;
|
||
|
|
case "/all/rssi":
|
||
|
|
var signal_color = 40;
|
||
|
|
var best_rssi = 30;
|
||
|
|
var worst_rssi = 70;
|
||
|
|
for (var j = 0, k=infos_array.length; j<k; j++) {
|
||
|
|
var rssi_norm = Math.ceil( (worst_rssi - parseInt(infos_array[j].rssi) ) / ( worst_rssi - best_rssi ) * 4 );
|
||
|
|
signal_color = (rssi_norm-1) * signal_color;
|
||
|
|
// Reset to grey
|
||
|
|
for (i=0, l=4; i<l;i++) {
|
||
|
|
document.getElementById("wl_"+i).style.backgroundColor = "hsl(0, 0%, 65%)";
|
||
|
|
};
|
||
|
|
// Color it
|
||
|
|
for (i=0, l=rssi_norm; i<l;i++) {
|
||
|
|
document.getElementById("wl_"+i).style.backgroundColor = "hsl(" + signal_color + ", 100%, 50%)";
|
||
|
|
};
|
||
|
|
};
|
||
|
|
break;
|
||
|
|
}; // End switch case
|
||
|
|
//~ };
|
||
|
|
//~ };
|
||
|
|
//~ };
|
||
|
|
//~ // On construit la commande
|
||
|
|
//~ request.open("GET", command, true);
|
||
|
|
//~ // et on l'envoie
|
||
|
|
//~ request.send();
|
||
|
|
};
|
||
|
|
|
||
|
|
function sendCmd(command) {
|
||
|
|
var request = new XMLHttpRequest();
|
||
|
|
request.onload = function() {
|
||
|
|
if (request.readyState === request.DONE) {
|
||
|
|
if (request.status === 200) {
|
||
|
|
// responseText is a string, use parse to get an array.
|
||
|
|
var infos_array = JSON.parse(request.responseText);
|
||
|
|
//console.log(infos_array);
|
||
|
|
parseResult(command, infos_array);
|
||
|
|
//return infos_array;
|
||
|
|
};
|
||
|
|
};
|
||
|
|
};
|
||
|
|
// On construit la commande
|
||
|
|
request.open("GET", command, true);
|
||
|
|
// et on l'envoie
|
||
|
|
request.send();
|
||
|
|
};
|
||
|
|
setInterval( sendCmd, 500, "/all/status");
|
||
|
|
setInterval( sendCmd, 1000, "/all/list");
|
||
|
|
setInterval( sendCmd, scanInterval, "/scan");
|
||
|
|
setInterval( sendCmd, 10000, "/all/rssi");
|
||
|
|
|
||
|
|
|
||
|
|
/* TODO :
|
||
|
|
* Change scanInterval after first results are in (3 to 30 seconds)
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
|