RadioPlayer-22/README.md

# 🎵 Game! Radio Player

A modern, responsive web-based radio player with a beautiful Spotify-inspired interface. Stream your favorite radio station with real-time song information, lyrics, and playback history.

![Radio Player Preview](img/imageupdate.png)

## ✨ Features

- **🎧 Live Streaming**: Supports multiple streaming protocols (Icecast, Zeno, Shoutcast, Radiojar)
- **🎨 Modern UI**: Spotify-inspired interface with smooth animations
- **📱 Responsive Design**: Works perfectly on desktop, tablet, and mobile devices
- **🎵 Real-time Metadata**: Displays current song, artist, and album artwork
- **📜 Lyrics Integration**: Automatic lyrics lookup using Vagalume API
- **📚 Playback History**: Shows up to 5 recently played songs
- **🎛️ Volume Control**: Precise volume control with keyboard shortcuts
- **⌨️ Keyboard Shortcuts**: Full keyboard navigation support

## 🚀 Quick Start

1. **Clone the repository**
   ```bash
   git clone https://github.com/yourusername/radio-player.git
   cd radio-player
   ```

2. **Configure your radio stream**
   - Open `js/script.js`
   - Update the `URL_STREAMING` constant with your stream URL
   - Get your API endpoint from [RadioAPI.me](https://radioapi.me)

3. **Serve the files**
   ```bash
   python -m http.server 8000
   ```

4. **Open in browser**
   ```
   http://localhost:8000
   ```

## ⚙️ Configuration

Edit `js/script.js` to configure your radio stream:

```javascript
const URL_STREAMING = "https://your-stream-url.com/stream"
const API_URL = "https://prod-api.radioapi.me/metadata/YOUR-API-KEY"
```

## 🎮 Keyboard Shortcuts

| Key | Action |
|-----|--------|
| `Space` or `P` | Play/Pause |
| `↑` | Volume Up |
| `↓` | Volume Down |
| `M` | Mute/Unmute |
| `0-9` | Set volume to 0-90% |

## 🎨 Customization

To change the number of history items displayed, edit `js/script.js` and modify the `HISTORY_ITEMS_COUNT` constant.

## 📱 Browser Support

- ✅ Chrome 60+
- ✅ Firefox 55+
- ✅ Safari 12+
- ✅ Edge 79+

## 🔧 Project Structure

```
radio-player/
├── css/          # Stylesheets
├── fonts/        # Font Awesome fonts
├── img/          # Images and artwork
├── js/           # JavaScript files
├── index.html    # Main HTML file
└── README.md     # This file
```

## 🌐 API Integration

This player uses [RadioAPI.me](https://radioapi.me) for metadata. Get your API endpoint from their service.

For lyrics functionality, get a Vagalume API key from [Vagalume API](https://api.vagalume.com.br/docs/).

## 🐛 Troubleshooting

- Check browser console for errors
- Verify stream URL is accessible
- Ensure API endpoint is working

## 📄 License

MIT License

## 🤝 Contributing

1. Fork the repository
2. Create a feature branch
3. Commit your changes
4. Open a Pull Request

---

Made with ❤️ for radio lovers everywhere