diff --git a/package-lock.json b/package-lock.json index b2d5072..b3c6d12 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1542,6 +1542,20 @@ "node": ">=6" } }, + "node_modules/fdir": { + "version": "6.4.5", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.5.tgz", + "integrity": "sha512-4BG7puHpVsIYxZUbiUE3RqGloLaSSwzYie5jvasC4LWuBWzZawynvYouhjbQKw2JuIGYdm0DzIxl8iVidKlUEw==", + "license": "MIT", + "peerDependencies": { + "picomatch": "^3 || ^4" + }, + "peerDependenciesMeta": { + "picomatch": { + "optional": true + } + } + }, "node_modules/fsevents": { "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", @@ -1706,6 +1720,18 @@ "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==", "license": "ISC" }, + "node_modules/picomatch": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz", + "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, "node_modules/postcss": { "version": "8.5.3", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz", @@ -1848,6 +1874,22 @@ "node": ">=0.10.0" } }, + "node_modules/tinyglobby": { + "version": "0.2.14", + "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz", + "integrity": "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==", + "license": "MIT", + "dependencies": { + "fdir": "^6.4.4", + "picomatch": "^4.0.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/SuperchupuDev" + } + }, "node_modules/typescript": { "version": "5.6.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.3.tgz", @@ -1901,14 +1943,17 @@ "license": "ISC" }, "node_modules/vite": { - "version": "6.2.6", - "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.6.tgz", - "integrity": "sha512-9xpjNl3kR4rVDZgPNdTL0/c6ao4km69a/2ihNQbcANz8RuCOK3hQBmLSJf3bRKVQjVMda+YvizNE8AwvogcPbw==", + "version": "6.3.5", + "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz", + "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==", "license": "MIT", "dependencies": { "esbuild": "^0.25.0", + "fdir": "^6.4.4", + "picomatch": "^4.0.2", "postcss": "^8.5.3", - "rollup": "^4.30.1" + "rollup": "^4.34.9", + "tinyglobby": "^0.2.13" }, "bin": { "vite": "bin/vite.js" diff --git a/src/Puzzle.tsx b/src/Puzzle.tsx index 8486b2f..89e018d 100644 --- a/src/Puzzle.tsx +++ b/src/Puzzle.tsx @@ -1,4 +1,4 @@ -import { For } from "solid-js"; +import { For, Show } from "solid-js"; import "./App.css"; import usePuzzleModel from "./usePuzzleModel"; import FitText from "./FitText"; @@ -134,6 +134,11 @@ function Puzzle() { Submit + +
 navigator.clipboard.writeText(store.guessHistory)}>
+            {store.guessHistory}
+          
+
{store.solvedGroups.length === 4 &&
} diff --git a/src/usePuzzleModel.ts b/src/usePuzzleModel.ts index e58c7c6..a5914f2 100644 --- a/src/usePuzzleModel.ts +++ b/src/usePuzzleModel.ts @@ -19,8 +19,11 @@ type PuzzleStore = { selected: number[]; solvedGroups: Answer[]; puzzle: number[]; + guessHistory: string; }; +const emoji = ["🟨", "🟩", "🟦", "🟪"]; + export default function usePuzzleModel(id: Accessor) { const [store, setStore] = createStore({ guesses: 0, @@ -28,22 +31,22 @@ export default function usePuzzleModel(id: Accessor) { selected: [], solvedGroups: [], puzzle: [], + guessHistory: "", }); - const { - setSolution - } = useAppModel() + const { setSolution } = useAppModel(); createEffect(() => { - id() setStore({ guesses: 0, pinnedCount: 0, selected: [], solvedGroups: [], puzzle: shuffleArray(Array.from({ length: 16 }, (_, i) => i)), + guessHistory: `Connections +Puzzle #${id()}`, }); - }) + }); const answers = (): Answer[] => { return connections.find((x) => x.id === id())!.answers; @@ -61,11 +64,18 @@ export default function usePuzzleModel(id: Accessor) { }; const handleGuess = () => { - setStore('guesses', x => x+1) + setStore("guesses", (x) => x + 1); const selected = store.puzzle.length === 4 ? [0, 1, 2, 3] : store.selected; const selectedAnswers = selected.map((x) => getFromPuzzle(x)); const { level } = selectedAnswers[0]; const isCorrect = selectedAnswers.every((x) => x.level === level); + const guessHistoryLine = selectedAnswers + .map((x) => emoji[x.level]) + .join(""); + setStore({ + guessHistory: `${store.guessHistory} +${guessHistoryLine}`, + }); if (!isCorrect) { // TODO you got it wrong alert("wrong"); @@ -84,11 +94,11 @@ export default function usePuzzleModel(id: Accessor) { }); const newSolvedGroup = answers().find((x) => x.level === level); if (newSolvedGroup != null) { - setStore('solvedGroups', x => x.concat(newSolvedGroup)) + setStore("solvedGroups", (x) => x.concat(newSolvedGroup)); } if (store.puzzle.length === 0) { // completely solved! - setSolution(id(), store.guesses) + setSolution(id(), store.guesses); } };