import { renderHeader } from '../components/header.js';
import { directMessages } from '../mock-data.js';
import {
  addAppLogEntry,
  addChatMessage,
  addSignedMessageToChat,
  addSystemChatMessage,
  addOutgoingPendingMessage,
  getChatMessages,
  markChatRead,
  markOutgoingSent,
  markReadReceiptSentByBaseKey,
  authService,
  setContacts,
  state,
} from '../state.js';
import { startOutgoingCall } from '../services/call-service.js';
import { openSpeechInputModal } from '../components/speech-input-modal.js';
import { isTextToSpeechConfigured, speakTextBySettings } from '../services/speech-tools-service.js';
import { showToast } from '../services/channels-ux.js';

export const pageMeta = { id: 'chat-view', title: 'Чат' };

function openMessageActionsModal({ messageText = '', onReadAloud }) {
  const root = document.getElementById('modal-root');
  if (!root) return;
  root.innerHTML = `
    <div class="modal" id="chat-message-actions-modal-overlay">
      <div class="modal-card stack dm-dialog-card dm-message-actions-menu" id="chat-message-actions-modal">
        <button class="secondary-btn dm-message-action-btn" type="button" id="msg-action-copy">Копировать</button>
        <button class="secondary-btn dm-message-action-btn" type="button" id="msg-action-read">Прочесть</button>
      </div>
    </div>
  `;

  const close = () => {
    root.innerHTML = '';
  };

  root.querySelector('#chat-message-actions-modal-overlay')?.addEventListener('click', (event) => {
    if (event.target?.id === 'chat-message-actions-modal-overlay') close();
  });
  root.querySelector('#msg-action-copy')?.addEventListener('click', async () => {
    try {
      if (navigator?.clipboard?.writeText) {
        await navigator.clipboard.writeText(String(messageText || ''));
      }
      showToast('Сообщение скопированно', { timeoutMs: 1000 });
    } catch {
      showToast('Не удалось скопировать сообщение', { kind: 'error', timeoutMs: 1200 });
    } finally {
      close();
    }
  });
  root.querySelector('#msg-action-read')?.addEventListener('click', async () => {
    close();
    if (typeof onReadAloud === 'function') await onReadAloud();
  });
}

function showTtsMissingConfigDialog(navigate) {
  const root = document.getElementById('modal-root');
  if (!root) return;
  root.innerHTML = `
    <div class="modal" id="chat-tts-missing-modal">
      <div class="modal-card stack dm-dialog-card">
        <h3 class="modal-title">Озвучка не настроена</h3>
        <p class="meta-muted">Перейти в настройки инструментов?</p>
        <div class="form-actions-grid">
          <button class="secondary-btn" type="button" id="chat-tts-no">Нет</button>
          <button class="primary-btn" type="button" id="chat-tts-yes">Да</button>
        </div>
      </div>
    </div>
  `;
  const close = () => { root.innerHTML = ''; };
  root.querySelector('#chat-tts-no')?.addEventListener('click', close);
  root.querySelector('#chat-tts-yes')?.addEventListener('click', () => {
    close();
    navigate('tools-settings-view');
  });
}

function autoResizeComposer(textarea) {
  if (!textarea) return;
  textarea.style.height = 'auto';
  textarea.style.height = `${Math.min(180, Math.max(42, textarea.scrollHeight))}px`;
}

function openConfirmContactModal(targetLogin = '') {
  const root = document.getElementById('modal-root');
  if (!root) return Promise.resolve(false);
  return new Promise((resolve) => {
    root.innerHTML = `
      <div class="modal" id="contact-confirm-modal">
        <div class="modal-card stack dm-dialog-card">
          <h3 class="modal-title">Добавить собеседника</h3>
          <p class="meta-muted">Добавить пользователя @${targetLogin} в контакты?</p>
          <div class="form-actions-grid">
            <button class="secondary-btn" type="button" id="contact-confirm-no">Нет</button>
            <button class="primary-btn" type="button" id="contact-confirm-yes">Да</button>
          </div>
        </div>
      </div>
    `;

    const close = (answer) => {
      root.innerHTML = '';
      resolve(!!answer);
    };
    root.querySelector('#contact-confirm-no')?.addEventListener('click', () => close(false));
    root.querySelector('#contact-confirm-yes')?.addEventListener('click', () => close(true));
  });
}

