const channelToken = new URLSearchParams(window.location.hash.slice(1)).get('channelToken');

function notify(type, payload = {}) {
  window.parent.postMessage({ type, token: channelToken, ...payload }, '*');
}

const phases = [
  { label: 'Fase 1 — Uma letra extra',    badgeClass: 'bg-blue-100 text-blue-700',    barClass: 'bg-blue-400' },
  { label: 'Fase 2 — Letra no meio',      badgeClass: 'bg-indigo-100 text-indigo-700', barClass: 'bg-indigo-400' },
  { label: 'Fase 3 — Apagar e redigitar', badgeClass: 'bg-orange-100 text-orange-700', barClass: 'bg-orange-400' },
  { label: 'Fase 4 — Duas correções',     badgeClass: 'bg-red-100 text-red-700',       barClass: 'bg-red-400' },
  { label: 'Fase 5 — Frases longas',      badgeClass: 'bg-purple-100 text-purple-700', barClass: 'bg-purple-500' },
];

const tasks = [
  // Fase 1 – Uma letra extra no final
  { error: 'Dadoss',                         correct: 'Dados',                         hint: 'Apague a letra repetida no final.' },
  { error: 'Redee',                          correct: 'Rede',                          hint: 'Há um "e" extra no final.' },
  { error: 'Codigoo',                        correct: 'Código',                        hint: 'Apague o "o" repetido, cuidado com o acento.' },
  { error: 'Aprendisado',                    correct: 'Aprendizado',                   hint: 'Corrija a palavra "Aprendisado".' },
  { error: 'Auulass',                         correct: 'Aulas',                        hint: 'Apague o "u" e "s" duplicados.' },
  { error: 'Comunidadde',                    correct: 'Comunidade',                    hint: 'A palavra tem uma letra repetida no final.' },

  // Fase 2 – Letra extra em posição variada
  { error: 'Tecnoologia livre',              correct: 'Tecnologia livre',              hint: 'Corrija a palavra "Tecnoologia".' },
  { error: 'Soberannia digital',             correct: 'Soberania digital',             hint: 'Há um "n" a mais em "Soberannia".' },
  { error: 'Internet para toddos',           correct: 'Internet para todos',           hint: 'Corrija a palavra "toddos".' },
  { error: 'Laboratóriio de código',         correct: 'Laboratório de código',         hint: 'Um "i" está sobrando.' },
  { error: 'Educaçãao popular',              correct: 'Educação popular',              hint: 'Apague a letra extra em "Educaçãao".' },
  { error: 'Tecnologia para a comunnidade',  correct: 'Tecnologia para a comunidade',  hint: 'Há um "n" extra em "comunnidade".' },

  // Fase 3 – Apagar tudo e redigitar
  { error: 'SOBERANIA DIGITAL',    correct: 'soberania digital',    hint: 'Apague tudo e redigite em minúsculas.' },
  { error: 'dados abertos',        correct: 'DADOS ABERTOS',        hint: 'Reescreva em letras maiúsculas.' },
  { error: 'REDE COMUNITÁRIA',     correct: 'rede comunitária',     hint: 'Reescreva em letras minúsculas.' },
  { error: 'tecnologia social',    correct: 'TECNOLOGIA SOCIAL',    hint: 'Apague e redigite em MAIÚSCULAS.' },
  { error: 'CIDADANIA DIGITAL',    correct: 'cidadania digital',    hint: 'Apague e redigite em minúsculas.' },

  // Fase 4 – Frases com dois erros 
  { error: 'Tecnoologia para toddos',                  correct: 'Tecnologia para todos',                  hint: 'Corrija duas palavras com letras extras.' },
  { error: 'Internet livre para a comunnidade',        correct: 'Internet livre para a comunidade',        hint: 'A palavra final tem uma letra repetida.' },
  { error: 'Educaçãao digital fortalece o territórrio', correct: 'Educação digital fortalece o território', hint: 'Corrija as duas palavras com letras sobrando.' },
  { error: 'Redee comunitária amplia vozess locais',   correct: 'Rede comunitária amplia vozes locais',   hint: 'Há duas letras repetidas em palavras diferentes.' },
  { error: 'Soberannia digital protege daddos',        correct: 'Soberania digital protege dados',        hint: 'Corrija as duas palavras com repetição.' },

  // Fase 5 – Frases mais longas
  { error: 'A tecnoologia livre fortalece a autonomia da comunnidade.', correct: 'A tecnologia livre fortalece a autonomia da comunidade.', hint: 'Corrija as duas palavras com letras extras.' },
  { error: 'Educaçãao popular e internet livre ampliam oportuniddades.', correct: 'Educação popular e internet livre ampliam oportunidades.', hint: 'Há duas palavras com letras repetidas.' },
  { error: 'Dadoss abertos apoiam a participaçãao social.', correct: 'Dados abertos apoiam a participação social.', hint: 'Corrija as duas palavras com letras sobrando.' },
  { error: 'A redee comunitária fortalece vínculoss no território.', correct: 'A rede comunitária fortalece vínculos no território.', hint: 'Remova as repetições em duas palavras.' },
  { error: 'Soberannia digital exige cuidado com dadoss pessoais.', correct: 'Soberania digital exige cuidado com dados pessoais.', hint: 'Corrija duas palavras com letras extras.' },
  { error: 'Você já domina o Backspace e corrige textoss com atenção.', correct: 'Você já domina o Backspace e corrige textos com atenção.', hint: 'Etapa final: encontre a letra repetida.' },
];

