Mobin-ava-music-player NPM

Ava Music Player (ReactJS Music Player)

Installation

$ npm install mobin-ava-music-player

Getting started

import AvaMusicPlayer from "mobin-ava-music-player";
import "mobin-ava-music-player/dist/style.css";

function App() {
    return (
        <>
            <AvaMusicPlayer
                playlist={{
                    id: 1,
                    scope: "audiom",
                    name: "playlist name",
                    cover: "playlist cover",
                    startIndex: 1,
                    description: "playlist description",
                    items: [
                        {
                            music_id: "1",
                            name: "music name",
                            artist: [
                                {
                                    artist_name: "artist name",
                                    artist_id: 1,
                                },
                            ],
                            cover: "music cover",
                            url: ["music url"],
                            lyric: "music lyric",
                            timestamp: 1,
                            quality: "320",
                            from: "string",
                            music_duration: 1,
                            mood: [""],
                            genre: [""],
                            tags: [""],
                        },
                    ],
                }}
            />
        </>
    );
}

<div id="root"></div>
<div id="ava-music-player-dialog-root"></div>
<!-- Add This line for player portal -->

API Reference

API	Type	required	Default	Description
playlist	PlaylistType	✓	-	playlist data
log	boolean	✘	-	If set to 'true,' it enables logging
provider	string	✘	"unknown"	set provider to send in log request
onClose	function => {}	✘	-	Music player close event
onOpenFullscreen	function => {}	✘	-	Event trigger when music player get full screen
onCloseFullscreen	function => {}	✘	-	Event trigger when music player minimize from full screan
onMusicChange	function => music	✘	-	Event trigger when active music change and reutrns audio and it's index in musics list

PlaylistType:

API	Type	required	Default	Description
id	number	✓	-	playlist id
scope	string	✓	-	It indicates the service user of the web service. Its value for audiom is 'audiom'
name	string	✓	-	Playlist name
description	string	✓	-	Playlist description
cover	string,null	✓	-	Playlist cover
timestamp	number	✘	-	Playlist create date
shareUrl	string	✘	-	Share url of playlist
startIndex	number	✓	-	Each playlist has a startIndex. When played, it starts playing the music that corresponds to this index, (Change it to change the playing music)
items	AudioType	✓	-	List of musics

AudioType:

API	Type	required	Default	Description
music_id	string	✓	-	Music Id
name	string	✓	-	Music name
artist	Artist[]	✓	-	Music artists information
cover	string , null	✓	-	Music Cover
url	string[]	✓	-	Music urls
lyric	string	✘	-	Music lyric
shareUrl	string	✘	-	Music share url
timestamp	number	✓	-	Music create date
quality	string	✓	-	Music quality
from	string	✓	-	It specifies where the music should be played from. It could be from a specific page like the home page or an artist's page, a playlist, shuffle mode, or the respective album.
music_duration	number	✓	-	Music duration
mood	string[]	✓	-	Music moods list
genre	string[]	✓	-	Music genres list
tags	string[]	✓	-	Music tags list