Function animateCardsIntoHeaderAndThen

public/js/dragAndDrop.js:522–645

(done)

);

function animateCardsIntoHeaderAndThen(done) {
  const sb  = getSidebar();
  const top = getTopZone();
  const liveCards = [];

  if (sb)  liveCards.push(...sb.querySelectorAll('#uploadCard, #folderManagementCard'));
  if (top) liveCards.push(...top.querySelectorAll('#uploadCard, #folderManagementCard'));

  if (!liveCards.length) {
    done();
    return;
  }

  // Snapshot their current positions before we move the real DOM
  const snapshots = liveCards.map(card => {
    const rect = card.getBoundingClientRect();
    return { card, rect };
  });

  // Make sure header dock is visible so icons are laid out
  showHeaderDockPersistent();

  // Move real cards into header (hidden container + icons)
  snapshots.forEach(({ card }) => {
    try { insertCardInHeader(card); } catch (e) {}
  });

  const ghosts = [];

  snapshots.forEach(({ card, rect }) => {
    // remember the size and center for the expand animation later
    card.dataset.lastWidth  = String(rect.width);
    card.dataset.lastHeight = String(rect.height);
    card.dataset.lastTargetLeft = String(rect.left);
    card.dataset.lastTargetTop = String(rect.top);
    card.dataset.lastTargetCx = String(rect.left + rect.width / 2);
    card.dataset.lastTargetCy = String(rect.top + rect.height / 2);

    const iconBtn = card.headerIconButton;
    if (!iconBtn) return;

    iconBtn.classList.remove('is-launching');
    iconBtn.classList.add('is-landing');
    iconBtn.style.setProperty('--header-icon-delay', `${HEADER_ICON_LAND_DELAY_MS}ms`);
    iconBtn.style.setProperty('--header-icon-land-ms', `${HEADER_ICON_LAND_MS}ms`);
    setTimeout(() => {
      if (!iconBtn.isConnected) return;
      iconBtn.classList.remove('is-landing');
      iconBtn.style.removeProperty('--header-icon-delay');
      iconBtn.style.removeProperty('--header-icon-land-ms');
    }, HEADER_ICON_LAND_DELAY_MS + HEADER_ICON_LAND_MS + 40);

    const iconRect = iconBtn.getBoundingClientRect();

    const iconName = card.id === 'uploadCard'
      ? 'cloud_upload'
      : card.id === 'folderManagementCard'
        ? 'folder'