<?php $players = []; ?>

<?php foreach($page->translation->description as $key => $block): ?>
    <?php if($block->status && (!isset($block->code_name) || $block->code_name == '')): ?>

        <?php if(isset($block->view) && $block->view != ''): ?>
            <?php echo $__env->make($block->view, ['dynamicContent' => $block, 'order' => $key], array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
        <?php else: ?>
            <?php echo $__env->make('layouts.partials.dynamic.'.$block->typeSlug, ['dynamicContent' => $block, 'order' => $key], array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
        <?php endif; ?>

        <?php if($block->typeSlug == 'video-block') $players[$key] = $block; ?>
    <?php endif; ?>
<?php endforeach; ?>

<?php if(count($players) != 0 ): ?>
    <script>
        // Load the IFrame Player API code asynchronously.
        var tag = document.createElement('script');
        tag.src = "https://www.youtube.com/player_api";
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

        // Replace the 'ytplayer' element with an <iframe> and
        // YouTube player after the API code downloads.

        <?php foreach($players as $key => $player): ?>
            var player<?php echo $key; ?> = null;
        <?php endforeach; ?>

        function loadYoutubePlayer(element, key, youtubeLink ) {
            element = new YT.Player(('ytplayer-'+key), {
                height: '360',
                width: '640',
                videoId: youtubeLink,
                host: 'https://www.youtube-nocookie.com',
                playerVars: {
                    modestbranding: 1,
                    showinfo: 0,
                    rel: 0,
                },
                events: {
                    'onReady': onPlayerReady,
                }
            });
        }


        <?php foreach($players as $key => $player): ?>
            document.querySelector('#player<?php echo $key; ?> .video-overlay').addEventListener('click', function () {
                if(player<?php echo $key; ?> === null){
                    loadYoutubePlayer(player<?php echo $key; ?>, '<?php echo $key; ?>', '<?php echo $player->youtube; ?>');
                }

                this.classList.add('hide');

            }, false);

        <?php endforeach; ?>

        function onPlayerReady(event) {
            event.target.playVideo();
        }
    </script>
<?php endif; ?>