connected clients list now works correctly with all pages

This commit is contained in:
Ziad-I
2024-07-31 17:18:08 +03:00
committed by Dion Moult
parent 0e40df4fa3
commit 385d9b9df7
6 changed files with 111 additions and 49 deletions
@@ -44,6 +44,7 @@ class WebNamespace(socketio.AsyncNamespace):
async def on_connect(self, sid, environ):
print(f"Web client connected: {sid}")
if blender_messages:
await sio.emit("connected_clients", list(blender_messages.keys()), namespace="/web", room=sid)
await self.send_cached_messages(sid)
async def on_disconnect(self, sid):
@@ -108,7 +109,7 @@ class BlenderNamespace(socketio.AsyncNamespace):
await sio.emit("gantt_data", {"blenderId": sid, "data": data}, namespace="/web")
async def on_drawings_data(self, sid, data):
print(f"Drawings directory from Blender client {sid}")
print(f"Drawings data from Blender client {sid}")
print(data)
blender_messages[sid]["drwings_data"] = data
await sio.emit("drawings_data", {"blenderId": sid, "data": data}, namespace="/web")
@@ -127,7 +127,7 @@ nav ul li a.active {
overflow-y: auto;
overflow: hidden;
transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
border: 1px solid var(--table-border-color);
border: 1px solid var(--border-color);
background-color: var(--nav-bg-color);
z-index: 1;
opacity: 0;
@@ -146,7 +146,7 @@ nav ul li a.active {
.client {
padding: var(--margin-small);
border-bottom: 1px solid var(--table-border-color);
border-bottom: 1px solid var(--border-color);
cursor: pointer;
}
@@ -166,7 +166,7 @@ nav ul li a.active {
}
.client-detail {
border-bottom: 1px solid var(--table-border-color);
border-bottom: 1px solid var(--border-color);
padding: var(--padding-small);
}
@@ -157,7 +157,7 @@ nav ul li a.active {
overflow-y: auto;
overflow: hidden;
transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
border: 1px solid var(--table-border-color);
border: 1px solid var(--details-border-color);
background-color: var(--nav-bg-color);
z-index: 1;
opacity: 0;
@@ -176,7 +176,7 @@ nav ul li a.active {
.client {
padding: var(--margin-small);
border-bottom: 1px solid var(--table-border-color);
border-bottom: 1px solid var(--details-border-color);
cursor: pointer;
}
@@ -196,7 +196,7 @@ nav ul li a.active {
}
.client-detail {
border-bottom: 1px solid var(--table-border-color);
border-bottom: 1px solid var(--details-border-color);
padding: var(--padding-small);
}
@@ -30,9 +30,9 @@ function connectSocket() {
socket.on("blender_connect", handleBlenderConnect);
socket.on("blender_disconnect", handleBlenderDisconnect);
socket.on("connect", handleWebConnect);
socket.on("connected_clients", handleConnectedClients);
socket.on("drawings_data", handleDrawingsData);
socket.on("svg_data", handleSvgData);
// socket.on("default_data", handleDefaultData);
}
// function used to get drawings data from blenderbim
@@ -53,8 +53,22 @@ function handleBlenderConnect(blenderId) {
connectedClients[blenderId] = {
shown: false,
ifc_file: "",
has_drawings: false,
};
}
$("#blender-count").text(function (i, text) {
return parseInt(text, 10) + 1;
});
const msg = {
blenderId: blenderId,
sourcePage: "drawings",
operator: {
type: "getDrawings",
},
};
socket.emit("web_operator", msg);
}
// Function to handle 'blender_disconnect' event
@@ -70,6 +84,18 @@ function handleBlenderDisconnect(blenderId) {
});
}
function handleConnectedClients(data) {
$("#blender-count").text(data.length);
console.log(data);
data.forEach(function (id) {
connectedClients[id] = {
shown: false,
ifc_file: "",
has_drawings: false,
};
});
}
function handleDrawingsData(data) {
const blenderId = data["blenderId"];
@@ -81,6 +107,8 @@ function handleDrawingsData(data) {
allDrawings[filename] = { drawings: drawings, sheets: sheets };
const hasDrawings = drawings.length > 0 || sheets.length > 0;
console.log(connectedClients);
if (connectedClients.hasOwnProperty(blenderId)) {
@@ -88,6 +116,7 @@ function handleDrawingsData(data) {
connectedClients[blenderId] = {
shown: true,
ifc_file: filename,
has_drawings: hasDrawings,
};
addSelectOption(blenderId, filename);
} else {
@@ -97,6 +126,7 @@ function handleDrawingsData(data) {
connectedClients[blenderId] = {
shown: true,
ifc_file: filename,
has_drawings: hasDrawings,
};
addSelectOption(blenderId, filename);
}
@@ -208,15 +238,18 @@ function toggleClientList() {
}
clientList.empty();
var counter = 0;
$.each(connectedClients, function (id, client) {
if (!client.shown) return;
counter++;
const dropdownIcon = $("<i>")
.addClass("fas fa-chevron-down")
.css("margin-left", "0.5rem");
const clientDiv = $("<div>").addClass("client").text(client.ifc_file);
const clientDiv = $("<div>")
.addClass("client")
.text(client.ifc_file || "Blender " + counter);
clientDiv.append(dropdownIcon);
@@ -229,26 +262,19 @@ function toggleClientList() {
clientDetailsDiv.append(clientId);
}
if (client.headers && client.headers.length) {
const clientHeaders = $("<div>")
if (!client.has_drawings) {
const clientShown = $("<div>")
.addClass("client-detail")
.text(`Table Headers: ${client.headers.join(", ")}`);
const scrollButton = $("<button>")
.addClass("scroll-button")
.text("Scroll to Table")
.on("click", function () {
$("html, body").animate(
{
scrollTop: $("#table-" + id).offset().top,
},
600
);
clientList.removeClass("show");
});
clientDetailsDiv.append(clientHeaders);
clientDetailsDiv.append(scrollButton);
.text("No drawings exist for this IFC File yet");
clientDetailsDiv.append(clientShown);
} else {
const clientNumbers = $("<div>")
.addClass("client-detail")
.text(
`${allDrawings[client.ifc_file].drawings.length} Drawing(s),
${allDrawings[client.ifc_file].sheets.length} Sheet(s)`
);
clientDetailsDiv.append(clientNumbers);
}
clientDiv.append(clientDetailsDiv);
@@ -37,6 +37,7 @@ function connectSocket() {
// Register socket event handlers
socket.on("blender_connect", handleBlenderConnect);
socket.on("blender_disconnect", handleBlenderDisconnect);
socket.on("connected_clients", handleConnectedClients);
socket.on("gantt_data", handleGanttData);
socket.on("default_data", handleDefaultData);
}
@@ -51,6 +52,10 @@ function handleBlenderConnect(blenderId) {
ganttTasks: {},
};
}
$("#blender-count").text(function (i, text) {
return parseInt(text, 10) + 1;
});
}
// Function to handle 'blender_disconnect' event
@@ -66,6 +71,18 @@ function handleBlenderDisconnect(blenderId) {
});
}
function handleConnectedClients(data) {
$("#blender-count").text(data.length);
console.log(data);
data.forEach(function (id) {
connectedClients[id] = {
shown: false,
workSchedule: {},
ganttTasks: {},
};
});
}
// Function to handle 'gantt_data' event
function handleGanttData(data) {
const blenderId = data["blenderId"];
@@ -75,7 +92,6 @@ function handleGanttData(data) {
const filename = data["data"]["ifc_file"];
const ganttTasks = data["data"]["gantt_data"]["tasks"];
const ganttWorkSched = data["data"]["gantt_data"]["work_schedule"];
// const ganttWorkSched = {};
if (connectedClients.hasOwnProperty(blenderId)) {
if (!connectedClients[blenderId].shown) {
@@ -111,10 +127,6 @@ function handleDefaultData(data) {
// Function to add a new gantt with data and filename
function addGanttElement(blenderId, tasks, workSched, filename) {
$("#blender-count").text(function (i, text) {
return parseInt(text, 10) + 1;
});
const ganttContainer = $("<div></div>")
.addClass("gantt-container")
.attr("id", "container-" + blenderId);
@@ -402,15 +414,17 @@ function toggleClientList() {
}
clientList.empty();
var counter = 0;
$.each(connectedClients, function (id, client) {
if (!client.shown) return;
counter++;
const dropdownIcon = $("<i>")
.addClass("fas fa-chevron-down")
.css("margin-left", "0.5rem");
const clientDiv = $("<div>").addClass("client").text(client.ifc_file);
const clientDiv = $("<div>")
.addClass("client")
.text(client.ifc_file || "Blender " + counter);
clientDiv.append(dropdownIcon);
@@ -423,6 +437,13 @@ function toggleClientList() {
clientDetailsDiv.append(clientId);
}
if (!client.shown) {
const clientShown = $("<div>")
.addClass("client-detail")
.text("No work schedule exported for this Blender yet");
clientDetailsDiv.append(clientShown);
}
if (client.workSchedule && client.gantt) {
const clientScheduleName = $("<div>")
.addClass("client-detail")
@@ -441,9 +462,7 @@ function toggleClientList() {
.text("Scroll to Gantt Chart")
.on("click", function () {
$("html, body").animate(
{
scrollTop: $("#gantt-" + id).offset().top,
},
{ scrollTop: $("#gantt-" + id).offset().top },
600
);
clientList.removeClass("show");
@@ -23,6 +23,7 @@ function connectSocket() {
// Register socket event handlers
socket.on("blender_connect", handleBlenderConnect);
socket.on("blender_disconnect", handleBlenderDisconnect);
socket.on("connected_clients", handleConnectedClients);
socket.on("csv_data", handleCsvData);
socket.on("default_data", handleDefaultData);
}
@@ -33,6 +34,9 @@ function handleBlenderConnect(blenderId) {
if (!connectedClients.hasOwnProperty(blenderId)) {
connectedClients[blenderId] = { shown: false, ifc_file: "" };
}
$("#blender-count").text(function (i, text) {
return parseInt(text, 10) + 1;
});
}
// Function to handle 'blender_disconnect' event
@@ -48,6 +52,14 @@ function handleBlenderDisconnect(blenderId) {
});
}
function handleConnectedClients(data) {
$("#blender-count").text(data.length);
console.log(data);
data.forEach(function (id) {
connectedClients[id] = { shown: false, ifc_file: "" };
});
}
// Function to handle 'csv_data' event
function handleCsvData(data) {
const blenderId = data["blenderId"];
@@ -85,10 +97,6 @@ function handleDefaultData(data) {
// Function to add a new table with data and filename
function addTableElement(blenderId, csvData, filename) {
$("#blender-count").text(function (i, text) {
return parseInt(text, 10) + 1;
});
// store headers of the csv data
const firstLine = csvData.indexOf("\n");
const csvHeaders = csvData.substring(0, firstLine).split(",");
@@ -292,15 +300,18 @@ function toggleClientList() {
}
clientList.empty();
var counter = 0;
$.each(connectedClients, function (id, client) {
if (!client.shown) return;
counter++;
const dropdownIcon = $("<i>")
.addClass("fas fa-chevron-down")
.css("margin-left", "0.5rem");
const clientDiv = $("<div>").addClass("client").text(client.ifc_file);
const clientDiv = $("<div>")
.addClass("client")
.text(client.ifc_file || "Blender " + counter);
clientDiv.append(dropdownIcon);
@@ -313,6 +324,13 @@ function toggleClientList() {
clientDetailsDiv.append(clientId);
}
if (!client.shown) {
const clientShown = $("<div>")
.addClass("client-detail")
.text("No CSV exported for this Blender yet");
clientDetailsDiv.append(clientShown);
}
if (client.headers && client.headers.length) {
const clientHeaders = $("<div>")
.addClass("client-detail")
@@ -323,9 +341,7 @@ function toggleClientList() {
.text("Scroll to Table")
.on("click", function () {
$("html, body").animate(
{
scrollTop: $("#table-" + id).offset().top,
},
{ scrollTop: $("#table-" + id).offset().top },
600
);
clientList.removeClass("show");