// Данные для игр
const cardData = {
  animals: [
    { emoji: '🐱', word: 'Кот' },
    { emoji: '🐶', word: 'Собака' },
    { emoji: '🐮', word: 'Корова' },
    { emoji: '🐷', word: 'Свинья' },
    { emoji: '🐸', word: 'Лягушка' },
    { emoji: '🐵', word: 'Обезьяна' },
    { emoji: '🦁', word: 'Лев' },
    { emoji: '🐘', word: 'Слон' }
  ],
  fruits: [
    { emoji: '🍎', word: 'Яблоко' },
    { emoji: '🍌', word: 'Банан' },
    { emoji: '🍇', word: 'Виноград' },
    { emoji: '🍊', word: 'Апельсин' },
    { emoji: '🍓', word: 'Клубника' },
    { emoji: '🍉', word: 'Арбуз' },
    { emoji: '🍑', word: 'Персик' },
    { emoji: '🍒', word: 'Вишня' }
  ],
  transport: [
    { emoji: '🚗', word: 'Машина' },
    { emoji: '🚕', word: 'Такси' },
    { emoji: '🚌', word: 'Автобус' },
    { emoji: '🚎', word: 'Троллейбус' },
    { emoji: '🚂', word: 'Поезд' },
    { emoji: '✈️', word: 'Самолёт' },
    { emoji: '🚁', word: 'Вертолёт' },
    { emoji: '🚢', word: 'Корабль' }
  ],
  colors: [
    { emoji: '🔴', word: 'Красный' },
    { emoji: '🔵', word: 'Синий' },
    { emoji: '🟢', word: 'Зелёный' },
    { emoji: '🟡', word: 'Жёлтый' },
    { emoji: '🟠', word: 'Оранжевый' },
    { emoji: '🟣', word: 'Фиолетовый' },
    { emoji: '⚫', word: 'Чёрный' },
    { emoji: '⚪', word: 'Белый' }
  ]
};

const sounds = ['А', 'О', 'У', 'Ы', 'Э', 'М', 'П', 'Б', 'Т', 'Д'];

const animalSounds = [
  { name: 'Кот', emoji: '🐱', sound: 'Мяу-мяу!' },
  { name: 'Собака', emoji: '🐶', sound: 'Гав-гав!' },
  { name: 'Корова', emoji: '🐮', sound: 'Му-у-у!' },
  { name: 'Лягушка', emoji: '🐸', sound: 'Ква-ква!' },
  { name: 'Овца', emoji: '🐑', sound: 'Бее-ее!' },
  { name: 'Петух', emoji: '🐓', sound: 'Ку-ка-ре-ку!' }
];

const stories = [
  {
    name: 'Колобок',
    correctOrder: ['👵', '🥧', '🫓'],
    pieces: ['🫓', '👵', '🥧']
  },
  {
    name: 'Репка',
    correctOrder: ['🌱', '👴', '👵'],
    pieces: ['👵', '🌱', '👴']
  },
  {
    name: 'День',
    correctOrder: ['🌅', '☀️', '🌙'],
    pieces: ['🌙', '🌅', '☀️']
  }
];

// Состояние игры
let currentCategory = 'animals';
let currentCardIndex = 0;
let currentSoundIndex = 0;
let currentQuestion = null;
let currentStory = null;
let selectedPiece = null;
let storyState = [];

// Навигация
function showMenu() {
  document.querySelectorAll('.game-section').forEach(section => {
    section.classList.add('hidden');
  });
  document.getElementById('menu').classList.remove('hidden');
}

function showGame(gameId) {
  document.getElementById('menu').classList.add('hidden');
  document.querySelectorAll('.game-section').forEach(section => {
    section.classList.add('hidden');
  });
  document.getElementById('game-' + gameId).classList.remove('hidden');
  
  if (gameId === 'cards') initCards();
  if (gameId === 'sounds') initSounds();
  if (gameId === 'animals') initAnimalQuiz();
  if (gameId === 'story') initStory();
}

