// Данные для игр const cardData = { animals: [ { emoji: '🐱', word: 'Кот' }, { emoji: '🐶', word: 'Собака' }, { emoji: '🐮', word: 'Корова' }, { emoji: '🐷', word: 'Свинья' }, { emoji: '🐸', word: 'Лягушка' }, { emoji: '🐵', word: 'Обезьяна' }, { emoji: '🦁', word: 'Лев' }, { emoji: '🐘', word: 'Слон' }, { 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: 'Вишня' }, { 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: 'Корабль' }, { 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: 'Белый' }, { emoji: '🟤', word: 'Коричневый' }, { emoji: '🩷', word: 'Розовый' }, { emoji: '🩵', word: 'Голубой' }, { emoji: '🩶', word: 'Серый' } ], vegetables: [ { emoji: '🥕', word: 'Морковь' }, { emoji: '🥔', word: 'Картофель' }, { emoji: '🥒', word: 'Огурец' }, { emoji: '🍅', word: 'Помидор' }, { emoji: '🥬', word: 'Капуста' }, { emoji: '🍆', word: 'Баклажан' }, { emoji: '🫑', word: 'Перец' }, { emoji: '🧅', word: 'Лук' }, { emoji: '🧄', word: 'Чеснок' }, { emoji: '🥦', word: 'Брокколи' } ], family: [ { 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: 'Ку-ка-ре-ку!' }, { 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: ['🌙', '🌅', '☀️'] }, { name: 'Дождик', correctOrder: ['☁️', '🌧️', '🌈'], pieces: ['🌈', '☁️', '🌧️'] }, { name: 'Дерево', correctOrder: ['🌰', '🌱', '🌳'], pieces: ['🌳', '🌰', '🌱'] }, { 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 = []; let currentFindItem = null; let matchCards = []; let matchFlipped = []; let matchPairs = 0; let matchMoves = 0; let currentFirstLetter = null; let currentSyllable = null; let syllableState = []; // Навигация 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(); if (gameId === 'find') initFind(); if (gameId === 'match') initMatch(); if (gameId === 'firstletter') initFirstLetter(); if (gameId === 'syllables') initSyllable(); } // Клик по карточкам игр 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('Попробуй ещё раз'); } } // ===== ИГРА 5: Найди лишнее ===== const findCategories = [ { items: ['🍎', '🍌', '🍇', '🚗'], answer: 3, name: 'Транспорт среди фруктов' }, { items: ['🐱', '🐶', '🐮', '🍎'], answer: 3, name: 'Фрукт среди животных' }, { items: ['🔴', '🔵', '🟢', '🐱'], answer: 3, name: 'Животное среди цветов' }, { items: ['🚗', '🚌', '🚂', '🍌'], answer: 3, name: 'Фрукт среди транспорта' }, { items: ['👨', '👩', '👦', '🍎'], answer: 3, name: 'Фрукт среди людей' }, { items: ['🥕', '🥔', '🥒', '🍌'], answer: 3, name: 'Фрукт среди овощей' }, { items: ['✈️', '🚁', '🚂', '🐶'], answer: 3, name: 'Животное среди транспорта' }, { items: ['🌅', '☀️', '🌙', '🍎'], answer: 3, name: 'Фрукт про времена суток' } ]; function initFind() { nextFindQuestion(); } function nextFindQuestion() { currentFindItem = findCategories[Math.floor(Math.random() * findCategories.length)]; document.getElementById('find-feedback').textContent = ''; document.getElementById('find-feedback').className = 'feedback'; document.getElementById('next-find-btn').classList.add('hidden'); const container = document.getElementById('find-items'); container.innerHTML = ''; currentFindItem.items.forEach((emoji, index) => { const item = document.createElement('div'); item.className = 'find-item'; item.innerHTML = '' + emoji + 'Предмет ' + (index + 1) + ''; item.onclick = () => checkFind(index, item); container.appendChild(item); }); } function checkFind(selectedIndex, item) { if (selectedIndex === currentFindItem.answer) { item.classList.add('correct'); document.getElementById('find-feedback').textContent = '🎉 Правильно! Молодец!'; document.getElementById('find-feedback').className = 'feedback success'; speak('Правильно! Это лишнее!'); document.getElementById('next-find-btn').classList.remove('hidden'); document.querySelectorAll('.find-item').forEach(i => i.style.pointerEvents = 'none'); } else { item.classList.add('wrong'); document.getElementById('find-feedback').textContent = 'Подумай ещё!'; document.getElementById('find-feedback').className = 'feedback error'; speak('Попробуй ещё раз'); setTimeout(() => { item.classList.remove('wrong'); document.getElementById('find-feedback').textContent = ''; }, 1000); } } // ===== ИГРА 6: Найди пару ===== const matchEmojis = ['🐱', '🐶', '🐮', '🐸', '🍎', '🍌', '🚗', '🚌', '🔴', '🔵', '🟢', '🟡']; function initMatch() { matchFlipped = []; matchPairs = 0; matchMoves = 0; document.getElementById('match-moves').textContent = '0'; document.getElementById('match-pairs').textContent = '0/6'; document.getElementById('match-feedback').textContent = ''; document.getElementById('match-feedback').className = 'feedback'; const selected = matchEmojis.slice(0, 6); const cards = [...selected, ...selected]; cards.sort(() => Math.random() - 0.5); const grid = document.getElementById('match-grid'); grid.innerHTML = ''; cards.forEach((emoji, index) => { const card = document.createElement('div'); card.className = 'match-card'; card.dataset.emoji = emoji; card.dataset.index = index; card.innerHTML = '' + emoji + ''; card.onclick = () => flipCard(card); grid.appendChild(card); }); } function flipCard(card) { if (matchFlipped.length >= 2 || card.classList.contains('flipped') || card.classList.contains('matched')) { return; } card.classList.add('flipped'); card.querySelector('span').style.visibility = 'visible'; matchFlipped.push(card); if (matchFlipped.length === 2) { matchMoves++; document.getElementById('match-moves').textContent = matchMoves; const [card1, card2] = matchFlipped; if (card1.dataset.emoji === card2.dataset.emoji) { card1.classList.add('matched'); card2.classList.add('matched'); matchPairs++; document.getElementById('match-pairs').textContent = matchPairs + '/6'; matchFlipped = []; if (matchPairs === 6) { document.getElementById('match-feedback').textContent = '🌟 Отлично! Все пары найдены!'; document.getElementById('match-feedback').className = 'feedback success'; speak('Молодец! Все пары найдены!'); } } else { setTimeout(() => { card1.classList.remove('flipped'); card2.classList.remove('flipped'); card1.querySelector('span').style.visibility = 'hidden'; card2.querySelector('span').style.visibility = 'hidden'; matchFlipped = []; }, 1000); } } } // ===== ИГРА 7: Первая буква ===== const firstLetterWords = [ { word: 'Аист', emoji: '🦢', letter: 'А' }, { word: 'Банан', emoji: '🍌', letter: 'Б' }, { word: 'Виноград', emoji: '🍇', letter: 'В' }, { word: 'Груша', emoji: '🍐', letter: 'Г' }, { word: 'Дом', emoji: '🏠', letter: 'Д' }, { word: 'Енот', emoji: '🦝', letter: 'Е' }, { word: 'Жираф', emoji: '🦒', letter: 'Ж' }, { word: 'Зонт', emoji: '☂️', letter: 'З' }, { word: 'Игла', emoji: '🪡', letter: 'И' }, { word: 'Йогурт', emoji: '🥛', letter: 'Й' }, { word: 'Кот', emoji: '🐱', letter: 'К' }, { word: 'Лев', emoji: '🦁', letter: 'Л' }, { word: 'Машина', emoji: '🚗', letter: 'М' }, { word: 'Ножницы', emoji: '✂️', letter: 'Н' }, { word: 'Облако', emoji: '☁️', letter: 'О' }, { word: 'Поезд', emoji: '🚂', letter: 'П' }, { word: 'Рыба', emoji: '🐟', letter: 'Р' }, { word: 'Солнце', emoji: '☀️', letter: 'С' }, { word: 'Торт', emoji: '🎂', letter: 'Т' }, { word: 'Утка', emoji: '🦆', letter: 'У' }, { word: 'Флаг', emoji: '🚩', letter: 'Ф' }, { word: 'Хлеб', emoji: '🍞', letter: 'Х' }, { word: 'Цветок', emoji: '🌸', letter: 'Ц' }, { word: 'Часы', emoji: '⏰', letter: 'Ч' }, { word: 'Шар', emoji: '🎈', letter: 'Ш' }, { word: 'Щётка', emoji: '🪥', letter: 'Щ' }, { word: 'Экскаватор', emoji: '🚜', letter: 'Э' }, { word: 'Юла', emoji: '🌀', letter: 'Ю' }, { word: 'Яблоко', emoji: '🍎', letter: 'Я' } ]; function initFirstLetter() { nextFirstLetterQuestion(); } function nextFirstLetterQuestion() { currentFirstLetter = firstLetterWords[Math.floor(Math.random() * firstLetterWords.length)]; document.getElementById('firstletter-feedback').textContent = ''; document.getElementById('firstletter-feedback').className = 'feedback'; document.getElementById('next-firstletter-btn').classList.add('hidden'); document.getElementById('word-display').innerHTML = '' + currentFirstLetter.emoji + '' + currentFirstLetter.word + ''; const letters = ['А', 'Б', 'В', 'Г', 'Д', 'Е', 'Ж', 'З', 'И', 'Й', 'К', 'Л', 'М', 'Н', 'О', 'П', 'Р', 'С', 'Т', 'У', 'Ф', 'Х', 'Ц', 'Ч', 'Ш', 'Щ', 'Э', 'Ю', 'Я']; const options = [currentFirstLetter.letter]; while (options.length < 6) { const random = letters[Math.floor(Math.random() * letters.length)]; if (!options.includes(random)) { options.push(random); } } options.sort(() => Math.random() - 0.5); const container = document.getElementById('letter-options'); container.innerHTML = ''; options.forEach(letter => { const btn = document.createElement('button'); btn.className = 'letter-option'; btn.textContent = letter; btn.onclick = () => checkFirstLetter(letter, btn); container.appendChild(btn); }); } function checkFirstLetter(selected, button) { const buttons = document.querySelectorAll('.letter-option'); buttons.forEach(btn => btn.disabled = true); if (selected === currentFirstLetter.letter) { button.classList.add('correct'); document.getElementById('firstletter-feedback').textContent = '🎉 Правильно! Это буква ' + selected; document.getElementById('firstletter-feedback').className = 'feedback success'; speak('Правильно! Первая буква ' + selected); document.getElementById('next-firstletter-btn').classList.remove('hidden'); } else { button.classList.add('wrong'); document.getElementById('firstletter-feedback').textContent = 'Попробуй ещё раз!'; document.getElementById('firstletter-feedback').className = 'feedback error'; speak('Попробуй ещё раз'); setTimeout(() => { buttons.forEach(btn => { btn.disabled = false; btn.classList.remove('wrong'); }); document.getElementById('firstletter-feedback').textContent = ''; }, 1500); } } // ===== ИГРА 8: Слоги ===== const syllableWords = [ { word: 'МА-ШИ-НА', syllables: ['МА', 'ШИ', 'НА'], scrambled: ['НА', 'МА', 'ШИ'] }, { word: 'МО-ЛО-КО', syllables: ['МО', 'ЛО', 'КО'], scrambled: ['КО', 'МО', 'ЛО'] }, { word: 'СО-БА-КА', syllables: ['СО', 'БА', 'КА'], scrambled: ['КА', 'СО', 'БА'] }, { word: 'ЯБ-ЛО-КО', syllables: ['ЯБ', 'ЛО', 'КО'], scrambled: ['КО', 'ЯБ', 'ЛО'] }, { word: 'ДЕ-РЕ-ВО', syllables: ['ДЕ', 'РЕ', 'ВО'], scrambled: ['ВО', 'ДЕ', 'РЕ'] }, { word: 'МО-РО-ЖЕ-НОЕ', syllables: ['МО', 'РО', 'ЖЕ', 'НОЕ'], scrambled: ['НОЕ', 'МО', 'ЖЕ', 'РО'] }, { word: 'ВЕ-ЛО-СИ-ПЕД', syllables: ['ВЕ', 'ЛО', 'СИ', 'ПЕД'], scrambled: ['ПЕД', 'ВЕ', 'СИ', 'ЛО'] }, { word: 'ТЕ-ЛЕ-ФОН', syllables: ['ТЕ', 'ЛЕ', 'ФОН'], scrambled: ['ФОН', 'ТЕ', 'ЛЕ'] }, { word: 'КА-РАН-ДАШ', syllables: ['КА', 'РАН', 'ДАШ'], scrambled: ['ДАШ', 'КА', 'РАН'] }, { word: 'МО-ЛО-ТOK', syllables: ['МО', 'ЛО', 'ТОК'], scrambled: ['ТОК', 'МО', 'ЛО'] } ]; function initSyllable() { resetSyllable(); } function resetSyllable() { currentSyllable = syllableWords[Math.floor(Math.random() * syllableWords.length)]; syllableState = []; document.getElementById('syllable-feedback').textContent = ''; document.getElementById('syllable-feedback').className = 'feedback'; document.getElementById('syllable-target').textContent = currentSyllable.word; const piecesContainer = document.getElementById('syllable-pieces'); piecesContainer.innerHTML = ''; currentSyllable.scrambled.forEach((syllable, index) => { const piece = document.createElement('div'); piece.className = 'syllable-piece'; piece.textContent = syllable; piece.dataset.index = index; piece.onclick = () => selectSyllablePiece(index, piece); piecesContainer.appendChild(piece); }); const slotsContainer = document.getElementById('syllable-slots'); slotsContainer.innerHTML = ''; for (let i = 0; i < currentSyllable.syllables.length; i++) { const slot = document.createElement('div'); slot.className = 'syllable-slot'; slot.dataset.slot = i; slot.textContent = '...'; slot.onclick = () => placeSyllableInSlot(i); slotsContainer.appendChild(slot); } } let selectedSyllablePiece = null; function selectSyllablePiece(index, element) { document.querySelectorAll('.syllable-piece').forEach(p => p.classList.remove('selected')); element.classList.add('selected'); selectedSyllablePiece = { index, element, value: currentSyllable.scrambled[index] }; } function placeSyllableInSlot(slotIndex) { if (!selectedSyllablePiece) return; const slots = document.querySelectorAll('.syllable-slot'); const slot = slots[slotIndex]; if (slot.classList.contains('filled')) { const oldSyllable = slot.textContent; const piecesContainer = document.getElementById('syllable-pieces'); const oldPiece = document.createElement('div'); oldPiece.className = 'syllable-piece'; oldPiece.textContent = oldSyllable; oldPiece.onclick = () => selectSyllablePiece(-1, oldPiece); piecesContainer.appendChild(oldPiece); } slot.textContent = selectedSyllablePiece.value; slot.classList.add('filled'); syllableState[slotIndex] = selectedSyllablePiece.value; if (selectedSyllablePiece.element.parentNode.id === 'syllable-pieces') { selectedSyllablePiece.element.remove(); } selectedSyllablePiece = null; document.querySelectorAll('.syllable-piece').forEach(p => p.classList.remove('selected')); } function checkSyllable() { const filledSlots = syllableState.filter(s => s !== undefined); if (filledSlots.length < currentSyllable.syllables.length) { document.getElementById('syllable-feedback').textContent = 'Заполни все ячейки!'; document.getElementById('syllable-feedback').className = 'feedback error'; speak('Заполни все ячейки'); return; } const isCorrect = JSON.stringify(syllableState) === JSON.stringify(currentSyllable.syllables); if (isCorrect) { document.getElementById('syllable-feedback').textContent = '🌟 Отлично! Слово собрано правильно!'; document.getElementById('syllable-feedback').className = 'feedback success'; speak('Молодец! Всё правильно!'); } else { document.getElementById('syllable-feedback').textContent = 'Попробуй ещё раз!'; document.getElementById('syllable-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();