[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_26":27,"_28":29,"_30":12,"_31":12,"_32":12,"_33":12,"_34":12,"_35":12,"_36":37},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":12},"sharedTextdoc",{"_13":14,"_15":-7,"_16":17,"_18":19,"_20":21,"_22":23,"_24":12,"_25":12},"isAuthenticated",false,"sharedTextdocId","68e6709c412881918ca81803bdd331bd","versionInt","title","Игра: Выбирай Только У — Мобильная Версия (react, Tailwind)","type","code/react","content","import React, { useEffect, useState } from \"react\";\n\n// Mobile-friendly single-file React component.\n// Tailwind CSS is used for styling (no import required in canvas preview per guidance).\n// How it works:\n// - Three difficulties: Легкий / Средний / Сложный\n// - На каждом уровне показывается сетка с буквами. Игрок должен нажимать только на буквы \"У\" (кириллица).\n// - С уровня в уровень усложняем: добавляем дополнительные отвлекающие символы (Х, А, 4), увеличиваем размер сетки.\n// - После прохождения всех уровней — выводим итоговый комментарий по результатам (время, ошибки).\n\nexport default function LetterSelectGame() {\n // difficulty: 'easy' | 'medium' | 'hard'\n const [difficulty, setDifficulty] = useState(null);\n const [level, setLevel] = useState(1);\n const [grid, setGrid] = useState([]);\n const [gridSize, setGridSize] = useState(3);\n const [targetsRemaining, setTargetsRemaining] = useState(0);\n const [mistakes, setMistakes] = useState(0);\n const [corrects, setCorrects] = useState(0);\n const [gameOver, setGameOver] = useState(false);\n const [startTime, setStartTime] = useState(null);\n const [elapsed, setElapsed] = useState(0);\n const [maxLevels, setMaxLevels] = useState(6);\n const [showNextBtn, setShowNextBtn] = useState(false);\n\n // difficulty settings influence starting grid size and growth\n const difficultySettings = {\n easy: { startSize: 3, maxSize: 5, addPerLevel: 0 },\n medium: { startSize: 3, maxSize: 6, addPerLevel: 1 },\n hard: { startSize: 4, maxSize: 7, addPerLevel: 1 }\n };\n\n // letters pools by level complexity\n // Level 1: У and Х\n // Later levels gradually add А and 4\n function getLettersForLevel(lv) {\n if (lv <= 2) return [\"У\", \"Х\"];\n if (lv <= 4) return [\"У\", \"Х\", \"А\"];\n return [\"У\", \"Х\", \"А\", \"4\"];\n }\n\n // Generate a grid for current level\n function generateGrid(lv, diff) {\n const settings = difficultySettings[diff];\n const size = Math.min(\n settings.startSize + Math.floor((lv - 1) * settings.addPerLevel),\n settings.maxSize\n );\n setGridSize(size);\n\n // Decide how many У (targets) to place: between 10% and 25% of cells, depends on level\n const cellCount = size * size;\n const minTargets = Math.max(1, Math.floor(cellCount * 0.1));\n const maxTargets = Math.max(1, Math.floor(cellCount * 0.25));\n const numTargets = Math.min(cellCount - 1, minTargets + Math.floor((lv - 1) * 0.5));\n\n const letters = getLettersForLevel(lv);\n const newGrid = new Array(cellCount).fill(null).map(() => ({\n char: \"\",\n revealed: false,\n selected: false,\n id: Math.random().toString(36).slice(2)\n }));\n\n // choose random unique indices for У\n const indices = Array.from({ length: cellCount }, (_, i) => i);\n shuffle(indices);\n const targetIndices = indices.slice(0, numTargets);\n\n // fill targets\n for (let idx of targetIndices) {\n newGrid[idx].char = \"У\";\n }\n\n // fill remaining cells with distractors chosen from letters (excluding У)\n const distractors = letters.filter((c) => c !== \"У\");\n for (let i = 0; i < cellCount; i++) {\n if (!newGrid[i].char) {\n // choose random distractor\n const ch = distractors[Math.floor(Math.random() * distractors.length)];\n newGrid[i].char = ch;\n }\n }\n\n setTargetsRemaining(numTargets);\n setGrid(newGrid);\n }\n\n // shuffle helper\n function shuffle(arr) {\n for (let i = arr.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [arr[i], arr[j]] = [arr[j], arr[i]];\n }\n }\n\n // start new game with selected difficulty\n function startGame(diff) {\n setDifficulty(diff);\n setLevel(1);\n setMistakes(0);\n setCorrects(0);\n setGameOver(false);\n setStartTime(Date.now());\n setElapsed(0);\n setShowNextBtn(false);\n generateGrid(1, diff);\n }\n\n useEffect(() => {\n if (!difficulty) return;\n generateGrid(level, difficulty);\n setShowNextBtn(false);\n }, [level, difficulty]);\n\n // timer\n useEffect(() => {\n if (!startTime || gameOver) return;\n const t = setInterval(() => {\n setElapsed(Math.floor((Date.now() - startTime) / 1000));\n }, 500);\n return () => clearInterval(t);\n }, [startTime, gameOver]);\n\n function handleCellTap(cellIndex) {\n if (gameOver) return;\n setGrid((prevGrid) => {\n const g = prevGrid.slice();\n const cell = g[cellIndex];\n if (cell.selected) return g; // already selected\n\n cell.selected = true;\n\n if (cell.char === \"У\") {\n setCorrects((c) => c + 1);\n setTargetsRemaining((t) => {\n const newT = t - 1;\n if (newT <= 0) {\n // level complete\n // small delay to show last selection\n setTimeout(() => {\n // if last level finished\n if (level >= maxLevels) {\n finishGame();\n } else {\n setShowNextBtn(true);\n }\n }, 300);\n }\n return newT;\n });\n } else {\n setMistakes((m) => m + 1);\n // optional: on mistake you can give feedback (vibration)\n if (navigator.vibrate) navigator.vibrate(50);\n }\n\n return g;\n });\n }\n\n function nextLevel() {\n setLevel((l) => l + 1);\n setShowNextBtn(false);\n }\n\n function finishGame() {\n setGameOver(true);\n }\n\n function restart() {\n setDifficulty(null);\n setGrid([]);\n setLevel(1);\n setMistakes(0);\n setCorrects(0);\n setGameOver(false);\n setStartTime(null);\n setElapsed(0);\n setShowNextBtn(false);\n }\n\n // final comment generator\n function finalComment() {\n const accuracy = corrects + mistakes > 0 ? Math.round((corrects / (corrects + mistakes)) * 100) : 100;\n const speed = elapsed > 0 ? Math.round((corrects / elapsed) * 10) / 10 : 0;\n if (accuracy >= 95 && speed >= 1.5) return \"Отлично! Быстро и почти без ошибок — ваша внимательность на высоте.\";\n if (accuracy >= 90) return \"Очень хорошо — вы быстро нашли большинство У. Есть куда расти!\";\n if (accuracy >= 75) return \"Хорошая работа. Практикуйтесь дальше — внимание и скорость улучшатся.\";\n if (accuracy >= 50) return \"Неплохо, но было много отвлечений. Сосредоточьтесь на форме буквы У.\";\n return \"Это начало — не расстраивайтесь. Попробуйте режим 'Легкий' и пройдите несколько уровней подряд.\";\n }\n\n // small UI helpers\n function modeLabel(d) {\n if (d === \"easy\") return \"Лёгкий\";\n if (d === \"medium\") return \"Средний\";\n return \"Сложный\";\n }\n\n return (\n