let current = 0;
let lastNotifiedPhase = -1;
notify('started');

const phaseBadge    = document.getElementById('phaseBadge');
const stepCounter   = document.getElementById('stepCounter');
const progressBar   = document.getElementById('progressBar');
const errorText     = document.getElementById('errorText');
const correctText   = document.getElementById('correctText');
const taskHint      = document.getElementById('taskHint');
const editInput     = document.getElementById('editInput');
const feedbackEl    = document.getElementById('feedback');
const successBanner = document.getElementById('successBanner');
const taskBox       = document.getElementById('taskBox');

function getPhaseIdx(idx) { return Math.floor(idx / 6); }

function syncInputHeight() {
  editInput.style.height = 'auto';
  editInput.style.height = `${Math.max(editInput.scrollHeight, 120)}px`;
}

function showTask() {
  const t        = tasks[current];
  const phaseIdx = getPhaseIdx(current);
  const phase    = phases[phaseIdx];

  if (phaseIdx !== lastNotifiedPhase) {
    notify('running', { step: phaseIdx + 1 });
    lastNotifiedPhase = phaseIdx;
  }

  phaseBadge.textContent  = phase.label;
  phaseBadge.className    = `text-xs font-bold px-3 py-1 rounded-full transition-all ${phase.badgeClass}`;
  progressBar.className   = `h-2.5 rounded-full transition-all duration-500 ${phase.barClass}`;
  progressBar.style.width = `${(current / tasks.length) * 100}%`;
  stepCounter.textContent = `Passo ${current + 1} de ${tasks.length}`;

  errorText.textContent   = t.error;
  correctText.textContent = t.correct;
  taskHint.textContent    = t.hint;
  editInput.value         = t.error;
  editInput.disabled      = false;
  syncInputHeight();
  editInput.focus();
  feedbackEl.classList.add('hidden');
}
showTask();

editInput.addEventListener('input', () => {
  syncInputHeight();
  if (editInput.value === tasks[current].correct) {
    feedbackEl.textContent = 'Correto!';
    feedbackEl.className   = 'text-xl font-bold py-1 text-center text-green-600';
    feedbackEl.classList.remove('hidden');
    editInput.disabled = true;
    current++;
    setTimeout(() => {
      if (current >= tasks.length) {
        taskBox.classList.add('hidden');
        progressBar.style.width = '100%';
        successBanner.classList.remove('hidden');
        lucide.createIcons();
        notify('success', { score: 100 });
        notify('completed', { score: 100 });
      } else {
        showTask();
      }
    }, 700);
  }
});

editInput.addEventListener('keydown', (e) => {
  if (e.key === 'Enter') e.preventDefault();
});