// Клик по карточкам игр
document.querySelectorAll('.game-card').forEach(card => {
  card.addEventListener('click', () => {
    const gameId = card.dataset.game;
    showGame(gameId);
  });
});

// ===== ИГРА 1: Карточки со словами =====
function initCards() {
  currentCardIndex = 0;
  showCard();
}

function showCard() {
  const cards = cardData[currentCategory];
  const card = cards[currentCardIndex];
  document.getElementById('card-image').textContent = card.emoji;
  document.getElementById('card-word').textContent = card.word;
}

document.querySelectorAll('.category-btn').forEach(btn => {
  btn.addEventListener('click', () => {
    document.querySelectorAll('.category-btn').forEach(b => b.classList.remove('active'));
    btn.classList.add('active');
    currentCategory = btn.dataset.category;
    currentCardIndex = 0;
    showCard();
  });
});

function nextCard() {
  const cards = cardData[currentCategory];
  currentCardIndex = (currentCardIndex + 1) % cards.length;
  showCard();
}

function prevCard() {
  const cards = cardData[currentCategory];
  currentCardIndex = (currentCardIndex - 1 + cards.length) % cards.length;
  showCard();
}

function speakWord() {
  const card = cardData[currentCategory][currentCardIndex];
  speak(card.word);
}

// ===== ИГРА 2: Звуки и буквы =====
function initSounds() {
  currentSoundIndex = 0;
  showSound();
}

function showSound() {
  const letter = sounds[currentSoundIndex];
  document.getElementById('letter-display').textContent = letter;
  document.getElementById('exercise-text').textContent = 'Повтори звук: "' + letter + '-а-а"';
}

function nextSound() {
  currentSoundIndex = (currentSoundIndex + 1) % sounds.length;
  showSound();
}

function playSoundExample() {
  const letter = sounds[currentSoundIndex];
  speak(letter + '-а-а');
}

// ===== ИГРА 3: Викторина с животными =====
function initAnimalQuiz() {
  nextQuestion();
}

function nextQuestion() {
  currentQuestion = animalSounds[Math.floor(Math.random() * animalSounds.length)];
  document.getElementById('feedback').textContent = '';
  document.getElementById('feedback').className = 'feedback';
  document.getElementById('next-question-btn').classList.add('hidden');
  
  const options = [currentQuestion];
  while (options.length < 4) {
    const random = animalSounds[Math.floor(Math.random() * animalSounds.length)];
    if (!options.includes(random)) {
      options.push(random);
    }
  }
  
  options.sort(() => Math.random() - 0.5);
  
  const container = document.getElementById('quiz-options');
  container.innerHTML = '';
  options.forEach(animal => {
    const btn = document.createElement('button');
    btn.className = 'quiz-option';
    btn.textContent = animal.emoji + ' ' + animal.name;
    btn.onclick = () => checkAnswer(animal, btn);
    container.appendChild(btn);
  });
}

function playAnimalSound() {
  speak(currentQuestion.sound);
}

function checkAnswer(selected, button) {
  const buttons = document.querySelectorAll('.quiz-option');
  buttons.forEach(btn => {
    btn.disabled = true;
    if (btn.textContent.includes(selected.name) && selected.name === currentQuestion.name) {
      btn.classList.add('correct');
    }
  });
  
  if (selected.name === currentQuestion.name) {
    document.getElementById('feedback').textContent = '🎉 Правильно! Молодец!';
    document.getElementById('feedback').className = 'feedback success';
    speak('Правильно! Это ' + currentQuestion.name);
    document.getElementById('next-question-btn').classList.remove('hidden');
  } else {
    button.classList.add('wrong');
    document.getElementById('feedback').textContent = 'Попробуй ещё раз!';
    document.getElementById('feedback').className = 'feedback error';
    speak('Попробуй ещё раз');
    setTimeout(() => {
      buttons.forEach(btn => {
        btn.disabled = false;
        btn.classList.remove('wrong');
      });
      document.getElementById('feedback').textContent = '';
    }, 1500);
  }
}

