Lazy Load Youtube Video based of URL from CMB2

video-embed.js

//* Lightweight Youtube Emebeds
//**********************************************
// https://www.labnol.org/internet/light-youtube-embeds/27941/

document.addEventListener("DOMContentLoaded",
		  function() {
				var div, n,
					 v = document.getElementsByClassName("youtube-player");
				for (n = 0; n < v.length; n++) {
					 div = document.createElement("div");
					 div.setAttribute("data-id", v[n].dataset.id);
					 div.innerHTML = ytThumb(v[n].dataset.id);
					 div.onclick = ytIframe;
					 v[n].appendChild(div);
				}
		  });

	 function ytThumb(id) {
		  var thumb = '<img src="https://i.ytimg.com/vi/ID/maxresdefault.jpg" aria-hidden="true">',
				play = '<button class="play" aria-label="Play Video"></button>';
		  return thumb.replace("ID", id) + play;
	 }

	 function ytIframe() {
		  var iframe = document.createElement("iframe");
		  var embed = "https://www.youtube.com/embed/ID?autoplay=1&amp;rel=0&amp;showinfo=0&amp;color=white&amp;iv_load_policy=3";
		  iframe.setAttribute("src", embed.replace("ID", this.dataset.id));
		  iframe.setAttribute("frameborder", "0");
		  iframe.setAttribute("allowfullscreen", "1");
		  this.parentNode.replaceChild(iframe, this);
	 }


//* Append Youtube URL for iframes
//**********************************************

(function($) {

	var $youtube_src = $("iframe[src*='youtube.com']");
	var $vimeo_src = $("iframe[src*='player.vimeo.com']");

	// Loop for each youtube video
	$($youtube_src).each(function( ) {

		var $this = $(this);
		var _src = $this.attr('src');
		var $youtube_options = '&amp;rel=0&amp;showinfo=0&amp;color=white';

		// Append
		$this.attr( 'src', _src + $youtube_options );

	});

	// Loop through each vimeo video
	$($vimeo_src).each(function( ) {
		var $this = $(this);
		var _src = $this.attr('src');
		var $vimeo_options = '?title=0&byline=0&portrait=0';

		//Append
		$this.attr( 'src', _src + $vimeo_options );

	});

})( jQuery );

video-embed.php

<?php

/**
 * Video Meta Outputput from CMB2 for lazy loading
 *
 * Dones't include loading JS
 */


// If this file is called directly, abort.
//**********************
if( !defined( 'ABSPATH' ) ) exit;


//* Video Output
//**********************************************

// CMB2 Meta
$prefix = '_pb_homepage_video_';
$video_url   = esc_url( get_post_meta( get_the_ID(), '' .$prefix. 'video', true ) );
$class = 'home-video';

$vidoe_url_host = parse_url( $video_url, PHP_URL_HOST );
$video_url_path = parse_url( $video_url, PHP_URL_PATH ); // for youtu.be based videos

// https://secure.php.net/manual/en/function.parse-url.php
// https://stackoverflow.com/questions/3392993/php-regex-to-get-youtube-video-id

// Get the id of youtube videos coming from youtube.com or youtu.be
if ( $vidoe_url_host == 'www.youtube.com' || $vidoe_url_host == 'youtube.com' ) {
	$youtube_url_id = parse_str( parse_url( $video_url, PHP_URL_QUERY ), $video_id );
	$youtube_url_id = $video_id['v'];
} elseif ( $vidoe_url_host == 'youtu.be' ) {
	$youtube_url_id = trim( $video_url_path, "/" );
}


//**********************

// Output video place holder if video url is provided
if ( !empty( $video_url ) ) {

	include CHILD_DIR . '/inc/views/video-placeholder.php';

}

video-placeholder.php

<div class="<?php echo $class; ?>">
	<div class="video-wrap">

		<?php if( $vidoe_url_host == 'www.youtube.com' || $vidoe_url_host == 'youtube.com' || $vidoe_url_host == 'youtu.be' ) : ?>

			<div class="youtube-player embeded-video-player" data-id="<?php echo $youtube_url_id; ?>"></div>

		<?php else : ?>

			<?php echo wp_oembed_get( $video_url ); ?>

		<?php endif; ?>

	</div>
</div>
<!-- End Video Embed -->