ratijas
/
muzika-gromche
forked from nikita/muzika-gromche
1
0
Fork 0
Code Pull Requests Activity
muzika-gromche/Frontend
History
ivan tkachenko 81870ecd47 WIP: Add frontend web app player & editor in Vue 3 + Vite 
TODO:
- implement viewing & editing.
- Add links to deployment, and CHANGELOG.
- Change web app icon.
 		2025-12-07 16:22:57 +02:00
..
.vscode WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
public WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
scripts WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
src WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
tests/components WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
.gitignore WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
README.md WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
index.html WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
package.json WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
pnpm-lock.yaml WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
tsconfig.app.json WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
tsconfig.json WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
tsconfig.node.json WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
vite.config.ts WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00
vitest.config.ts WIP: Add frontend web app player & editor in Vue 3 + Vite 2025-12-07 16:22:57 +02:00

README.md

Muzika Gromche — Web Player & Editor

Play your favorite tracks on repeat right in your browser.

Project structure

The look & feel is inspired by a certain popular NLE (Non-Linear video Editor) which incorporates DAW (Digital Audio Workstation) functionality in it.

  • Library page lists all available audio tracks with some basic information presented in cards. There is a search / filter field on top.
  • Player page features in-depth information about selected audio track, a dedicated timeline widget lets you play, seek, scrub, zoom into timeline tracks & clips, and manupulate them. Each timeline track represents either a segment of the song (intro, loop), or a specific kind of visual effects (such as flickering, fading out & color palette for powered lights, lyrics, drunkness & condensation).

Development

Adding new tracks

  1. Add track declaration to Plugin.cs and fill in its properties.
  2. Launch the game once, so that it generates a new JSON dump (in the Lethal Company save files directory) of all tracks.
  3. Replace public/MuzikaGromcheTracks.json with the new JSON dump.
  4. Run the following script to generate bare codenames file: 
    cat ./MuzikaGromcheTracks.json | jq '[.tracks[].Name | {(.): { "Artist": "", "Song": "" }}] | add' > MuzikaGromcheCodenamesBare.json
  5. Add new codenames from the generated file above to public/MuzikaGromcheCodenames.json file.

Run & test

First time setup:

  • copy audio files from the /Assets/ directory located at repository's root to Frontend/public/MuzikaGromcheAudio/ directory.

Muzika Gromche Web Player & Editor is built with Vue 3 + TypeScript + Vite.

pnpm run dev
pnpm run test

Deploy

pnpm run build

Use scp, rsync or any other tool to upload content of dist/ to root@ratijas.me /var/www/html/muzika-gromche/.