alb-media-player.js

Usage

Music player demo - Add audio tag in your HTML and set id='albPlayerId'.

<audio controls id="albPlayerId"> </audio>

Install

Using NPM, install audio player js, and save it to your package.json dependencies.

$ npm i alb-media-player

Import

Import player, naming it according to your preference.

// import player

import * as player from 'alb-media-player';

Events

setConfig(options) - set the config option (audioList)

• audioList: list of audio you want to add e.g :

setConfig({
  audioList: [
    {
      url: 'https://www.learningcontainer.com/wp-content/uploads/2020/02/Sample-OGG-File.ogg',
      title: 'Smaple 1',
      cover:
        'https://i1.sndcdn.com/artworks-000249294066-uow7s0-t500x500.jpg',
    },
    {
      url: 'https://www.soundhelix.com/examples/mp3/SoundHelix-Song-10.mp3',
      title: 'Sample 2',
      cover:
        'https://i1.sndcdn.com/artworks-000249294066-uow7s0-t500x500.jpg',
    }
  ],
});

initAudio() - Initialize the audio player.

play() - Play the audio.

pause() - Pause the audio.

setVolume(volume: number) - Set volume of audio player - assign value between 0 to 1.

next() - Change the audio to next file.

previous() - Change audio back to previous.

muteAudio() - Mute/ unmute the audio.

seeking(position:number) - Seek audio to new position.

shuffleAudio() - Play the random audio from list.

repeatAudio() - Repeat enable or disable.

convertToClock(value: number) - Convert song timelap into digital clock format e.g. 10:00, 09:45

Properties

totalAudioLength - Selected audio length.

currentAudioTime - Current playback time.

currentAudio - Current playing audio.

playerInfo - Get player information like controls, current song, audio list, etc.