UNPKG

@lahzenegar/video-react

Version:

Video-React is a web video player built from the ground up for an HTML5 world using React library.

317 lines (274 loc) 10.6 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.mediaProperties = undefined; var _extends2 = require('babel-runtime/helpers/extends'); var _extends3 = _interopRequireDefault(_extends2); exports.formatTime = formatTime; exports.isVideoChild = isVideoChild; exports.isHls = isHls; exports.mergeAndSortChildren = mergeAndSortChildren; exports.deprecatedWarning = deprecatedWarning; exports.throttle = throttle; exports.getErrorSchema = getErrorSchema; exports.camelCaseSeparator = camelCaseSeparator; exports.startTimer = startTimer; var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _hls = require('hls.js'); var _hls2 = _interopRequireDefault(_hls); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } /** * @file format-time.js * * Format seconds as a time string, H:MM:SS or M:SS * Supplying a guide (in seconds) will force a number of leading zeros * to cover the length of the guide * * @param {Number} seconds Number of seconds to be turned into a string * @param {Number} guide Number (in seconds) to model the string after * @return {String} Time formatted as H:MM:SS or M:SS * @private * @function formatTime */ function formatTime() { var _seconds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0; var guide = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _seconds; var dvr = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; var seconds = dvr ? guide - _seconds : _seconds; var s = Math.floor(seconds % 60); var m = Math.floor(seconds / 60 % 60); var h = Math.floor(seconds / 3600); var gm = Math.floor(guide / 60 % 60); var gh = Math.floor(guide / 3600); // handle invalid times if (isNaN(seconds) || seconds === Infinity) { // '-' is false for all relational operators (e.g. <, >=) so this setting // will add the minimum number of fields specified by the guide h = m = s = '-'; } // Check if we need to show hours h = h > 0 || gh > 0 ? h + ':' : ''; // If hours are showing, we may need to add a leading zero. // Always show at least one digit of minutes. m = ((h || gm >= 10) && m < 10 ? '0' + m : m) + ':'; // Check if leading zero is need for seconds s = s < 10 ? '0' + s : s; if (dvr) return '-' + h + m + s; return h + m + s; } // Check if the element belongs to a video element // only accept <source />, <track />, // <MyComponent isVideoChild /> // elements function isVideoChild(c) { if (c.props && c.props.isVideoChild) { return true; } return c.type === 'source' || c.type === 'track'; } var find = function find(elements, func) { return elements.filter(func)[0]; }; // check if two components are the same type var isTypeEqual = function isTypeEqual(component1, component2) { var type1 = component1.type; var type2 = component2.type; if (typeof type1 === 'string' || typeof type2 === 'string') { return type1 === type2; } if (typeof type1 === 'function' && typeof type2 === 'function') { return type1.displayName === type2.displayName; } return false; }; // is hls source? function isHls(src) { var hlsSuffix = /http.*?\.m3u8/; if (hlsSuffix.test(src)) return true; return false; } // merge default children // sort them by `order` property // filter them by `disabled` property function mergeAndSortChildren(defaultChildren, _children, _parentProps) { var defaultOrder = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1; var children = _react2.default.Children.toArray(_children); var parentProps = (0, _extends3.default)({}, _parentProps); return children.filter(function (e) { return !e.props.disabled; }) // filter the disabled components .concat(defaultChildren.filter(function (c) { return !find(children, function (component) { return isTypeEqual(component, c); }); })).map(function (element) { var defaultComponent = find(defaultChildren, function (c) { return isTypeEqual(c, element); }); delete parentProps.order; var defaultProps = defaultComponent ? defaultComponent.props : {}; var props = (0, _extends3.default)({}, parentProps, defaultProps, element.props); var e = _react2.default.cloneElement(element, props, element.props.children); return e; }).sort(function (a, b) { return (a.props.order || defaultOrder) - (b.props.order || defaultOrder); }); } /** * Temporary utility for generating the warnings */ function deprecatedWarning(oldMethodCall, newMethodCall) { // eslint-disable-next-line no-console console.warn('WARNING: ' + oldMethodCall + ' will be deprecated soon! Please use ' + newMethodCall + ' instead.'); } function throttle(callback, limit) { var _arguments = arguments; var wait = false; return function () { if (!wait) { callback.apply(null, _arguments); wait = true; setTimeout(function () { wait = false; }, limit); } }; } var mediaProperties = exports.mediaProperties = ['error', 'src', 'srcObject', 'currentSrc', 'crossOrigin', 'networkState', 'preload', 'buffered', 'readyState', 'seeking', 'currentTime', 'duration', 'paused', 'defaultPlaybackRate', 'playbackRate', 'played', 'seekable', 'ended', 'autoplay', 'loop', 'mediaGroup', 'controller', 'controls', 'volume', 'muted', 'defaultMuted', 'audioTracks', 'videoTracks', 'textTracks', 'width', 'height', 'videoWidth', 'videoHeight', 'poster']; function getErrorSchema(error) { if (error) { var details = error.details, fatal = error.fatal, isFatal = fatal || isNetworkError(error); if (isFatal) { return { type: getErrorType(error), detail: isNetworkError(error) ? getNetworkError(error) : getErrorDetail(details), isFatal: isFatal }; } return null; } } function getNetworkError(error) { if (error) { var response = error.response, details = error.details, detail = getErrorDetail(details); if (response && response.code) { return 'HTTP_ERROR_' + response.code; } return detail ? 'NETWORK_ISSUE_' + getErrorDetail(details) : 'NETWORK_ERROR'; } } function isNetworkError(error) { return error && error.type === _hls2.default.ErrorTypes.NETWORK_ERROR; } function getErrorType(error) { var type = error.type; switch (type) { case _hls2.default.ErrorTypes.KEY_SYSTEM_ERROR: return 'KEY_SYSTEM_ERROR'; case _hls2.default.ErrorTypes.MEDIA_ERROR: return 'MEDIA_ERROR'; case _hls2.default.ErrorTypes.MUX_ERROR: return 'MUX_ERROR'; case _hls2.default.ErrorTypes.NETWORK_ERROR: return 'NETWORK_ERROR'; case _hls2.default.ErrorTypes.OTHER_ERROR: return 'OTHER_ERROR'; default: return 'UNHANDLED_ERROR'; } } function getErrorDetail(errorDetail) { if (errorDetail) { switch (errorDetail) { case _hls2.default.ErrorDetails.AUDIO_TRACK_LOAD_ERROR: return 'AUDIO_TRACK_LOAD_ERROR'; case _hls2.default.ErrorDetails.AUDIO_TRACK_LOAD_TIMEOUT: return 'AUDIO_TRACK_LOAD_TIMEOUT'; case _hls2.default.ErrorDetails.BUFFER_ADD_CODEC_ERROR: return 'BUFFER_ADD_CODEC_ERROR'; case _hls2.default.ErrorDetails.BUFFER_APPENDING_ERROR: return 'BUFFER_APPENDING_ERROR'; case _hls2.default.ErrorDetails.BUFFER_APPEND_ERROR: return 'BUFFER_APPEND_ERROR'; case _hls2.default.ErrorDetails.BUFFER_FULL_ERROR: return 'BUFFER_FULL_ERROR'; case _hls2.default.ErrorDetails.BUFFER_NUDGE_ON_STALL: return 'BUFFER_NUDGE_ON_STALL'; case _hls2.default.ErrorDetails.BUFFER_SEEK_OVER_HOLE: return 'BUFFER_SEEK_OVER_HOLE'; case _hls2.default.ErrorDetails.BUFFER_STALLED_ERROR: return 'BUFFER_STALLED_ERROR'; case _hls2.default.ErrorDetails.FRAG_DECRYPT_ERROR: return 'FRAG_DECRYPT_ERROR'; case _hls2.default.ErrorDetails.FRAG_LOAD_ERROR: return 'FRAG_LOAD_ERROR'; case _hls2.default.ErrorDetails.FRAG_LOAD_TIMEOUT: return 'FRAG_LOAD_TIMEOUT'; case _hls2.default.ErrorDetails.FRAG_PARSING_ERROR: return 'FRAG_PARSING_ERROR'; case _hls2.default.ErrorDetails.INTERNAL_EXCEPTION: return 'INTERNAL_EXCEPTION'; case _hls2.default.ErrorDetails.KEY_LOAD_ERROR: return 'KEY_LOAD_ERROR'; case _hls2.default.ErrorDetails.KEY_LOAD_TIMEOUT: return 'KEY_LOAD_TIMEOUT'; case _hls2.default.ErrorDetails.KEY_SYSTEM_LICENSE_REQUEST_FAILED: return 'KEY_SYSTEM_LICENSE_REQUEST_FAILED'; case _hls2.default.ErrorDetails.KEY_SYSTEM_NO_ACCESS: return 'KEY_SYSTEM_NO_ACCESS'; case _hls2.default.ErrorDetails.KEY_SYSTEM_NO_KEYS: return 'KEY_SYSTEM_NO_KEYS'; case _hls2.default.ErrorDetails.KEY_SYSTEM_NO_SESSION: return 'KEY_SYSTEM_NO_SESSION'; case _hls2.default.ErrorDetails.LEVEL_LOAD_ERROR: return 'LEVEL_LOAD_ERROR'; case _hls2.default.ErrorDetails.LEVEL_LOAD_TIMEOUT: return 'LEVEL_LOAD_TIMEOUT'; case _hls2.default.ErrorDetails.LEVEL_SWITCH_ERROR: return 'LEVEL_SWITCH_ERROR'; case _hls2.default.ErrorDetails.MANIFEST_INCOMPATIBLE_CODECS_ERROR: return 'MANIFEST_INCOMPATIBLE_CODECS_ERROR'; case _hls2.default.ErrorDetails.MANIFEST_LOAD_ERROR: return 'MANIFEST_LOAD_ERROR'; case _hls2.default.ErrorDetails.MANIFEST_LOAD_TIMEOUT: return 'MANIFEST_LOAD_TIMEOUT'; case _hls2.default.ErrorDetails.MANIFEST_PARSING_ERROR: return 'MANIFEST_PARSING_ERROR'; case _hls2.default.ErrorDetails.REMUX_ALLOC_ERROR: return 'REMUX_ALLOC_ERROR'; default: return typeof errorDetail === 'string' ? camelCaseSeparator(errorDetail).toUpperCase() : 'OTHER_ERRORS'; } } return 'UNHANDLED_ERROR'; } // function isHandalableError(fatal) { // return fatal !== true; // } function camelCaseSeparator(input) { var separator = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '_'; if (input && separator) { return input.trim().replace(/([A-Z])/g, function (item) { return separator + item.toLowerCase(); }).replace(new RegExp('^\\' + separator, 'g'), '').replace(new RegExp('\\' + separator + '$', 'g'), ''); } return null; } function startTimer() { var milliSecondsPassed = 0; var timerInterval = setInterval(function () { milliSecondsPassed += 100; }, 100); return { end: function end() { clearInterval(timerInterval); return milliSecondsPassed; } }; }