s

README.md

@@ -2,7 +2,7 @@
 
 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/cover.png)
+![Radio Player Preview](img/imageupdate.png)
 
 ## ✨ Features
 
@@ -14,93 +14,37 @@ A modern, responsive web-based radio player with a beautiful Spotify-inspired in
 - **📚 Playback History**: Shows up to 5 recently played songs
 - **🎛️ Volume Control**: Precise volume control with keyboard shortcuts
 - **⌨️ Keyboard Shortcuts**: Full keyboard navigation support
-- **🎨 Dynamic Artwork**: Album covers with loading animations
-- **🔊 Media Session**: Integration with browser media controls
 
 ## 🚀 Quick Start
 
-### Prerequisites
-
-- A modern web browser (Chrome, Firefox, Safari, Edge)
-- A radio stream URL
-- (Optional) Vagalume API key for lyrics
-
-### Installation
-
 1. **Clone the repository**
    ```bash
    git clone https://github.com/yourusername/radio-player.git
    cd radio-player
    ```
 
-2. **Install dependencies** (if using npm/pnpm)
+2. **Configure your radio stream**
-   ```bash
-   pnpm install
-   ```
-
-3. **Configure your radio stream**
    - Open `js/script.js`
    - Update the `URL_STREAMING` constant with your stream URL
