UNPKG

react-soundplayer

Version:
1,353 lines (1,086 loc) 101 kB
(function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(require("react"), require("soundcloud-audio")); else if(typeof define === 'function' && define.amd) define("ReactSoundplayer", ["react", "soundcloud-audio"], factory); else if(typeof exports === 'object') exports["ReactSoundplayer"] = factory(require("react"), require("soundcloud-audio")); else root["ReactSoundplayer"] = factory(root["React"], root["SoundCloudAudio"]); })(this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_3__) { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // identity function for calling harmony imports with the correct context /******/ __webpack_require__.i = function(value) { return value; }; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { /******/ configurable: false, /******/ enumerable: true, /******/ get: getter /******/ }); /******/ } /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = 10); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ (function(module, exports) { module.exports = __WEBPACK_EXTERNAL_MODULE_0__; /***/ }), /* 1 */ /***/ (function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */(function(process) {/** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ if (process.env.NODE_ENV !== 'production') { var REACT_ELEMENT_TYPE = (typeof Symbol === 'function' && Symbol.for && Symbol.for('react.element')) || 0xeac7; var isValidElement = function(object) { return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE; }; // By explicitly using `prop-types` you are opting into new development behavior. // http://fb.me/prop-types-in-prod var throwOnDirectAccess = true; module.exports = __webpack_require__(26)(isValidElement, throwOnDirectAccess); } else { // By explicitly using `prop-types` you are opting into new production behavior. // http://fb.me/prop-types-in-prod module.exports = __webpack_require__(25)(); } /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(5))) /***/ }), /* 2 */ /***/ (function(module, exports, __webpack_require__) { var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! Copyright (c) 2017 Jed Watson. Licensed under the MIT License (MIT), see http://jedwatson.github.io/classnames */ /* global define */ (function () { 'use strict'; var hasOwn = {}.hasOwnProperty; function classNames () { var classes = []; for (var i = 0; i < arguments.length; i++) { var arg = arguments[i]; if (!arg) continue; var argType = typeof arg; if (argType === 'string' || argType === 'number') { classes.push(arg); } else if (Array.isArray(arg) && arg.length) { var inner = classNames.apply(null, arg); if (inner) { classes.push(inner); } } else if (argType === 'object') { for (var key in arg) { if (hasOwn.call(arg, key) && arg[key]) { classes.push(key); } } } } return classes.join(' '); } if (typeof module !== 'undefined' && module.exports) { classNames.default = classNames; module.exports = classNames; } else if (true) { // register as 'classnames', consistent with npm package name !(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = function () { return classNames; }.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); } else { window.classNames = classNames; } }()); /***/ }), /* 3 */ /***/ (function(module, exports) { module.exports = __WEBPACK_EXTERNAL_MODULE_3__; /***/ }), /* 4 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.VolumeIconMuteSVG = exports.VolumeIconLoudSVG = exports.VolumeIconSVG = exports.PrevIconSVG = exports.NextIconSVG = exports.PauseIconSVG = exports.PlayIconSVG = exports.ButtonIconSVG = exports.SoundCloudLogoSVG = undefined; var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } // SoundCloud Logo var SoundCloudLogoSVG = exports.SoundCloudLogoSVG = function SoundCloudLogoSVG() { return _react2.default.createElement("svg", { className: "sb-soundplayer-cover-logo", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor" }, _react2.default.createElement("path", { d: "M10.517 3.742c-.323 0-.49.363-.49.582 0 0-.244 3.591-.244 4.641 0 1.602.15 2.621.15 2.621 0 .222.261.401.584.401.321 0 .519-.179.519-.401 0 0 .398-1.038.398-2.639 0-1.837-.153-4.127-.284-4.592-.112-.395-.313-.613-.633-.613zm-1.996.268c-.323 0-.49.363-.49.582 0 0-.244 3.322-.244 4.372 0 1.602.119 2.621.119 2.621 0 .222.26.401.584.401.321 0 .581-.179.581-.401 0 0 .081-1.007.081-2.608 0-1.837-.206-4.386-.206-4.386 0-.218-.104-.581-.425-.581zm-2.021 1.729c-.324 0-.49.362-.49.582 0 0-.272 1.594-.272 2.644 0 1.602.179 2.559.179 2.559 0 .222.229.463.552.463.321 0 .519-.241.519-.463 0 0 .19-.944.19-2.546 0-1.837-.253-2.657-.253-2.657 0-.22-.104-.582-.425-.582zm-2.046-.358c-.323 0-.49.363-.49.582 0 0-.162 1.92-.162 2.97 0 1.602.069 2.496.069 2.496 0 .222.26.557.584.557.321 0 .581-.304.581-.526 0 0 .143-.936.143-2.538 0-1.837-.206-2.96-.206-2.96 0-.218-.198-.581-.519-.581zm-2.169 1.482c-.272 0-.232.218-.232.218v3.982s-.04.335.232.335c.351 0 .716-.832.716-2.348 0-1.245-.436-2.187-.716-2.187zm18.715-.976c-.289 0-.567.042-.832.116-.417-2.266-2.806-3.989-5.263-3.989-1.127 0-2.095.705-2.931 1.316v8.16s0 .484.5.484h8.526c1.655 0 3-1.55 3-3.155 0-1.607-1.346-2.932-3-2.932zm10.17.857c-1.077-.253-1.368-.389-1.368-.815 0-.3.242-.611.97-.611.621 0 1.106.253 1.542.699l.981-.951c-.641-.669-1.417-1.067-2.474-1.067-1.339 0-2.425.757-2.425 1.99 0 1.338.873 1.736 2.124 2.026 1.281.291 1.513.486 1.513.923 0 .514-.379.738-1.184.738-.65 0-1.26-.223-1.736-.777l-.98.873c.514.757 1.504 1.232 2.639 1.232 1.853 0 2.668-.873 2.668-2.163 0-1.477-1.193-1.845-2.27-2.097zm6.803-2.745c-1.853 0-2.949 1.435-2.949 3.502s1.096 3.501 2.949 3.501c1.852 0 2.949-1.434 2.949-3.501s-1.096-3.502-2.949-3.502zm0 5.655c-1.097 0-1.553-.941-1.553-2.153 0-1.213.456-2.153 1.553-2.153 1.096 0 1.551.94 1.551 2.153.001 1.213-.454 2.153-1.551 2.153zm8.939-1.736c0 1.086-.533 1.756-1.396 1.756-.864 0-1.388-.689-1.388-1.775v-3.897h-1.358v3.916c0 1.978 1.106 3.084 2.746 3.084 1.726 0 2.754-1.136 2.754-3.103v-3.897h-1.358v3.916zm8.142-.89l.019 1.485c-.087-.174-.31-.515-.475-.768l-2.703-3.692h-1.362v6.894h1.401v-2.988l-.02-1.484c.088.175.311.514.475.767l2.79 3.705h1.213v-6.894h-1.339v2.975zm5.895-2.923h-2.124v6.791h2.027c1.746 0 3.474-1.01 3.474-3.395 0-2.484-1.437-3.396-3.377-3.396zm-.097 5.472h-.67v-4.152h.719c1.436 0 2.028.688 2.028 2.076 0 1.242-.651 2.076-2.077 2.076zm7.909-4.229c.611 0 1 .271 1.242.737l1.26-.582c-.426-.883-1.202-1.503-2.483-1.503-1.775 0-3.016 1.435-3.016 3.502 0 2.143 1.191 3.501 2.968 3.501 1.232 0 2.047-.572 2.513-1.533l-1.145-.68c-.358.602-.718.864-1.329.864-1.019 0-1.611-.932-1.611-2.153-.001-1.261.583-2.153 1.601-2.153zm5.17-1.192h-1.359v6.791h4.083v-1.338h-2.724v-5.453zm6.396-.157c-1.854 0-2.949 1.435-2.949 3.502s1.095 3.501 2.949 3.501c1.853 0 2.95-1.434 2.95-3.501s-1.097-3.502-2.95-3.502zm0 5.655c-1.097 0-1.553-.941-1.553-2.153 0-1.213.456-2.153 1.553-2.153 1.095 0 1.55.94 1.55 2.153.001 1.213-.454 2.153-1.55 2.153zm8.557-1.736c0 1.086-.532 1.756-1.396 1.756-.864 0-1.388-.689-1.388-1.775v-3.794h-1.358v3.813c0 1.978 1.106 3.084 2.746 3.084 1.726 0 2.755-1.136 2.755-3.103v-3.794h-1.36v3.813zm5.449-3.907h-2.318v6.978h2.211c1.908 0 3.789-1.037 3.789-3.489 0-2.552-1.565-3.489-3.682-3.489zm-.108 5.623h-.729v-4.266h.783c1.565 0 2.21.706 2.21 2.133.001 1.276-.707 2.133-2.264 2.133z" })); }; // Player Button Icons var ButtonIconSVG = exports.ButtonIconSVG = function ButtonIconSVG(props) { return _react2.default.createElement("svg", { className: "sb-soundplayer-icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32", fill: "currentColor" }, props.children); }; // |> Play var PlayIconSVG = exports.PlayIconSVG = function PlayIconSVG() { return _react2.default.createElement(ButtonIconSVG, null, _react2.default.createElement("path", { d: "M0 0 L32 16 L0 32 z" })); }; // || Pause var PauseIconSVG = exports.PauseIconSVG = function PauseIconSVG() { return _react2.default.createElement(ButtonIconSVG, null, _react2.default.createElement("path", { d: "M0 0 H12 V32 H0 z M20 0 H32 V32 H20 z" })); }; // |>| Next var NextIconSVG = exports.NextIconSVG = function NextIconSVG() { return _react2.default.createElement(ButtonIconSVG, null, _react2.default.createElement("path", { d: "M4 4 L24 14 V4 H28 V28 H24 V18 L4 28 z " })); }; // |<| Prev var PrevIconSVG = exports.PrevIconSVG = function PrevIconSVG() { return _react2.default.createElement(ButtonIconSVG, null, _react2.default.createElement("path", { d: "M4 4 H8 V14 L28 4 V28 L8 18 V28 H4 z " })); }; // Volume var VolumeIconSVG = exports.VolumeIconSVG = function VolumeIconSVG(props) { return _react2.default.createElement("svg", { className: "sb-soundplayer-icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 75 75", fill: "currentColor", stroke: "currentColor" }, props.children); }; var VolumeIconLoudSVG = exports.VolumeIconLoudSVG = function VolumeIconLoudSVG() { return _react2.default.createElement(VolumeIconSVG, null, _react2.default.createElement("polygon", { points: "39.389,13.769 22.235,28.606 6,28.606 6,47.699 21.989,47.699 39.389,62.75 39.389,13.769", style: { strokeWidth: 5, strokeLinejoin: 'round' } }), _react2.default.createElement("path", { d: "M 48.128,49.03 C 50.057,45.934 51.19,42.291 51.19,38.377 C 51.19,34.399 50.026,30.703 48.043,27.577", style: { fill: 'none', strokeWidth: 5, strokeLinecap: 'round' } }), _react2.default.createElement("path", { d: "M 55.082,20.537 C 58.777,25.523 60.966,31.694 60.966,38.377 C 60.966,44.998 58.815,51.115 55.178,56.076", style: { fill: 'none', strokeWidth: 5, strokeLinecap: 'round' } }), _react2.default.createElement("path", { d: "M 61.71,62.611 C 66.977,55.945 70.128,47.531 70.128,38.378 C 70.128,29.161 66.936,20.696 61.609,14.01", style: { fill: 'none', strokeWidth: 5, strokeLinecap: 'round' } })); }; var VolumeIconMuteSVG = exports.VolumeIconMuteSVG = function VolumeIconMuteSVG() { return _react2.default.createElement(VolumeIconSVG, null, _react2.default.createElement("polygon", { points: "39.389,13.769 22.235,28.606 6,28.606 6,47.699 21.989,47.699 39.389,62.75 39.389,13.769", style: { stroke: '#11111', strokeWidth: 5, strokeLinejoin: 'round' } }), _react2.default.createElement("path", { d: "M 48.651772,50.269646 69.395223,25.971024", style: { fill: 'none', strokeWidth: 5, strokeLinecap: 'round' } }), _react2.default.createElement("path", { d: "M 69.395223,50.269646 48.651772,25.971024", style: { fill: 'none', strokeWidth: 5, strokeLinecap: 'round' } })); }; /***/ }), /* 5 */ /***/ (function(module, exports) { // shim for using process in browser var process = module.exports = {}; // cached from whatever global is present so that test runners that stub it // don't break things. But we need to wrap it in a try catch in case it is // wrapped in strict mode code which doesn't define any globals. It's inside a // function because try/catches deoptimize in certain engines. var cachedSetTimeout; var cachedClearTimeout; function defaultSetTimout() { throw new Error('setTimeout has not been defined'); } function defaultClearTimeout () { throw new Error('clearTimeout has not been defined'); } (function () { try { if (typeof setTimeout === 'function') { cachedSetTimeout = setTimeout; } else { cachedSetTimeout = defaultSetTimout; } } catch (e) { cachedSetTimeout = defaultSetTimout; } try { if (typeof clearTimeout === 'function') { cachedClearTimeout = clearTimeout; } else { cachedClearTimeout = defaultClearTimeout; } } catch (e) { cachedClearTimeout = defaultClearTimeout; } } ()) function runTimeout(fun) { if (cachedSetTimeout === setTimeout) { //normal enviroments in sane situations return setTimeout(fun, 0); } // if setTimeout wasn't available but was latter defined if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) { cachedSetTimeout = setTimeout; return setTimeout(fun, 0); } try { // when when somebody has screwed with setTimeout but no I.E. maddness return cachedSetTimeout(fun, 0); } catch(e){ try { // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally return cachedSetTimeout.call(null, fun, 0); } catch(e){ // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error return cachedSetTimeout.call(this, fun, 0); } } } function runClearTimeout(marker) { if (cachedClearTimeout === clearTimeout) { //normal enviroments in sane situations return clearTimeout(marker); } // if clearTimeout wasn't available but was latter defined if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) { cachedClearTimeout = clearTimeout; return clearTimeout(marker); } try { // when when somebody has screwed with setTimeout but no I.E. maddness return cachedClearTimeout(marker); } catch (e){ try { // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally return cachedClearTimeout.call(null, marker); } catch (e){ // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error. // Some versions of I.E. have different rules for clearTimeout vs setTimeout return cachedClearTimeout.call(this, marker); } } } var queue = []; var draining = false; var currentQueue; var queueIndex = -1; function cleanUpNextTick() { if (!draining || !currentQueue) { return; } draining = false; if (currentQueue.length) { queue = currentQueue.concat(queue); } else { queueIndex = -1; } if (queue.length) { drainQueue(); } } function drainQueue() { if (draining) { return; } var timeout = runTimeout(cleanUpNextTick); draining = true; var len = queue.length; while(len) { currentQueue = queue; queue = []; while (++queueIndex < len) { if (currentQueue) { currentQueue[queueIndex].run(); } } queueIndex = -1; len = queue.length; } currentQueue = null; draining = false; runClearTimeout(timeout); } process.nextTick = function (fun) { var args = new Array(arguments.length - 1); if (arguments.length > 1) { for (var i = 1; i < arguments.length; i++) { args[i - 1] = arguments[i]; } } queue.push(new Item(fun, args)); if (queue.length === 1 && !draining) { runTimeout(drainQueue); } }; // v8 likes predictible objects function Item(fun, array) { this.fun = fun; this.array = array; } Item.prototype.run = function () { this.fun.apply(null, this.array); }; process.title = 'browser'; process.browser = true; process.env = {}; process.argv = []; process.version = ''; // empty string to avoid regexp issues process.versions = {}; function noop() {} process.on = noop; process.addListener = noop; process.once = noop; process.off = noop; process.removeListener = noop; process.removeAllListeners = noop; process.emit = noop; process.prependListener = noop; process.prependOnceListener = noop; process.listeners = function (name) { return [] } process.binding = function (name) { throw new Error('process.binding is not supported'); }; process.cwd = function () { return '/' }; process.chdir = function (dir) { throw new Error('process.chdir is not supported'); }; process.umask = function() { return 0; }; /***/ }), /* 6 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'; module.exports = ReactPropTypesSecret; /***/ }), /* 7 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; Object.defineProperty(exports, "__esModule", { value: true }); var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i];for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } }return target; }; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor); } }return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor; }; }(); exports.default = withSoundCloudAudio; var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); var _soundcloudAudio = __webpack_require__(3); var _soundcloudAudio2 = _interopRequireDefault(_soundcloudAudio); var _hoistNonReactStatics = __webpack_require__(22); var _hoistNonReactStatics2 = _interopRequireDefault(_hoistNonReactStatics); var _audioStore = __webpack_require__(21); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; }return 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 === "undefined" ? "undefined" : _typeof(call)) === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + (typeof superClass === "undefined" ? "undefined" : _typeof(superClass))); }subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } function getDisplayName(WrappedComponent) { return WrappedComponent.displayName || WrappedComponent.name || 'Component'; } function withSoundCloudAudio(WrappedComponent) { var WithSoundCloudAudio = function (_Component) { _inherits(WithSoundCloudAudio, _Component); function WithSoundCloudAudio(props, context) { _classCallCheck(this, WithSoundCloudAudio); var _this = _possibleConstructorReturn(this, (WithSoundCloudAudio.__proto__ || Object.getPrototypeOf(WithSoundCloudAudio)).call(this, props, context)); if (!props.clientId && !props.soundCloudAudio && !props.streamUrl) { console.warn('You need to get a clientId from SoundCloud,\n pass in an instance of SoundCloudAudio\n or use streamUrl with audio source instead\n https://github.com/soundblogs/react-soundplayer#examples'); } // Don't create a SoundCloudAudio instance // if there is no `window` if ('undefined' !== typeof window) { if (props.soundCloudAudio) { _this.soundCloudAudio = props.soundCloudAudio; } else { _this.soundCloudAudio = new _soundcloudAudio2.default(props.clientId); } } _this.state = { duration: 0, currentTime: 0, seeking: false, playing: false, volume: 1, isMuted: false, hasSetStartTime: false }; return _this; } _createClass(WithSoundCloudAudio, [{ key: 'componentDidMount', value: function componentDidMount() { this.mounted = true; this.requestAudio(); this.listenAudioEvents(); } }, { key: 'componentDidUpdate', value: function componentDidUpdate(prevProps) { this.props.streamUrl !== prevProps.streamUrl && this.init(prevProps); } }, { key: 'componentWillUnmount', value: function componentWillUnmount() { this.mounted = false; (0, _audioStore.resetPlayedStore)(); this.soundCloudAudio.unbindAll(); } }, { key: 'init', value: function init(prevProps) { var _this2 = this; if (this.props.streamUrl) { this.setState({ hasSetStartTime: false }, function () { _this2.requestAudio(); !prevProps.streamUrl && _this2.listenAudioEvents(); _this2.state.playing && _this2.soundCloudAudio.play(); }); } else { this.soundCloudAudio.stop(); this.soundCloudAudio.cleanData(); this.setState({ duration: 0, currentTime: 0, seeking: false, playing: false, hasSetStartTime: false }); } } }, { key: 'requestAudio', value: function requestAudio() { var _this3 = this; var soundCloudAudio = this.soundCloudAudio; var _props = this.props, resolveUrl = _props.resolveUrl, streamUrl = _props.streamUrl, preloadType = _props.preloadType, onReady = _props.onReady; if (streamUrl) { soundCloudAudio.preload(streamUrl, preloadType); } else if (resolveUrl) { soundCloudAudio.resolve(resolveUrl, function (data) { if (!_this3.mounted) { return; } _this3.setState(_defineProperty({}, data.tracks ? 'playlist' : 'track', data), function () { return onReady && onReady(); }); }); } } }, { key: 'listenAudioEvents', value: function listenAudioEvents() { var soundCloudAudio = this.soundCloudAudio; // https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events soundCloudAudio.on('playing', this.onAudioStarted.bind(this)); soundCloudAudio.on('timeupdate', this.getCurrentTime.bind(this)); soundCloudAudio.on('loadedmetadata', this.getDuration.bind(this)); soundCloudAudio.on('seeking', this.onSeekingTrack.bind(this)); soundCloudAudio.on('seeked', this.onSeekedTrack.bind(this)); soundCloudAudio.on('pause', this.onAudioPaused.bind(this)); soundCloudAudio.on('ended', this.onAudioEnded.bind(this)); soundCloudAudio.on('volumechange', this.onVolumeChange.bind(this)); soundCloudAudio.on('canplay', this.onCanPlay.bind(this)); } }, { key: 'onSeekingTrack', value: function onSeekingTrack() { this.setState({ seeking: true }); } }, { key: 'onSeekedTrack', value: function onSeekedTrack() { this.setState({ seeking: false }); } }, { key: 'onAudioStarted', value: function onAudioStarted() { var soundCloudAudio = this.soundCloudAudio; var onStartTrack = this.props.onStartTrack; this.setState({ playing: true }); (0, _audioStore.stopAllOther)(soundCloudAudio.playing); (0, _audioStore.addToPlayedStore)(soundCloudAudio); onStartTrack && onStartTrack(soundCloudAudio, soundCloudAudio.playing); } }, { key: 'onAudioPaused', value: function onAudioPaused() { var onPauseTrack = this.props.onPauseTrack; this.setState({ playing: false }); onPauseTrack && onPauseTrack(this.soundCloudAudio); } }, { key: 'onAudioEnded', value: function onAudioEnded() { var onStopTrack = this.props.onStopTrack; this.setState({ playing: false }); onStopTrack && onStopTrack(this.soundCloudAudio); } }, { key: 'onVolumeChange', value: function onVolumeChange() { this.setState({ volume: this.soundCloudAudio.audio.volume, isMuted: this.soundCloudAudio.audio.muted }); } }, { key: 'onCanPlay', value: function onCanPlay() { var _props2 = this.props, onCanPlayTrack = _props2.onCanPlayTrack, startTime = _props2.startTime; if (startTime && !this.state.hasSetStartTime) { this.soundCloudAudio.setTime(startTime); this.setState({ hasSetStartTime: true, currentTime: this.soundCloudAudio.audio.currentTime }); } else { onCanPlayTrack && onCanPlayTrack(this.soundCloudAudio); } } }, { key: 'getCurrentTime', value: function getCurrentTime() { this.setState({ currentTime: this.soundCloudAudio.audio.currentTime }); } }, { key: 'getDuration', value: function getDuration() { this.setState({ duration: this.soundCloudAudio.audio.duration }); } }, { key: 'render', value: function render() { return _react2.default.createElement(WrappedComponent, _extends({}, this.props, { soundCloudAudio: this.soundCloudAudio }, this.state)); } }]); return WithSoundCloudAudio; }(_react.Component); WithSoundCloudAudio.displayName = 'withSoundCloudAudio(' + getDisplayName(WrappedComponent) + ')'; WithSoundCloudAudio.WrappedComponent = WrappedComponent; return (0, _hoistNonReactStatics2.default)(WithSoundCloudAudio, WrappedComponent); } /***/ }), /* 8 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; module.exports = __webpack_require__(12); /***/ }), /* 9 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; module.exports = __webpack_require__(20); /***/ }), /* 10 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; module.exports = { components: __webpack_require__(9), addons: __webpack_require__(8) }; /***/ }), /* 11 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor); } }return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor; }; }(); var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); var _propTypes = __webpack_require__(1); var _propTypes2 = _interopRequireDefault(_propTypes); var _soundcloudAudio = __webpack_require__(3); var _soundcloudAudio2 = _interopRequireDefault(_soundcloudAudio); var _withSoundCloudAudio = __webpack_require__(7); var _withSoundCloudAudio2 = _interopRequireDefault(_withSoundCloudAudio); 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 === "undefined" ? "undefined" : _typeof(call)) === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + (typeof superClass === "undefined" ? "undefined" : _typeof(superClass))); }subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } // IMPORTANT NOTE! // This container is deprecated, please use `withSoundCloudAudio` instead // HOC pattern docs - https://reactjs.org/docs/higher-order-components.html var SoundPlayerContainer = function (_Component) { _inherits(SoundPlayerContainer, _Component); function SoundPlayerContainer() { _classCallCheck(this, SoundPlayerContainer); return _possibleConstructorReturn(this, (SoundPlayerContainer.__proto__ || Object.getPrototypeOf(SoundPlayerContainer)).apply(this, arguments)); } _createClass(SoundPlayerContainer, [{ key: 'wrapChild', value: function wrapChild(child) { return _react2.default.cloneElement(child, this.props); } }, { key: 'componentWillMount', value: function componentWillMount() { console.warn('\n <SoundPlayerContainer /> is deprecated! Please use HOC addons/withSoundCloudAudio instead.\n https://reactjs.org/docs/higher-order-components.html\n https://labs.voronianski.dev/react-soundplayer/#Containers\n '); } }, { key: 'render', value: function render() { var children = this.props.children; if (!children) { return; } if (!Array.isArray(children)) { return this.wrapChild(children); } return _react2.default.createElement('span', null, _react2.default.Children.map(children, this.wrapChild.bind(this))); } }]); return SoundPlayerContainer; }(_react.Component); SoundPlayerContainer.propTypes = { streamUrl: _propTypes2.default.string, resolveUrl: _propTypes2.default.string, clientId: _propTypes2.default.string, soundCloudAudio: _propTypes2.default.instanceOf(_soundcloudAudio2.default), onStartTrack: _propTypes2.default.func, onStopTrack: _propTypes2.default.func, onPauseTrack: _propTypes2.default.func, onVolumeChange: _propTypes2.default.func, onReady: _propTypes2.default.func }; exports.default = (0, _withSoundCloudAudio2.default)(SoundPlayerContainer); /***/ }), /* 12 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.SoundPlayerContainer = exports.withSoundCloudAudio = exports.withCustomAudio = undefined; var _withSoundCloudAudio2 = __webpack_require__(7); var _withSoundCloudAudio3 = _interopRequireDefault(_withSoundCloudAudio2); var _SoundPlayerContainer2 = __webpack_require__(11); var _SoundPlayerContainer3 = _interopRequireDefault(_SoundPlayerContainer2); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } exports.withCustomAudio = _withSoundCloudAudio3.default; exports.withSoundCloudAudio = _withSoundCloudAudio3.default; exports.SoundPlayerContainer = _SoundPlayerContainer3.default; /***/ }), /* 13 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; Object.defineProperty(exports, "__esModule", { value: true }); var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i];for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } }return target; }; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor); } }return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor; }; }(); var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); var _propTypes = __webpack_require__(1); var _propTypes2 = _interopRequireDefault(_propTypes); var _classnames = __webpack_require__(2); var _classnames2 = _interopRequireDefault(_classnames); var _Icons = __webpack_require__(4); 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 === "undefined" ? "undefined" : _typeof(call)) === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + (typeof superClass === "undefined" ? "undefined" : _typeof(superClass))); }subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var Cover = function (_Component) { _inherits(Cover, _Component); function Cover() { _classCallCheck(this, Cover); return _possibleConstructorReturn(this, (Cover.__proto__ || Object.getPrototypeOf(Cover)).apply(this, arguments)); } _createClass(Cover, [{ key: 'render', value: function render() { var _props = this.props, backgroundUrl = _props.backgroundUrl, trackName = _props.trackName, artistName = _props.artistName, className = _props.className, style = _props.style, children = _props.children; var classNames = (0, _classnames2.default)('sb-soundplayer-cover', className); return _react2.default.createElement('div', { className: classNames, style: _extends({}, style, { backgroundImage: 'url(' + backgroundUrl + ')' }) }, _react2.default.createElement('div', null, _react2.default.createElement(_Icons.SoundCloudLogoSVG, null)), _react2.default.createElement('div', null, _react2.default.createElement('span', { className: 'sb-soundplayer-track sb-soundplayer-info-box' }, trackName)), _react2.default.createElement('div', null, _react2.default.createElement('span', { className: 'sb-soundplayer-artist sb-soundplayer-info-box' }, 'by ', artistName)), _react2.default.Children.map(children, _react2.default.cloneElement)); } }]); return Cover; }(_react.Component); Cover.propTypes = { className: _propTypes2.default.string, backgroundUrl: _propTypes2.default.string.isRequired, trackName: _propTypes2.default.string.isRequired, artistName: _propTypes2.default.string.isRequired }; Cover.defaultProps = { style: {} }; exports.default = Cover; /***/ }), /* 14 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor); } }return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor; }; }(); var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); var _propTypes = __webpack_require__(1); var _propTypes2 = _interopRequireDefault(_propTypes); var _classnames = __webpack_require__(2); var _classnames2 = _interopRequireDefault(_classnames); var _soundcloudAudio = __webpack_require__(3); var _soundcloudAudio2 = _interopRequireDefault(_soundcloudAudio); var _Icons = __webpack_require__(4); 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 === "undefined" ? "undefined" : _typeof(call)) === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + (typeof superClass === "undefined" ? "undefined" : _typeof(superClass))); }subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var NextButton = function (_Component) { _inherits(NextButton, _Component); function NextButton() { _classCallCheck(this, NextButton); return _possibleConstructorReturn(this, (NextButton.__proto__ || Object.getPrototypeOf(NextButton)).apply(this, arguments)); } _createClass(NextButton, [{ key: 'shouldComponentUpdate', value: function shouldComponentUpdate() { return false; } }, { key: 'handleClick', value: function handleClick(e) { var _props = this.props, soundCloudAudio = _props.soundCloudAudio, onNextClick = _props.onNextClick; soundCloudAudio && soundCloudAudio.next(); onNextClick && onNextClick(e); } }, { key: 'render', value: function render() { var _props2 = this.props, className = _props2.className, style = _props2.style; var classNames = (0, _classnames2.default)('sb-soundplayer-btn sb-soundplayer-next-btn', className); return _react2.default.createElement('button', { type: 'button', className: classNames, style: style, onClick: this.handleClick.bind(this) }, _react2.default.createElement(_Icons.NextIconSVG, null)); } }]); return NextButton; }(_react.Component); NextButton.propTypes = { className: _propTypes2.default.string, onNextClick: _propTypes2.default.func, soundCloudAudio: _propTypes2.default.instanceOf(_soundcloudAudio2.default) }; exports.default = NextButton; /***/ }), /* 15 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor); } }return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor; }; }(); var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); var _propTypes = __webpack_require__(1); var _propTypes2 = _interopRequireDefault(_propTypes); var _classnames = __webpack_require__(2); var _classnames2 = _interopRequireDefault(_classnames); var _soundcloudAudio = __webpack_require__(3); var _soundcloudAudio2 = _interopRequireDefault(_soundcloudAudio); var _Icons = __webpack_require__(4); 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 === "undefined" ? "undefined" : _typeof(call)) === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + (typeof superClass === "undefined" ? "undefined" : _typeof(superClass))); }subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var PlayButton = function (_Component) { _inherits(PlayButton, _Component); function PlayButton() { _classCallCheck(this, PlayButton); return _possibleConstructorReturn(this, (PlayButton.__proto__ || Object.getPrototypeOf(PlayButton)).apply(this, arguments)); } _createClass(PlayButton, [{ key: 'shouldComponentUpdate', value: function shouldComponentUpdate(nextProps) { var _props = this.props, playing = _props.playing, seeking = _props.seeking; return playing !== nextProps.playing || seeking !== nextProps.seeking; } }, { key: 'handleClick', value: function handleClick(e) { var _props2 = this.props, playing = _props2.playing, soundCloudAudio = _props2.soundCloudAudio, onTogglePlay = _props2.onTogglePlay; if (!playing) { soundCloudAudio && soundCloudAudio.play({ playlistIndex: soundCloudAudio._playlistIndex }); } else { soundCloudAudio && soundCloudAudio.pause(); } onTogglePlay && onTogglePlay(e); } }, { key: 'render', value: function render() { var _props3 = this.props, playing = _props3.playing, seekingIcon = _props3.seekingIcon, seeking = _props3.seeking, className = _props3.className, style = _props3.style; var iconNode = void 0; if (seeking && seekingIcon) { iconNode = _react2.default.cloneElement(seekingIcon); } else if (playing) { iconNode = _react2.default.createElement(_Icons.PauseIconSVG, null); } else { iconNode = _react2.default.createElement(_Icons.PlayIconSVG, null); } var classNames = (0, _classnames2.default)('sb-soundplayer-btn sb-soundplayer-play-btn', className); return _react2.default.createElement('button', { type: 'button', className: classNames, style: style, onClick: this.handleClick.bind(this) }, iconNode); } }]); return PlayButton; }(_react.Component); PlayButton.propTypes = { className: _propTypes2.default.string, seeking: _propTypes2.default.bool, playing: _propTypes2.default.bool, onTogglePlay: _propTypes2.default.func, seekingIcon: _propTypes2.default.node, soundCloudAudio: _propTypes2.default.instanceOf(_soundcloudAudio2.default) }; PlayButton.defaultProps = { playing: false, seeking: false }; exports.default = PlayButton; /***/ }), /* 16 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor); } }return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor; }; }(); var _react = __webpack_require__(0); var _react2 = _interopRequireDefault(_react); var _propTypes = __webpack_require__(1); var _propTypes2 = _interopRequireDefault(_propTypes); var _classnames = __webpack_require__(2); var _classnames2 = _interopRequire