# 🎵 RepoDructor Music Player

A beautiful glassmorphism music player webapp built with Nuxt.js for local network use.

## Features

- 🎨 **Glassmorphism UI** with aurora effects and light orbs
- 🌓 **Dark/Light mode** toggle
- 🔀 **True random shuffle** using Fisher-Yates algorithm
- 🔁 **Repeat modes**: None, All, Single track
- 📱 **Responsive design** for mobile and desktop
- 🎧 **Audio streaming** with range request support
- 🎵 **Multiple audio formats** support (MP3, WAV, FLAC, M4A, OGG, AAC)

## Setup

1. **Install dependencies:**
   ```bash
   npm install
   ```

2. **Add your music:**
   - Place your audio files in the `/music` directory
   - Supported formats: `.mp3`, `.wav`, `.flac`, `.m4a`, `.ogg`, `.aac`
   - You can organize files in subfolders

3. **Start the development server:**
   ```bash
   npm run dev
   ```

4. **Access the player:**
   - Open http://localhost:3000 in your browser
   - Other devices on your network can access it via your IP address

## Usage

### Controls
- **Play/Pause**: Click the main play button or any track
- **Next/Previous**: Use the navigation buttons
- **Shuffle**: Click the shuffle button (🔀) to enable random playback
- **Repeat**: Click the repeat button to cycle through modes:
  - 🔁 No repeat
  - 🔂 Repeat all
  - 🔂 Repeat single track
- **Volume**: Adjust using the volume slider
- **Seek**: Click anywhere on the progress bar
- **Theme**: Toggle between light and dark modes

### Random Algorithm
The shuffle feature uses the Fisher-Yates algorithm for truly random playback, ensuring:
- No bias towards certain tracks
- Equal probability for all songs
- No repetition until the entire playlist is played
- Genuine randomness regardless of track popularity

## Production

To build for production:

```bash
npm run build
npm run preview
```

## File Structure

```
├── assets/css/          # Global styles and glassmorphism effects
├── components/          # Vue components (if needed)
├── layouts/             # App layouts
├── music/               # 🎵 PUT YOUR MUSIC FILES HERE
├── pages/               # App pages (main player)
├── server/api/music/    # API endpoints for music serving
├── nuxt.config.ts       # Nuxt configuration
└── package.json         # Dependencies
```

## Technical Details

- **Framework**: Nuxt.js 3 with Vue.js
- **Styling**: Pure CSS with CSS custom properties
- **Audio**: Native HTML5 audio with streaming support
- **State**: Vue Composition API with localStorage persistence
- **Effects**: CSS animations and glassmorphism
- **Network**: Designed for local network access

## Browser Support

Works in all modern browsers that support:
- HTML5 Audio API
- CSS Backdrop Filter
- ES6+ JavaScript features

Enjoy your music! 🎶