Projets/ObsiGate
1
1
Fork 0
Code Issues 16 Pull Requests Actions Packages Projects Releases 20 Wiki Activity

fix: drag-drop utilise text/plain uniquement + logs console
CI / lint (push) Failing after 9s
Details
CI / test (push) Has been skipped
Details
CI / build (push) Has been skipped
Details
CI / e2e (push) Has been skipped
Details
CI / security (push) Successful in 16s
Details
Desktop Build / build-windows (push) Has been cancelled
Details
Desktop Build / build-linux (push) Has been cancelled
Details

Browse Source 
- dragstart: setData 'text/plain' (universel, pas de custom MIME)
- drop container + tab: getData('text/plain')
- console.log dans le drop handler pour diagnostic
- Suppression application/obsigate-tab (non fiable cross-browser)
This commit is contained in:
bruno
2026-07-27 23:20:55 -04:00
parent 1a9a555bee
commit fe4cb9c47c
1 changed files with 43 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/js/pane-manager.js
+43 -33
View File
@@ -371,8 +371,8 @@ function createPaneTabManager(paneId) {
const payload = JSON.stringify({ const payload = JSON.stringify({
paneId: this.paneId, tabId: tab.id, index: idx paneId: this.paneId, tabId: tab.id, index: idx
}); });
e.dataTransfer.setData('application/obsigate-tab', payload); // text/plain is universally supported across all browsers for drag-drop
e.dataTransfer.setData('text/plain', payload); // fallback for browser compat e.dataTransfer.setData('text/plain', payload);
e.dataTransfer.effectAllowed = 'move'; e.dataTransfer.effectAllowed = 'move';
el.classList.add('dragging'); el.classList.add('dragging');
}); });
@@ -395,9 +395,9 @@ function createPaneTabManager(paneId) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); // Prevent container handler from double-firing e.stopPropagation(); // Prevent container handler from double-firing
document.querySelectorAll('.tab-drop-indicator').forEach(d => d.remove()); document.querySelectorAll('.tab-drop-indicator').forEach(d => d.remove());
const raw = e.dataTransfer.getData('text/plain');
if (!raw) return;
try { try {
const raw = e.dataTransfer.getData('application/obsigate-tab');
if (!raw) return;
const dragData = JSON.parse(raw); const dragData = JSON.parse(raw);
// Same pane — reorder // Same pane — reorder
if (dragData.paneId === this.paneId) { if (dragData.paneId === this.paneId) {
@@ -796,39 +796,49 @@ const PaneManager = {
const tabBar = container.querySelector('.tab-bar'); const tabBar = container.querySelector('.tab-bar');
if (tabBar) tabBar.classList.remove('drop-target'); if (tabBar) tabBar.classList.remove('drop-target');
// Try both data formats // Get drag data (text/plain is universally supported)
let raw = e.dataTransfer.getData('application/obsigate-tab'); const raw = e.dataTransfer.getData('text/plain');
if (!raw) raw = e.dataTransfer.getData('text/plain'); console.log('[PaneManager] drop fired, raw data:', raw ? raw.substring(0, 80) : 'null');
if (!raw) return; if (!raw) return;
let dragData;
try { dragData = JSON.parse(raw); } catch (e2) { console.log('[PaneManager] JSON parse error:', e2); return; }
if (dragData.paneId == null || dragData.tabId == null) { console.log('[PaneManager] missing paneId/tabId'); return; }
try { // Recalculate edge zone from drop coordinates
const dragData = JSON.parse(raw); const rect = container.getBoundingClientRect();
if (dragData.paneId == null || dragData.tabId == null) return; const relX = e.clientX - rect.left;
const relY = e.clientY - rect.top;
const isSingle = !this.isSplit();
// Recalculate edge zone from drop coordinates console.log('[PaneManager] drop at', relX.toFixed(0), relY.toFixed(0),
const rect = container.getBoundingClientRect(); 'rect', rect.width.toFixed(0), 'x', rect.height.toFixed(0),
const relX = e.clientX - rect.left; 'isSingle', isSingle, 'paneId', paneId, 'srcPane', dragData.paneId);
const relY = e.clientY - rect.top;
const isSingle = !this.isSplit();
if (isSingle && relX > rect.width * 0.72) { if (isSingle && relX > rect.width * 0.72) {
this.splitRight(); console.log('[PaneManager] → splitRight');
setTimeout(() => { this.splitRight();
const newPaneId = this.panes.length - 1; // Transfer after DOM settles
this.transferTab(dragData.paneId, dragData.tabId, newPaneId); const transfer = () => {
}, 200); const newPaneId = this.panes.length - 1;
} else if (isSingle && relY > rect.height * 0.72) { console.log('[PaneManager] transferring tab', dragData.tabId, 'to pane', newPaneId);
this.splitDown(); this.transferTab(dragData.paneId, dragData.tabId, newPaneId);
setTimeout(() => { };
const newPaneId = this.panes.length - 1; setTimeout(transfer, 200);
this.transferTab(dragData.paneId, dragData.tabId, newPaneId); } else if (isSingle && relY > rect.height * 0.72) {
}, 200); console.log('[PaneManager] → splitDown');
} else if (dragData.paneId !== paneId) { this.splitDown();
// Cross-pane transfer (already in split mode, different panes) const transfer = () => {
this.transferTab(dragData.paneId, dragData.tabId, paneId); const newPaneId = this.panes.length - 1;
} this.transferTab(dragData.paneId, dragData.tabId, newPaneId);
// else: same pane, not edge — tab handler deals with reorder };
} catch (e2) { console.debug('PaneManager drop error:', e2); } setTimeout(transfer, 200);
} else if (dragData.paneId !== paneId) {
console.log('[PaneManager] → cross-pane transfer', dragData.paneId, '→', paneId);
this.transferTab(dragData.paneId, dragData.tabId, paneId);
} else {
console.log('[PaneManager] → same pane, no edge — letting tab handler deal');
}
}); });
}, },