// UIManager is loaded via window.UIManager from index.html
const UIManager = window.UIManager;

function escapeHtml(str) {
  const div = document.createElement('div');
  div.textContent = str;
  return div.innerHTML;
}

window.escapeHtml = escapeHtml;

// Initialize the application when DOM is loaded
document.addEventListener('DOMContentLoaded', () => {
  console.log('Movie Mapper application initialized');

  // Create and initialize the UI manager
  const uiManager = new UIManager();

  // Expose to window for debugging and external access
  window.uiManager = uiManager;

  // Debug function to log problematic file info
  window.debugProblematicFile = async (filePath) => {
    await uiManager.debugProblematicFile(filePath);
  };

  // Test TVDB API connectivity
  window.testTVDBAPI = async () => {
    await uiManager.searchManager.testTVDBAPI();
  };

  // Open video preview
  window.openVideoPreview = async (filePath) => {
    await uiManager.modalManager.openVideoPreview(filePath);
  };

  // Open directory
  window.openDirectory = async (directory) => {
    await uiManager.openDirectory(directory);
  };

  // Make file editable
  window.makeEditable = (element) => {
    uiManager.makeEditable(element);
  };

  // Handle file name double-click to edit
  document.addEventListener('dblclick', (e) => {
    const fileNameEl = e.target.closest('.file-name');
    if (fileNameEl) {
      e.stopPropagation();
      uiManager.makeEditable(fileNameEl);
    }
  });

  console.log('UIManager initialized and exposed to window');
});

console.log('Movie Mapper renderer loaded');