✨ Add hide arrows option, closes #24

vegeta897 · Sep 22, 2024 · 75c0077 · 75c0077
1 parent 38c0fca
commit 75c0077
Show file tree

Hide file tree

Showing 11 changed files with 32 additions and 6 deletions.
diff --git a/src/components/EndButtons.svelte b/src/components/EndButtons.svelte
@@ -52,6 +52,11 @@
 			label: 'main.options.include_times',
 			click: toggle(store.shareTimes),
 		},
+		{
+			bind: store.hideArrows,
+			label: 'main.options.hide_arrows',
+			click: toggle(store.hideArrows),
+		},
 	]
 
 	function shareText() {
@@ -61,6 +66,7 @@
 		const emojiGridParams: Parameters<typeof getEmojiGrid>[0] = {
 			guesses: get(store.guesses),
 			answer: get(store.answer),
+			hideArrows: get(store.hideArrows),
 		}
 		let totalTime = ''
 		if (get(store.shareTimes)) {
@@ -95,6 +101,7 @@
 			totalTime: get(store.shareTimes) ? get(store.totalGuessTimeString) : undefined,
 			showURL: get(store.shareURL),
 			hash: hash || undefined,
+			hideArrows: get(store.hideArrows),
 		})
 		canvas.toBlob((blob) => {
 			canvasBlob = blob!
@@ -166,7 +173,7 @@
 						on:click={toggleOption.click}
 						hideLabel
 						label={$t(toggleOption.label)}
-						style="transform: scale(1.2); touch-action: manipulation; flex-basis: 2.5rem;"
+						style="transform: scale(var(--toggle-scale)); touch-action: manipulation; flex-basis: 2.5rem;"
 						toggledColor="var(--accent-color)"
 						untoggledColor="#695d6e"
 					>
@@ -398,13 +405,17 @@
 		flex-grow: 1;
 		margin: 0 auto;
 		padding: 0 0.25rem 0 0.5rem;
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		justify-content: space-evenly;
+		--toggle-scale: 1.2;
 	}
 
 	.label {
 		order: -1;
 		flex-grow: 1;
 		font-size: 1.2em;
-		margin: 0.875rem 0;
 		padding-right: 0.625rem;
 	}
 
@@ -468,6 +479,7 @@
 		}
 		.share-options {
 			font-size: 0.75em;
+			--toggle-scale: 1;
 		}
 		.landscape-controls {
 			gap: 0.375rem;

diff --git a/src/lib/share.ts b/src/lib/share.ts
@@ -26,10 +26,12 @@ export function getEmojiGrid({
 	guesses,
 	answer,
 	guessTimes,
+	hideArrows,
 }: {
 	guesses: string[]
 	answer: string
 	guessTimes?: string[]
+	hideArrows: boolean
 }): string {
 	let timeStringPad: number
 	if (guessTimes) timeStringPad = longestStringLength(guessTimes)
@@ -42,7 +44,7 @@ export function getEmojiGrid({
 					[...word]
 						.map((letter, l) => {
 							if (letter === answer[l]) return '🟩'
-							return letter > answer[l] ? downTile : '🔼'
+							return hideArrows ? '🟪' : letter > answer[l] ? downTile : '🔼'
 						})
 						.join('') + (guessTimes ? ' ' + guessTimes[w].padStart(timeStringPad) : '')
 			)
@@ -83,6 +85,7 @@ export function drawResults(
 		totalTime,
 		showURL,
 		hash,
+		hideArrows,
 	}: {
 		highContrast: boolean
 		boardContent: Board
@@ -92,6 +95,7 @@ export function drawResults(
 		totalTime?: string
 		showURL: boolean
 		hash?: string
+		hideArrows: boolean
 	}
 ): void {
 	if (!canvas) return
@@ -122,14 +126,15 @@ export function drawResults(
 	ctx.font = '50px Arial'
 	ctx.textAlign = 'right'
 	ctx.textBaseline = 'middle'
-	const isAprilFools = aprilFools()
+	// const isAprilFools = aprilFools()
 	boardContent.forEach((row, r) => {
 		if (r >= guesses.length) return
 		row.forEach((tile, t) => {
 			let topRadius = 12
 			let bottomRadius = 12
-			if (tile.distance === 0) {
-				ctx.fillStyle = highContrast ? '#64ba2e' : '#15a850'
+			const correctTile = tile.distance === 0
+			if (correctTile || hideArrows) {
+				ctx.fillStyle = correctTile ? (highContrast ? '#64ba2e' : '#15a850') : '#a640c7'
 			} else if (tile.distance > 0) {
 				ctx.fillStyle = '#567de8'
 				bottomRadius = 31

diff --git a/src/lib/translations/de/main.json b/src/lib/translations/de/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Erlaube Tanzbuchstaben",
 		"include_link": "Link einbeziehen",
 		"include_times": "Zeiten einbeziehen",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Genaue Zeiten anzeigen"
 	},
 	"footer": {

diff --git a/src/lib/translations/en/main.json b/src/lib/translations/en/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Allow dancing letters",
 		"include_link": "Include link",
 		"include_times": "Include times",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Show precise times"
 	},
 	"footer": {

diff --git a/src/lib/translations/es/main.json b/src/lib/translations/es/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Permitir letras danzantes",
 		"include_link": "Incluir enlace",
 		"include_times": "Incluir tiempos",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Mostrar tiempos precisos"
 	},
 	"footer": {

diff --git a/src/lib/translations/fr/main.json b/src/lib/translations/fr/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Autoriser les lettres dansantes",
 		"include_link": "Inclure le lien",
 		"include_times": "Inclure temps",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Afficher des heures précises"
 	},
 	"footer": {

diff --git a/src/lib/translations/nl/main.json b/src/lib/translations/nl/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Laat dansende letters toe",
 		"include_link": "Koppeling toevoegen",
 		"include_times": "Voeg tijden toe",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Toon precieze tijden"
 	},
 	"footer": {

diff --git a/src/lib/translations/pl/main.json b/src/lib/translations/pl/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Zezwól na tańczące litery",
 		"include_link": "Dołącz link",
 		"include_times": "Dołącz czas",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Pokaż precyzyjny czas"
 	},
 	"footer": {

diff --git a/src/lib/translations/pt/main.json b/src/lib/translations/pt/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Permitir letras dançantes",
 		"include_link": "Incluir link",
 		"include_times": "Incluir tempos",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Mostrar horários precisos"
 	},
 	"footer": {

diff --git a/src/lib/translations/tr/main.json b/src/lib/translations/tr/main.json
@@ -86,6 +86,7 @@
 		"allow_dancing_letters": "Dans eden harfleri göster",
 		"include_link": "Adresi ekle",
 		"include_times": "Süreyi ekle",
+		"hide_arrows": "Hide arrows",
 		"show_precise_times": "Hassas süreleri göster"
 	},
 	"footer": {

diff --git a/src/store/app.ts b/src/store/app.ts
@@ -28,6 +28,7 @@ export const allowDancing: Writable<boolean> = storageWritable('wp-allowDancing'
 export const hideLandscape: Writable<boolean> = storageWritable('wp-hideLandscape', false)
 export const shareURL: Writable<boolean> = storageWritable('wp-shareURL', true)
 export const shareTimes: Writable<boolean> = storageWritable('wp-shareTimes', false)
+export const hideArrows: Writable<boolean> = storageWritable('wp-hideArrows', false)
 export const preciseTimes: Writable<boolean> = storageWritable('wp-preciseTimes', false)
 
 export const lastPlayedDaily: Writable<number> = storageWritable('wp-lastPlayedDaily', -1)