Skip to content

Latest commit

 

History

History
67 lines (50 loc) · 2.62 KB

README.md

File metadata and controls

67 lines (50 loc) · 2.62 KB

use-html-audio

A react custom hook for html audio player purpose with queue support.

Install

using npm:

$ npm install use-html-audio

using yarn:

$ yarn add use-html-audio

Usage


import { useHtmlAudio } from "use-html-audio";

const MyComponent = () => {
  const player = useHtmlAudio(hookInputs);

  // player.element should be included somewhere in the jsx
  // it wont affect the UI in any way (it is a hidden <audio> element).
  return <div>{player.element}</div>;
};

hookInputs

name type desc
queue* [{src:"" , id: "" }] an array of audio urls with a unique id
autoNext boolean automatically play next track on finish
autoPlay boolean automatically play the first track
autoLoad boolean automatically load the first track

player

name type desc
element html element an tag that should be put in the jsx
loading boolean
duration number (sec) full length of the current track
currentDuration number(sec) current duration
progress number
playing boolean
currentTrack object
isMuted boolean
currentIndex number
buffering boolean
audioEnded boolean
togglePlay funtion
seekBySec funtion seekByPercent(sec)
seekByPercent funtion seekByPercent(percent), percent = 0-1
playNext function
playPrev funtion
playAtIndex funtion
playAtId funtion
toggleMute funtion