• Current song
• Historic of played songs ( added option to show or hide history song )
• Cover art of the current song
• Lyrics of the current song (Vagalume API)
• Responsive design
• Now available as a Progressive Web App (PWA) for enhanced user experience!

Open The Script.js file and edit the lines Below.

// RADIO NAME
const RADIO_NAME = 'Your Radio';

// Change Azuracast Stream URL Here, .
const URL_STREAMING = 'https://azuracp.web-radios.eu/listen/treloparea/stream';

//API URL Azuracast Now Playing
const API_URL = 'https://azuracp.web-radios.eu/api/nowplaying/2';

// Visit https://api.vagalume.com.br/docs/ to get your API key
const API_KEY = "18fe07917957c289983464588aabddfb";

// Variable to control history display: true = display / false = hides
let showHistory = true; 

Open The img folder and add your logo named "cover.png"

Just put the files in your server or use Free Hosting

Now you can install the Radio Player as a Progressive Web App (PWA) to your device for an enhanced experience! Simply visit the website on a supported browser and follow the prompts to install it.

To configure the name of your radio and the colors used in the Progressive Web App (PWA), you need to edit the manifest.json file:

1. Open the manifest.json file in your project.
2. Locate the "name" field and replace 'Your Radio Name' with the name of your radio.
3. If desired, you can also customize the "background_color" and "theme_color" fields to match your radio's branding colors.

Here's an example:

{
  "name": "Your Radio Name",
  "short_name": "Radio Player",
  "start_url": "/index.html",
  "display": "standalone",
  "background_color": "#ffffff",  // Customize this color to match your branding
  "theme_color": "#ffffff",       // Customize this color to match your branding
  "icons": [
    {
      "src": "img/cover.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ]
}

• Azuracast

• Azuracast

• M - mute/unmute
• P and space - play/pause
• arrow up and arrow down - increase/decrease volume
• 0 to 9 - volume percent

If you have any feedback, please reach out to me at [email protected]

MIT

• gsavio/player-shoutcast-html5
• joeyboli/RadioPlayer