diff --git a/package.json b/package.json index 5382787..6328dc6 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "format": "prettier -w src" }, "dependencies": { + "framer-motion": "^11.0.5", "next": "14.1.0", "react": "^18", "react-dom": "^18", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7adade8..85abacd 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,6 +5,9 @@ settings: excludeLinksFromLockfile: false dependencies: + framer-motion: + specifier: ^11.0.5 + version: 11.0.5(react-dom@18.2.0)(react@18.2.0) next: specifier: 14.1.0 version: 14.1.0(react-dom@18.2.0)(react@18.2.0) @@ -73,6 +76,20 @@ packages: dependencies: regenerator-runtime: 0.14.1 + /@emotion/is-prop-valid@0.8.8: + resolution: {integrity: sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==} + requiresBuild: true + dependencies: + '@emotion/memoize': 0.7.4 + dev: false + optional: true + + /@emotion/memoize@0.7.4: + resolution: {integrity: sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==} + requiresBuild: true + dev: false + optional: true + /@eslint-community/eslint-utils@4.4.0(eslint@8.56.0): resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} @@ -1275,6 +1292,24 @@ packages: resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==} dev: true + /framer-motion@11.0.5(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-Lb0EYbQcSK/pgyQUJm+KzsQrKrJRX9sFRyzl9hSr9gFG4Mk8yP7BjhuxvRXzblOM/+JxycrJdCDVmOQBsjpYlw==} + peerDependencies: + react: ^18.0.0 + react-dom: ^18.0.0 + peerDependenciesMeta: + react: + optional: true + react-dom: + optional: true + dependencies: + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + tslib: 2.6.2 + optionalDependencies: + '@emotion/is-prop-valid': 0.8.8 + dev: false + /fs.realpath@1.0.0: resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==} dev: true diff --git a/src/app/layout.tsx b/src/app/(game)/layout.tsx similarity index 97% rename from src/app/layout.tsx rename to src/app/(game)/layout.tsx index b20f0b8..c71dc61 100644 --- a/src/app/layout.tsx +++ b/src/app/(game)/layout.tsx @@ -2,7 +2,7 @@ import Head from "next/head"; import { Nav } from "@/components/Nav"; import { Footer } from "@/components/Footer"; -import "./globals.css"; +import "../globals.css"; export default function RootLayout({ children, diff --git a/src/app/page.tsx b/src/app/(game)/page.tsx similarity index 100% rename from src/app/page.tsx rename to src/app/(game)/page.tsx diff --git a/src/app/puzzle/page.tsx b/src/app/(game)/puzzle/page.tsx similarity index 100% rename from src/app/puzzle/page.tsx rename to src/app/(game)/puzzle/page.tsx diff --git a/src/app/scanner/page.tsx b/src/app/(game)/scanner/page.tsx similarity index 100% rename from src/app/scanner/page.tsx rename to src/app/(game)/scanner/page.tsx diff --git a/src/app/(token)/layout.tsx b/src/app/(token)/layout.tsx new file mode 100644 index 0000000..ad0a74e --- /dev/null +++ b/src/app/(token)/layout.tsx @@ -0,0 +1,29 @@ +import Head from "next/head"; + +import "../globals.css"; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + + + + + + + + {children} + + + ); +} diff --git a/src/app/(token)/token/page.tsx b/src/app/(token)/token/page.tsx new file mode 100644 index 0000000..fb6cdb4 --- /dev/null +++ b/src/app/(token)/token/page.tsx @@ -0,0 +1,54 @@ +"use client"; +import { useState, useEffect } from "react"; +import { motion, AnimatePresence } from "framer-motion"; +export default function Page() { + const [token, setToken] = useState(""); + const [copied, setCopied] = useState(false); + useEffect(() => { + if (typeof window !== "undefined") { + setToken(new URLSearchParams(window.location.search).get("token")!); + } + }, []); + function copy() { + if (typeof window !== "undefined") { + navigator.clipboard.writeText(token); + } else { + console.error("window is undefined"); + prompt("請複製以下代碼", token); + } + setCopied(true); + setTimeout(() => { + setCopied(false); + }, 500); + } + return ( +
+

+ 你找到了拼圖 + ！ +

+
+
+ {token} +
+ + {copied ? "已複製" : "複製"} + +
+
+ 在 OPass > 大地遊戲 > 掃描器中輸入以下代碼來取得拼圖 +
+
+ ); +}