Luna Radio Player with Audio-Visualizer

WordPress

Thank you for purchase. If you have any questions that are beyond the scope of this help file, please feel free to send a message on the link. Thanks so much!

• codecanyon.net/user/sodah

• Download the Installable WordPress file only:

  

• Use the Plugin-Installation from WordPress or copy the content from the ZIP-Archiv in the /wp-content/plugins
• Activate the Plugin
• Generate a Token for your website
• Generate the shortcode for your radio player on the shortcode generator, or make it manual with this documention
• Copy the generated Shortcode at your page on this place from your radio player.

Example shortcode:

[lunaradio id='lunaradio' width='100%' height='70px' radiustopleft='0px' radiustopright='0px' radiusbottomleft='0px' radiusbottomright='0px' borderposition='none' bordercolor='#ffffff' bordersize='0px' token='mytoken' userinterface='small' backgroundcolor='#0e1015' fontcolor='#ffffff' hightlightcolor='#fa225b' fontname='' googlefont='' fontratio='0.4' radioname='My Radio Name' offlinetext='Radio is offline' scroll='true' scrollradioname='left' scrolltitle='right' scrollradionamespeed='0.25' scrolltitlespeed='0.25' coverimage='' onlycoverimage='false' coverstyle='circle' usevisualizer='fake' visualizertype='4' itunestoken='1000lIPN' metadatatechnic='fallback' ownmetadataurl='' corsproxy='' usestreamcorsproxy='false' streamurl='http://149.56.155.209:80' streamtype='shoutcast2' icecastmountpoint='' radionomyid='' radionomyapikey='' radiojarid='' radiocoid='' shoutcastpath='/live' shoutcastid='1' streamsuffix='' metadatainterval='20000' volume='90' debug='false' uselocalstorage='false' autoplay='false' displayliveicon='true' displayvisualizericon='true' multicolorvisualizer='false' color1='#e66c35' color2='#d04345' color3='#85a752' color4='#067dcc' visualizeropacity='0.4' visualizerghost='0.0' visualizerblur='0' visualizerghostblur='0'] 
                

Download the latest version here. An upgrade is necessary if the currently used version is older than 6. To do this, the old plug-in must be uninstalled and the new one subsequently installed. The already integrated shortcode does not need to be changed.

Download the latest version here. An update applies when the version currently in use is 6. When updating, only the files in the plug-in folder must be overwritten with the new files.

To simplify the creation of the code, use this SHORTCODE GENERATOR.

Available player options:
(Please put all values in single quotes.)

Use the generated Shortcode at the place in your website you need.

[lunaradio width='100%' height='70px' radiustopleft='0px' radiustopright='0px' radiusbottomleft='0px' radiusbottomright='0px' borderposition='none' bordercolor='#ffffff' bordersize='0px' token='mytoken' userinterface='small' backgroundcolor='#0e1015' fontcolor='#ffffff' hightlightcolor='#fa225b' fontname='' googlefont='' fontratio='0.4' radioname='My Radio Name' scroll='true' coverimage='' coverstyle='circle' usevisualizer='fake' visualizertype='4' itunestoken='1000lIPN' metadatatechnic='fallback' ownmetadataurl='' corsproxy='' usestreamcorsproxy='false' streamurl='http://149.56.155.209:80' streamtype='shoutcast2' icecastmountpoint='' radionomyid='' radionomyapikey='' radiojarid='' radiocoid='' shoutcastpath='/live' shoutcastid='1' streamsuffix='' metadatainterval='20000' volume='90' debug='false' ]	
                

The player supported only the streaming types with standard configuration from: shoutcast2, icecast2, radionomy, radiojar, radio.co and HLS
So that all functions for streaming and reading the meta-data can be carried out correctly, certain standard functions must also be activated on the streaming server. More information you can find here in the article from your streaming type.

Please set the streamurl without path. The path must be set in parameter shoutcastpath. If you have multiply streams at the same streamurl, you must look for the streamid.
The player reads the data by default via the following URL: http://streamurl:port/currentsong?sid=shoutcastid
Please make sure that this option is activated in shoutcast2!
The cover image is be loaded ober the iTunes-API.

Shoutcast Directory

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "SmoothJazz.com Global" streamurl: "http://149.56.155.209:80" streamtype: "shoutcast2" shoutcastpath: "/live" shoutcastid: "1" ]	
            

Example for Meta Data URL:

http://149.56.155.209:80/currentsong?sid=1

