1+ <!doctypehtml> < meta name ="viewport "content ="width=device-width, "> < style > body {margin : 0 }.container {position : relative;width : 100% ;height : 0 ;padding-bottom : 56.25% }.video {position : absolute;top : 0 ;left : 0 ;width : 100% ;height : 100% }</ style > < div class ="container "> < div class ="video "id ="player "> </ div > </ div > < script > const randomPlayerId = "player" + Date . now ( ) ; document . getElementById ( "player" ) . id = randomPlayerId ; const parsedUrl = new URL ( window . location . href ) , UrlQueryData = parsedUrl . searchParams . get ( "data" ) , { end :end , list :list , color :color , start :start , rel_s :rel_s , loop_s :loop_s , listType :listType , playerLang :playerLang , playlist :playlist , videoId_s :videoId_s , controls_s :controls_s , cc_lang_pref_s :cc_lang_pref_s , contentScale_s :contentScale_s , allowWebViewZoom :allowWebViewZoom , modestbranding_s :modestbranding_s , iv_load_policy :iv_load_policy , preventFullScreen_s :preventFullScreen_s , showClosedCaptions_s :showClosedCaptions_s } = JSON . parse ( UrlQueryData ) ; function sendMessageToRN ( e ) { window . ReactNativeWebView . postMessage ( JSON . stringify ( e ) ) } let metaString = "" ; contentScale_s && ( metaString += `initial-scale=${ contentScale_s } ) , allowWebViewZoom || ( metaString += `maximum-scale=${ contentScale_s } ) ; const viewport = document . querySelector ( "meta[name=viewport]" ) ; viewport . setAttribute ( "content" , "width=device-width, " + metaString ) ; var tag = document . createElement ( "script" ) ; tag . src = "https://www.youtube.com/iframe_api" ; var player , firstScriptTag = document . getElementsByTagName ( "script" ) [ 0 ] ; function onYouTubeIframeAPIReady ( ) { player = new YT . Player ( randomPlayerId , { width :"1000" , height :"1000" , videoId :videoId_s , playerVars :{ end :end , rel :rel_s , list :list , color :color , loop :loop_s , start :start , playsinline :1 , hl :playerLang , playlist :playlist , listType :listType , controls :controls_s , fs :preventFullScreen_s , cc_lang_pref :cc_lang_pref_s , iv_load_policy :iv_load_policy , modestbranding :modestbranding_s , cc_load_policy :showClosedCaptions_s } , events :{ onReady :onPlayerReady , onError :onPlayerError , onStateChange :onPlayerStateChange , onPlaybackRateChange :onPlaybackRateChange , onPlaybackQualityChange :onPlaybackQualityChange } } ) } function onPlayerError ( e ) { sendMessageToRN ( { eventType :"playerError" , data :e . data } ) } function onPlaybackRateChange ( e ) { sendMessageToRN ( { eventType :"playbackRateChange" , data :e . data } ) } function onPlaybackQualityChange ( e ) { sendMessageToRN ( { eventType :"playerQualityChange" , data :e . data } ) } function onPlayerReady ( e ) { sendMessageToRN ( { eventType :"playerReady" } ) } function onPlayerStateChange ( e ) { sendMessageToRN ( { eventType :"playerStateChange" , data :e . data } ) } firstScriptTag . parentNode . insertBefore ( tag , firstScriptTag ) ; var isFullScreen = ! 1 ; function onFullScreenChange ( ) { isFullScreen = document . fullscreenElement || document . msFullscreenElement || document . mozFullScreenElement || document . webkitFullscreenElement , sendMessageToRN ( { eventType :"fullScreenChange" , data :Boolean ( isFullScreen ) } ) } document . addEventListener ( "fullscreenchange" , onFullScreenChange ) , document . addEventListener ( "msfullscreenchange" , onFullScreenChange ) , document . addEventListener ( "mozfullscreenchange" , onFullScreenChange ) , document . addEventListener ( "webkitfullscreenchange" , onFullScreenChange ) , window . addEventListener ( "message" , function ( e ) { var { data :e } = e ; switch ( e ) { case "playVideo" :player . playVideo ( ) ; break ; case "pauseVideo" :player . pauseVideo ( ) ; break ; case "muteVideo" :player . mute ( ) ; break ; case "unMuteVideo" :player . unMute ( ) } } ) </ script >
0 commit comments