Forge-Engine/static/js/screen_edit/tabs-and-blocks.js

// switchBuilderTab()/toggleDashCreate() ont déménagé dans builder-tabs.js
// (générique, chargé par les DEUX éditeurs — voir ce fichier) : tout ce
// qui reste ici est propre aux blocs de logique/panneaux flottants,
// jamais chargé par l'éditeur de scène 2D (scene_edit.html).

function toggleBlockEditRow(blockId) {
  document.getElementById('blockEditRow' + blockId).classList.toggle('hidden');
}

// ---------- Panneaux flottants : glisser-déposer + redimensionnement +
// plein écran ---------- Générique, porté tel quel depuis game_dashboard.html
// (mêmes gestes partout dans l'outil plutôt qu'une variante par panneau).
function makeFloatPanelDraggable(panel, header) {
  var dragging = false, offsetX = 0, offsetY = 0;
  header.addEventListener('mousedown', function (e) {
    if (e.target.closest('button')) return;
    dragging = true;
    if (panel.classList.contains('floatPanel--fullscreen')) panel._fsToggle.exit();
    var rect = panel.getBoundingClientRect();
    panel.style.left = rect.left + 'px';
    panel.style.top = rect.top + 'px';
    panel.style.right = 'auto';
    panel.style.bottom = 'auto';
    panel.style.transform = 'none';
    offsetX = e.clientX - rect.left;
    offsetY = e.clientY - rect.top;
    document.body.style.userSelect = 'none';
  });
  document.addEventListener('mousemove', function (e) {
    if (!dragging) return;
    panel.style.left = (e.clientX - offsetX) + 'px';
    panel.style.top = (e.clientY - offsetY) + 'px';
  });
  document.addEventListener('mouseup', function () {
    dragging = false;
    document.body.style.userSelect = '';
  });
}
function makeFloatPanelResizable(panel, handle) {
  var resizing = false, startX = 0, startY = 0, startW = 0, startH = 0;
  handle.addEventListener('mousedown', function (e) {
    resizing = true;
    if (panel.classList.contains('floatPanel--fullscreen')) panel._fsToggle.exit();
    var rect = panel.getBoundingClientRect();
    startX = e.clientX; startY = e.clientY;
    startW = rect.width; startH = rect.height;
    panel.style.width = startW + 'px';
    panel.style.maxWidth = 'none';
    document.body.style.userSelect = 'none';
    e.preventDefault();
  });
  document.addEventListener('mousemove', function (e) {
    if (!resizing) return;
    panel.style.width = Math.max(320, startW + (e.clientX - startX)) + 'px';
    panel.style.height = Math.max(200, startH + (e.clientY - startY)) + 'px';
  });
  document.addEventListener('mouseup', function () {
    resizing = false;
    document.body.style.userSelect = '';
  });
}
function makeFloatPanelFullscreenable(panel, toggleBtn) {
  var saved = null;
  function enter() {
    saved = {
      left: panel.style.left, top: panel.style.top, right: panel.style.right,
      width: panel.style.width, height: panel.style.height,
      maxWidth: panel.style.maxWidth, transform: panel.style.transform,
    };
    panel.classList.add('floatPanel--fullscreen');
    panel.style.left = '12px'; panel.style.top = '12px'; panel.style.right = '12px'; panel.style.bottom = '12px';
    panel.style.width = 'auto'; panel.style.height = 'auto'; panel.style.maxWidth = 'none'; panel.style.transform = 'none';
    toggleBtn.title = 'Quitter le plein écran';
  }
  function exit() {
    panel.classList.remove('floatPanel--fullscreen');
    panel.style.bottom = '';
    if (saved) {
      panel.style.left = saved.left; panel.style.top = saved.top; panel.style.right = saved.right;
      panel.style.width = saved.width; panel.style.height = saved.height;
      panel.style.maxWidth = saved.maxWidth; panel.style.transform = saved.transform;
    }
    toggleBtn.title = 'Plein écran';
  }
  toggleBtn.addEventListener('click', function () {
    if (panel.classList.contains('floatPanel--fullscreen')) exit(); else enter();
  });
  panel._fsToggle = { enter: enter, exit: exit };
  return panel._fsToggle;
}

// ---------- Modale d'un bloc de logique (voir screens/flow/blocks/) : un
// seul bloc ouvert à la fois, réutilise le même #nodeForm/#flowCanvas pour
// n'importe quel bloc — voir currentBlockNodes()/currentBlockEdges(). ----------
(function () {
  var panel = document.getElementById('logicBlockPanel');
  makeFloatPanelDraggable(panel, document.getElementById('logicBlockPanelHeader'));
  makeFloatPanelResizable(panel, document.getElementById('logicBlockPanelResizeHandle'));
  makeFloatPanelFullscreenable(panel, panel.querySelector('.floatPanelFullscreenBtn'));
  window.openLogicBlockPanel = function (blockId) {
    CURRENT_BLOCK_ID = blockId;
    closeNodeForm();
    var block = FLOW_BLOCKS.find(function (b) { return b.id === blockId; });
    document.getElementById('logicBlockPanelTitle').textContent = (block && block.name) || '?';
    panel.classList.remove('hidden');
    panel._fsToggle.enter();
    renderFlow();
    requestAnimationFrame(drawFlowEdges);
  };
  window.closeLogicBlockPanel = function () {
    panel.classList.add('hidden');
    CURRENT_BLOCK_ID = null;
  };
})();

// L'ouverture initiale ?tab=/?block=... (données Jinja : request.args)
// reste dans le petit <script> inline en fin de screen_edit.html, après
// ce fichier — voir le commentaire là-bas.