2.0.0 • Published 7 years ago
react-simple-audio-player v2.0.0
Usage
npm install react-simple-audio-player --save
import React, { Component } from 'react'
import PlayAudio from 'react-simple-audio-player'
class App extends Component {
render () {
return <PlayAudio url={'http://www.noiseaddicts.com/samples_1w72b820/4186.mp3'} />
}
}
export default App;
The component uses react-player
package to play media and add simple design and controls to extend the package.
Props
Prop | Description | Default |
---|---|---|
url | The url of an audio to play | |
width | Set the width and height (height is equal to width) of the player | 60px |
simpleMode | Set to true disable seconds counter, automatically true with width less then 45px | false |
colorScale | Pass array of 5 colors for theme personalisation | scaled red shades (see demo) |
Changing color theme example
import React, { Component } from 'react'
import PlayAudio from 'react-simple-audio-player'
import chroma from "chroma-js"
const colorScale = chroma
.scale([
'#0199CB',
'#ffffff',
])
.mode('lch')
.colors(5)
class App extends Component {
render () {
return <PlayAudio url={'http://www.noiseaddicts.com/samples_1w72b820/4186.mp3'} colorScale={colorScale} />
}
}
export default App
Result: