// Alias db.js functions
const dbGetAllEntries = getAllEntries;
const dbGetEntry = getEntry;
const dbAddEntry = addEntry;
const dbUpdateEntry = updateEntry;
const dbDeleteEntry = deleteEntry;

var BACKEND_MODE = false;
var currentUser = null;
var favoriteWords = {};
var currentTranslationSettings = { translator: 'local' };
var liveTranslationTimer = null;
var liveTranslationSeq = 0;
var selectionTimer = null;
var selectionSeq = 0;

function safeGetAllEntries() {
  if (BACKEND_MODE) return apiGetEntries();
  return dbGetAllEntries();
}

function safeAddEntry(entry) {
  if (BACKEND_MODE) return apiAddEntry(entry);
  return dbAddEntry(entry);
}

function safeUpdateEntry(id, entry) {
  if (BACKEND_MODE) return apiUpdateEntry(id, entry);
  return dbGetEntry(id).then(function(existing) {
    Object.assign(existing, entry);
    existing.updatedAt = new Date().toISOString();
    return dbUpdateEntry(existing);
  });
}

function safeDeleteEntry(id) {
  if (BACKEND_MODE) return apiDeleteEntry(id);
  return dbDeleteEntry(id);
}

var savedSelStart = 0;
var savedSelEnd = 0;

let state = {
  entries: [],
  currentId: null
};

function uuid() {
  return Date.now().toString(36) + Math.random().toString(36).slice(2, 8);
}

function todayStr() {
  const d = new Date();
  return d.getFullYear() + '-' +
    String(d.getMonth() + 1).padStart(2, '0') + '-' +
    String(d.getDate()).padStart(2, '0');
}

// ----- Render functions -----

function renderList() {
  const ul = document.getElementById('entry-list');
  ul.innerHTML = state.entries.map(e => {
    const preview = e.spanish.slice(0, 30) + (e.spanish.length > 30 ? '...' : '');
    const active = e.id === state.currentId ? 'active' : '';
    return '<li class="' + active + '" data-id="' + e.id + '">' +
      '<div class="entry-date">' + escHtml(e.date) + '</div>' +
      '<div class="entry-preview">' + escHtml(preview) + '</div>' +
      '<div class="entry-actions">' +
        '<button class="btn-delete" data-id="' + e.id + '">&#128465; 删除</button>' +
      '</div>' +
    '</li>';
  }).join('');
}

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

function renderTranslate(entry) {
  document.getElementById('translate-en').textContent = entry ? entry.english : '-';
  document.getElementById('translate-cn').textContent = entry ? entry.chinese : '-';
}

function setEditor(entry) {
  document.getElementById('entry-date').value = entry ? entry.date : todayStr();
  document.getElementById('entry-text').value = entry ? entry.spanish : '';
  const hint = document.getElementById('entry-hint');
  hint.textContent = entry && entry.spanish
    ? '已保存。修改后点击保存更新。'
    : '输入西语后实时显示翻译';
  updateLiveTranslation();
}

function clearEditor() {
  state.currentId = null;
  document.querySelectorAll('#entry-list li').forEach(function(el) { el.classList.remove('active'); });
  setEditor(null);
  renderTranslate(null);
  clearLiveTranslation();
}

// ----- Live translation & vocabulary -----

function shouldUseApiTranslation() {
  return BACKEND_MODE && (currentTranslationSettings.translator || 'local') !== 'local';
}

function translateEditorToEnZh(text) {
  if (!shouldUseApiTranslation()) {
    var local = translateText(text);
    return Promise.resolve({ english: local.english, chinese: local.chinese, provider: 'local' });
  }
  return Promise.all([
    apiTranslate({ text: text, source: 'es', target: 'en' }),
    apiTranslate({ text: text, source: 'es', target: 'zh' })
  ]).then(function(results) {
    if (!results[0].translatedText || !results[1].translatedText) {
      throw new Error('翻译接口未返回结果');
    }
    return {
      english: results[0].translatedText,
      chinese: results[1].translatedText,
      provider: 'api'
    };
  }).catch(function() {
    var local = translateText(text);
    return { english: local.english, chinese: local.chinese, provider: 'local' };
  });
}

