react-native-youtube-iframe-2/dist/YoutubeIframe.js

A simple wrapper around the youtube iframe js API for react native

var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _WebView=require("./WebView");var _constants=require("./constants");var _events=require("events");var _PlayerScripts=require("./PlayerScripts");var _this=this,_jsxFileName="/home/syousefi/workspace/react-native/react-native-youtube-iframe-2/src/YoutubeIframe.js";var YoutubeIframe=function YoutubeIframe(props,ref){var height=props.height,width=props.width,videoId=props.videoId,playList=props.playList,remote=props.remote,_props$play=props.play,play=_props$play===void 0?false:_props$play,_props$mute=props.mute,mute=_props$mute===void 0?false:_props$mute,_props$volume=props.volume,volume=_props$volume===void 0?100:_props$volume,webViewStyle=props.webViewStyle,webViewProps=props.webViewProps,_props$playbackRate=props.playbackRate,playbackRate=_props$playbackRate===void 0?1:_props$playbackRate,_props$contentScale=props.contentScale,contentScale=_props$contentScale===void 0?1.0:_props$contentScale,_props$onError=props.onError,onError=_props$onError===void 0?function(_err){}:_props$onError,_props$onReady=props.onReady,onReady=_props$onReady===void 0?function(_event){}:_props$onReady,_props$playListStartI=props.playListStartIndex,playListStartIndex=_props$playListStartI===void 0?0:_props$playListStartI,_props$initialPlayerP=props.initialPlayerParams,initialPlayerParams=_props$initialPlayerP===void 0?{}:_props$initialPlayerP,_props$allowWebViewZo=props.allowWebViewZoom,allowWebViewZoom=_props$allowWebViewZo===void 0?false:_props$allowWebViewZo,_props$forceAndroidAu=props.forceAndroidAutoplay,forceAndroidAutoplay=_props$forceAndroidAu===void 0?false:_props$forceAndroidAu,_props$onChangeState=props.onChangeState,onChangeState=_props$onChangeState===void 0?function(_event){}:_props$onChangeState,_props$onFullScreenCh=props.onFullScreenChange,onFullScreenChange=_props$onFullScreenCh===void 0?function(_status){}:_props$onFullScreenCh,_props$onPlaybackQual=props.onPlaybackQualityChange,onPlaybackQualityChange=_props$onPlaybackQual===void 0?function(_quality){}:_props$onPlaybackQual,_props$onPlaybackRate=props.onPlaybackRateChange,onPlaybackRateChange=_props$onPlaybackRate===void 0?function(_playbackRate){}:_props$onPlaybackRate;var webViewRef=(0,_react.useRef)(null);var eventEmitter=(0,_react.useRef)(new _events.EventEmitter());var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),playerReady=_useState2[0],setPlayerReady=_useState2[1];(0,_react.useImperativeHandle)(ref,function(){return{getDuration:function getDuration(){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.durationScript);return new Promise(function(resolve){eventEmitter.current.once('getDuration',resolve);});},getCurrentTime:function getCurrentTime(){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.currentTimeScript);return new Promise(function(resolve){eventEmitter.current.once('getCurrentTime',resolve);});},isMuted:function isMuted(){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.isMutedScript);return new Promise(function(resolve){eventEmitter.current.once('isMuted',resolve);});},getVolume:function getVolume(){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.getVolumeScript);return new Promise(function(resolve){eventEmitter.current.once('getVolume',resolve);});},getPlaybackRate:function getPlaybackRate(){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.getPlaybackRateScript);return new Promise(function(resolve){eventEmitter.current.once('getPlaybackRate',resolve);});},getAvailablePlaybackRates:function getAvailablePlaybackRates(){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.getAvailablePlaybackRatesScript);return new Promise(function(resolve){eventEmitter.current.once('getAvailablePlaybackRates',resolve);});},seekTo:function seekTo(seconds,allowSeekAhead){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.seekToScript(seconds,allowSeekAhead));}};},[]);(0,_react.useEffect)(function(){if(!playerReady){return;}[_PlayerScripts.playMode[play],_PlayerScripts.soundMode[mute],_PlayerScripts.PLAYER_FUNCTIONS.setVolume(volume),_PlayerScripts.PLAYER_FUNCTIONS.setPlaybackRate(playbackRate)].forEach(webViewRef.current.injectJavaScript);},[play,playerReady,mute,volume,playbackRate]);var onWebMessage=(0,_react.useCallback)(function(event){var message=JSON.parse(event.nativeEvent.data);try{switch(message.eventType){case'fullScreenChange':onFullScreenChange(message.data);break;case'playerStateChange':onChangeState(_constants.PLAYER_STATES[message.data]);break;case'playerReady':onReady();setPlayerReady(true);if(Array.isArray(playList)){webViewRef.current.injectJavaScript(_PlayerScripts.PLAYER_FUNCTIONS.loadPlaylist(playList,playListStartIndex,play));}break;case'playerQualityChange':onPlaybackQualityChange(message.data);break;case'playerError':onError(_constants.PLAYER_ERROR[message.data]);break;case'playbackRateChange':onPlaybackRateChange(message.data);break;default:eventEmitter.current.emit(message.eventType,message.data);break;}}catch(error){console.warn(error);}},[play,onReady,onError,playList,onChangeState,onFullScreenChange,playListStartIndex,onPlaybackRateChange,onPlaybackQualityChange]);return _react.default.createElement(_reactNative.View,{style:{height:height,width:width},__self:_this,__source:{fileName:_jsxFileName,lineNumber:171,columnNumber:5}},_react.default.createElement(_WebView.WebView,(0,_extends2.default)({originWhitelist:['*'],allowsInlineMediaPlayback:true,style:[styles.webView,webViewStyle],mediaPlaybackRequiresUserAction:false,allowsFullscreenVideo:!(initialPlayerParams==null?void 0:initialPlayerParams.preventFullScreen),userAgent:forceAndroidAutoplay?_reactNative.Platform.select({android:_constants.CUSTOM_USER_AGENT,ios:''}):'',onShouldStartLoadWithRequest:function onShouldStartLoadWithRequest(request){return request.mainDocumentURL==='about:blank';},bounces:false},webViewProps,{ref:webViewRef,onMessage:onWebMessage,source:!remote?(0,_extends2.default)({},webViewProps==null?void 0:webViewProps.source,{method:'GET',html:(0,_PlayerScripts.MAIN_SCRIPT)(videoId,playList,initialPlayerParams,allowWebViewZoom,contentScale)}):(0,_extends2.default)({},webViewProps==null?void 0:webViewProps.source,{method:'GET',uri:(0,_PlayerScripts.MAIN_SCRIPT_REMOTE)(videoId,playList,initialPlayerParams,allowWebViewZoom,contentScale,remote)}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:172,columnNumber:7}})));};var styles=_reactNative.StyleSheet.create({webView:{backgroundColor:'transparent'}});var _default=(0,_react.forwardRef)(YoutubeIframe);exports.default=_default;