isPlayer issue: Can't use mb.YTPLayer for (hero) section background videos

[jjroelofs]

So I've always been using this background player to add background videos to page sections. Sometimes they are here regions at the top of the page but they can be anywhere in the page. Since you added the below code this is not working properly anymore. This code causes any section where I add a background video to become a fixed-size 16:9 size. Instead I need the section to be whatever height the content inside makes it, and then the video will stretch out to match the section size. Example: http://demo.sooperthemes.com/glazed-main/sections-and-backgrounds (I'll be fixing this page soon but without a fix the section is cut short)

        /**
         If is an inline player toggle play if the overlay is clicked
         */
        if (YTPlayer.isPlayer) {
          YTPlayer.inlinePlayButton = jQuery("<div/>").addClass("inlinePlayButton").html(jQuery.mbYTPlayer.controls.play);
          $YTPlayer.append(YTPlayer.inlinePlayButton);
          YTPlayer.inlinePlayButton.on("click", function (e) {
            $YTPlayer.YTPPlay();
            e.stopPropagation();
          });

          if (YTPlayer.opt.autoPlay)
            YTPlayer.inlinePlayButton.hide();

          YTPlayer.overlay.on("click", function () {
            $YTPlayer.YTPTogglePlay();
          }).css({cursor: "pointer"})
        }

[jjroelofs]

Proposed solution:

diff --git a/src/jquery.mb.YTPlayer.src.js b/src/jquery.mb.YTPlayer.src.js
index e509e86..ffa4def 100644
--- a/src/jquery.mb.YTPlayer.src.js
+++ b/src/jquery.mb.YTPlayer.src.js
@@ -236,6 +236,12 @@ function iOSversion() {
        */
       optimizeDisplay: true,

+      /**
+       optimizeDisplay (bool)
+       The video will be a fixed size matching the content's aspect ratio
+       */
+      isStandAlonePlayer: false,
+
       /**
        abundance (bool)
        the abudance of the video size
@@ -535,7 +541,7 @@ function iOSversion() {
         YTPlayer.wrapper.append(playerBox);
         playerBox.after(YTPlayer.overlay);

-        if (YTPlayer.isPlayer) {
+        if (YTPlayer.isPlayer && YTPlayer.opt.isStandAlonePlayer) {
           YTPlayer.inlineWrapper = jQuery("<div/>").addClass("inline-YTPlayer");

           YTPlayer.inlineWrapper.css({

I added an extra option so that you can specify whether the player is a standalone player or used as the background of the container element. I do really like the new options you added to this plugin, like the controls and disable-on-mobile options. I hope you can understand my use case and accommodate for it in your plugin so that I don't need to maintain a fork for using it in my Drupal module :)