function parseBaseKey(baseKey) {
  const raw = String(baseKey || '').trim();
  const parts = raw.split('|');
  if (parts.length < 4) return null;
  const fromLogin = parts[0] || '';
  const toLogin = parts[1] || '';
  const timeMs = Number(parts[2] || 0);
  const nonce = Number(parts[3] || 0);
  if (!fromLogin || !toLogin || !Number.isFinite(timeMs) || !Number.isFinite(nonce)) return null;
  return { fromLogin, toLogin, timeMs, nonce };
}

function resolveMessageTimeMs(msg) {
  const base = parseBaseKey(msg?.baseKey);
  if (base?.timeMs && Number.isFinite(base.timeMs) && base.timeMs > 0) return base.timeMs;

  const messageKey = String(msg?.messageKey || '').trim();
  if (messageKey) {
    const parts = messageKey.split('|');
    const timeMs = Number(parts[2] || 0);
    if (parts.length >= 4 && Number.isFinite(timeMs) && timeMs > 0) return timeMs;
  }

  const tempId = String(msg?.tempId || '').trim();
  if (tempId.startsWith('tmp-')) {
    const ts = Number(tempId.split('-')[1] || 0);
    if (Number.isFinite(ts) && ts > 0) return ts;
  }

  const fallback = Number(msg?.createdAtMs || 0);
  if (Number.isFinite(fallback) && fallback > 0) return fallback;
  return 0;
}

function formatMessageTime(valueMs) {
  const timeMs = Number(valueMs || 0);
  if (!Number.isFinite(timeMs) || timeMs <= 0) return '';
  return new Intl.DateTimeFormat('ru-RU', {
    day: '2-digit',
    month: '2-digit',
    year: '2-digit',
    hour: '2-digit',
    minute: '2-digit',
  }).format(new Date(timeMs));
}

function resolveDeliveryStatus(msg) {
  if (msg?.from !== 'out') return '';
  if (msg?.secondTick) return '✓✓';
  if (msg?.firstTick) return '✓';
  return '…';
}

function formatFileSize(bytes) {
  const value = Number(bytes || 0);
  if (!Number.isFinite(value) || value < 1024) return `${Math.max(0, Math.trunc(value))} B`;
  if (value < 1024 * 1024) return `${(value / 1024).toFixed(1)} KB`;
  return `${(value / (1024 * 1024)).toFixed(1)} MB`;
}

function messagePlainText(msg) {
  return String(msg?.text || '').trim();
}

async function downloadAttachment(attachment) {
  const fileName = String(attachment?.fileName || 'file.bin');
  const mime = String(attachment?.mime || 'application/octet-stream');
  const plainBytes = await authService.downloadAndDecryptDmAttachment(attachment, state.entrySettings.shineServerHttp);
  const blob = new Blob([plainBytes], { type: mime });
  const url = URL.createObjectURL(blob);
  try {
    const link = document.createElement('a');
    link.href = url;
    link.download = fileName;
    document.body.append(link);
    link.click();
    link.remove();
  } finally {
    setTimeout(() => URL.revokeObjectURL(url), 1000);
  }
}

function scrollToLatestMessage(list) {
  if (!list) return;
  const apply = () => {
    list.scrollTop = list.scrollHeight;
  };
  apply();
  window.requestAnimationFrame(apply);
  window.requestAnimationFrame(() => window.requestAnimationFrame(apply));
  window.setTimeout(apply, 0);
  window.setTimeout(apply, 60);
  window.setTimeout(apply, 120);
  window.setTimeout(apply, 260);
}