Please set the streamurl without mountpoint. The mountpoint must be set in parameter icecastmountpoint. The player reads the data by default via the following URL: http://streamurl:port/status-json.xsl
Please make sure that this option is activated in icecast2!
The cover image is be loaded ober the iTunes-API.

Icecast Directory

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "Sweet FM - Le Mans 94.8" streamurl: "http://stream.sweetfm.fr:8000" streamtype: "icecast2" icecastmountpoint: "/lms" ]	
            

Example for Meta Data URL:

http://stream.sweetfm.fr:8000/status-json.xsl

The player reads the data by default via the following URL: https://api.radionomy.com/currentsong.cfm?radiouid=radionomyid&apikey=radionomyapikey&callmeback=yes&type=xml&cover=yes&previous=yes
Please make sure that this option is activated in radionomy!
On radionomy will the player get the cover automaticaly over the meta data url. Radionomy don't use iTunes-API for reading Cover.
The metadatatechnic-parameter will be ignored. The Player read directly the meta data url.

Radionomy Directory

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "RTFM" streamurl: "http://listen.radionomy.com/rtfm" streamtype: "radionomy" radionomyid: "8f255562-3f11-406b-8d98-f98cb23c84ec" radionomyapikey: "4842dc4c-d6e0-4ab3-986b-412fd7d6aeab" ]	
           

Example for Meta Data URL:

https://api.radionomy.com/currentsong.cfm?radiouid=8f255562-3f11-406b-8d98-f98cb23c84ec&apikey=4842dc4c-d6e0-4ab3-986b-412fd7d6aeab&callmeback=yes&type=xml&cover=yes&previous=yes

The player reads the data by default via the following URL: https://www.radiojar.com/api/stations/radiojarid/now_playing/?rand=12345
Please make sure that this option is activated in radiojar!
On radiojar will the player get the cover automaticaly over the meta data url. Radiojar don't use iTunes-API for reading Cover.
The metadatatechnic-parameter will be ignored. The Player read directly the meta data url.

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "My Radio Name" streamurl: "http://stream.radiojar.com/7n3s4124hrquv" streamtype: "radiojar" radiojarid: "7n3s4124hrquv" ]	
            

Example for Meta Data URL:

https://www.radiojar.com/api/stations/7n3s4124hrquv/now_playing/?rand=1234

The player reads the data by default via the following URL: https://public.radio.co/stations/radiocoid/status
Please make sure that this option is activated in Radio.co!
On Radio.co will the player get the cover automaticaly over the meta data url. Radio.co don't use iTunes-API for reading Cover.
The metadatatechnic-parameter will be ignored. The Player read directly the meta data url.

Internet Radio Directories

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "CMF Radio" streamurl: "https://streams.radio.co/sdef46f462/listen" streamtype: "radioco" radiocoid: "sdef46f462" ]
            

Example for Meta Data URL:

https://public.radio.co/stations/sdef46f462/status

Please enter the complete URL from your m3u8-stream.
It is possible to read the song title directly from the stream. Please use here: metadatatechnic: "hls".
The cover image is be loaded ober the iTunes-API.

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "RamPower" streamurl: "https://stream.ram.radio/audio/ram.stream_aac/playlist.m3u8" streamtype: "hls" metadatatechnic: "hls" ]
            

On special streaming servers the player can't read standard the meta data. For reading meta data from your stream you have to options.
1. Read the stream-icy-meta from the stream
2. Read the meta data over ownmetadataurl
The cover image is be loaded ober the iTunes-API.

Example for required parameters:

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "My Radio Name" streamurl: "http://149.56.155.209:80/live" streamtype: "other" metadatatechnic: "stream-icy-meta" streamsuffix: "#" ]
            

Parameter metadatatechnic have now much options to read the meta data (artist - song title): fallback, corsproxy, directly, stream-icy-meta and ownmetadataurl
The reason for so many possibilities are the different servers and the required CORS POLICY. In essence, Same-Origin policies prevent Cross-Origin requests – requests that do not come from the same origin as the hosted data will be rejected, protecting the origin source from a variety of complex attacks including cross-domain scripts, redirects, and more. Because the streaming URL is a different URL than the web server URL, a CORS POLICY is required here. The CORS-POLICY must be activated/installed on your Streaming Server. If a suitable CORS POLICY is activated on the streaming server, the meta data can be received and read. Without a CORS POLICY you need a CORS PROXY server. This CORS PROXY server managed the access rights to the streaming server.

