fixing network map
Deploy / deploy (push) Has been cancelled

This commit is contained in:
2026-05-12 10:33:35 +02:00
parent 13d8420976
commit fe5f288fc0
+7 -11
View File
@@ -396,6 +396,7 @@ function renderMoreEvents() {
}
let sentinelObserver = null;
let suppressNextMouse = false;
function observeSentinel() {
if (sentinelObserver) sentinelObserver.disconnect();
@@ -1160,13 +1161,14 @@ function renderNodeToolbar() {
{ type: 'cloud', icon: 'fa-cloud', color: '#22c55e', label: 'Cloud' },
{ type: 'endpoint', icon: 'fa-laptop', color: '#ec4899', label: 'Endpoint' },
{ type: 'other', icon: 'fa-circle', color: '#6b7280', label: 'Other' },
{ type: 'shape:rectangle', icon: 'fa-vector-square', color: '#3b82f6', label: 'Box', isShape: true },
{ type: 'shape:ellipse', icon: 'fa-circle', color: '#3b82f6', label: 'Ellipse', isShape: true },
];
bar.innerHTML = '<span class="text-secondary me-1 small" style="font-size:.7rem;line-height:26px;">Drag to canvas:</span>';
iconMap.forEach(t => {
const el = document.createElement('span');
el.className = 'toolbar-node-item d-inline-flex align-items-center gap-1 px-2 py-1 rounded';
el.className = 'd-inline-flex align-items-center gap-1 px-2 py-1 rounded';
el.draggable = true;
el.dataset.nodeType = t.type;
el.style.cssText = 'cursor:grab;font-size:.75rem;color:' + t.color + ';background:' + t.color + '12;border:1px solid ' + t.color + '30;';
el.innerHTML = '<i class="fas ' + t.icon + '" style="font-size:.75rem;"></i><span>' + t.label + '</span>';
el.addEventListener('dragstart', (e) => {
@@ -1175,15 +1177,6 @@ function renderNodeToolbar() {
});
bar.appendChild(el);
});
bar.innerHTML += '<span class="toolbar-shape-item d-inline-flex align-items-center gap-1 px-2 py-1 rounded ms-1" draggable="true" data-shape="rectangle" style="cursor:grab;font-size:.75rem;color:#3b82f6;background:#3b82f612;border:1px solid #3b82f630;"><i class="fas fa-vector-square" style="font-size:.75rem;"></i><span>Box</span></span>';
bar.innerHTML += '<span class="toolbar-shape-item d-inline-flex align-items-center gap-1 px-2 py-1 rounded ms-1" draggable="true" data-shape="ellipse" style="cursor:grab;font-size:.75rem;color:#3b82f6;background:#3b82f612;border:1px solid #3b82f630;"><i class="fas fa-circle" style="font-size:.75rem;"></i><span>Ellipse</span></span>';
bar.querySelectorAll('.toolbar-shape-item').forEach(el => {
el.addEventListener('dragstart', (e) => {
e.dataTransfer.setData('text/plain', 'shape:' + el.dataset.shape);
e.dataTransfer.effectAllowed = 'copy';
});
});
}
function setupCanvasDrop() {
@@ -1191,6 +1184,8 @@ function setupCanvasDrop() {
wrapper.addEventListener('dragover', (e) => { e.preventDefault(); e.dataTransfer.dropEffect = 'copy'; });
wrapper.addEventListener('drop', async (e) => {
e.preventDefault();
suppressNextMouse = true;
setTimeout(() => { suppressNextMouse = false; }, 100);
const data = e.dataTransfer.getData('text/plain');
const rect = canvas.getBoundingClientRect();
const mx = e.clientX - rect.left - panX;
@@ -1301,6 +1296,7 @@ function onMouseDown(e) {
return;
}
if (e.button !== 0) return;
if (suppressNextMouse) return;
const rect = canvas.getBoundingClientRect();
const mx = e.clientX - rect.left - panX;
const my = e.clientY - rect.top - panY;