function updateLiveTranslation() {
  var text = document.getElementById('entry-text').value;
  if (!text.trim()) {
    clearLiveTranslation();
    return;
  }
  updateVocabulary(text);
  if (!shouldUseApiTranslation()) {
    var result = translateText(text);
    document.getElementById('editor-translate-en').textContent = result.english;
    document.getElementById('editor-translate-cn').textContent = result.chinese;
    return;
  }
  if (liveTranslationTimer) clearTimeout(liveTranslationTimer);
  liveTranslationTimer = setTimeout(function() {
    fetchLiveTranslation(text);
  }, 350);
}

function fetchLiveTranslation(text) {
  var seq = ++liveTranslationSeq;
  translateEditorToEnZh(text).then(function(result) {
    if (seq !== liveTranslationSeq) return;
    if (document.getElementById('entry-text').value !== text) return;
    document.getElementById('editor-translate-en').textContent = result.english;
    document.getElementById('editor-translate-cn').textContent = result.chinese;
  });
}

function clearLiveTranslation() {
  liveTranslationSeq++;
  if (liveTranslationTimer) clearTimeout(liveTranslationTimer);
  selectionSeq++;
  if (selectionTimer) clearTimeout(selectionTimer);
  document.getElementById('editor-translate-en').textContent = '-';
  document.getElementById('editor-translate-cn').textContent = '-';
  document.getElementById('vocab-list').innerHTML = '';
  document.getElementById('selection-translate').style.display = 'none';
}

function updateVocabulary(text) {
  var vocab = getVocabulary(text);
  var container = document.getElementById('vocab-list');
  if (vocab.length === 0) {
    container.innerHTML = '<div style="font-size:0.75rem;color:var(--text-muted);font-style:italic">输入西语后显示单词</div>';
    return;
  }
  container.innerHTML = vocab.map(function(v) {
    var isFavorite = favoriteWords[v.word.toLowerCase()] ? 'active' : '';
    var favBtn = BACKEND_MODE
      ? '<button class="favorite-btn ' + isFavorite + '" data-word="' + escHtml(v.word) + '" data-en="' + escHtml(v.english) + '" data-zh="' + escHtml(v.chinese) + '" title="收藏单词">★</button>'
      : '';
    return '<div class="vocab-item">' +
      '<span class="vocab-word">' + escHtml(v.word) + '</span>' +
      '<button class="vocab-speech" data-word="' + escHtml(v.word) + '" data-lang="es">' + '\uD83D\uDD0A' + '</button>' +
      '<span class="vocab-en">' + escHtml(v.english) + '</span>' +
      '<button class="vocab-speech" data-word="' + escHtml(v.word) + '" data-lang="en">🔊</button>' +
      '<span class="vocab-zh">' + escHtml(v.chinese) + '</span>' +
      '<button class="vocab-speech" data-word="' + escHtml(v.word) + '" data-lang="zh">🔊</button>' +
      favBtn +
    '</div>';
  }).join('');
}

function handleVocabSpeech(word, lang) {
  var entry = getVocabForWord(word);
  if (entry) {
    if (lang === 'en') speakText(entry.en, 'en');
    else if (lang === 'zh') speakText(entry.zh, 'zh');
    else speakText(word, 'es');
  }
}

function handleSelection() {
  var ta = document.getElementById('entry-text');
  var selText = ta.value.substring(ta.selectionStart, ta.selectionEnd).trim();
  var el = document.getElementById('selection-translate');
  if (!selText) {
    selectionSeq++;
    if (selectionTimer) clearTimeout(selectionTimer);
    el.style.display = 'none';
    return;
  }
  if (!shouldUseApiTranslation()) {
    var result = translateSelection(selText);
    document.getElementById('selected-translation').textContent =
      result.english + ' / ' + result.chinese;
    el.style.display = 'block';
    return;
  }
  if (selectionTimer) clearTimeout(selectionTimer);
  selectionTimer = setTimeout(function() {
    fetchSelectionTranslation(selText);
  }, 250);
}

