Newer
Older
//////////////////
/// 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)
///////////////////////
/// Logfile stream
///////////////////////
var ansi_up = new AnsiUp;
socket.on("new-lines", function(lines) {
//console.log(lines)
lines.forEach(function(line){
$("#stream-output").prepend(
'<div>'+ansi_up.ansi_to_html(line)+'</div>'
);
})
});
//////////////////
/// 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)
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
});
///////////////////////
/// 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);
});