Add a data-youtube-nocookie option

marstyson · Sep 29, 2018 · 729ea0a · 729ea0a
1 parent 5d5f9ec
commit 729ea0a
Show file tree

Hide file tree

Showing 7 changed files with 33 additions and 8 deletions.
diff --git a/README.md b/README.md
@@ -320,6 +320,7 @@ The following attributes are supported on the `<video>` element only:
 -   **data-allow-fullscreen** - optional; if set to "false" the player will not include a fullscreen button
 -   **data-youtube-id** - optional; 11-character YouTube ID, to play the YouTube video using *Able Player*.
 -   **data-youtube-desc-id** - optional; 11-character YouTube ID of the described version of a video. See the section below on *YouTube Support* for additional information.
+-   **data-youtube-nocookie** - optional; if set to "true" the YouTube video will be embedded using the "youtube-nocookie.com" host.
 -   **height** - height of the video in pixels. If not provided will
     default to 360.
 -   **poster** - path to an image file. Will be displayed in the player

diff --git a/build/ableplayer.dist.js b/build/ableplayer.dist.js
@@ -291,6 +291,13 @@
       this.youTubeDescId = $(media).data('youtube-desc-id');
     }
 
+    if ($(media).data('youtube-nocookie') !== undefined && $(media).data('youtube-nocookie')) {
+      this.youTubeNoCookie = true;
+    }
+    else {
+      this.youTubeNoCookie = false;
+    }
+
     // Icon type
     // By default, AblePlayer 3.0.33 and higher uses SVG icons for the player controls
     // Fallback for browsers that don't support SVG is scalable icomoon fonts
@@ -5239,6 +5246,7 @@
     }
     this.youTubePlayer = new YT.Player(containerId, {
       videoId: this.activeYouTubeId,
+      host: this.youTubeNoCookie ? 'https://www.youtube-nocookie.com' : 'https://www.youtube.com',
       width: this.ytWidth,
       height: this.ytHeight,
       playerVars: {

diff --git a/build/ableplayer.js b/build/ableplayer.js
@@ -291,6 +291,13 @@
       this.youTubeDescId = $(media).data('youtube-desc-id');
     }
 
+    if ($(media).data('youtube-nocookie') !== undefined && $(media).data('youtube-nocookie')) {
+      this.youTubeNoCookie = true;
+    }
+    else {
+      this.youTubeNoCookie = false;
+    }
+
     // Icon type
     // By default, AblePlayer 3.0.33 and higher uses SVG icons for the player controls
     // Fallback for browsers that don't support SVG is scalable icomoon fonts
@@ -5239,6 +5246,7 @@
     }
     this.youTubePlayer = new YT.Player(containerId, {
       videoId: this.activeYouTubeId,
+      host: this.youTubeNoCookie ? 'https://www.youtube-nocookie.com' : 'https://www.youtube.com',
       width: this.ytWidth,
       height: this.ytHeight,
       playerVars: {

diff --git a/build/ableplayer.min.js b/build/ableplayer.min.js
diff --git a/package-lock.json b/package-lock.json
diff --git a/scripts/ableplayer-base.js b/scripts/ableplayer-base.js
@@ -291,6 +291,13 @@
       this.youTubeDescId = $(media).data('youtube-desc-id');
     }
 
+    if ($(media).data('youtube-nocookie') !== undefined && $(media).data('youtube-nocookie')) {
+      this.youTubeNoCookie = true;
+    }
+    else {
+      this.youTubeNoCookie = false;
+    }
+
     // Icon type
     // By default, AblePlayer 3.0.33 and higher uses SVG icons for the player controls
     // Fallback for browsers that don't support SVG is scalable icomoon fonts

diff --git a/scripts/youtube.js b/scripts/youtube.js
@@ -98,6 +98,7 @@
     }
     this.youTubePlayer = new YT.Player(containerId, {
       videoId: this.activeYouTubeId,
+      host: this.youTubeNoCookie ? 'https://www.youtube-nocookie.com' : 'https://www.youtube.com',
       width: this.ytWidth,
       height: this.ytHeight,
       playerVars: {