function fetchSelectionTranslation(selText) {
  var seq = ++selectionSeq;
  translateEditorToEnZh(selText).then(function(result) {
    if (seq !== selectionSeq) return;
    var ta = document.getElementById('entry-text');
    var current = ta.value.substring(ta.selectionStart, ta.selectionEnd).trim();
    if (current !== selText) return;
    document.getElementById('selected-translation').textContent =
      result.english + ' / ' + result.chinese;
    document.getElementById('selection-translate').style.display = 'block';
  });
}

// ----- Event handlers -----

function selectEntry(id) {
  state.currentId = id;
  var entry = state.entries.find(function(e) { return e.id == id; });
  var p = entry ? Promise.resolve(entry) : dbGetEntry(id);
  p.then(function(found) {
    if (!found) return;
    setEditor(found);
    renderTranslate(found);
    renderList();
  });
}

function saveCurrentEntry() {
  var date = document.getElementById('entry-date').value;
  var spanish = document.getElementById('entry-text').value.trim();
  if (!spanish) { alert('请输入西语内容'); return; }

  var saveBtn = document.getElementById('btn-save');
  saveBtn.textContent = '\u23F3 翻译中...';
  translateEditorToEnZh(spanish).then(function(translation) {
    var data = {
      date: date,
      spanish: spanish,
      english: translation.english,
      chinese: translation.chinese
    };
    var savePromise;
    if (state.currentId) {
      savePromise = safeUpdateEntry(state.currentId, data);
    } else if (BACKEND_MODE) {
      savePromise = apiAddEntry(data).then(function(entry) {
        state.currentId = entry.id;
      });
    } else {
      var entry = {
        id: uuid(),
        date: date,
        spanish: spanish,
        english: translation.english,
        chinese: translation.chinese,
        createdAt: new Date().toISOString(),
        updatedAt: new Date().toISOString()
      };
      savePromise = dbAddEntry(entry).then(function() {
        state.currentId = entry.id;
      });
    }

    return savePromise.then(function() {
      return safeGetAllEntries();
    }).then(function(entries) {
      state.entries = entries;
      renderList();
      renderTranslate({ english: translation.english, chinese: translation.chinese });
      var found = entries.find(function(e) { return e.id === state.currentId; });
      if (found) setEditor(found);
      document.getElementById('btn-save').textContent = '\uD83D\uDCBE 已保存 \u2713';
      setTimeout(function() { document.getElementById('btn-save').textContent = '\uD83D\uDCBE 保存'; }, 1500);
    });
  }).catch(function() {
    document.getElementById('btn-save').textContent = '\uD83D\uDCBE 保存';
  });
}

function newEntry() {
  clearEditor();
  document.getElementById('entry-date').value = todayStr();
  document.getElementById('entry-text').focus();
}

// ----- Modal -----

var pendingDeleteId = null;

function showDeleteModal(id) {
  pendingDeleteId = id;
  document.getElementById('modal-overlay').classList.add('show');
}

function hideDeleteModal() {
  pendingDeleteId = null;
  document.getElementById('modal-overlay').classList.remove('show');
}

function confirmDelete(id) {
  safeDeleteEntry(id).then(function() {
    if (state.currentId === id) clearEditor();
    return safeGetAllEntries();
  }).then(function(entries) {
    state.entries = entries;
    renderList();
    hideDeleteModal();
  });
}

function saveTextareaSelection() {
  var ta = document.getElementById('entry-text');
  savedSelStart = ta.selectionStart;
  savedSelEnd = ta.selectionEnd;
}

// ----- Chinese to Spanish helper -----

var helperDebounceTimer = null;
var helperRequestSeq = 0;
var helperOnlineResult = '';