function renderLog(list, chatId, { onOpenActions } = {}) {
  list.innerHTML = '';
  const messages = getChatMessages(chatId);
  let unreadSeparatorInserted = false;
  messages.forEach((msg) => {
    if (!unreadSeparatorInserted && msg?.from === 'in' && msg?.unread) {
      const sep = document.createElement('div');
      sep.className = 'chat-unread-separator';
      const label = document.createElement('span');
      label.textContent = 'Новые сообщения';
      sep.append(label);
      list.append(sep);
      unreadSeparatorInserted = true;
    }

    const bubble = document.createElement('div');
    const bubbleKind = String(msg?.kind || '').trim();
    bubble.className = `bubble ${msg.from}${bubbleKind ? ` ${bubbleKind}` : ''}`;

    const plainText = messagePlainText(msg);
    if (plainText) {
      const textNode = document.createElement('div');
      textNode.className = 'bubble-text';
      textNode.textContent = plainText;
      bubble.append(textNode);
    }

    const attachments = Array.isArray(msg?.attachments) ? msg.attachments : [];
    if (attachments.length) {
      const attachmentsNode = document.createElement('div');
      attachmentsNode.className = 'stack';
      attachments.forEach((attachment) => {
        const btn = document.createElement('button');
        btn.type = 'button';
        btn.className = 'secondary-btn';
        btn.textContent = `${attachment?.fileName || 'file'} • ${formatFileSize(attachment?.origSize || attachment?.encSize || 0)}`;
        btn.addEventListener('click', async (event) => {
          event.stopPropagation();
          try {
            await downloadAttachment(attachment);
          } catch (error) {
            showToast(`Не удалось скачать файл: ${error?.message || 'unknown'}`, { kind: 'error', timeoutMs: 1600 });
          }
        });
        attachmentsNode.append(btn);
      });
      bubble.append(attachmentsNode);
    }

    const metaNode = document.createElement('div');
    metaNode.className = 'bubble-meta';

    const timeNode = document.createElement('span');
    timeNode.className = 'bubble-time';
    timeNode.textContent = formatMessageTime(resolveMessageTimeMs(msg));
    metaNode.append(timeNode);

    const status = resolveDeliveryStatus(msg);
    if (status) {
      const statusNode = document.createElement('span');
      statusNode.className = 'bubble-status';
      statusNode.textContent = status;
      metaNode.append(statusNode);
    }

    bubble.append(metaNode);
    bubble.addEventListener('click', () => {
      if (typeof onOpenActions === 'function') onOpenActions(msg);
    });
    list.append(bubble);
  });
  scrollToLatestMessage(list);
  markChatRead(chatId);
}

