Kast – Extraordinary SHOUTcast HTML5 Radio Player for jQuery – Material Design

Description

Overview Kast Extraordinary SHOUTcast HTML5 Sticky Radio Player for your website jQuery and Zepto Plugin Allows you to stream your live radio station to your web visitors on Desktops Tablets and Mobile devices SHOUTcast exclusive Colorful Responsive design Fully-customizable Production-ready Mobile-compatible Touch-friendly Retina-ready and more Following Google s Material Design guidelines Update Spotify API has been replaced with lastFM API to fix images issue Features Pure HTML5 HTML5 only audio player All SHOUTcast Versions Plays any SHOUTcast station SID Supports multiple streams from a single server Multi-format Audio Player MP3 OGG AAC AAC aacPlus SHOUTcast Exclusive for SHOUTcast servers only made with love Sticky Player Runs peacefully at your web browser corner Popup Player Current and Played Information Displays various information and stats about a SHOUTcast server server title current listeners genre track title artist name and more Album and Artist Artworks Smart album artwork retrieving from the biggest music database using lastFM API or Artist artwork as a fallback Mobile-compatible with MobileCare Kast is memory-efficient runs perfectly on Mobile devices Premium feature Responsive Design Ultra Responsive Design with Mobile-first approach Material Design Kast UI Following Google s Material Design guidelines Colorful All Material Design Colors Red Pink Purple Deep Purple Indigo Blue Light Blue Cyan Teal Green Light Green Lime Yellow Amber Orange Deep Orange Brown Grey Blue Grey Carolina Black White Light and Dark Themes Material Light Theme and Material Dark Theme Dynamic Theme Colors and Contrast Dynamically changes colors and theme based on the dominated colors color palette from the artwork image with also color contrast check for text colors light or dark Anywhere You can insert it anywhere into your web page Non-sticky Cross-browser Chrome Firefox Safari Opera Edge IE Touch-friendly and Retina-ready Independent player just jQuery Continuous and LiveStream play SHOUTcast Direct Metadata via DNAS JSONP Support Multi Language Support HTTPS SSL Support Stream your radio station on your SSL secured website HTTPS Offline Detection Display message on SHOUTcast server offline or Internet connection loss Performance-focused Completely written in plain JavaScript Easy-to-use Meant for everyone Highly customizable Easy to customize and fully customizable Developer API Rich API and events for Developers Extra Volume controls Mute Unmute minimize and maximize the player and more More Screenshots Click on the Screenshots button to view the gallery Live Preview Click on the Live Preview button to view the demo Usage First make sure jQuery is included If not include it script src https ajax googleapis com ajax libs jquery 2 1 4 jquery min js script Then include Kast files link href path to kast min css type text css rel stylesheet script src path to kast min js script Call it script kast host myshoutcastserver com port 8080 version 2 script Recommended include Google s Roboto font link href https fonts googleapis com css family Roboto 400 type text css rel stylesheet Options Customize Kast just the way you like it Usage kast host port optionName host String Server IP or domain name Required port Integer Server port 80 by default protocol String Server protocol http by default version Integer SHOUTcast version 2 by default 1 or 2 sid Integer SHOUTcast V2 server stream ID If you have multiple stations 1 by default statsPath String SHOUTcast V2 path to stats stats by default playedPath String Path to played list played by default directStreamURL Boolean or String Add direct audio stream URL false by default ui String User Interface colored by default transparent or colored theme String Material Design theme light by default dark light or dynamic colors String or Object Material Design colors primary cyan accent yellow by default primary color name accent color name or dynamic Color names red pink purple deep purple indigo blue light blue cyan teal green light green lime yellow amber orange deep orange brown grey blue Grey carolina black white Note Carolina color it s an extra color startTemplate String Starting template maximized by default minimized or maximized position String Player sticky position right by default right or left container String Player container element class or ID body by default autoPlay Boolean Autoplay radio false by default true or false autoUpdate Boolean or String Auto update info Current playing info played list server stats true by default true false or all Note all Auto updates all the information including server stats current listeners etc artwork Boolean or Array Retrieve album artwork or artist artwork as a fallback using lastFM API or set a custom image true by default true false or https my-website-or-some-cors-website com my-custom-artwork jpg Note about custom image It s recommended to add 64 64 small image with custom image array i e images video-games-music jpg images video-games-music-optional-64 64 jpg statusBar Boolean Show status bar at the top of the player true by default true or false minimizeMaximize Boolean Show minimize maximize button in the status bar true by default true or false muteUnmute Boolean Show mute unmute button in the status bar true by default true or false startMuted Boolean Start audio muted false by default true or false serverInfo Boolean String or Array Show server info stats in the status bar or set a custom text false by default false My Custom text servertitle servergenre etc SHOUTcast V1 server info currentlisteners streamstatus peaklisteners maxlisteners uniquelisteners bitrate songtitle SHOUTcast V2 server info averagetime backupstatus bitrate content currentlisteners maxlisteners peaklisteners servergenre servertitle serverurl songtitle streamhits streamlisted streamlistederror streampath streamstatus streamuptime uniquelisteners version played Boolean Show played list true by default true or false currentTrack Boolean or String Show current track title or set a custom text true by default true false My Track Title etc currentArtist Boolean or String Show current artist name or set a custom text true by default true false My Artist Name etc playedTracks Boolean Show SHOUTcast V2 played track titles true by default true or false playedArtists Boolean Show SHOUTcast V2 played artist names true by default true or false offlineCheck Boolean Show message on SHOUTcast server offline or Internet connection loss in the status bar true by default true or false mobileCare Boolean or Array Lightweight player for Mobile Devices true by default true false low medium high very high or ultra Note Kast is always responsive design but MobileCare is different you set it by selecting a grade from low to ultra modes and If you want to customize the max-width when mobileCare get triggered set medium 800px The default max-width is 599px false What you see in Desktop is what you see in Mobile low true equal low Autoplay and offlineCheck will be disabled Kast will always start minimized and lite auto update medium Medium quality artwork Server stats update in the status bar will be disabled Dymanic theme and colors will be dropped to fixed theme colors and lite auto update level 2 high Artwork and played list will be disabled very high Auto update and minimize maximize will be disabled ultra Just a play pause button Takes only 3MB of RAM language Object Set text for Multi-language offlineText Temporarily Offline playedText Played unknownTrackText Unknown Track unknownArtistText Unknown Artist by default irrelevantWords Boolean or Array Let Kast be aware of some irrelavent words inside the current song title to help Kast get the right artwork from lastFM API feat ft Feat Ft by default false blah blah com mumbo jumbo etc skipInfo Boolean or Array of objects Skip info based on track names or artist names i e skip ad titles false by default false track track name to skip artist Artist name to skip track another track to skip etc defaultArtwork Boolean or Array Set default album artwork It shows when artwork not found false by default false https my-website-or-some-cors-website com my-default-artwork jpg Note about default image It s recommended to add 64 64 small image with default image array i e images my-default-artwork jpg images my-default-artwork-optional-64 64 jpg customCheckerInterval Boolean or Integer Set custom stats checker interval in ms false by default false 7000 10000 etc popup Boolean Enable Kast popup player false by default false true popupCSSLink String Kast CSS link for Kast popup player by default http to-kast-css-link-file css popupWidth Integer Set popup player width 380 by default popupHeight Integer Set popup player height 570 by default overHTTPS Boolean Stream secured SHOUTcast audio for secured HTTPS websites experimental false by default true or false Note Currently SHOUTcast serve audio only through an HTTP protocol And HTTPS page should only have HTTPS content with overHTTPS you serve your web visitors a secured stream by using a secured HTTPS proxy direct Boolean Fetch SHOUTcast metadata direclty from the servers false by default true or false Note Supported from 2 2 DNAS via JSONP betaProxies Boolean Use beta proxies to fetch SHOUTcast metadata false by default true or false continuous Boolean Enable continuous play Play Pause radio true by default true or false API Kast Developer API kast Start with default options kast play Play audio kast play true Reload audio and play it kast pause Pause audio kast stop Stop audio kast mute Mute audio kast unmute Unmute audio kast minimize Minimize player kast maximize Maximize player kast stats Update the current playing info kast stats callback Access to the current playing info kast played Update the current played info kast played callback Access to the current played info kast autoUpdate all Enable auto update including server stats kast autoUpdate true Enable auto update kast autoUpdate false Disable auto update kast destroy Destroy plugin instance Events Kast Developer Events Usage kast host port eventName callback onReady callback function when Kast is ready onAudioLoad callback function when audio is loaded return HTMLAudioElement onMobile callback function when Kast is running on Mobile device onPlay callback function when audio is playing return HTMLAudioElement onPause callback function when audio is paused return HTMLAudioElement onStop callback function when audio is stopped return HTMLAudioElement onMute callback function on audio mute return HTMLAudioElement onUnmute callback function on audio unmute return HTMLAudioElement onMinimize callback function on player minimize onMaximize callback function on player maximize onUpdate callback function on current played info update return stats onUpdateAll callback function on server stats in the status bar update every 8s 12s 16s return stats onOffline callback function on offline return stats onOnline callback function on back online return stats onCurrentArtwork callback function on current artwork update return current Album Artist artwork image onPlayedArtworks callback function on played artworks update return played Album Artist artwork image will be called for each of one onCurrentInfo callback function on current playing info change return currentTrack and currentArtist onPlayedInfo callback function on played info change return playedTrack and playedArtist will be called for each of one onDynamicColors callback function on dynamic colors change return primaryColor and accentColor onDynamicColorsContrast callback function on dynamic colors contrast change return primaryColorContrast and accentColorContrast onDynamicTheme callback function on dynamic them change return current theme Audio Formats Support MP3 audio mpeg Chrome Yes Firefox Yes Safari Yes Opera Yes IE9 Yes Edge Yes Android Browser Yes iOS Safari Yes OGG audio ogg Chrome Yes Firefox Yes Safari No Opera Yes IE No Edge No Android Browser Yes iOS Safari No AAC audio aac Chrome Yes Firefox Yes Safari Yes Opera Yes IE9 Yes Edge Yes Android Browser Yes iOS Safari Yes AAC audio aacp Desktop Chrome Only Yes Before You Buy IMPORTANT Not a Music Player It s SHOUTcast Radio Player it s not designed for Music MP3 playlists SHOUTcast Only Icecast and other streaming media servers are not supported Multiple Servers are not supported yet About Continuous Play Continuous Play is for Play Pause or Play Stop It s not for Gapless Radio Playback so when you navigate from one page to another Kast reloads itself If you want Gapless Radio Playback then you should use AJAX Dynamic navigation system Autoplay on iOS isn t supported Direct If your SHOUTcast server is V2 and support direct connection enable direct SHOUTcast V1 Streams unplayable on Chrome 55 x Safari 10 SHOUTcast V1 servers are over 10 years old they are running on deprecated HTTP 0 9 These modern browsers are breaking the ability for the outdated SHOUTcast V1 x servers to be played with HTML5 Non-Port 80 V1 streams are no longer playable Upgrading to the latest SHOUTcast V2 should solve your problem Read more https bugs chromium org p chromium issues detail id 669800 https www internet-radio com community threads latest-chrome-browser-update-v55-breaks-shoutcast-v1-x-html5-players 27560 CDAT Bug If Kast is showing these texts then switch to beta proxies to fix this problem for now Update Fixed in the new Kast 1 3 Before You Ask IMPORTANT Please provide your SHOUTcast server address We don t do custom projects You can use install it like any jQuery WordPress plugin If this is your first time then please check basic YouTube videos on how to use install jQuery WordPress plugins No ETA for the next versions English only Browser Compatibility Google Chrome Mozilla Firefox Apple Safari Opera Microsoft Edge Internet Explorer 9 and above Basically any HTML5 web browser Changelog v1 3 1 – Spotify API has been replaced with lastFM API v1 3 – New features new options and bug fixes Read changelog txt for more info v1 2 – New features new options and improvements Read changelog txt for more info v1 1 2 – Bug fixes and a new feature Read changelog txt for more info v1 1 1 – SHOUTcast V1 played list are now supported and Minor bug fixes v1 1 0 – The biggest update yet Read UPGRADE txt Important v1 0 2 – Build 10250 Bug fixes and improvements v1 0 2 Improvements and a new feature Read changelog txt for more info v1 0 1 – Build 10150 Fixed cross-browser support v1 0 1 Improvements and a new feature Read changelog txt for more info v1 0 0 Initial release Kast Made with love Don t forget to rate 3