const chat = ChatSDK.init({
  container: document.body,
  projectId: 'YOUR_PROJECT_ID',
  mode: 'floating',
  apiBaseUrl: 'https://YOUR_SERVER_DOMAIN',
  socketUrl: 'https://YOUR_SERVER_DOMAIN'
})

const chat = ChatSDK.init({
  container: document.body,
  projectId: 'YOUR_PROJECT_ID',
  mode: 'floating',
  floatingButton: {
    position: 'bottom-left',        // 'bottom-right', 'bottom-left', 'top-right', 'top-left'
    offset: { bottom: 24, left: 24 }, // Distance from edges in pixels
    icon: 'chat',                   // Button icon type
    zIndex: 2147483000             // CSS z-index for layering
  },
  apiBaseUrl: 'https://YOUR_SERVER_DOMAIN',
  socketUrl: 'https://YOUR_SERVER_DOMAIN'
})

const chat = ChatSDK.init({
  container: '#chat-container',
  projectId: 'YOUR_PROJECT_ID',
  mode: 'fullscreen',  // or omit this line for default behavior
  apiBaseUrl: 'https://YOUR_SERVER_DOMAIN',
  socketUrl: 'https://YOUR_SERVER_DOMAIN'
})
chat.open() // Required for full-screen mode

const chat = ChatSDK.init({
  container: '#chat-container',
  projectId: 'your-project-id',
  username: 'John Doe',
  language: 'en',
  theme: 'light',
  onReady: () => console.log('Chat ready!'),
  onMessage: (message) => console.log('New message:', message)
});

// Open/close the chat widget
chat.open();
chat.close();

// Join/leave the chat
chat.joinChat();
chat.leaveChat();

// Send a message programmatically
chat.sendMessage('Hello world!', 'text');

// Destroy the widget
chat.destroy();

// Change language
chat.setLanguage('zh');

// Change theme
chat.setTheme('dark');

// Switch template
chat.setTemplate('template-id');

// Check widget state
const isOpen = chat.isOpen();
const isJoined = chat.isJoined();

// Get configuration
const config = chat.getConfig();

// Get message history
const messages = chat.getMessages();

// Listen to events
chat.on('message', (message) => {
  console.log('New message:', message);
});

// Remove event listeners
chat.off('message');

// Emit custom events
chat.emit('custom-event', data);

const chat = ChatSDK.init({
  container: '#chat',
  projectId: 'demo-project',
  username: 'Visitor',
  autoJoin: true
});

const chat = ChatSDK.init({
  container: document.getElementById('chat-container'),
  projectId: 'my-project',
  templateId: 'customer-support',
  username: 'Customer',
  language: 'zh',
  theme: 'dark',
  width: '100%',
  height: '500px',
  uiTemplate: 'telegram',

  onReady: () => {
    console.log('Chat is ready!');
    chat.open();
  },

  onMessage: (message) => {
    // Track messages in analytics
    analytics.track('chat_message_received', {
      content: message.content,
      type: message.messageType
    });
  },

  onUserMessage: (message) => {
    // Track user messages
    analytics.track('chat_message_sent', {
      content: message.content
    });
  }
});

const chat = ChatSDK.init({
  container: '#chat',
  projectId: 'support-chat',
  language: 'en', // Start with English
  mode: 'floating'
});

// Language switcher - dynamically change UI language
document.getElementById('lang-zh').addEventListener('click', () => {
  chat.setLanguage('zh'); // 简体中文
});

document.getElementById('lang-es').addEventListener('click', () => {
  chat.setLanguage('es'); // Español
});

document.getElementById('lang-ar').addEventListener('click', () => {
  chat.setLanguage('ar'); // العربية (RTL support)
});

// Supported languages:
// 'en' (English), 'zh' (简体中文), 'zh-TW' (繁體中文), 'es' (Español),
// 'hi' (हिन्दी), 'ar' (العربية), 'pt' (Português), 'de' (Deutsch),
// 'ja' (日本語), 'ko' (한국어), 'fr' (Français), 'ru' (Русский),
// 'it' (Italiano), 'tr' (Türkçe), 'pl' (Polski), 'vi' (Tiếng Việt),
// 'th' (ไทย), 'id' (Bahasa Indonesia), 'nl' (Nederlands)

const chat = ChatSDK.init({
  container: '#chat',
  projectId: 'sales-demo',

  onJoin: ({ userId, username }) => {
    // Notify your backend
    fetch('/api/chat-joined', {
      method: 'POST',
      body: JSON.stringify({ userId, username })
    });
  },

  onUserMessage: (message) => {
    // Process user messages
    if (message.content.includes('pricing')) {
      // Show pricing modal
      showPricingModal();
    }
  },

  onError: (error) => {
    // Handle errors gracefully
    console.error('Chat error:', error);
    showErrorNotification('Chat temporarily unavailable');
  }
});

const chat = ChatSDK.init({
  container: '#chat',
  projectId: 'my-project',

  onError: (error) => {
    switch (error.code) {
      case 'CONTAINER_NOT_FOUND':
        console.error('Chat container not found');
        break;
      case 'PROJECT_LOAD_ERROR':
        console.error('Failed to load project');
        break;
      case 'SOCKET_CONNECTION_ERROR':
        console.error('Connection failed');
        break;
      default:
        console.error('Unknown error:', error.message);
    }
  }
});