-   - Update the `API_URL` with your metadata API endpoint
+   - Get your API endpoint from [RadioAPI.me](https://radioapi.me)
 
-4. **Serve the files**
+3. **Serve the files**
    ```bash
-   # Using Python
    python -m http.server 8000
-   
-   # Using Node.js
-   npx serve .
-   
-   # Using PHP
-   php -S localhost:8000
    ```
 
-5. **Open in browser**
+4. **Open in browser**
    ```
    http://localhost:8000
    ```
 
 ## ⚙️ Configuration
 
-### Stream Configuration
-
 Edit `js/script.js` to configure your radio stream:
 
 ```javascript
-// Change Stream URL Here
 const URL_STREAMING = "https://your-stream-url.com/stream"
-
+const API_URL = "https://prod-api.radioapi.me/metadata/YOUR-API-KEY"
-// API endpoint for metadata
-const API_URL = "https://your-api-endpoint.com/metadata"
-
-// Vagalume API key for lyrics (optional)
-const API_KEY = "your-vagalume-api-key"
-```
-
-### Supported Stream Types
-
-- **Icecast**: `http://icecast.server.com:8000/stream`
-- **Shoutcast**: `http://shoutcast.server.com:8000/stream`
-- **Radiojar**: `https://stream.radiojar.com/stream`
-- **Zeno**: `https://zeno.fm/stream`
-
-### API Configuration
-
-The player expects a JSON API response with the following structure:
-
-```json
-{
-  "title": "Song Title",
-  "artist": "Artist Name",
-  "art": "https://album-art-url.com/cover.jpg",
-  "history": [
-    {
-      "song": "Previous Song",
-      "artist": "Previous Artist",
-      "artwork": "https://previous-artwork-url.com/cover.jpg"
-    }
-  ]
-}
 ```
 
 ## 🎮 Keyboard Shortcuts
@@ -115,29 +59,7 @@ The player expects a JSON API response with the following structure:
 
 ## 🎨 Customization
 
-### Styling
+To change the number of history items displayed, edit `js/script.js` and modify the `HISTORY_ITEMS_COUNT` constant.
-
-The player uses CSS custom properties for easy theming. Edit `css/style.css` to customize:
-
-```css
-:root {
-  --primary-color: #1db954;
-  --secondary-color: #191414;
-  --text-color: #ffffff;
-  --background-color: #121212;
-}
-```
-
-### History Items
-
-To change the number of history items displayed:
-
-1. Edit `js/script.js`
-2. Modify the `HISTORY_ITEMS_COUNT` constant in `initializeHistoryItems()`
-
-```javascript
-const HISTORY_ITEMS_COUNT = 10 // Change from 5 to desired number
-```
 
 ## 📱 Browser Support
 
@@ -146,104 +68,40 @@ const HISTORY_ITEMS_COUNT = 10 // Change from 5 to desired number
 - ✅ Safari 12+
 - ✅ Edge 79+
 
-## 🔧 Development
+## 🔧 Project Structure
-
-### Project Structure
 
 ```
 radio-player/
-├── css/
+├── css/          # Stylesheets
-│   ├── animate.css          # Animation library
+├── fonts/        # Font Awesome fonts
-│   ├── bootstrap.min.css    # Bootstrap framework
+├── img/          # Images and artwork
-│   ├── font-awesome.min.css # Icon library
+├── js/           # JavaScript files
-│   └── style.css           # Custom styles
+├── index.html    # Main HTML file
-├── fonts/                  # Font Awesome fonts
+└── README.md     # This file
-├── img/                   # Images and artwork
-├── js/
-│   ├── bootstrap.min.js   # Bootstrap JavaScript
-│   └── script.js         # Main application logic
-├── index.html            # Main HTML file
-├── package.json          # Dependencies
-└── README.md            # This file
 ```
 
-### Key Functions
-
-- `Page()` - Handles UI updates and DOM manipulation
-- `Player()` - Manages audio playback and controls
-- `getStreamingData()` - Fetches metadata from API
-- `initializeHistoryItems()` - Dynamically generates history items
-
 ## 🌐 API Integration
 
-### Vagalume Lyrics API
+This player uses [RadioAPI.me](https://radioapi.me) for metadata. Get your API endpoint from their service.
 
-To enable lyrics functionality:
+For lyrics functionality, get a Vagalume API key from [Vagalume API](https://api.vagalume.com.br/docs/).
-
-1. Visit [Vagalume API](https://api.vagalume.com.br/docs/)
-2. Get your API key
-3. Update the `API_KEY` constant in `js/script.js`
-
-### Custom Metadata API
-
-The player expects a REST API endpoint that returns JSON metadata. Implement your own API or use services like:
-
-- RadioAPI.me
-- Radio Browser API
-- Custom Icecast metadata parser
 
 ## 🐛 Troubleshooting
 
-### Common Issues
-
-**Stream not playing:**
-- Check if the stream URL is accessible
-- Verify CORS settings on your server
-- Ensure the stream format is supported
-
-**Metadata not updating:**
-- Verify API endpoint is working
 - Check browser console for errors
-- Ensure API response format matches expected structure
+- Verify stream URL is accessible
-
+- Ensure API endpoint is working
-**Lyrics not showing:**
-- Verify Vagalume API key is valid
-- Check if song/artist exists in Vagalume database
-- Ensure API requests are not blocked by CORS
-
-### Debug Mode
-
-Enable debug logging by opening browser console and looking for:
-- API response data
-- Stream connection status
-- Error messages
 
 ## 📄 License
 
-This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+MIT License
 
 ## 🤝 Contributing
 
 1. Fork the repository
-2. Create a feature branch (`git checkout -b feature/amazing-feature`)
+2. Create a feature branch
-3. Commit your changes (`git commit -m 'Add amazing feature'`)
+3. Commit your changes
-4. Push to the branch (`git push origin feature/amazing-feature`)
+4. Open a Pull Request
-5. Open a Pull Request
-
-## 🙏 Acknowledgments
-
-- [Bootstrap](https://getbootstrap.com/) - CSS framework
-- [Font Awesome](https://fontawesome.com/) - Icons
-- [Animate.css](https://animate.style/) - Animations
-- [Vagalume](https://www.vagalume.com.br/) - Lyrics API
-
-## 📞 Support
-
-If you need help or have questions:
-
-- Create an [issue](https://github.com/yourusername/radio-player/issues)
-- Check the [documentation](https://github.com/yourusername/radio-player/wiki)
-- Join our [Discord community](https://discord.gg/your-community)
 
 ---