function openHelperModal() {
  var ta = document.getElementById('entry-text');
  savedSelStart = ta.selectionStart;
  savedSelEnd = ta.selectionEnd;
  helperOnlineResult = '';
  if (helperDebounceTimer) clearTimeout(helperDebounceTimer);
  document.getElementById('helper-input').value = '';
  document.getElementById('helper-result').textContent = '';
  document.getElementById('helper-confirm').disabled = true;
  document.getElementById('helper-modal-overlay').classList.add('show');
  setTimeout(function() { document.getElementById('helper-input').focus(); }, 0);
}

function closeHelperModal() {
  if (helperDebounceTimer) clearTimeout(helperDebounceTimer);
  helperRequestSeq++;
  document.getElementById('helper-modal-overlay').classList.remove('show');
}

function updateHelperPreview() {
  var zh = document.getElementById('helper-input').value;
  helperOnlineResult = '';
  if (helperDebounceTimer) clearTimeout(helperDebounceTimer);
  if (!zh.trim()) {
    document.getElementById('helper-result').textContent = '';
    document.getElementById('helper-confirm').disabled = true;
    return;
  }
  var local = translateZhToEs(zh);
  if (shouldUseApiTranslation()) {
    document.getElementById('helper-result').textContent = local || '正在调用已配置的翻译接口...';
    document.getElementById('helper-confirm').disabled = true;
  } else {
    document.getElementById('helper-result').textContent = local || (BACKEND_MODE ? '本地词典未收录' : '本地词典未收录，正在尝试在线翻译...');
    document.getElementById('helper-confirm').disabled = !local;
  }
  if (shouldUseApiTranslation() || !BACKEND_MODE) {
    helperDebounceTimer = setTimeout(function() {
      translateZhOnline(zh);
    }, 600);
  }
}

function translateZhOnline(zh) {
  var seq = ++helperRequestSeq;
  var request;
  if (shouldUseApiTranslation()) {
    request = apiTranslate({ text: zh, source: 'zh', target: 'es' }).then(function(data) {
      return { translatedText: data.translatedText };
    });
  } else if (!BACKEND_MODE) {
    var url = 'https://api.mymemory.translated.net/get?q=' +
      encodeURIComponent(zh) + '&langpair=zh-CN|es';
    request = fetch(url)
      .then(function(res) { return res.json(); })
      .then(function(data) {
        return {
          translatedText: data && data.responseData && data.responseData.translatedText,
          quotaFinished: data && data.quotaFinished
        };
      });
  } else {
    var localOnly = translateZhToEs(zh);
    if (localOnly) {
      document.getElementById('helper-result').textContent = localOnly;
      document.getElementById('helper-confirm').disabled = false;
    }
    return;
  }
  request.then(function(result) {
      if (seq !== helperRequestSeq) return;
      var text = result && result.translatedText;
      if (text && !result.quotaFinished) {
        helperOnlineResult = text.trim();
        document.getElementById('helper-result').textContent = helperOnlineResult;
        document.getElementById('helper-confirm').disabled = false;
      } else {
        var local = translateZhToEs(zh);
        if (local) {
          document.getElementById('helper-result').textContent = local;
          document.getElementById('helper-confirm').disabled = false;
        } else {
          document.getElementById('helper-result').textContent = '翻译接口未返回结果，且本地词典未收录';
        }
      }
    })
    .catch(function() {
      if (seq !== helperRequestSeq) return;
      var local = translateZhToEs(zh);
      if (local) {
        document.getElementById('helper-result').textContent = local;
        document.getElementById('helper-confirm').disabled = false;
      } else {
        document.getElementById('helper-result').textContent = '在线翻译暂不可用，且本地词典未收录';
      }
    });
}

function getHelperResult() {
  if (helperOnlineResult) return helperOnlineResult;
  return translateZhToEs(document.getElementById('helper-input').value);
}

