Features

Shoutcast & Icecast

Compatible with Shoutcast 1/2 & Icecast 2.

Native Browser Code

Built in pure HTML5, CSS, jQuery. No Server-side script needed.

Fast Data Gathering

Direct requests to Server via JSONP. Fast and automatic update.

Responsive Design

Optimized to look great on Desktop, Tablet and Phone!

Color Customization

Choose any Material Design color for both background and play/pause button.

Album Artwork

iTunes API is used to retrieve all the album artwork.

Server Info

Show your current listeners, stream quality, genre, etc...

Song History

Display the last songs played on your radio station.

Animated

Smooth animated transitions between songs.

Multi Language

Ready for English, Spanish, Portugese, French and Italian.

Multiple Instances

Play more than one stream on the same page.

Social Share

Share your Radio on Facebook, Twitter & Google Plus.

Support & Updates

100% Guaranteed support. Updates and improvements in the future.

Settings

Setting	Description	Value	Type
URL:	URL to your radio stream	http://server:port	String
version:	Version of Shoutcast (1/2) or Icecast	1, 2, icecast	String
stream_id:	The stream id of your DNAS 2 Server	1, 2, 3, etc..	Integer
mount_point:	Mount Point of your Icecast stream	path/to/stream	String
type:	Used to correct play of DNAS 1 Stream (don't change it)	/;type=mp3	String
streampath:	The stream path to your DNAS 2 Server	/stream?icy=http	String
cors:	Cors proxy (don't touch it)	https://cors-anywhere.herokuapp.com	String
logo:	This image will be used as album cover fallback	pathto/your/logo.jpg	String
bg:	Background for the player	red, pink, purple, deeppurple, indigo, blue, lightblue, cyan, teal, green, lightgreen, lime, yellow, amber, orange, deeporange, brown, grey, bluegrey, darkblue, black, white	String
accent:	Accent color applied to play/pause button and slider thumb	red, pink, purple, deeppurple, indigo, blue, lightblue, cyan, teal, green, lightgreen, lime, yellow, amber, orange, deeporange, brown, grey, bluegrey, darkblue, black	String
vertical_layout:	Sets vertical layout (Big artwork)	false, true	Boolean
blur:	Add a blur effect with the album cover to the player background	true, false	Boolean
blur_opacity:	Blur effect opacity (if enabled)	0.01 - 1	Integer
lang:	Prefered language for Server Info	en, es, pt, fr, it	String
src:	Used for play/pause function (leave it blank)	none	Empty
volume:	Defines the initial volume level	0.01 - 1	Integer
autoplay:	Play radio stream on page load	true, false	Boolean

Installation

First make sure jQuery is include, if not, include it

Then include myCast files

Add a parent div to the body of your html page, with a unique id and myCast class

Finally call the script in the body of your html page

<script>
    $("#stream1").myCast({
        URL: "http://ip:port",
        version: "2",
    });
</script>

Examples

$("#stream1").myCast({
    URL: "http://107.191.38.213:10042",
    version: "2",
    bg: "grey",
    accent: "deeporange"
});

$("#stream2").myCast({
    URL: "http://149.56.195.94:8416",
    version: "icecast",
    mount_point: "autodj",
    bg: "green",
    accent: "amber",
    lang: "es",
    blur: true,
    blur_opacity: 0.16 	
});

$("#stream3").myCast({
    URL: "http://149.56.195.94:8416",
    version: "2",
    bg: "purple",
    accent: "pink",
    vertical_layout: true
});

Support

If you encounter any problem with the player please contact me here