localization.js

// All language code is based on: https://www.science.co.il/language/Locale-codes.php
const translations = {
  af: undefined,
  ar: undefined,
  az: undefined,
  be: undefined,
  bg: undefined,
  bn: {
    title: "Highest priest GPT",
    username: "ব্যবহারকারীর নাম",
    usernamePlaceholder: "আপনার নাম লিখুন",
    createChannel: "জাদুকর হিসেবে একটি নতুন চ্যানেল তৈরি করুন ✨",
    askQuestion: "প্রশ্ন জিজ্ঞাসা করুন",
    questionPlaceholder: "আপনার প্রশ্ন এইখানে লিখুন",
    askButton: "জিজ্ঞাসা করুন",
    answerQuestion: "প্রশ্নের উত্তর দিন",
    waitingQuestion: "প্রশ্নের জন্য অপেক্ষামান...",
    answerPlaceholder: "আপনার উত্তর এইখানে লিখুন",
    answerButton: "উত্তর পাঠান",
    chatLog: "চ্যাট লগ",
    shareLink: "এই লিংকটি প্রশ্নকারীর সাথে শেয়ার করুন:",
    userJoined: "{username} {role} হিসেবে যুক্ত হয়েছেন",
    questioner: "প্রশ্নকর্তা",
    responder: "উত্তরদাতা",
    copyButton: "কপি করুন",
    copied: "কপি হয়েছে!",
  },
  bs: undefined,
  ca: undefined,
  cs: undefined,
  da: undefined,
  de: undefined,
  el: undefined,
  en: {
    title: "Highest priest GPT",
    username: "Username",
    usernamePlaceholder: "Enter your name",
    createChannel: "Create a new channel as a wizard ✨",
    askQuestion: "Ask a Question",
    questionPlaceholder: "Type your question here",
    askButton: "Ask Question",
    answerQuestion: "Answer the Question",
    waitingQuestion: "Waiting for a question...",
    answerPlaceholder: "Type your answer here",
    answerButton: "Send Answer",
    chatLog: "Chat Log",
    shareLink: "Share this link with the questioner:",
    userJoined: "{username} joined as {role}",
    questioner: "questioner",
    responder: "responder",
    copyButton: "Copy",
    copied: "Copied!",
  },
  es: undefined,
  et: undefined,
  fa: undefined,
  fi: undefined,
  fr: undefined,
  he: undefined,
  hi: {
    title: "सर्वोच्च पुजारी GPT",
    username: "उपयोगकर्ता नाम",
    usernamePlaceholder: "अपना नाम दर्ज करें",
    createChannel: "जादूगर के रूप में एक नया चैनल बनाएं ✨",
    askQuestion: "एक प्रश्न पूछें",
    questionPlaceholder: "अपना प्रश्न यहां टाइप करें",
    askButton: "प्रश्न पूछें",
    answerQuestion: "प्रश्न का उत्तर दें",
    waitingQuestion: "प्रश्न की प्रतीक्षा कर रहे हैं...",
    answerPlaceholder: "अपना उत्तर यहां टाइप करें",
    answerButton: "उत्तर भेजें",
    chatLog: "चैट लॉग",
    shareLink: "प्रश्नकर्ता के साथ यह लिंक साझा करें:",
    userJoined: "{username} {role} के रूप में शामिल हुए",
    questioner: "प्रश्नकर्ता",
    responder: "उत्तरदाता",
    copyButton: "कॉपी करें",
    copied: "कॉपी किया गया!",
  },
  hr: undefined,
  hu: undefined,
  id: undefined,
  it: undefined,
  ja: undefined,
  kk: undefined,
  ko: undefined,
  lt: undefined,
  lv: undefined,
  mk: undefined,
  mn: undefined,
  ms: undefined,
  nb: undefined,
  nl: undefined,
  pl: undefined,
  pt: {
    title: "Highest priest GPT",
    username: "Nome de usuário",
    usernamePlaceholder: "Digite seu nome",
    createChannel: "Criar novo canal como mago ✨",
    askQuestion: "Faça uma pergunta",
    questionPlaceholder: "Digite sua pergunta aqui",
    askButton: "Fazer Pergunta",
    answerQuestion: "Responda a Pergunta",
    waitingQuestion: "Esperando por uma pergunta...",
    answerPlaceholder: "Digite sua pergunta aqui",
    answerButton: "Enviar Resposta",
    chatLog: "Log do Chat",
    shareLink: "Compartilhe esse link com quem irá perguntar:",
    userJoined: "{username} entrou como {role}",
    questioner: "quem irá perguntar",
    responder: "quem irá responder",
    copyButton: "Copiar",
    copied: "Copiado!",
  },
  ro: undefined,
  ru: undefined,
  sk: undefined,
  sl: undefined,
  sq: undefined,
  sr: undefined,
  sv: undefined,
  th: undefined,
  tr: undefined,
  uk: undefined,
  ur: undefined,
  uz: undefined,
  vi: {
    title: "Lãnh Chúa Tối Cao GPT",
    username: "Tên Người dùng",
    usernamePlaceholder: "Nhập tên của bạn",
    createChannel: "Tạo kênh mới với vai trò Lãnh Chúa ✨",
    askQuestion: "Câu hỏi của bạn",
    questionPlaceholder: "Nhập câu hỏi của bạn ở đây",
    askButton: "Đặt câu hỏi",
    answerQuestion: "Trả lời câu hỏi",
    waitingQuestion: "đang chờ câu hỏi...",
    answerPlaceholder: "Nhập câu trả lời của bạn ở đây",
    answerButton: "Gửi câu trả lời",
    chatLog: "Thông tin trò chuyện",
    shareLink: "Gửi liên kết với người muốn hỏi:",
    userJoined: "{username} đã tham gia với vai trò {role}",
    questioner: "người hỏi",
    responder: "người trả lời",
    copyButton: "Sao chép",
    copied: "đã sao chép!",
  },
  zh: undefined,
};
// This is where we define the available languages and their translations
const languageOptions = {
  en: "English",
  hi: "हिन्दी",
  vi: "Tiếng Việt",
  pt: "Português",
  bn: "বাংলা",
};

