69 lines
2.1 KiB
HTML
69 lines
2.1 KiB
HTML
<html>
|
|
<body>
|
|
<input type="text" size="20" id="websocket" placeholde="websocket url" value="wss://cloudvars.br0tkasten.de">
|
|
<input type="text" size="20" id="projectID" placeholder="project_id" value="p4-@cloud.sb3">
|
|
<button id="read" name="read">read</button>
|
|
|
|
<ul id="data"></ul>
|
|
<script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
|
|
<script>
|
|
let socket;
|
|
let projectID;
|
|
|
|
$("#read").click(function() {
|
|
$("#data").empty();
|
|
projectID = $("#projectID").val();
|
|
socket = new WebSocket($("#websocket").val());
|
|
|
|
socket.onopen = function(e) {
|
|
console.log("connection established");
|
|
socket.send(JSON.stringify({
|
|
method: "handshake",
|
|
project_id: projectID,
|
|
user: "testClient"+Math.random()
|
|
}));
|
|
};
|
|
|
|
function setVariable(name, value) {
|
|
console.log(`Setting variable: ${name} = ${value}`);
|
|
socket.send(JSON.stringify({
|
|
method: "set",
|
|
// project_id: projectID,
|
|
name,
|
|
value
|
|
}));
|
|
};
|
|
|
|
socket.onmessage = function(event) {
|
|
console.log(event.data);
|
|
for (const message of event.data.split("\n")) {
|
|
console.log(`${message}`);
|
|
const obj = JSON.parse(message);
|
|
if (obj.method === "set") {
|
|
obj_id = obj.name.replace(/[^0-9A-Za-z]/g,'_');
|
|
|
|
console.log(obj_id + ":" + $(`#${obj_id}`).length)
|
|
if($(`#${obj_id}`).length > 0) {
|
|
$(`#${obj_id}`).html(`<b>${obj.name}:</b> ${obj.value}`);
|
|
} else {
|
|
$('#data').append(`<li id="${obj_id}"><b/>${obj.name}:</b>${obj.value}</li>`);
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
socket.onclose = function(event) {
|
|
if (event.wasClean) {
|
|
console.log(`connection closed cleanly, code=${event.code} reason=${event.reason}`);
|
|
} else {
|
|
console.log('connection died');
|
|
}
|
|
};
|
|
|
|
socket.onerror = function(error) {
|
|
console.log(`[error] ${error.data}`);
|
|
};
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |