JavaScript – Easy Audio Player | CodeCanyon

Easy Audio Player his title this type of JavaScript/Media This time I will review,made by FWDesign, JavaScript/Media is sold at a price of $10 in themeforest.



audio // fallback // flash // html5 // mp3 // music // ogg // player // podcast // release // responsive // song // streaming // volume // wp //

What is Easy Audio Player ?

Easy Audio Player it is a powerful HTML5 audio player for your website with responsive layout and full API spport, it runs with the new HTML5 audio engine and if its not supported, it will use Adobe Flash fallback. Packed with four skins with various styles it can be used in any type of layout and of course the skins can be modified.

Easy Audio Player can be used in any type of HTML page including WordPress, at this link there is a demo page running in WordPress (Please note that this is NOT a WordPress plugin!, the player must be installed manually, we have inclulded a tutorial about how to install it in WordPress).

Main features:

Packed with tone of options allowing you to control the layout and skin in the way that pleases you most. Extremely easy to use, setup in less than 3 minutes.

Fully Responsive & Mobile Optimized (Smartphones & Tablets). Video demonstration on Android or Video demonstration demo on IOS.

Support for old browsers like IE7 and IE8.

Full API support, the player has a full set of methods and events / listeners that allows to control the player externally, even more you can hide the entire buttons bar and have an invisible player instance that can be controlled with your own set of buttons.

All buttons are optional (please note that all buttons includding the background can be hidden).

Support for multiple instances of the audio player and different audio (.mp3 files) attached to each instance.

Autoplay, the audio (.mp3 file) should start playing as soon as it is ready (optional).

Loop, the audio (.mp3 file) should start over again, when it is finished (optional).

Volume, the volume can be set.

Animation intro, the entire skin can have a animation intro once the player is ready (optional).

Four skins along with the PSD files included!

Detailed Documentation included!

Example pages included!

API – public methods:

setSource(source:String): – Set the audio path, this method accept a parameter that represents the audio source path.

setVolume(volume:Number): – Set the audio volume, this method accepts a parameter that represents a number between 0 (audio mute state) and 1 (audio maximum volume).

stopToScrub() and stopToScrub(): – Notify instance to stop to scrub (useful only if a custom scrub bar is used).

scrub(): – Notify instance to scrub (set the audio position), this method accepts a parameter that represents a number between 0 (audio start position) and 1 (audio end position).

stop(): – Stops the playback and the loading process if the loading process has started.

play(): – Start / play playback.

pause(): – Pause the playback.

destroy(): – Destroy the Easy Audio Player instance and remove it from DOM.

API – event listeners:

ready – FWDAudioPlayer.READY: – Dispatched when the Easy Audio Player instance API is actually available.

stop – FWDAudioPlayer.STOP: – Dispatched when the Easy Audio Player instance is stopped.

play – FWDAudioPlayer.PLAY: – Dispatched when the Easy Audio Player instance playback start to play.

play – FWDAudioPlayer.PLAY: – Dispatched when the Easy Audio Player instance playback start to play.

pause – FWDAudioPlayer.PAUSE: – Dispatched when the Easy Audio Player instance playback is paused.

update – FWDAudioPlayer.UPDATE: – Dispatched when the Easy Audio Player instance is playing and it’s position is changing (useful to update a custom scrub bar), this event has a property of type Number between 0 (audio start position) and 1 (audio end position).

error – FWDAudioPlayer.ERROR: – Dispatched when the Easy Audio Player instance can’t load or play the audio file, this event has a property of type String that represents the error message.

playComplete – FWDAudioPlayer.PLAY_COMPLETE: – Dispatched when the Easy Audio Player instance playback has reached the end of the audio file.

API – main attributes:

instanceName <String>: – The the Easy Audio Player instance instance name, the API is called by the Easy Audio Player instance name dot property.

skinPath <String>: – Specifies the URL of the skin path.

flashPath <String>: – Specifies the URL of the Flash (SWF) file that will handle the fallback for older browsers. If the SWF file is not in the same folder as your html page. You can change the URL path with this attribute.

sourcePath <String>: – Specifies the URL of the audio files.

useOnlyAPI <Boolean>: – Use only public API with or without the default skin, basically this will hide or show the control bar.

autoPlay <Boolean>: – Specifies whether or not to start playing the Easy Audio Player instance as soon as the audio has loaded.

loop <Boolean>: – Specifies that the Easy Audio Player instance should start over again, when the playback reaches the end.

maxWidth <Number>: – The Easy Audio Player instance maximum width in pixels.

volume <Number>: – Specifies the volume of the audio. The volume ranges from 0 (silent) to 1 (full volume).

animateOnIntro <Boolean>: – Specifies that the Easy Audio Player instance should animate or not the buttons when it is fully loaded.

animateOnIntro <Boolean>: – Specifies that the Easy Audio Player instance should animate or not the buttons when it is fully loaded.

showOnlyPlayButton <Boolean>: – Specifies if only the play button is used.

showBackgroundBar <Boolean>: – Hide or show the buttons background bar.

showVolumeScrubber <Boolean>: – Hide or show the volume scrub bar.

showVolumeButton <Boolean>: – Hide or show the volume button.

showTime <Boolean>: – Hide or show the time.

Special notes:

For simplicity we have used only two audio files, but is important to note that each audio player instance can play a different audio file (.mp3 file).

If autoplay is enabled the Easy Audio Player instance will try to play the audio file, on most mobile devices this is not allowed by the operating system.

On mobile devices the volume is always set to maximum and it can’t be modified, this is again a restrction of the mobile operating system… the volume can be modified using the device volume controller.

Keywords: audio, html5, mp3, ogg, music, player, song, responsive, volume, streaming, fallback, flash, release, wp, podcast

Related produck This user:FWDesign

More items by FWDesign