Plyr vimeo multiple autopause off

by beaver71

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/plyr/2.0.18/plyr.js"></script>
<link rel="stylesheet" href="https://cdn.plyr.io/2.0.7/plyr.css">
<h2>Vimeo 1</h2>
<div class="video-component jsVideoComponent">
  <div class="video-component__video jsVideo" data-type="vimeo" data-video-id="137907462"></div>
</div>
<h2>Vimeo 2</h2>
<div class="video-component jsVideoComponent">
  <div class="video-component__video jsVideo" data-type="vimeo" data-video-id="221432022"></div>
</div>

JavaScript

$(document).ready(function($) {
  var $videoComponent = $('.jsVideoComponent');

  var options = {
    autoplay: true,
  };

  if ($videoComponent.length) {
    $videoComponent.each(function(index) {
      console.log("videoComponent " + index);
      var $thisComponent = $(this);
      console.log("  >videoComp:", $thisComponent);
      var $thisVideo = $thisComponent.find('.jsVideo');

      // control video
      var video = plyr.setup($thisComponent.find('.jsVideo').get(), options);

      video[0].on('ready', function(event) {
        var player = video[0].getEmbed();
        console.log("  >player:", player);
        // check vimeo player API: https://github.com/vimeo/player.js#setautopauseautopause-boolean-promiseboolean-unsupportederrorerror
        player.setAutopause(false).then(function(autopause) {
          // autopause was turned off
        }).catch(function(error) {
          switch (error.name) {
            case 'UnsupportedError':
              // Autopause is not supported with the current player or browser
              break;

            default:
              // some other error occurred
              break;
          }
        });
      });

      var $button = $thisComponent.find('.jsVideoBtn');
      $button.on('click', function() {
        console.log($thisComponent);
        $thisComponent.find('.plyr').show();
        video[0].toggleFullscreen();
        video[0].play();
      });

      video[0].on('exitfullscreen', function() {
        $thisComponent.find('.plyr').hide();
        video[0].stop();
      });
    });

  }
});