fix /buttons/degrees not loading data immediately

src/routes/buttons/+page.svelte

@@ -8,7 +8,6 @@
 		pageIndexFromName,
 	} from './88x31'
 	import { writable } from 'svelte/store'
-	import { page } from '$app/stores'
 	import ButtonLink from './ButtonLink.svelte'
 	import ExternalLinkIcon from './ExternalLinkIcon.svelte'
 	import ExternalLink from './ExternalLink.svelte'

src/routes/buttons/degrees/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { writable } from 'svelte/store'
-	import { pageIndexFromName, data } from '../88x31'
+	import { pageIndexFromName, data, downloadData } from '../88x31'
 	import ButtonLink from '../ButtonLink.svelte'
 	import { onMount } from 'svelte'
 	import { page } from '$app/stores'
@@ -99,9 +99,14 @@
 		localStorage.setItem('88x31-degrees-targetPage', $targetPage)
 	}
 
-	onMount(() => {
-		return page.subscribe(async (page) => {
-			const hash = decodeURIComponent(page.url.hash.slice(1))
+	onMount(async () => {
+		await downloadData()
+
+		updateFromHash()
+	})
+
+	function updateFromHash() {
+		const hash = decodeURIComponent(location.hash.slice(1))
 		let [origin, target] = hash.split('→')
 
 		if (origin === undefined) origin = ''
@@ -112,8 +117,7 @@
 
 		if (origin !== '' && $originPage !== origin) originPage.set(origin)
 		if (target !== '' && $targetPage !== target) targetPage.set(target)
-		})
-	})
+	}
 
 	originPage.subscribe(calculatePath)
 	targetPage.subscribe(calculatePath)
@@ -126,6 +130,8 @@
 	}
 </script>
 
+<svelte:window on:hashchange={updateFromHash} />
+
 <input
 	type="text"
 	bind:value={$originPage}