Testpage for CORS requests
Use this page to test CORS requests. You can either send the CORS request to a remote server (to test if CORS is supported), or send the CORS request to a test server (to explore certain features of CORS):
www.test-cors.org

metadatatechnic = fallback

This you can use, if you don't have a CORS POLICY on your streaming server. The player uses the fallback.php file. This file loaded the meta data from your streaming server.
But this script have also a requirement:

• php.ini: allow_url_fopen = On
• php.ini: disable_functions-parameter has no values of: CURL or file_get or file_put
• firewall from the webserver allowed cross-scripting

metadatatechnic = corsproxy
corsproxy = https://www.mycorsproxy.url/

This you can use, if you don't have a CORS POLICY on your streaming server. The player uses the CORS PROXY SERVER for loading the meta data from your streaming server.

Proxy Use Cases

metadatatechnic = directly

This can be used if the CORS POLICY exists.

metadatatechnic = stream-icy-meta

If you want to read the meta data directly from the stream, this variant is used. The script: stream-icy-meta.php is then used by the player to read the meta data.

There are a few disadvantages:

• Your webserver streamed the radio-stream. Depending on the user, this requires a lot of resources from the web server.
• Your statistics will not more works correctly. A listener streams and reads the meta data from the stream at the same time. This results in multiple accesses in the statistics, which however do not match the real number of listeners.

And this script have also a requirement:

• php.ini: allow_url_fopen = On
• php.ini: disable_functions-parameter has no values of: CURL or file_get or file_put
• firewall from the webserver allowed cross-scripting

metadatatechnic = hls

It is possible to read the song title directly from the HLS M3u8 stream.

metadatatechnic = ownmetadataurl
ownmetadataurl = https://www.mymetadata.url

This option can be used with all server variants. You need your own script or text file to output the finished meta data for Artist - song title. This option is used most often for special streaming servers that are not officially supported here.

For multiply instances you just need to put the shortcode in the desired places on the website. All player can have a different look & feel.

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "My Radio Name" streamurl: "http://149.56.155.209:80/live" streamtype: "other" metadatatechnic: "stream-icy-meta" streamsuffix: "#" ]

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "CMF Radio" streamurl: "https://streams.radio.co/sdef46f462/listen" streamtype: "radioco" radiocoid: "sdef46f462" ]

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "My Radio Name" streamurl: "http://stream.radiojar.com/7n3s4124hrquv" streamtype: "radiojar" radiojarid: "7n3s4124hrquv" ]	

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "RTFM" streamurl: "http://listen.radionomy.com/rtfm" streamtype: "radionomy" radionomyid: "8f255562-3f11-406b-8d98-f98cb23c84ec" radionomyapikey: "4842dc4c-d6e0-4ab3-986b-412fd7d6aeab" ]	

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "Sweet FM - Le Mans 94.8" streamurl: "http://stream.sweetfm.fr:8000" streamtype: "icecast2" icecastmountpoint: "/lms" ]	

[lunaradio width='100%' height='70px' token: "yourtoken" radioname: "SmoothJazz.com Global" streamurl: "http://149.56.155.209:80" streamtype: "shoutcast2" shoutcastpath: "/live" shoutcastid: "1" ]	
                

For fullsize you must set the WordPress Site in fullsize. More you can read here.

This CSS is required in your webpage. If nested containers are used, all must be at 100% height with CSS.

<style>
body, html {
    height: 100%;
    margin: 0;
    padding: 0;
}
</style>
                

In the SHORTCODE you must set the userinterface to big and height 100%:

[lunaradio width='100%' height='100%' token: "yourtoken" radioname: "SmoothJazz.com Global" streamurl: "http://149.56.155.209:80" streamtype: "shoutcast2" shoutcastpath: "/live" shoutcastid: "1" ]	
                

Set the DIV-Container height to 0px and the player will automatically use following height: large display: 80px; medium display: 60px; small display: 40px

API example is located in api.html demo.

Start Play:

window.luRadioModules["mylunaradio"].playMode();
        

Stop currently playing:

window.luRadioModules["mylunaradio"].pauseMode();
        

Change Visualizer:

window.luRadioModules["mylunaradio"].changeVisualizer();
        

Change Volume:

window.luRadioModules["mylunaradio"].animateVolume(50);
        

Software purchased from Envato/Codecanyon does not have installation support. However, you are welcome to inform us about bugs in the software, and we will fix them as soon as possible.

We would like to help a little bit here: FAQs