Documentation & Setup Guide
Thank you for purchasing AIO - Radio Station Player script. This is my most complete and extensive script ever created. I have taken all complaints, requests and questions into consideration when writing it. I eliminated as many bugs and issues as I could and made a perfect script for all radio station owners.
This is not my first player. If you purchased one of the previous players you are probably wondering why the heck another one... Let me explain.
I have received a lot of reports about issues and problems with various platforms and stream configurations. While this would normally mean that I have to repair my script
in this case, that would be impossible. Most of the problems were happening due to the basic principle of code I used. The way I designed the code to work it simply could not
work with so many different configurations. So after a while, I decided to stop repairing broken scripts and make a new one which will fix all that and more. The new player is re-coded from the ground up.
I can assure you, you will not find the same code in the new player. I did copy a few general functions from the previous player, of course, but the stylesheet, API, PHP and everything else is written from scratch. It took about a month to fully code and test it (and more than a year of bugs and issue reports to release over 32 updates).
More detailed list of features
After purchasing the script you will be able to download the ZIP file with player files. This player is a standalone script meaning it can work without any other framework or CMS. The zip file includes all you need to make the player work. The player comes with pre-defined folders and a few general options. But it does not include any channels or artist images. You will have to set that up by yourself.
Download and extract the zip file from the link to any folder on your web server (E.g.: /player/). When you are done, you will have to set permissions for a few folders so the player has permission to access, edit and delete files. The reason for permissions requirements is that this player does not use a database but pure PHP files.
After extracting all the files on your web server, please change chmod of the following folders to 755 (player may work without, but just in case):Note: You may also need to change chmod of inc/conf/general.php to 644 (if you cannot save settings, try 755). I included the first configuration to make your life easier, but that may cause an invalid permissions error when attempting to change settings.
Now the script is ready for use! To access player control panel simply navigate your browser window to http://yourwebsite.com/player-folder/panel/ (Replace "yourwebsite.com/player-folder/" with your domain name and path to the player). When you first time access the panel, enter the following details into the form:
Once you sign into the panel, my advice is to change the username and password for the control panel immediately. You can do that by accessing tab Settings.
Note that your password will not be saved in plain text but it will be hashed with SHA512 encryption which means it will become unrecoverable!
In this control panel, you can set up your player, change all the settings, and more!
Creating channels has never been easier. With AIO - Radio Station Player you can configure an unlimited number of channels easily. Okay, enough talk. Once in control panel navigate to tab Channels and click Add Channel. Control Panel already has self-explanation(s) in place so it should be easy to fill in information. Please make sure that you do not leave out any fields because if you do, the player may not work properly. Once you are done, click Save button. If everything is OK you will be redirected to the channel(s) list page. The new channel may not appear immediately that is because of PHP's internal file cache. If you click F5 or refresh a few times the new channel should appear. Now that's it. If you click Home tab you should be able to listen to the station with your preferences.
Note: When you set up a single channel on the player, it will hide the channel's list icon. The same principle applies to the different Qualities setting.
Most shared web hosting providers block required ports to which the player has to connect to. The ports are used by the streaming servers, not the player itself. For example, Shoutcast uses port 8000 by default on which listeners can listen to music. The player uses the same ports to get radio information which means if they are blocked information is not displayed and the error is logged to a file.
The AIO Radio Station Player will log all errors and issues into tmp/logs/ folder.
The PHP errors (script issues) will be logged into a file called php.log.
Problems with API(s) will be logged into a file called player.api.log. These errors are usually the reason why the radio information is not displayed.
Issues like Invalid Configuration you can fix yourself. But if you see an issue like Connection to X server failed you will have to check if your provider is blocking the script's connection to the streaming server. The player includes a tool to do that. In the Control Panel navigate to tab Tools and on top click Start Test. The script will attempt to connect to 3 different API's and if the connection is successful you will see message success!. If the connection fails, you will have to contact your web hosting provider to open the specified ports or check connectivity between their servers and your streaming servers (Icecast/Shoutcast and others). You can also enable Debug mode under settings and the debugging tool on Tools page will show very detailed information about the connectivity problem you are facing, see the example bellow.
Toggle CURL Debug exampleIssues like CURL extension is not loaded! are self-explanatory. This specific issue means that the PHP CURL extension is not available for the script to use. The fix is simple: contact the provider to enable PHP CURL extension.
Shared web hosting companies and even private hosting companies have certain firewall setups which very often disturb connectivity between players and the services. This is not done intentionally. Firewalls can ensure a certain level of security against hackers so providers are obligated to use them. But yes, this issue is a very common problem among my clients. If you encounter issues like no artist/title displayed, artist image showing loading for very very long time or player not loading at all this is probably the problem.
The solution to this problem is rather simple. First, you need to find out which port is the problem and then you need to contact your web hosting provider to unblock the specific port. In some cases, web hosting providers did not fulfill client's requests, but in most cases they do. To find out which port is your streaming service using you can simply look at the link. E.g.: http://defikon.com:8000/ is using port 8000. So basically http://URL:PORT/ format is what you need to be focused on.
Note: There are also other reasons why live information may not be shown. Please check the log file (/tmp/logs/player.api.log) before attempting to contact your web hosting provider.
This question has been asked and answered hundreds of times. But I will answer it again so those who did not find the answer can find it here. It's simple, most other scripts are based on the client side which means they're using your computer to get the same information so the ports on your computer also must be opened. In most cases, the computer doesn't block ports for such purposes. My player however works differently. To ensure the best possible performance/information accuracy, the same task is done on the server. The server does all instead of your computer and if the server doesn't have access to the stream, it fails and can't show the information. So that is the reason why your web hosting must have access to the specific host/port to show live track information (artist/title).
In this section, I will cover advanced configuration and options. This script comes with a lot of pre-defined settings which are there to make the setup as easy as possible. But for advanced users that is usually not enough. Since the control panel is very self-explanatory, I will only cover the advanced part of the settings, which means explaining how some options work.
AIO Radio Station Player comes with a very extensive control panel which allows you to change all the options easily, but is it required? NO! It is not! If you are sure that you can manage the player on your own, you can delete a folder panel and be done with it for good! I do not offer support as in instructions on how to configure the player without the control panel, since that is why I wrote it, but you will still receive player support. But note that without a panel you do lose some features like Updates and Embedded generator.
The script's Control Panel comes with a built-in function to compile custom color schemes. It's easy as changing a single color value to another and clicking Compile. You will find this option under Tools tab. If you wonder how to compile the SCSS on your own, for example open up file /templates/default/scss/default.light.scss and uncomment color variable on top of the file. It will look something like this:
// Imports (other required SCSS files)
@import "reset-browsers.scss";
// Configure SASS options (Colors, Animations, Fonts etc...)
$font-family: "Roboto", sans-serif;
$ease-out: cubic-bezier(0.25, 0.8, 0.25, 1);
$ease-in: cubic-bezier(0.55, 0, 0.55, 0.2);
// Other options
$base-font-size: 1.33rem; // Base font size
$font-bold: 400; // Bold font weight
$font-light: 300; // Light font weight
// Default accent color
$accent-color: #62a8ea !default;
After you change the variable $accent-color, you can proceed with the SCSS compile process and save the new file under templates/{template_name}/custom/. After the compilation is done, you will find your new color scheme under the Color Scheme setting in channel edit/add mode.
Note: The templates under Settings dictate which set of color schemes are displayed under the Color Scheme option. That means if you compile the "Default" template theme, it won't be visible until that template is selected under Settings.
In the Control Panel, under the Tools tab, you have an option to manage artist images. This option will make management extremely easy. In the previous player, there was an option to add custom images as well, but it required knowledge of regular expressions to replace artist names. With the new system, this is unnecessary. You can enter the normal artist name into the input field, select an image, and Upload it. The image will be automatically resized to 280x280px (default image size) and compressed to optimal quality.
You can also upload your own images (without compression) to the folder tmp/images/. The image name regex is something like /[^a-zA-Z0-9\.-]/, which means that all characters except letters, numbers, periods, and hyphens are replaced by a dot. So, for example, the name David Guetta, ft. Timber comes out like david.guetta.ft.timber.
This player has the option to enable or disable multi-language support. It also allows you to set a custom language. Both options can be found in the control panel. Under the Language(s) tab, you can add, edit, or delete different languages, which are named according to the ISO 639-1 standard. This standard is used because of browser language preferences. If you enable the option Multi-language support, the player will check if it has the same language that the browser uses. If it does, it will display the player language based on the browser preference; otherwise, it will use the default language set in the options menu.
The update system requires a valid License Key to work. The update check function is simple, and it uses JSONP (JavaScript call) to check for newer versions. Once the new script version is available, you will see an option to initiate the update process. The process downloads an update zip file and extracts it into the player folder. In this process, PHP CURL and PHP ZipArchive extensions are required. The update is always written in a way that it will not replace any user-defined configs. However, it's strongly recommended to create a script backup before initiating the update process.
Note: The script comes with free updates for life. This means as long as the script is being sold, you will receive free updates.
There are various options for the stats, but I will only cover two in this section. The first option, called Stats refresh speed, is a very essential option for people who would like to speed up a player's information. By reducing the timer, the information will be more "live," so refreshed more often. But the higher the refresh rate, the more requests per second the player will make. This can lead to account termination if you use a shared web hosting provider or if the provider limits requests per second. I recommend a higher refresh time for shared hosts because, with a lot of listeners, this can quickly lead to problems. The stats are always cached for a minimum of 5 seconds. That means that if you have 1,000 listeners, only one of them will do the long request for getting stats and artist image from LastFM. The other 999 will receive a cached response.
The second option is Artist/Title Regex. This option is for developers and people who know POSIX Regex well. So, what does this do? The regex is used to match the currently playing artist and title from radio information. Most of the tracks use the format Name of Artist - Name of Track, so the regex matches the first part Name of Artist as the artist variable and Name of Track as the title variable. If you require some special configuration that should match the artist/title differently, you can change it here. However, I cannot offer support for this option. I added it for really advanced users only.
Custom allows both JSON with History and simple Artist - Title. If an image is missing, the player will attempt to read it from various sources like it would in other methods.
See bellow of JSON example that can be used:
{
"artist": "David Guetta",
"title": "Lonely Is The Night",
"image": "https://prahec.com/assets/img/album/lonely-is-the-night.png",
"history": [
{
"played_at": "2024-09-27T06:02:11.0120033-03:00",
"title": "Lonely Is The Night",
"artist": "Air Supply"
},
{
"played_at": "2024-09-27T05:58:17.5843617-03:00",
"title": "Dona",
"artist": "Roupa Nova"
},
{
"played_at": "2024-09-27T05:55:40.6524339-03:00",
"title": "I've Been Around",
"artist": "Nathan Jones"
},
{
"played_at": "2024-09-27T05:55:35.8128193-03:00",
"title": "100% romântica",
"artist": "Rádio Só Kakarecos Light"
},
{
"played_at": "2024-09-27T05:49:42.6854779-03:00",
"title": "Do It To Me",
"artist": "Lionel Richie"
},
{
"played_at": "2024-09-27T05:46:30.5140752-03:00",
"title": "Graffiti",
"artist": "The Paris Group"
},
{
"played_at": "2024-09-27T05:41:27.1440521-03:00",
"title": "Esquinas",
"artist": "Djavan"
},
{
"played_at": "2024-09-27T05:36:03.4899532-03:00",
"title": "I'll Be There For You",
"artist": "Bon Jovi"
},
{
"played_at": "2024-09-27T05:35:45.005106-03:00",
"title": "A Só Kakarecos Light",
"artist": "Esta é"
},
{
"played_at": "2024-09-27T05:31:51.9160074-03:00",
"title": "A Horse With No Name",
"artist": "America"
}
]
}
Azuracast now-playing information is currently the most recommended method to use when available. Using web sockets (please read more on API & Web sockets here), you can get instantaneous information from the stream when playback information changes. Web sockets are highly recommended. An additional benefit is that AIO can be configured to use real song history from Azuracast and artworks as well. This allows perfect control over your streaming information and centralized management for ID3 tags. Another upside is that AIO can still handle artwork while web sockets provide real-time track information.
Some time ago, I wrote a simple Go App that allows listening to stream and provides real-time information to the AIO Radio Station Player via web sockets live, similar to using something like Windows Media Player, Winamp, iTunes, etc... This is not something that is part of AIO or comes with AIO, but on demand I am willing to provide the app for anyone. It's super easy to configure, but it's best installed on the streaming server itself (hance advanced feature). It could work else where, but since it has built in Proxy for HTTPS and Web Sockets server, it may require good bandwidth. If you wish to use something like that, please contact me via "contact" page.
server:
port: 8001
certificate: "path/to/cert.crt"
key: "path/to/cert.key"
stream_url: "https://radio.prahec.com/listen/prahec_house/house.96K.mp3"
websockets: true
history:
enabled: true
max_entries: 10
This is not an advanced option, but I have to explain that it's there! All my scripts supported this option before, but now the option is very different. You are not forced to use different qualities; it's optional. If you configure only a single quality per channel, the settings button will be hidden. Most stations I encounter do not use this, so I made it very optional. However, I do recommend that those who can, add more qualities than they currently offer. It can be a useful tool to reduce bandwidth usage on the streaming server and also offer your listeners lower-quality stream options for smartphones and tablet devices. There are still people who have a very slow Internet connection, and with this option, they can enjoy a stable connection by just changing a setting.
The player has always been using PHP to handle back-end operations (connecting, reading, parsing and caching stats), and so after the initial release, I decided to add JSONP support, which is a simple addition, but it extends the functionality and options of the player much further ahead. Also, a note that this has already been working since the first release, but only when accessed on the same domain name. This is why the new add-on also brings an option to enable or disable Player API via external calls (JSONP is disabled by default).
Below, I will demonstrate how powerful this API can be when coded properly. It does require JQuery or Javascript knowledge, but it should be rather easy to understand if you know what JQuery is and if you ever wrote simple code with it. Note: The examples below are based on the bootstrap framework, all although the style on this website is custom designed
Via simple JSONP request, we can get the list of all available channels on the player and then show them as a list so people can select which channel to open.
Note: The URL of JSONP call must be changed to your domain/player URL.
<script type="text/javascript">
$(document).ready(function() {
$.getJSON('http://your-radio-url.com/player/index.php?channel=all&callback=?', function(response) {
if ( response == null ) {
alert('Something went wrong!');
}
$.each(response, function(key, channel) {
var channelRow = $('<li><a href="#">' + channel.name + '</a></li>'); // HTML for channel
channelRow.on('click', function() { // Bind each row/button to open player on selected channel
// Opens windowed player on selected channel using "default" template (for sake of simplicity)
window.open('http://linktoplayer.com/player/index.php?template=default#' + channel.name, 'aio_radio_player', 'width=720, height=355');
$( this ).closest( '.channels-list.active' ).removeClass( 'active' ).hide();
return false;
});
// Finally, append the row to list
$('.channels-list').append(channelRow);
});
});
});
</script>
<!-- Insert anywhere on the page -->
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Action <span class="caret"></span></button>
<ul class="dropdown-menu channels-list" role="menu"></ul>
</div>
This option allows you to show the currently playing track and the artist's image anywhere. The example also uses interval so the data is fetched every 10 seconds.
Note: This only works if you specify the name of the channel, e.g.: http://playerdomain.com/player/index.php?channel=Prahec%20Top40
On Air:
Source Code:
<script type="text/javascript">
$(document).ready(function() {
// Simple function that uses JQuery getJSON and JSONP request
function getPlayingInformation() {
// Attempt to get stats for "Demo Channel" channel
$.getJSON('http://linktoplayer.com/player/index.php?channel=Prahec%20Top40&callback=?', function(response) {
if ( response == null || response.artist == null ) {
alert('Something went wrong!');
}
$('.trackinfo').html(response.artist + ' - ' + response.title + '<br>\
<img width="140" height="140" class="thumbnail" src="http://linktoplayer.com/player/' + response.image + '">');
// Note: If image caching is enabled the returned URL from the player is in this style: tmp/cache/meghan.trainor.png otherwise its a full URL to the image
});
}
// Fetch information and start an interval timer (10sec)
getPlayingInformation();
setInterval(getPlayingInformation, 10000);
});
</script>
<!-- Insert anywhere on the page -->
<span class="trackinfo"></span>
You can also get a list of all channels via JSONP and then query each channel for their status. See the example bellow and its source code to understand the idea.
Note: This feature will create a massive number of requests (depending on number of channels you use) so please use it with great care!
<script type="text/javascript">
// Called every 40sec
function get_channels_status() {
// Get the channels list and then loop through each channel
$.getJSON( 'http://your-radio-url.com/player/index.php?channel=all&callback=?', function( response ) {
let html_container = $( '.all-channels-status' );
html_container.html('<ul></ul>');
// Is there something wrong?
if ( response == null ) {
html_container.html( 'Unable to get list of channels...' );
}
// Loop through channels
$.each( response, function( key, channel ) {
// Get chanel status at the current loop key
$.getJSON( 'http://your-radio-url.com/player/index.php?channel=' + encodeURIComponent( channel.name ) + '&callback=?', function( response ) {
html_container.find( 'ul' ).append( '<li><b>' + channel.name + ' on air</b>: <img width="14" height="14" src="https://prahec.com/projects/aio-radio/demo/' + response.image + '"> \
' + response.artist + ' - ' + response.title + ' (Data is ' + ( ( response.cached ) ? 'cached' : 'not cached' ) + ')</li>' );
} );
} );
} );
}
// Fetch information and start an interval timer (40sec)
get_channels_status();
setInterval(get_channels_status, 40000);
</script>
<!-- Insert anywhere on the page -->
<div class="all-channels-status"></div>
Updates are available exclusively through the item update system. The reason for that is to prevent sharing of unlicensed versions of the player. I cannot express how much time and effort has gone into updates for this radio player, and so I would really appreciate if my continuous work is appreciated and not freely shared.
Loading changelog, please wait...
I recognize that as a valued customer, you may have numerous questions when using my players/apps. To enhance your experience and provide exceptional support, I have included a comprehensive Frequently Asked Questions (FAQ) section directly on this page. This decision stems from my commitment to transparency, efficiency, and your success in utilizing my products to their fullest potential.
Since Chrome version release 80 (February 2020) websites can no longer mix content (https/http). That may cause AIO to show up "ERROR: Network error occurred!". That means that the URL to stream was automatically changed from HTTP to HTTPS because you access a web page (AIO Radio Station Player) e.g. https://player.com/ while Shoutcast streaming server (for example) only supports "http" content. Since this is "mixed" content, Chrome 80+ will automatically try to use "HTTPS" instead. Read more here.
Chrome version 66 and above have got an update which supposed to save bandwidth and go against ads. Now that I believe it does, but its also annoying for players like mine. For all the details about the update and the feature, check out this page: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes. It's worth taking note, there is nothing we can do about some cases of triggering this new "update".
You can customize player appearance as you wish, and these changes can be "permanently" safe. To do so, you need to copy/paste the template you wish to build upon inside folder /templates and name it the way you wish to name your new template. The newly created theme will stay safe from future updates. Note: The new template will not show up on the selection until you clear the template cache which is stored in tmp/cache folder and is easily cleared by going to "Channels" and clicking "Flush Cache".
If you forgot only the username, simply open file /inc/conf/general.php and look for variable admin_user. The default user is admin. If you forgot the password, you will have to reset the password to the original state. To do so, you should remove the key "admin_pass" from the configuration file, and you will be able to log in with the default password.
First please read the documentation provided above. This script will also create logs which will give information about what went wrong. You can find the log file in folder tmp/logs/. The filename is usually player.api.log.
Player comes with "Templates" and "Themes" which are limited to certain applications. While themes (meant as Color Schemes) can be used differently regarding the channel, the templates can only be used globally through the player. Templates come with their own "HTML" tag set while "themes" are just basically CSS (stylesheet) files with custom elements, color schemes, or just basic changes. The templates are generally bigger modification that includes different images, styles, schemes, etc...
In the update 1.49 released on 26th March 2023, we have changed the configuration format. The update system should automatically convert your configuration files but it would seem that due to some server configurations, this does not work. If you are experiencing issues with the player after the update, please try to manually convert the configuration files:
To convert the files, simply open them in a text editor and replace all instances of $settings =, $channels =, $lang = with return.
If you are not sure how to do this, please contact your hosting provider.
<?php
$settings = array(
'site_title' => 'AIO Radio',
'title' => 'AIO - Radio Station Player',
'description' => 'Looking for All-in-one radio station player solution?',
...
);
Here is an example of how the configuration file should look like after the update:
<?php
return array (
'site_title' => 'AIO Radio',
'title' => 'AIO - Radio Station Player',
'description' => 'Looking for All-in-one radio station player',
...
);
This player is based on a few open-source projects for which I have to give credit because without them, my work would be much harder and it would probably not be that good. I also have to thank StreamingPulse for providing me with a free stream for the demos.