sem/5g_drone_ROS2
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

move websockets to html

Browse Source
This commit is contained in:
Sem van der Hoeven
2023-05-31 20:30:24 +02:00
parent 2839e0cfcf
commit 209828d35a
2 changed files with 73 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
api/index.js
View File

@@ -88,7 +88,6 @@ var connect_to_api = function () {
}
} catch (error) {
console.log("could not parse as json, must be bytes");
logSizeInBytes("image", message.data);
}
});

75
api/views/index.ejs
View File

@@ -114,8 +114,7 @@
xhr.send();
}
function send_move_request(data)
{
function send_move_request(data) {
var xhr = new XMLHttpRequest();
xhr.open("POST", "/move", true);
xhr.setRequestHeader("Content-Type", "application/json");
@@ -184,30 +183,60 @@
}
function connect() {
var received = false;
var xhr = new XMLHttpRequest();
xhr.open("GET", "/connect", true);
xhr.onreadystatechange = function () {
if (this.status == 200) {
console.log(this.responseText);
if (this.responseText.length > 0) {
var status = JSON.parse(this.responseText);
// console.log(status)
document.getElementById("connectedlabel").innerHTML = "Connected: true";
document.getElementById("connectbutton").disabled = true;
}
console.log("Connecting to API");
var ws = new WebSocket("ws://10.100.0.40:9001/");
ws.on("open", function open() {
console.log("connected with websockets to API!");
});
ws.on("message", function message(message) {
try {
var msg = JSON.parse(message);
if (msg.type != "IMAGE") {
send_events_to_clients(msg);
} else {
console.log("error");
document.getElementById("connectedlabel").innerHTML = "Connected: false";
if (!received)
{
alert("Could not connect to API!");
received = true;
console.log("got image");
}
} catch (error) {
console.log("could not parse as json, must be bytes");
}
}
};
xhr.send();
});
ws.on("error", function error(err) {
console.log("there was an error");
console.error("error: " + err);
received_error = true;
});
// var received = false;
// var xhr = new XMLHttpRequest();
// xhr.open("GET", "/connect", true);
// xhr.onreadystatechange = function () {
// if (this.status == 200) {
// console.log(this.responseText);
// if (this.responseText.length > 0) {
// var status = JSON.parse(this.responseText);
// // console.log(status)
// document.getElementById("connectedlabel").innerHTML = "Connected: true";
// document.getElementById("connectbutton").disabled = true;
// }
// } else {
// console.log("error");
// document.getElementById("connectedlabel").innerHTML = "Connected: false";
// if (!received)
// {
// alert("Could not connect to API!");
// received = true;
// }
// }
// };
// xhr.send();
}
// window onload function die elke seconde een request doet om te kijken of er al nieuwe foto is
// function die elke 100 ms een request doet om de status te updaten