function insertSpanishAtCursor(es) {
  var ta = document.getElementById('entry-text');
  var start = savedSelStart || ta.selectionStart;
  var end = savedSelEnd || ta.selectionEnd;
  var before = ta.value.slice(0, start);
  var after = ta.value.slice(end);
  var prefix = '';
  var suffix = '';
  if (before.length > 0 && !/\s$/.test(before)) prefix = ' ';
  if (after.length > 0 && !/^\s/.test(after)) suffix = ' ';
  var insert = prefix + es + suffix;
  var newPos = start + insert.length;
  ta.value = before + insert + after;
  ta.focus();
  ta.setSelectionRange(newPos, newPos);
  savedSelStart = savedSelEnd = newPos;
  updateLiveTranslation();
}

function confirmHelperInsert() {
  var es = getHelperResult();
  if (!es) return;
  insertSpanishAtCursor(es);
  closeHelperModal();
}

// ----- Speech handler -----

function handleSpeech(lang) {
  var text = lang === 'en'
    ? document.getElementById('translate-en').textContent
    : document.getElementById('translate-cn').textContent;
  if (text && text !== '-') speakText(text, lang);
}

// ----- Backend features -----

function renderUserArea() {
  if (!currentUser) return;
  document.getElementById('user-name').textContent = currentUser.displayName || currentUser.username;
  document.getElementById('btn-logout').style.display = '';
  document.getElementById('btn-change-password').style.display = '';
  if (currentUser.isAdmin) {
    document.getElementById('admin-link').style.display = '';
  }
}

function loadBackendData() {
  safeGetAllEntries().then(function(entries) {
    state.entries = entries;
    renderList();
    setEditor(null);
    renderTranslate(null);
  });
  loadStats();
  loadFavoriteWords();
  loadSettingsForm();
}

function loadLocalData() {
  safeGetAllEntries().then(function(entries) {
    state.entries = entries;
    renderList();
    setEditor(null);
    renderTranslate(null);
  });
}

function loadStats() {
  if (!BACKEND_MODE) {
    document.getElementById('stats-content').textContent = '登录后显示统计';
    return;
  }
  apiGetStats().then(function(stats) {
    var dailyHtml = (stats.daily || []).map(function(d) {
      return d.date + ': ' + d.count + ' 篇';
    }).join(' · ');
    document.getElementById('stats-content').innerHTML =
      '<div class="stat-grid">' +
        '<div class="stat-item"><div class="stat-value">' + stats.total + '</div><div class="stat-label">总日记</div></div>' +
        '<div class="stat-item"><div class="stat-value">' + stats.streak + '</div><div class="stat-label">连续天数</div></div>' +
        '<div class="stat-item"><div class="stat-value">' + stats.week + '</div><div class="stat-label">本周</div></div>' +
        '<div class="stat-item"><div class="stat-value">' + stats.month + '</div><div class="stat-label">本月</div></div>' +
      '</div>' +
      '<div class="daily-stats">最近 7 天：' + escHtml(dailyHtml) + '</div>' +
      '<div class="daily-stats">累计西语字符：' + stats.totalChars + '</div>';
  }).catch(function() {});
}

function loadFavoriteWords() {
  if (!BACKEND_MODE) return;
  apiGetVocabulary().then(function(items) {
    favoriteWords = {};
    items.forEach(function(item) {
      favoriteWords[item.word.toLowerCase()] = item;
    });
    updateLiveTranslation();
  }).catch(function() {});
}

function toggleFavorite(btn) {
  var word = btn.dataset.word;
  var key = word.toLowerCase();
  if (favoriteWords[key]) {
    apiDeleteVocabulary(favoriteWords[key].id).then(function() {
      delete favoriteWords[key];
      btn.classList.remove('active');
    }).catch(function(err) { alert(err.message); });
  } else {
    apiAddVocabulary({
      word: word,
      english: btn.dataset.en || '',
      chinese: btn.dataset.zh || '',
      category: ''
    }).then(function(item) {
      favoriteWords[key] = item;
      btn.classList.add('active');
    }).catch(function(err) { alert(err.message); });
  }
}

