Initial commit

src/app/Globals.css

@@ -0,0 +1,17 @@
+@import "tailwindcss";
+
+body {
+  @apply bg-black text-white select-none flex items-center justify-center min-h-screen;
+}
+
+.content-box {
+  @apply bg-[rgb(16,16,16)] w-auto h-auto rounded-lg p-8 border border-[rgb(32,32,32)] shadow shadow-black;
+}
+
+.button {
+  @apply bg-[rgb(24,24,24)] border border-[rgb(48,48,48)] hover:bg-[rgb(32,32,32)] hover:border-[rgb(56,56,56)] rounded-lg px-4 py-2 text-white hover:font-bold hover:underline transition-all cursor-pointer;
+}
+
+.back-button {
+  @apply w-4 h-4 p-2 bg-[rgb(24,24,24)] border border-[rgb(48,48,48)] rounded-full cursor-pointer;
+}

src/app/download/componets/PlatformDownload.css

@@ -0,0 +1,29 @@
+@import "tailwindcss";
+
+.dropdown {
+  @apply relative mt-4 inline-block text-left;
+}
+
+.dropdown-btn {
+  @apply bg-[rgb(24,24,24)] border border-[rgb(48,48,48)] hover:bg-[rgb(32,32,32)] hover:border-[rgb(56,56,56)] rounded-lg px-4 py-2 flex items-center justify-between w-40 cursor-pointer transition-colors;
+}
+
+.arrow {
+  @apply text-[16px] ml-2 transition-transform duration-200;
+}
+
+.arrow.rotate {
+  @apply rotate-180;
+}
+
+.dropdown-list {
+  @apply absolute left-0 mt-1 w-40 bg-[rgb(24,24,24)] border border-[rgb(48,48,48)] rounded-lg shadow shadow-black overflow-hidden duration-300 max-h-0 opacity-0 pointer-events-none;
+}
+
+.dropdown-list.open {
+  @apply max-h-60 opacity-100 pointer-events-auto;
+}
+
+.dropdown-item {
+  @apply pl-2 pr-4 py-2 hover:bg-[rgb(32,32,32)] m-[3px] rounded-[3px] cursor-pointer transition-colors flex items-center gap-2;
+}

src/app/download/componets/PlatformDownload.tsx

@@ -0,0 +1,70 @@
+'use client'
+
+import { useEffect, useRef, useState } from 'react'
+import './PlatformDownload.css'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faChevronUp } from '@fortawesome/free-solid-svg-icons'
+import {
+  faAndroid,
+  faApple,
+  faLinux,
+  faWindows
+} from '@fortawesome/free-brands-svg-icons'
+
+export default function PlatformDownload ({
+  onSelect
+}: {
+  onSelect: (v: string) => void
+}) {
+  const [open, setOpen] = useState(false)
+  const [selected, setSelected] = useState<string | null>(null)
+  const ref = useRef<HTMLDivElement>(null)
+
+  useEffect(() => {
+    const handler = (e: MouseEvent) => {
+      if (ref.current && !ref.current.contains(e.target as Node)) setOpen(false)
+    }
+    window.addEventListener('click', handler)
+    return () => window.removeEventListener('click', handler)
+  }, [])
+
+  const handleClick = (v: string) => {
+    setSelected(v)
+    setOpen(false)
+    onSelect(v)
+  }
+
+  return (
+    <div className='dropdown' ref={ref}>
+      <button onClick={() => setOpen(!open)} className='dropdown-btn'>
+        <span>{selected ?? 'Select'}</span>
+        <FontAwesomeIcon
+          icon={faChevronUp}
+          className={`arrow ${open ? 'rotate' : ''}`}
+        />
+      </button>
+      <div className={`dropdown-list ${open ? 'open' : ''}`}>
+        <div onClick={() => handleClick('Windows')} className='dropdown-item'>
+          <FontAwesomeIcon icon={faWindows} />
+          Windows
+        </div>
+        <div onClick={() => handleClick('macOS')} className='dropdown-item'>
+          <FontAwesomeIcon icon={faApple} />
+          macOS
+        </div>
+        <div onClick={() => handleClick('Linux')} className='dropdown-item'>
+          <FontAwesomeIcon icon={faLinux} />
+          Linux
+        </div>
+        <div onClick={() => handleClick('iOS')} className='dropdown-item'>
+          <FontAwesomeIcon icon={faApple} />
+          iOS
+        </div>
+        <div onClick={() => handleClick('Android')} className='dropdown-item'>
+          <FontAwesomeIcon icon={faAndroid} />
+          Android
+        </div>
+      </div>
+    </div>
+  )
+}

src/app/download/page.tsx

