I am getting the following errors on the console:
VIDEOJS: ERROR: TypeError: this.ytPlayer.getDuration is not a function && VIDEOJS: ERROR: TypeError: this.ytPlayer.getPlaybackRate is not a function.
The erros point to the videojs-youtube plugin https://github.com/videojs/videojs-youtube
Here is where they can be seen live: https://wordpress-513216-1628950.cloudwaysapps.com/
The video works fine when it iterates only one, however when I have it many in a loop, the error happens. I have created a WP shortcode plugin to add them to the page. Here is my code:
function display_sm_videojs($atts)
{
$a = shortcode_atts(array(
'class' => '',
'autoplay' => '',
'preload' => 'auto'
), $atts);
$id = get_the_ID();
$videoType = get_post_meta($id, 'upload-video-from', true);
$postThumbnail = get_the_post_thumbnail_url($id);
.
.
.
.
if ($videoType === 'YouTube') {
$videoURL = get_post_meta($id, 'from-youtube', true);
$dataSetup = '{ "techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "' . $videoURL . '"}], "youtube": { "rel": 0 } }';
// Add YouTube VideoJS Plugin
if (!wp_script_is('sm-videojs-youtube', 'enqueued')) {
wp_enqueue_script('sm-videojs-youtube');
}
.
.
.
.
.
.
.
.
$video = "
<div class='video-js-responsive-container vjs-hd " . esc_attr($a['class']) . "'>
<video
id='my-video'
class='video-js'
controls
" . esc_attr($a['autoplay']) . "
preload=' " . esc_attr($a['preload']) . "'
controlsList='nodownload'
poster='$postThumbnail'
data-setup='$dataSetup'
>
$videoSource
<!-- <source src='MY_VIDEO.webm' type='video/webm' /> -->
<p class='vjs-no-js'>
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href='https://videojs.com/html5-video-support/' target='_blank'
>supports HTML5 video</a
>
</p>
</video>
</div>";
//! Enqueue Style / Scripts
// Styles
if (!wp_style_is('sm-videojs-css', 'enqueued')) {
wp_enqueue_style('sm-videojs-css');
}
// Scripts
if (!wp_script_is('sm-videojs-js', 'enqueued')) {
wp_enqueue_script('sm-videojs-js');
}
return $video;
}
function register_sm_videoJS()
{
// Register Style/Scripts
wp_register_style('videojs-css', 'https://vjs.zencdn.net/7.10.2/video-js.css', [], '1.0.0');
wp_register_style('sm-videojs-css', plugin_dir_url(__DIR__) . 'sm_videojs/css/sm-videojs.min.css', ['videojs-css'], '1.0.0');
wp_register_script('sm-videojs-js', plugin_dir_url(__DIR__) . 'sm_videojs/js/video.min.js', ['elementor-frontend'], '1.0.0', true);
wp_register_script('sm-videojs-youtube', plugin_dir_url(__DIR__) . 'sm_videojs/js/Youtube.min.js', ['sm-videojs-js'], '1.0.0', true);
// Add Shortcode
add_shortcode('sm-videojs', 'display_sm_videojs');
}
add_action('init', 'register_sm_videoJS');
from VIDEOJS: ERROR: TypeError: this.ytPlayer.getDuration is not a function && this.ytPlayer.getPlaybackRate
No comments:
Post a Comment