function loadSettingsForm() {
  if (!BACKEND_MODE) return;
  apiGetTranslationSettings().then(function(settings) {
    currentTranslationSettings = settings;
    document.getElementById('translator-type').value = settings.translator || 'local';
    document.getElementById('api-url').value = settings.api_url || '';
    document.getElementById('api-key').value = settings.api_key || '';
    document.getElementById('extra-config').value = JSON.stringify(settings.extra_config || {}, null, 2);
  }).catch(function() {});
}

function openSettingsModal() {
  document.getElementById('settings-modal-overlay').classList.add('show');
}

function closeSettingsModal() {
  document.getElementById('settings-modal-overlay').classList.remove('show');
}

function openPasswordModal() {
  document.getElementById('password-msg').textContent = '';
  document.getElementById('password-old').value = '';
  document.getElementById('password-new').value = '';
  document.getElementById('password-confirm').value = '';
  document.getElementById('password-modal-overlay').classList.add('show');
  setTimeout(function() { document.getElementById('password-old').focus(); }, 0);
}

function closePasswordModal() {
  document.getElementById('password-modal-overlay').classList.remove('show');
}

function savePasswordModal() {
  var oldPassword = document.getElementById('password-old').value;
  var newPassword = document.getElementById('password-new').value;
  var confirmPassword = document.getElementById('password-confirm').value;
  var msg = document.getElementById('password-msg');
  if (!oldPassword) {
    msg.textContent = '请输入当前密码';
    return;
  }
  if (newPassword.length < 6) {
    msg.textContent = '新密码至少 6 位';
    return;
  }
  if (newPassword !== confirmPassword) {
    msg.textContent = '两次输入的新密码不一致';
    return;
  }
  apiChangePassword({
    oldPassword: oldPassword,
    newPassword: newPassword
  }).then(function() {
    closePasswordModal();
    alert('密码已修改');
  }).catch(function(err) {
    msg.textContent = err.message || '修改密码失败';
  });
}

function saveSettingsModal() {
  var extra = {};
  var rawExtra = document.getElementById('extra-config').value.trim();
  if (rawExtra) {
    try {
      extra = JSON.parse(rawExtra);
    } catch (e) {
      alert('扩展配置必须是合法 JSON');
      return;
    }
  }
  apiSaveTranslationSettings({
    translator: document.getElementById('translator-type').value,
    api_url: document.getElementById('api-url').value.trim(),
    api_key: document.getElementById('api-key').value.trim(),
    extra_config: extra
  }).then(function(saved) {
    currentTranslationSettings = saved;
    closeSettingsModal();
    alert('翻译设置已保存');
  }).catch(function(err) { alert(err.message); });
}

function handleLogout() {
  apiLogout().then(function() {
    location.href = 'login.html';
  }).catch(function() {
    location.href = 'login.html';
  });
}

// ----- Initialization -----