// ===== ИГРА 4: Составь историю =====
function initStory() {
  currentStory = stories[Math.floor(Math.random() * stories.length)];
  storyState = [null, null, null];
  selectedPiece = null;
  
  document.getElementById('story-feedback').textContent = '';
  document.getElementById('story-feedback').className = 'feedback';
  
  const slots = document.querySelectorAll('.story-slot');
  slots.forEach(slot => {
    slot.innerHTML = slot.dataset.slot + 1;
    slot.classList.remove('filled');
    slot.onclick = () => selectSlot(parseInt(slot.dataset.slot));
  });
  
  const piecesContainer = document.getElementById('story-pieces');
  piecesContainer.innerHTML = '';
  currentStory.pieces.forEach((piece, index) => {
    const pieceEl = document.createElement('div');
    pieceEl.className = 'story-piece';
    pieceEl.textContent = piece;
    pieceEl.dataset.index = index;
    pieceEl.onclick = () => selectPiece(index, pieceEl);
    piecesContainer.appendChild(pieceEl);
  });
}

function selectPiece(index, element) {
  document.querySelectorAll('.story-piece').forEach(p => p.classList.remove('selected'));
  element.classList.add('selected');
  selectedPiece = { index, element, value: currentStory.pieces[index] };
}

function selectSlot(slotIndex) {
  if (!selectedPiece) return;
  
  const slots = document.querySelectorAll('.story-slot');
  const slot = slots[slotIndex];
  
  if (slot.classList.contains('filled')) {
    const oldPiece = slot.querySelector('.piece');
    if (oldPiece) {
      const piecesContainer = document.getElementById('story-pieces');
      const oldPieceEl = document.createElement('div');
      oldPieceEl.className = 'story-piece';
      oldPieceEl.textContent = oldPiece.textContent;
      oldPieceEl.dataset.index = storyState[slotIndex];
      oldPieceEl.onclick = () => selectPiece(storyState[slotIndex], oldPieceEl);
      piecesContainer.appendChild(oldPieceEl);
    }
  }
  
  slot.innerHTML = '';
  const pieceEl = document.createElement('div');
  pieceEl.className = 'piece';
  pieceEl.textContent = selectedPiece.value;
  slot.appendChild(pieceEl);
  slot.classList.add('filled');
  
  storyState[slotIndex] = selectedPiece.index;
  
  if (selectedPiece.element.parentNode.id === 'story-pieces') {
    selectedPiece.element.remove();
  }
  
  selectedPiece = null;
  document.querySelectorAll('.story-piece').forEach(p => p.classList.remove('selected'));
}

function resetStory() {
  initStory();
}

function checkStory() {
  const filledSlots = storyState.filter(s => s !== null);
  if (filledSlots.length < 3) {
    document.getElementById('story-feedback').textContent = 'Заполни все ячейки!';
    document.getElementById('story-feedback').className = 'feedback error';
    speak('Заполни все ячейки');
    return;
  }
  
  const isCorrect = JSON.stringify(storyState) === JSON.stringify(currentStory.correctOrder.map((emoji, i) => 
    currentStory.pieces.indexOf(currentStory.correctOrder[i])
  ));
  
  if (isCorrect) {
    document.getElementById('story-feedback').textContent = '🌟 Отлично! История правильная!';
    document.getElementById('story-feedback').className = 'feedback success';
    speak('Молодец! Всё правильно!');
  } else {
    document.getElementById('story-feedback').textContent = 'Попробуй ещё раз!';
    document.getElementById('story-feedback').className = 'feedback error';
    speak('Попробуй ещё раз');
  }
}

// ===== Утилита: Синтез речи =====
function speak(text) {
  if ('speechSynthesis' in window) {
    const utterance = new SpeechSynthesisUtterance(text);
    utterance.lang = 'ru-RU';
    utterance.rate = 0.9;
    utterance.pitch = 1.1;
    speechSynthesis.speak(utterance);
  }
}

// Инициализация
showMenu();