//////////////////
/// Connection
//////////////////
var socket = io.connect({
// transports: ['websocket'],
path: "/web/socket",
});
socket.on('connect', function() {
console.log('Connected to server');
});
socket.on('disconnect', function() {
console.log('Disconnected from server');
});
socket.on('error', function(e) {
console.log(e);
});
socket.on('timestamp', function(server_unix_time) {
//console.log(server_unix_time)
var diff = difftime(server_unix_time)
$('[data-status=timestamp-diff]').text(diff)
// console.log(diff)
});
///////////////////////
/// Logfile stream
///////////////////////
var ansi_up = new AnsiUp;
socket.on("new-lines", function(lines) {
//console.log(lines)
lines.forEach(function(line){
$("#stream-output").prepend(
'
'+ansi_up.ansi_to_html(line)+'
'
);
})
});
//////////////////
/// RTC status
//////////////////
socket.on("rtc-status", function(data) {
$('[data-status="ref_cx"]').text(data.cred.cx.toFixed(2))
$('[data-status="ref_cy"]').text(data.cred.cy.toFixed(2))
$('[data-status="current_cx"]').text(data.cloud.cx.toFixed(2))
$('[data-status="current_cy"]').text(data.cloud.cy.toFixed(2))
$("#image-skp_cmd-dm").text(data.dm.skp_cmd)
$("#image-cloud_samples-cloud").text(data.cloud.cloud_samples)
console.log(data.cred.data[40])
/// In drawings.js
draw_image(data.cred, "cred") // cred image
draw_image(data.gain, "cred", true ) // mask true
draw_centroid(data.cred, "cred", "red") // red dot
draw_circle(data.cloud, "cred", "red", 1) // red circle
draw_dm(data.dm, "dm", false)
draw_dm(data.dm, "dm2", true)
draw_image(data.cloud, "cloud")
/// Draw a circle corresponding to the center of rotation.
/// "data" is a dummy array.
/// "cx" and "cy" are the normalized coordinates
//var center_of_rotation = {data:[1,2,3], cx:+0.28, cy:-0.11}
var center_of_rotation = {data:[1,2,3], cx:+0.16, cy:+0.04}
draw_circle(center_of_rotation, "cred", "white", 0.2) // red circle
});
////////////////////
/// JSON status
////////////////////
socket.on("json-status", function(data) {
/// General
$.each(data, function(key,status){
$('[data-status="'+key+'"]').text(status.value)
});
/// devices part (devices.js)
update_devices(data)
/// SYNOPTIC part (synoptic.js)
update_synoptic(data)
});
///////////////////////
/// Pulse on changes
///////////////////////
function pulse(selector) {
// var done = "bg-success"
// var delay = 200
selector.fadeTo('slow', 0.5, function() {
selector.fadeTo('slow', 1.0) //.removeClass(done);
});
// setTimeout(function() {
// selector.removeClass(done);
// }, delay);
}
$(document).ready(function(){
// Select all elements with data-status attribute
const elements = document.querySelectorAll('[data-status]');
// Object to store previous text content of each element
const previousTextContent = {};
// Function to monitor text changes
function observeChanges(element) {
const observer = new MutationObserver(mutationsList => {
for (let mutation of mutationsList) {
if (mutation.type === 'childList') {
const previousText = previousTextContent[element.getAttribute('data-status')];
const currentText = element.textContent.trim();
if (previousText !== currentText) {
pulse($(element))
previousTextContent[element.getAttribute('data-status')] = currentText;
}
}
}
});
observer.observe(element, { subtree: true, childList: true });
}
// Apply observeChanges function to each element
elements.forEach(element => {
previousTextContent[element.getAttribute('data-status')] = element.textContent.trim();
observeChanges(element);
});
});