# 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:
    ```sh
    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.

```sh
pnpm run dev
pnpm run test
```

### Deploy

```sh
pnpm run build
```

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