@@ -0,0 +1,144 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import PlatformDownload from './componets/PlatformDownload'
+import axios from 'axios'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faArrowLeft } from '@fortawesome/free-solid-svg-icons'
+import Link from 'next/link'
+
+export default function Download () {
+  const [platform, setPlatform] = useState<string | null>(null)
+  const [latestVersion, setLatestVersion] = useState<null | string>()
+  const [latestLauncherVersion, setLatestLauncherVersion] = useState<
+    null | string
+  >()
+  const [latestCheckFailed, setLatestCheckFailed] = useState<boolean>()
+
+  useEffect(() => {
+    const fetchVersions = async () => {
+      try {
+        const gameRes = await axios.get(
+          'https://berrydash.lncvrt.xyz/database/getLatestVersion.php'
+        )
+        const launcherRes = await axios.get(
+          'https://berrydash.lncvrt.xyz/database/launcher/latest.php'
+        )
+        setLatestVersion(gameRes.data)
+        setLatestLauncherVersion(launcherRes.data)
+      } catch {
+        setLatestCheckFailed(true)
+      }
+    }
+    fetchVersions()
+  }, [])
+
+  return (
+    <div className='content-box text-center'>
+      <div className='relative'>
+        <Link href='/' className='absolute top-0 left-0 -mt-7 -ml-7'>
+          <FontAwesomeIcon
+            icon={faArrowLeft}
+            className='back-button text-white hover:text-gray-300 transition-colors'
+          />
+        </Link>
+      </div>
+      <p className='text-2xl'>Berry Dash Downloads</p>
+      {latestVersion == null || latestLauncherVersion == null ? (
+        latestCheckFailed ? (
+          <>
+            <p>Failed to load</p>
+            <button onClick={() => window.location.reload()}>
+              Reload page
+            </button>
+          </>
+        ) : (
+          <p>Loading...</p>
+        )
+      ) : (
+        <>
+          <p>what platform do you use?</p>
+          <PlatformDownload onSelect={setPlatform} />
+          {platform != null ? (
+            <p className='m-4'>
+              here are the downloads that are available for your platform
+            </p>
+          ) : null}
+          {platform == 'Windows' ? (
+            <Link
+              className='download-option button'
+              href={`https://archive.org/download/berry-dash-archive/Berry-Dash-Launcher-${latestLauncherVersion}-win-x64.msi`}
+              target='_blank'
+            >
+              Windows (x64)
+            </Link>
+          ) : platform == 'macOS' ? (
+            <>
+              <Link
+                className='download-option button'
+                href={`https://archive.org/download/berry-dash-archive/Berry-Dash-Launcher-${latestLauncherVersion}-macos-silicon.dmg`}
+                target='_blank'
+              >
+                macOS (apple silicon based macs)
+              </Link>
+              <Link
+                className='download-option button'
+                href={`https://archive.org/download/berry-dash-archive/Berry-Dash-Launcher-${latestLauncherVersion}-macos-intel.dmg`}
+                target='_blank'
+              >
+                macOS (intel based macs)
+              </Link>
+            </>
+          ) : platform == 'Linux' ? (
+            <>
+              <Link
+                className='download-option button'
+                href={`https://archive.org/download/berry-dash-archive/Berry-Dash-Launcher-${latestLauncherVersion}-linux.AppImage`}
+                target='_blank'
+              >
+                Linux AppImage (universal)
+              </Link>
+              <Link
+                className='download-option button'
+                href={`https://archive.org/download/berry-dash-archive/Berry-Dash-Launcher-${latestLauncherVersion}-linux.deb`}
+                target='_blank'
+              >
+                Linux DEB (debian based systems)
+              </Link>
+              <Link
+                className='download-option button'
+                href={`https://archive.org/download/berry-dash-archive/Berry-Dash-Launcher-${latestLauncherVersion}-linux.rpm`}
+                target='_blank'
+              >
+                Linux RPM (REHL based systems)
+              </Link>
+              <Link
+                className='download-option button'
+                href='https://aur.archlinux.org/packages/berrydash'
+                target='_blank'
+              >
+                Arch Linux AUR Package
+              </Link>
+            </>
+          ) : platform == 'iOS' ? (
+            <Link
+              className='download-option button'
+              href={`https://archive.org/download/berry-dash-archive/Berry-Dash-${latestVersion}-ios.ipa`}
+              target='_blank'
+            >
+              iOS
+            </Link>
+          ) : platform == 'Android' ? (
+            <Link
+              className='download-option button'
+              href={`https://archive.org/download/berry-dash-archive/Berry-Dash-${latestVersion}-android.apk`}
+              target='_blank'
+            >
+              Android (arm32, arm64)
+            </Link>
+          ) : null}
+        </>
+      )}
+    </div>
+  )
+}

src/app/layout.tsx

@@ -0,0 +1,18 @@
+import { Lexend } from 'next/font/google'
+import './Globals.css'
+
+const lexend = Lexend({
+  subsets: ['latin']
+})
+
+export default function RootLayout ({
+  children
+}: Readonly<{
+  children: React.ReactNode
+}>) {
+  return (
+    <html lang='en'>
+      <body className={lexend.className}>{children}</body>
+    </html>
+  )
+}

src/app/page.tsx

@@ -0,0 +1,38 @@
+import { Metadata } from 'next'
+import Link from 'next/link'
+
+export const metadata: Metadata = {
+  title: 'Berry Dash - Home'
+}
+
+export default function Home () {
+  return (
+    <div className='content-box text-center'>
+      <p className='text-2xl'>Berry Dash</p>
+      <p>
+        a simple 2d game, where you collect berries, with a leaderboard system
+        and more
+      </p>
+      <p className='mt-2 flex gap-2 justify-center'>
+        <Link href='/download' className='button'>
+          Download
+        </Link>
+        <Link href='/discord' className='button'>
+          Discord
+        </Link>
+        {/* <Link href='/tutorial' className='button'>
+          Tutorial
+        </Link>
+        <Link href='/leaderboards' className='button'>
+          Online Leaderboards
+        </Link>
+        <Link href='/chatroom' className='button'>
+          Online Chatroom
+        </Link> */}
+        <Link href='/github' className='button'>
+          GitHub
+        </Link>
+      </p>
+    </div>
+  )
+}