jasonflorentino / acnh-jukebox

A lil web app that plays K.K. Slider jams like in Animal Crossing: New Horizons!

Home Page:https://acnhjukebox.vercel.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

🏝 ACNH Jukebox

A Web app for playing K.K. Slider jams like in Animal Crossing: New Horizons

Started as a little toy project to play around with Next.js and boy am I hooked -- Next is awesome! Also the art and music of this game are just too good NOT to get lost in. Enjoy!

β€” Jason, Dec 2021

Screenshot of the app interface

Live Deployment

Click here to visit the live site.

Under the hood

This app uses ACNH API for music data.
It's a Next.js app written with TypeScript and SCSS, set up from this starter.

Developing

Requires node and npm

  • Download or clone this repo.
  • Install dependencies:
    # From inside the repo directory:
    npm install
    
  • Start the app:
    npm run dev
    
  • The app will be running on http://localhost:3000
  • Make changes on dev branch
  • Merge working branch into main to trigger CI/CD

To Do, maybe

πŸ’­ Determine loop times for more songs
πŸ’­ Fix bug where triggering Search from keyboard enters 's' as first input
πŸ’­ Combine Player and Search Input into same container component
πŸ’­ Animate search tranisiton
πŸ’­ Song name language selector
πŸ’­ Scroll to current song' button?
βœ… Search?
βœ… Add "Actions Buttons" container
βœ… Background waves
βœ… Play random song, button similar to in-game buttons
βœ… Prune Next page props
βœ… Footer content + animate in?
βœ… Better music looping
βœ… Use different fonts
βœ… Update to Next 12
βœ… Remove Tailwind
βœ… Notify limited features on mobile browers
βœ… Works on Safari (Desktop)
βœ… Volume control (Desktop only?)

Contributing

First of all, thank you for your interest! Unfortunately, I won't be actively reviewing PRs against this repo. That said, feel free to fork it and build on it yourself! If you would like to contribute features to this one, msg me and we can get something going.

What I would need help with is finding more loop times for the songs. The way I did it is loading up the audio file in an audio editing program, finding about when the loop should happen, and then pushing and pulling that time in the app to find which exact time works best. Kind of tedious, but worth it for my fav songs haha.

About

A lil web app that plays K.K. Slider jams like in Animal Crossing: New Horizons!

https://acnhjukebox.vercel.app


Languages

Language:TypeScript 61.4%Language:SCSS 31.8%Language:JavaScript 4.4%Language:CSS 2.4%