A React.js wrapper for howler.js (audio player). 

A React.js wrapper for howler.js (audio player)

thangngoc89

khoanguyen.me

stenerson

react-howler

- Removed: Seek Property (#59, #102, #103)

- Removed: Support `xhrWithCredentials` - now requiring Howler version >= `2.2.0` (#96)

- Added: Support `xhrWithCredentials` (#77)

- Fixed: Use `componentDidUpdate` and remove use of depreciated `componentWillReceiveProps` method (#90)

- Updated: Add dev dependencies to remove reliance on global packages for development

- Updated: Use Howler.js version `^2.1.1`. Revert to using semantic Howler.js versions (Rolling back #39) 

- Fixed: Don't mute if the `mute` prop has not changed (#65)

- Updated: Use Howler.js version `2.0.13`

- Updated: Use Howler.js version `2.0.8` to fix Chrome deprecation warning (#55) 

- Added: Load sound when `props.preload` changes to true (#58)

- Fixed: Don't seek if no props.seek specified (#57) 

- Updated: Use Howler.js version `2.0.7` to fix Chrome deprecation warning (#52, #53) 

- Updated: Revert prevent seeking if the sound is not loaded (#41) since upstream issue was fixed (#44)

- Updated: Use fixed Howler.js version (#39)

- Fixed: Prevent seeking if the sound is not loaded to avoid upstream issue (#41)

- Fixed: Replace React.PropTypes with `prop-types` package. Fixes deprecation warning when using react version greater than 15.5 (#34)

- Fixed: Issue causing possible reinitialization when using array as `src` prop.

- Updated: Remove Yarn from devDependencies - it's recommended to install globally so having it  as a devDep is redundant.

- Added: Use [Yarn](https://yarnpkg.com/) (#17)

- Changed: Update to work with nodejs v6 (#18)

- Changed Example: Simplified example build by using [create-react-app](https://github.com/facebookincubator/create-react-app) (#20,#21)

Object.defineProperty(exports, "__esModule", {

var _react2 = _interopRequireDefault(_react);

var _propTypes2 = _interopRequireDefault(_propTypes);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

var ReactHowler = function (_Component) {

    var _this = _possibleConstructorReturn(this, (ReactHowler.__proto__ || Object.getPrototypeOf(ReactHowler)).call(this, props));

    _this.initHowler = _this.initHowler.bind(_this);

    value: function componentDidMount() {

    value: function componentDidUpdate(prevProps) {

      // The src prop must be either a string or an array of strings

      // Because of this, we can use it's JSON representation to check for changes

      if (JSON.stringify(prevProps.src) !== JSON.stringify(this.props.src)) {

    value: function componentWillUnmount() {

     * Create howler object with given props

      var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;

      if (typeof _howler4.Howl !== 'undefined') {

        this.howler = new _howler4.Howl({

          onloaderror: props.onLoadError,

     * Stop, unload and destroy howler object

      if (typeof this.props.seek !== 'undefined' && this.props.seek !== this.seek()) {

      if (this.props.preload && this.howlerState() === 'unloaded') {

     * Begins playback of a sound when not playing

      var playing = this.howler.playing();

        // Automatically load if we're trying to play

        if (this.howlerState() === 'unloaded') {

     * If no id given, pauses all playback

     * @param {Number} id = undefined [sound of group to pause]

      var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : undefined;

     * @return {String} [unloaded, loading or loaded]

     * If no id given, stops all playback

     * Mutes the sound, but doesn't pause the playback.

     * @param {Boolean} [muted] [True to mute and false to unmute]

     * @param {Number} [id] [The sound ID. If none is passed, all sounds in group are muted]

      (_howler = this.howler).mute.apply(_howler, arguments);

     * Get/set volume of this sound or the group. This method optionally takes 0, 1 or 2 arguments.

     * @param {Number} [volume] [Volume from 0.0 to 1.0]

      return (_howler2 = this.howler).volume.apply(_howler2, arguments);

  "description": "A React.js wrapper for howler.js (audio player)",

    "example:react": "npm run babelify && cd examples/react && yarn install && NODE_PATH=../../lib npm start",

    "example:react:build": "npm run lint && npm run babelify && cd examples/react && yarn install && NODE_PATH=../../lib npm run build",

    "predeploy": "npm run example:react:build",

    "deploy": "babel-node bin/deploy-gh-pages",

    "prepublish": "npm run lint && npm run babelify",

    "test": "echo \"Error: no test specified\"",

    "url": "git+https://github.com/thangngoc89/react-howler.git"

  "author": "Khoa Nguyen <hi@khoanguyen.me>",

    "url": "https://github.com/thangngoc89/react-howler/issues"

  "homepage": "https://github.com/thangngoc89/react-howler#readme",

		@@ -0,1 +1,7 @@
		# 5.0.0 - 2020-11-14

		## Breaking Changes

		- Removed: Seek Property (#59, #102, #103)

		# 4.0.0 - 2020-09-23
		@@ -2,0 +8,0 @@

		@@ -127,6 +127,2 @@ 'use strict';

		if (typeof this.props.seek !== 'undefined' && this.props.seek !== this.seek()) {
		this.seek(this.props.seek);
		}

		if (this.props.preload && this.howlerState() === 'unloaded') {
		@@ -133,0 +129,0 @@ this.load();

		{
		"name": "react-howler",
		"version": "4.0.0",
		"version": "5.0.0",
		"description": "A React.js wrapper for howler.js (audio player)",
		@@ -5,0 +5,0 @@ "main": "lib/index.js",

Worsened metrics