import React, { useState, useEffect } from 'react'; import { ChevronRight, Play, Pause, RotateCcw, CheckCircle, Star, Heart, Zap, Shield } from 'lucide-react'; const AnchorResourceGame = () => { const [currentStep, setCurrentStep] = useState(0); const [completedSteps, setCompletedSteps] = useState(new Set()); const [selectedResource, setSelectedResource] = useState(''); const [selectedAnchor, setSelectedAnchor] = useState(''); const [customResource, setCustomResource] = useState(''); const [isTimerRunning, setIsTimerRunning] = useState(false); const [timeLeft, setTimeLeft] = useState(0); const [gameProgress, setGameProgress] = useState(0); const [showCelebration, setShowCelebration] = useState(false); const resources = [ { id: 'calm', name: 'Спокойствие', icon: '🧘‍♀️', color: 'bg-blue-100 border-blue-300' }, { id: 'confidence', name: 'Уверенность', icon: '💪', color: 'bg-orange-100 border-orange-300' }, { id: 'joy', name: 'Радость', icon: '😊', color: 'bg-yellow-100 border-yellow-300' }, { id: 'energy', name: 'Энергия', icon: '⚡', color: 'bg-green-100 border-green-300' }, { id: 'custom', name: 'Свой вариант', icon: '✨', color: 'bg-purple-100 border-purple-300' } ]; const anchors = [ { id: 'fingers', name: 'Сжать большой и средний пальцы', description: 'На левой руке' }, { id: 'wrist', name: 'Коснуться запястья', description: 'Костяшкой указательного пальца' }, { id: 'thumb', name: 'Прижать большой палец к ладони', description: 'На правой руке' }, { id: 'ear', name: 'Слегка потянуть мочку уха', description: 'Левого уха' } ]; const steps = [ { id: 'welcome', title: 'Простое руководство по созданию «Якоря Ресурса»', content: 'Представьте, что у вас есть внутренняя кнопка. Нажав на нее, вы можете мгновенно переключить свое состояние с тревоги на спокойствие. С уныния на уверенность.\n\nЭто не фантастика. Это то, как работает ваш мозг.\n\nЭто руководство — практическая инструкция по созданию такой кнопки. Мы не будем анализировать прошлое. Мы создадим простой инструмент для управления собой здесь и сейчас.', type: 'intro', points: 10 }, { id: 'benefits', title: 'Что вы получите', content: 'В результате прохождения этой игры:', type: 'benefits', points: 15, benefits: [ { icon: '🧠', text: 'Вы поймете, как сами создаете тревогу и страх' }, { icon: '⚡', text: 'Вы научитесь вызывать сильные позитивные состояния в любой момент' }, { icon: '⚓', text: 'Вы создадите свой личный «Якорь» для мгновенного доступа к спокойствию' }, { icon: '🎯', text: 'Вы получите пошаговый алгоритм, чтобы управлять своим настроением' } ], footer: 'Вы перестанете быть заложником своих эмоций. Вы станете их хозяином.' }, { id: 'theory', title: 'Как работает тревога. Ваше внутреннее кино', content: 'Тревога и страх не случаются с вами. Вы сами их создаете.\n\nВаш мозг похож на кинотеатр с полным погружением. Когда вы тревожитесь, вы запускаете внутри себя особое кино.', type: 'theory', points: 20, theorySteps: [ { title: 'Внутренние картинки', description: 'Вы начинаете видеть в своей голове пугающие образы. Проваленный экзамен. Недовольное лицо начальника. Сцена будущего конфликта.', icon: '🎬' }, { title: 'Внутренние звуки', description: 'К картинкам подключается звуковая дорожка. Вы слышите критикующий голос. «У тебя ничего не получится!». «Ты снова облажаешься!».', icon: '🔊' }, { title: 'Телесные ощущения', description: 'Ваше тело реагирует на это кино как на реальность. Мозг не отличает яркое воображение от настоящих событий. В груди появляется тяжесть. Дыхание сбивается. Мышцы каменеют.', icon: '💫' } ], formula: 'Картинка + Звук = Ощущение', footer: 'Вы сами неосознанно создаете этот коктейль, который тело называет тревогой. Это просто выученный рефлекс. Хорошая новость в том, что его можно переучить.' }, { id: 'choose-resource', title: 'Выберите ресурс', content: 'Какое состояние вам нужно чаще всего? Выберите одно для начала.', type: 'choice', points: 20 }, { id: 'choose-anchor', title: 'Выберите якорь', content: 'Это простое действие, которое вы обычно не делаете. Оно станет вашей "кнопкой".', type: 'anchor-choice', points: 20 }, { id: 'preparation', title: 'Подготовка', content: 'Найдите тихое место. Сядьте удобно. Когда будете готовы - нажмите "Начать".', type: 'preparation', points: 15 }, { id: 'memory', title: 'Вспомните момент', content: `Вспомните яркий момент, когда вы чувствовали ${selectedResource === 'Свой вариант' ? (customResource || 'выбранное состояние') : selectedResource}. Переживите его заново.`, type: 'memory-guided', points: 30, memoryGuide: [ 'Найдите конкретный момент времени, когда это состояние было максимальным', 'Вернитесь мысленно в то место и время', 'Увидьте то, что видели тогда', 'Услышьте те звуки, голоса, музыку', 'Почувствуйте те же телесные ощущения', 'Позвольте себе полностью погрузиться в это воспоминание' ] }, { id: 'enhance', title: 'Усильте ощущения', content: 'Сейчас мы усилим ваше состояние. Я буду задавать вопросы, а вы мысленно отвечайте и делайте то, что я говорю.', type: 'enhance-guided', points: 35, guidedSteps: [ { category: 'Визуальное усиление', icon: '👁️', questions: [ 'Что именно вы видите в этом воспоминании?', 'Какие цвета вас окружают? Сделайте их более насыщенными.', 'Картинка цветная или черно-белая? Если черно-белая - добавьте цвет.', 'Вы видите себя со стороны или смотрите своими глазами? Попробуйте войти внутрь и смотреть своими глазами.', 'Сделайте картинку больше, ярче, четче. Увеличьте ее в два раза.' ] }, { category: 'Звуковое усиление', icon: '🔊', questions: [ 'Какие звуки вы слышите? Голоса, музыка, природа?', 'Сделайте эти звуки громче и чище.', 'Есть ли ваш внутренний голос? Что он говорит?', 'Измените тон голоса на более теплый и поддерживающий.', 'Добавьте приятную фоновую мелодию, если ее нет.' ] }, { category: 'Телесные ощущения', icon: '🤗', questions: [ 'Где в теле вы чувствуете это приятное состояние?', 'Какого оно размера? Увеличьте его в два раза.', 'Какой у него цвет? Сделайте его более ярким.', 'Есть ли движение? Пусть оно разливается по всему телу.', 'Почувствуйте, как это ощущение заполняет вас полностью.' ] } ] }, { id: 'set-anchor', title: 'Установите якорь', content: `На пике ощущений выполните ваш якорь: ${selectedAnchor}. Держите 10 секунд.`, type: 'anchor-set', duration: 10, points: 40 }, { id: 'test', title: 'Проверка якоря', content: 'Сейчас нужно полностью выйти из ресурсного состояния, а затем проверить якорь.', type: 'test-guided', points: 50, distractionTasks: [ 'Умножьте 17 на 8 в уме', 'Найдите в комнате 5 предметов желтого цвета', 'Вспомните, что вы ели вчера на ужин', 'Посчитайте от 100 до 90 в обратном порядке', 'Назовите 7 марок автомобилей' ] }, { id: 'troubleshooting', title: 'Почему может не получиться и что делать', content: 'Если якорь не сработал, не расстраивайтесь! Это нормально. Рассмотрим возможные причины и решения.', type: 'troubleshooting', points: 40, problems: [ { title: 'Состояние было слишком слабым', description: 'Вы не прожили воспоминание, а просто подумали о нем.', solution: 'Найдите более сильное воспоминание. Потратьте больше времени, чтобы усилить картинки, звуки и ощущения.', icon: '🎭', color: 'from-red-50 to-pink-50 border-red-300' }, { title: 'Неправильный момент установки якоря', description: 'Вы сжали палец до пика состояния или уже после него.', solution: 'Будьте внимательны. Устанавливайте якорь точно на вершине переживания.', icon: '⏰', color: 'from-orange-50 to-yellow-50 border-orange-300' }, { title: 'Неудачный якорь', description: 'Вы выбрали жест, который уже связан с другими эмоциями.', solution: 'Выберите совершенно новый и уникальный жест.', icon: '⚓', color: 'from-blue-50 to-cyan-50 border-blue-300' }, { title: 'Недостаточно повторений', description: 'Связь получилась слишком слабой, чтобы перебить привычку тревожиться.', solution: 'Повторите процесс якорения 3-5 раз в спокойной обстановке.', icon: '🔄', color: 'from-green-50 to-emerald-50 border-green-300' } ], important: 'Эта техника — мощный инструмент для работы с повседневным стрессом и плохим настроением. Она не заменяет терапию при лечении клинических расстройств, но может стать отличным помощником.' }, { id: 'complete', title: 'Поздравляем!', content: 'Вы создали свой личный якорь! Используйте его при первых признаках стресса.', type: 'completion', points: 100 } ]; useEffect(() => { let interval; if (isTimerRunning && timeLeft > 0) { interval = setInterval(() => { setTimeLeft(timeLeft - 1); }, 1000); } else if (timeLeft === 0 && isTimerRunning) { setIsTimerRunning(false); completeStep(); } return () => clearInterval(interval); }, [isTimerRunning, timeLeft]); useEffect(() => { setGameProgress((completedSteps.size / steps.length) * 100); }, [completedSteps]); const completeStep = () => { const newCompleted = new Set(completedSteps); newCompleted.add(currentStep); setCompletedSteps(newCompleted); if (currentStep === steps.length - 1) { setShowCelebration(true); setTimeout(() => setShowCelebration(false), 3000); } }; const nextStep = () => { if (currentStep < steps.length - 1) { setCurrentStep(currentStep + 1); } }; const startTimer = (duration) => { setTimeLeft(duration); setIsTimerRunning(true); }; const formatTime = (seconds) => { const mins = Math.floor(seconds / 60); const secs = seconds % 60; return `${mins}:${secs.toString().padStart(2, '0')}`; }; const currentStepData = steps[currentStep]; const isStepCompleted = completedSteps.has(currentStep); const totalPoints = Array.from(completedSteps).reduce((sum, stepIndex) => sum + steps[stepIndex].points, 0); return ( ); }; export default AnchorResourceGame;