mirror of
https://github.com/Steffo99/steffoweb.git
synced 2024-11-22 08:04:31 +00:00
veri important updat
This commit is contained in:
parent
a5b0e59b8b
commit
a4a1b148e9
3 changed files with 72 additions and 0 deletions
46
hooks/useKonamiCode.ts
Normal file
46
hooks/useKonamiCode.ts
Normal file
|
@ -0,0 +1,46 @@
|
||||||
|
import {useCallback, useEffect, useState} from "react"
|
||||||
|
|
||||||
|
|
||||||
|
const KONAMI_CODE = ["ArrowUp", "ArrowUp", "ArrowDown", "ArrowDown", "ArrowLeft", "ArrowRight", "ArrowLeft", "ArrowRight", "KeyB", "KeyA"]
|
||||||
|
|
||||||
|
|
||||||
|
export function useKonamiCode(onDone: () => void) {
|
||||||
|
const [remainingKeys, setRemainingKeys] = useState(() => [...KONAMI_CODE])
|
||||||
|
const nextKey = remainingKeys?.[0];
|
||||||
|
|
||||||
|
const checkInput = useCallback(
|
||||||
|
(event: KeyboardEvent) => {
|
||||||
|
if(event.code === nextKey) {
|
||||||
|
setRemainingKeys(rem => {
|
||||||
|
rem = [...rem]
|
||||||
|
rem.shift()
|
||||||
|
return rem
|
||||||
|
})
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
setRemainingKeys([...KONAMI_CODE])
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[nextKey]
|
||||||
|
)
|
||||||
|
|
||||||
|
useEffect(
|
||||||
|
() => {
|
||||||
|
if(!nextKey) {
|
||||||
|
onDone()
|
||||||
|
setRemainingKeys([...KONAMI_CODE])
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[nextKey, onDone]
|
||||||
|
)
|
||||||
|
|
||||||
|
useEffect(
|
||||||
|
() => {
|
||||||
|
document.addEventListener("keydown", checkInput)
|
||||||
|
return () => {
|
||||||
|
document.removeEventListener("keydown", checkInput)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[checkInput]
|
||||||
|
)
|
||||||
|
}
|
20
pages/garasauto.tsx
Normal file
20
pages/garasauto.tsx
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
import {NextPage} from "next"
|
||||||
|
import React from "react"
|
||||||
|
import {LinkPanel} from "../components/LinkPanel"
|
||||||
|
import {faCar} from "@fortawesome/free-solid-svg-icons"
|
||||||
|
|
||||||
|
|
||||||
|
const Garasauto: NextPage = () => {
|
||||||
|
return <>
|
||||||
|
<div className={"chapter-1"}>
|
||||||
|
<section className={"panel box"}>
|
||||||
|
<h3>
|
||||||
|
Silly stuff
|
||||||
|
</h3>
|
||||||
|
<LinkPanel icon={faCar} text={"Garasauto"} href={"https://www.google.com/maps/@44.6332007,10.9484818,3a,32.4y,316.16h,84.93t/data=!3m6!1e1!3m4!1sWfvO44ELO7i2ct3S-P55ew!2e0!7i16384!8i8192"}/>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Garasauto
|
|
@ -1,13 +1,19 @@
|
||||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||||
|
import {useRouter} from "next/router"
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import type {NextPage} from "next"
|
import type {NextPage} from "next"
|
||||||
import {default as Link} from "next/link"
|
import {default as Link} from "next/link"
|
||||||
import {faRedditAlien, faMastodon, faGithub, faDiscord, faTelegram, faSteam, faItchIo, faTwitter, faLinkedin, faStackOverflow} from "@fortawesome/free-brands-svg-icons"
|
import {faRedditAlien, faMastodon, faGithub, faDiscord, faTelegram, faSteam, faItchIo, faTwitter, faLinkedin, faStackOverflow} from "@fortawesome/free-brands-svg-icons"
|
||||||
import {faBorderAll, faEnvelope, faGlobe, faPlus, faFileCode, faBagShopping} from "@fortawesome/free-solid-svg-icons"
|
import {faBorderAll, faEnvelope, faGlobe, faPlus, faFileCode, faBagShopping} from "@fortawesome/free-solid-svg-icons"
|
||||||
import {LinkPanel} from "../components/LinkPanel"
|
import {LinkPanel} from "../components/LinkPanel"
|
||||||
|
import {useKonamiCode} from "../hooks/useKonamiCode"
|
||||||
|
|
||||||
|
|
||||||
const Index: NextPage = () => {
|
const Index: NextPage = () => {
|
||||||
|
const router = useRouter()
|
||||||
|
|
||||||
|
useKonamiCode(() => router.push("/garasauto"))
|
||||||
|
|
||||||
return <>
|
return <>
|
||||||
<div className={"chapter-1"}>
|
<div className={"chapter-1"}>
|
||||||
<section className={"panel box"}>
|
<section className={"panel box"}>
|
||||||
|
|
Loading…
Reference in a new issue