let currentLanguage = "en"; // Default to English

function changeLanguage(lang) {
  // Check if the selected language is available
  if (translations[lang] === undefined) {
    lang = "en"; // Default to English if an invalid language is selected
  }
  currentLanguage = lang;
  document.querySelectorAll("[data-translate]").forEach((element) => {
    const key = element.getAttribute("data-translate");
    if (translations[lang][key]) {
      if (element.tagName === "INPUT" || element.tagName === "TEXTAREA") {
        element.placeholder = translations[lang][key];
      } else {
        element.textContent = translations[lang][key];
      }
    }
  });
  // Update button text
  if (document.getElementById("joinBtn")) document.getElementById("joinBtn").textContent = translations[lang].createChannel;
  if (document.getElementById("askBtn")) document.getElementById("askBtn").textContent = translations[lang].askButton;
  if (document.getElementById("answerBtn")) document.getElementById("answerBtn").textContent = translations[lang].answerButton;

  // Update input placeholders
  if (document.getElementById("username")) document.getElementById("username").placeholder = translations[lang].usernamePlaceholder;
  if (document.getElementById("question")) document.getElementById("question").placeholder = translations[lang].questionPlaceholder;
  if (document.getElementById("answer")) document.getElementById("answer").placeholder = translations[lang].answerPlaceholder;

  // Update other text elements
  const title = document.querySelector("h1");
  if (title) title.textContent = translations[lang].title;

  const usernameLabel = document.querySelector('label[for="username"]');
  if (usernameLabel) usernameLabel.textContent = translations[lang].username;

  const questionSectionH3 = document.querySelector("#questionSection h3");
  if (questionSectionH3) questionSectionH3.textContent = translations[lang].askQuestion;

  const answerSectionH3 = document.querySelector("#answerSection h3");
  if (answerSectionH3) answerSectionH3.textContent = translations[lang].answerQuestion;

  const displayQuestion = document.querySelector("#displayQuestion");
  if (displayQuestion) displayQuestion.textContent = translations[lang].waitingQuestion;

  const chatH3 = document.querySelector("#chat h3");
  if (chatH3) chatH3.textContent = translations[lang].chatLog;

  // Update HTML lang attribute
  document.documentElement.lang = lang;

  window.updateMessages(storage);

  // Update language selector
  const languageSelector = document.getElementById("languageSelector");
  if (languageSelector) {
    languageSelector.value = lang;
  }

  //save language to local storage
  localStorage.setItem("savedLanguage", JSON.stringify(lang));
}

// function updateShareLink() {
//     const shareLink = document.getElementById('shareLink');
//     if (shareLink.innerHTML) {
//         const linkText = translations[currentLanguage].shareLink;
//         const link = shareLink.querySelector('a');
//         if (link) {
//             link.setAttribute('target', '_blank');
//             shareLink.innerHTML = `${linkText} <br> ${link.outerHTML}`;
//         }
//     }
// }

// Initialize language on page load
document.addEventListener("DOMContentLoaded", () => {
  const savedLanguage = JSON.parse(localStorage.getItem("savedLanguage"));
  if (!savedLanguage) {
    const userLang = navigator.language || navigator.userLanguage;
    const initialLang = userLang.split("-")[0]; // Get the Language code
    changeLanguage(initialLang);
  } else {
    changeLanguage(savedLanguage);
  }

  // Initialize language selector
  const languageSelector = document.getElementById("languageSelector");
  if (languageSelector) {
    Object.keys(languageOptions).forEach((lang) => {
      const option = document.createElement("option");
      option.value = lang;
      option.textContent = languageOptions[lang];
      languageSelector.appendChild(option);
    });
  }
  // Set initial value of language selector
  if (languageSelector) {
    languageSelector.value = currentLanguage;
  }
});

// Expose necessary functions and variables to the global scope
window.changeLanguage = changeLanguage;
window.currentLanguage = currentLanguage;
window.translations = translations;
window.languageOptions = languageOptions;