Игра: выбирай только «У»

\n \n

\n\n {!difficulty && (\n

Выберите уровень сложности — игра адаптирована под телефон (тапы/жесты).

\n \n \n \n

Правило: нажимайте только на буквы \"У\". За нажатие на другие — штраф (ошибка).

\n )}\n\n {difficulty && (\n

Сложность

{modeLabel(difficulty)}

Уровень

{level} / {maxLevels}

\n\n

Время: {elapsed}s

Ошибки: {mistakes}

Осталось У: {targetsRemaining}

\n\n

\n {/* grid */}\n \n {grid.map((cell, idx) => (\n handleCellTap(idx)}\n className={`aspect-square flex items-center justify-center rounded-lg text-xl md:text-2xl font-bold select-none touch-none\n ${cell.selected ? (cell.char === \"У\" ? \"bg-emerald-200\" : \"bg-red-200 line-through text-gray-600\") : \"bg-white\"}`}\n style={{\n WebkitTapHighlightColor: \"transparent\",\n userSelect: \"none\"\n }}\n >\n {cell.selected ? cell.char : cell.char}\n \n ))}\n

\n\n

\n \n \n

\n\n {showNextBtn && (\n

\n \n

\n )}\n\n {level >= maxLevels && targetsRemaining <= 0 && !gameOver && (\n

\n \n

\n )}\n \n )}\n\n {/* Results */}\n {gameOver && (\n

Результаты

Уровней пройдено: {Math.min(level, maxLevels)}

Правильных нажатий: {corrects}

Ошибок: {mistakes}

Время: {elapsed} сек.

\n Комментарий:\n

{finalComment()}

\n\n

\n \n \n

\n )}\n\n \n

\n \n );\n}\n","access","public","isModerationBlocked","isAnonifyApiKeyDetected","dd",{"_38":39,"_40":41},"disablePrefetch",true,"shouldPrefetchAccount","shouldPrefetchUser","shouldPrefetchSystemHints","promoteCss","disableSSR","stripModulepreloadImports","statsigGateEvaluationsPromise",["P",37],"traceId","17708623485094089654","traceTime",1780631245061]