function bindAppEvents() {
  document.getElementById('entry-list').addEventListener('click', function(e) {
    var li = e.target.closest('li[data-id]');
    if (!li) return;
    if (e.target.closest('.btn-delete')) {
      showDeleteModal(li.dataset.id);
      return;
    }
    selectEntry(li.dataset.id);
  });

  document.getElementById('btn-new').addEventListener('click', newEntry);
  document.getElementById('btn-save').addEventListener('click', saveCurrentEntry);
  document.getElementById('btn-helper').addEventListener('click', openHelperModal);
  document.getElementById('helper-cancel').addEventListener('click', closeHelperModal);
  document.getElementById('helper-confirm').addEventListener('click', confirmHelperInsert);
  document.getElementById('helper-input').addEventListener('input', updateHelperPreview);

  document.getElementById('btn-settings').addEventListener('click', openSettingsModal);
  document.getElementById('settings-cancel').addEventListener('click', closeSettingsModal);
  document.getElementById('settings-save').addEventListener('click', saveSettingsModal);
  document.getElementById('btn-change-password').addEventListener('click', openPasswordModal);
  document.getElementById('password-cancel').addEventListener('click', closePasswordModal);
  document.getElementById('password-save').addEventListener('click', savePasswordModal);
  document.getElementById('btn-logout').addEventListener('click', handleLogout);

  document.querySelectorAll('#mobile-nav button').forEach(function(btn) {
    btn.addEventListener('click', function() {
      document.body.dataset.view = btn.dataset.view;
      document.querySelectorAll('#mobile-nav button').forEach(function(b) {
        b.classList.toggle('active', b === btn);
      });
    });
  });

  document.querySelectorAll('.btn-speech').forEach(function(btn) {
    btn.addEventListener('click', function() { handleSpeech(btn.dataset.lang); });
  });

  document.getElementById('entry-text').addEventListener('input', updateLiveTranslation);
  document.getElementById('entry-text').addEventListener('mouseup', function(e) { handleSelection(); saveTextareaSelection(); });
  document.getElementById('entry-text').addEventListener('keyup', function(e) { handleSelection(); saveTextareaSelection(); });

  document.getElementById('editor-vocab').addEventListener('click', function(e) {
    var fav = e.target.closest('.favorite-btn');
    if (fav) { toggleFavorite(fav); return; }
    var btn = e.target.closest('.vocab-speech');
    if (btn) handleVocabSpeech(btn.dataset.word, btn.dataset.lang);
  });

  document.getElementById('editor-vocab').addEventListener('dblclick', function(e) {
    var item = e.target.closest('.vocab-item');
    if (!item) return;
    var word = item.querySelector('.vocab-word').textContent;
    var el = e.target;
    if (el.classList.contains('vocab-en') || el.closest('.vocab-en')) {
      speakText(item.querySelector('.vocab-en').textContent, 'en');
    } else if (el.classList.contains('vocab-zh') || el.closest('.vocab-zh')) {
      speakText(item.querySelector('.vocab-zh').textContent, 'zh');
    } else {
      speakText(word, 'es');
    }
  });

  document.getElementById('entry-text').addEventListener('dblclick', function() {
    var ta = document.getElementById('entry-text');
    setTimeout(function() {
      var txt = ta.value.substring(ta.selectionStart, ta.selectionEnd).trim();
      if (txt) speakText(txt, 'es');
    }, 50);
  });

  document.getElementById('btn-speak-selected').addEventListener('click', function() {
    var ta = document.getElementById('entry-text');
    var start = savedSelStart || ta.selectionStart;
    var end = savedSelEnd || ta.selectionEnd;
    if (start === end) { start = 0; end = ta.value.length; }
    var sel = ta.value.substring(start, end).trim();
    if (sel) {
      speakText(sel, 'es');
      document.getElementById('selected-translation').textContent = sel;
      document.getElementById('selection-translate').style.display = 'block';
    }
  });

  document.querySelector('#modal-box .btn-cancel').addEventListener('click', hideDeleteModal);
  document.querySelector('#modal-box .btn-confirm').addEventListener('click', function() {
    if (pendingDeleteId) confirmDelete(pendingDeleteId);
  });

  document.addEventListener('keydown', function(e) {
    if (e.ctrlKey && e.key === 'Enter') saveCurrentEntry();
  });
}

function startApp() {
  if (location.protocol === 'file:') {
    BACKEND_MODE = false;
    loadLocalData();
    return;
  }
  apiGetMe().then(function(me) {
    BACKEND_MODE = true;
    currentUser = me;
    renderUserArea();
    loadBackendData();
  }).catch(function(err) {
    if (err && err.status === 401) {
      location.href = 'login.html';
      return;
    }
    BACKEND_MODE = false;
    loadLocalData();
  });
}

function init() {
  bindAppEvents();
  startApp();
}

document.addEventListener('DOMContentLoaded', init);