export function render({ navigate, route }) {
  const chatId = route.params.chatId || 'u1';
  const contact = directMessages.find((d) => d.id === chatId) || {
    id: chatId,
    name: chatId,
    initials: (chatId[0] || '?').toUpperCase(),
  };

  const screen = document.createElement('section');
  screen.className = 'stack dm-screen dm-chat-screen';
  const isKnownContact = (state.contacts || []).some((x) => String(x || '').toLowerCase() === String(chatId || '').toLowerCase());

  screen.append(
    renderHeader({
      title: `Чат с ${contact.name}`,
      leftAction: { label: '←', onClick: () => navigate('messages-list') },
      rightActions: [{
        label: 'Позвонить',
        onClick: async () => {
          try {
            await startOutgoingCall(chatId);
            renderLog(log, chatId, {
              onOpenActions: (msg) => openMessageActionsModal({
                messageText: msg?.text || '',
                onReadAloud: async () => {
                  if (!isTextToSpeechConfigured(state.entrySettings)) {
                    showTtsMissingConfigDialog(navigate);
                    return;
                  }
                  await speakTextBySettings(String(msg?.text || ''), state.entrySettings);
                },
              }),
            });
          } catch (e) {
            addSystemChatMessage(chatId, `[Звонок] Ошибка запуска: ${e.message || 'unknown'}`, {
              from: 'out',
              kind: 'call-tech',
            });
            renderLog(log, chatId, {
              onOpenActions: (msg) => openMessageActionsModal({
                messageText: msg?.text || '',
                onReadAloud: async () => {
                  if (!isTextToSpeechConfigured(state.entrySettings)) {
                    showTtsMissingConfigDialog(navigate);
                    return;
                  }
                  await speakTextBySettings(String(msg?.text || ''), state.entrySettings);
                },
              }),
            });
          }
        },
      }],
    })
  );

  if (!isKnownContact) {
    const card = document.createElement('div');
    card.className = 'card';
    const btn = document.createElement('button');
    btn.className = 'secondary-btn';
    btn.type = 'button';
    btn.textContent = 'Добавить собеседника в контакты';
    btn.addEventListener('click', async () => {
      try {
        const approved = await openConfirmContactModal(chatId);
        if (!approved) return;
        await authService.setUserRelation({
          login: state.session.login,
          toLogin: chatId,
          kind: 'contact',
          enabled: true,
          storagePwd: state.session.storagePwdInMemory,
        });
        const contactsPayload = await authService.listContacts();
        setContacts(contactsPayload?.contacts || []);
        addAppLogEntry({
          level: 'info',
          source: 'contacts',
          message: `Пользователь ${chatId} добавлен в контакты`,
        });
        card.remove();
      } catch (e) {
        addAppLogEntry({
          level: 'warn',
          source: 'contacts',
          message: 'Не удалось добавить пользователя в контакты',
          details: { login: chatId, error: e?.message || 'unknown' },
        });
      }
    });
    card.append(btn);
    screen.append(card);
  }

  const wrap = document.createElement('div');
  wrap.className = 'chat-wrap dm-chat-wrap';

  const log = document.createElement('div');
  log.className = 'messages-log dm-messages-log';

  const form = document.createElement('form');
  form.className = 'chat-input dm-chat-input';
  form.innerHTML = `
    <input type="file" id="chat-file-input" multiple hidden />
    <div class="stack" id="chat-attachments-preview"></div>
    <textarea class="input dm-input" name="message" rows="1" placeholder="Введите сообщение" maxlength="12000"></textarea>
    <div class="dm-actions-col">
      <button class="ghost-btn dm-voice-btn" type="button" id="chat-file-pick" title="Вложить файлы">📎</button>
      <button class="ghost-btn dm-voice-btn" type="button" id="chat-voice-input" title="Голосовой ввод">🎤</button>
      <button class="primary-btn dm-send-btn dm-send-icon-btn" type="submit" title="Отправить">➤</button>
    </div>
  `;

  const fileInput = form.querySelector('#chat-file-input');
  const attachmentsPreview = form.querySelector('#chat-attachments-preview');
  let pendingFiles = [];

  const renderPendingFiles = () => {
    if (!attachmentsPreview) return;
    attachmentsPreview.innerHTML = '';
    pendingFiles.forEach((file, index) => {
      const row = document.createElement('div');
      row.className = 'meta-muted';
      row.textContent = `${file.name} • ${formatFileSize(file.size)}`;
      row.addEventListener('click', () => {
        pendingFiles = pendingFiles.filter((_, current) => current !== index);
        renderPendingFiles();
      });
      attachmentsPreview.append(row);
    });
  };

  const buildMessagePayloadText = (plainText, preparedAttachments) => {
    const parts = [];
    const text = String(plainText || '').trim();
    if (text) parts.push(text);
    preparedAttachments.forEach((item) => {
      parts.push(`<<file:file-format(1.0):${item.type}|${item.fileName}|${item.origSize}|${item.origHashB64u}|${item.encHashB64u}|${item.encSize}|${item.keyB64u}|${item.nonceB64u}>>`);
    });
    return parts.join('\n');
  };

  const ensureUploads = async (preparedAttachments) => {
    for (const item of preparedAttachments) {
      const exists = await authService.headDmFile(item.encHashB64u, state.entrySettings.shineServerHttp);
      if (!exists) {
        await authService.uploadDmFileCiphertext({
          encHashB64u: item.encHashB64u,
          encSize: item.encSize,
          ciphertextBytes: item.ciphertextBytes,
          serverHttpBase: state.entrySettings.shineServerHttp,
        });
      }
    }
  };

  const sendTextMessage = async (rawText) => {
    const text = String(rawText || '').trim();
    if (!text && pendingFiles.length === 0) return;
    const tempLabel = text || `Файлы: ${pendingFiles.length}`;
    const tempId = addOutgoingPendingMessage(chatId, tempLabel);
    renderLog(log, chatId, {
      onOpenActions: (msg) => openMessageActionsModal({
        messageText: msg?.text || '',
        onReadAloud: async () => {
          if (!isTextToSpeechConfigured(state.entrySettings)) {
            showTtsMissingConfigDialog(navigate);
            return;
          }
          await speakTextBySettings(String(msg?.text || ''), state.entrySettings);
        },
      }),
    });

    try {
      const filesToSend = pendingFiles.slice(0, 12);
      const preparedAttachments = [];
      for (const file of filesToSend) {
        preparedAttachments.push(await authService.prepareEncryptedDmAttachment(file));
      }
      await ensureUploads(preparedAttachments);
      const messagePayloadText = buildMessagePayloadText(text, preparedAttachments);
      const result = await authService.sendDirectMessageWithAttachments({
        login: state.session.login,
        toLogin: chatId,
        text: messagePayloadText,
        storagePwd: state.session.storagePwdInMemory,
        attachments: preparedAttachments,
      });
      pendingFiles = [];
      if (fileInput) fileInput.value = '';
      renderPendingFiles();
      markOutgoingSent(tempId, {
        messageKey: result?.outgoingKey || '',
        baseKey: result?.baseKey || result?.localBaseKey || '',
      });
      if (result?.localOutgoingBlobB64) {
        try {
          const parsed = authService.parseSignedMessageBlob(result.localOutgoingBlobB64);
          addSignedMessageToChat({
            chatId,
            messageKey: result?.outgoingKey || parsed?.messageKey || '',
            baseKey: result?.baseKey || parsed?.baseKey || '',
            from: 'out',
            text: parsed?.text || '',
            messageType: Number(parsed?.messageType || 2),
            unread: false,
            rawBlobB64: result.localOutgoingBlobB64,
            revisionTimeMs: Number(parsed?.revisionTimeMs || 0),
            attachments: Array.isArray(parsed?.bodyAttachments) ? parsed.bodyAttachments : [],
            deleted: Boolean(parsed?.deleted),
          });
        } catch {
          // ignore local parse failure; server backlog/realtime will reconcile later
        }
      }
      renderLog(log, chatId, {
        onOpenActions: (msg) => openMessageActionsModal({
          messageText: msg?.text || '',
          onReadAloud: async () => {
            if (!isTextToSpeechConfigured(state.entrySettings)) {
              showTtsMissingConfigDialog(navigate);
              return;
            }
            await speakTextBySettings(String(msg?.text || ''), state.entrySettings);
          },
        }),
      });
      addAppLogEntry({
        level: 'info',
        source: 'outgoing-dm',
        message: `Сообщение отправлено для ${chatId}`,
        details: {
          toLogin: chatId,
          messageId: result?.outgoingKey || '',
          deliveredWsSessions: Number(result?.deliveredWsSessions || 0),
          deliveredWebPushSessions: Number(result?.deliveredWebPushSessions || 0),
        },
      });
    } catch (e) {
      addChatMessage(chatId, `Ошибка отправки: ${e.message || 'unknown'}`);
      addAppLogEntry({
        level: 'warn',
        source: 'outgoing-dm',
        message: 'Ошибка отправки личного сообщения',
        details: {
          toLogin: chatId,
          error: e?.message || 'unknown',
        },
      });
      renderLog(log, chatId, {
        onOpenActions: (msg) => openMessageActionsModal({
          messageText: msg?.text || '',
          onReadAloud: async () => {
            if (!isTextToSpeechConfigured(state.entrySettings)) {
              showTtsMissingConfigDialog(navigate);
              return;
            }
            await speakTextBySettings(String(msg?.text || ''), state.entrySettings);
          },
        }),
      });
    }
  };

  const input = form.elements.message;
  form.querySelector('#chat-file-pick')?.addEventListener('click', () => fileInput?.click());
  fileInput?.addEventListener('change', () => {
    const selected = Array.from(fileInput.files || []);
    if (selected.length > 12) {
      showToast('Можно приложить не больше 12 файлов', { kind: 'error', timeoutMs: 1400 });
    }
    pendingFiles = selected.slice(0, 12);
    renderPendingFiles();
  });
  autoResizeComposer(input);
  input?.addEventListener('input', () => autoResizeComposer(input));
  input?.addEventListener('focus', () => {
    scrollToLatestMessage(log);
  });
  input?.addEventListener('keydown', async (event) => {
    if (event.key !== 'Enter') return;
    if (event.ctrlKey) {
      event.preventDefault();
      const start = Number(input.selectionStart ?? input.value.length);
      const end = Number(input.selectionEnd ?? input.value.length);
      const value = String(input.value || '');
      input.value = `${value.slice(0, start)}\n${value.slice(end)}`;
      const nextPos = start + 1;
      try {
        input.setSelectionRange(nextPos, nextPos);
      } catch {
        // ignore
      }
      autoResizeComposer(input);
      return;
    }
    event.preventDefault();
    const text = String(input.value || '').trim();
    if (!text && pendingFiles.length === 0) return;
    input.value = '';
    autoResizeComposer(input);
    await sendTextMessage(text);
  });

  form.querySelector('#chat-voice-input')?.addEventListener('click', async () => {
    await openSpeechInputModal({
      navigate,
      onTextReady: (text) => {
        const prev = String(input.value || '').trim();
        input.value = prev ? `${prev} ${text}` : text;
        autoResizeComposer(input);
      },
      onSendText: async (text) => sendTextMessage(text),
      onSendQueued: () => {
        showToast('Сообщение будет отправлено автоматически после распознавания', { timeoutMs: 1000 });
      },
    });
  });

  form.addEventListener('submit', async (event) => {
    event.preventDefault();
    const text = input.value.trim();
    if (!text && pendingFiles.length === 0) return;
    input.value = '';
    autoResizeComposer(input);
    await sendTextMessage(text);
  });

  wrap.append(log, form);
  screen.append(wrap);
  renderLog(log, chatId, {
    onOpenActions: (msg) => openMessageActionsModal({
      messageText: msg?.text || '',
      onReadAloud: async () => {
        if (!isTextToSpeechConfigured(state.entrySettings)) {
          showTtsMissingConfigDialog(navigate);
          return;
        }
        await speakTextBySettings(String(msg?.text || ''), state.entrySettings);
      },
    }),
  });
  window.requestAnimationFrame(() => scrollToLatestMessage(log));
  window.setTimeout(() => scrollToLatestMessage(log), 180);
  void sendReadReceiptsForVisible(chatId);
  return screen;
}
async function sendReadReceiptsForVisible(chatId) {
  const pending = getChatMessages(chatId)
      .filter((row) => row?.from === 'in' && Number(row?.messageType) === 1 && !row?.readReceiptSent)
      .slice(0, 50);
  for (const row of pending) {
    const ref = parseBaseKey(row.baseKey);
    if (!ref) continue;
    try {
      await authService.sendReadReceipt({
        login: state.session.login,
        toLogin: ref.fromLogin,
        storagePwd: state.session.storagePwdInMemory,
        refToLogin: ref.toLogin,
        refFromLogin: ref.fromLogin,
        refTimeMs: ref.timeMs,
        refNonce: ref.nonce,
        refType: 1,
      });
      if (row.baseKey) {
        markReadReceiptSentByBaseKey(row.baseKey);
      } else {
        row.readReceiptSent = true;
      }
    } catch (e) {
      addAppLogEntry({
        level: 'warn',
        source: 'read-receipt',
        message: 'Не удалось отправить подтверждение прочтения',
        details: { chatId, messageKey: row.messageKey || '', error: e?.message || 'unknown' },
      });
    }
  }
}