Add a data-youtube-nocookie option

laurefrog · laurefrog · commit 729ea0a36421 · 2018-09-29T16:17:52.000+02:00
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: {

Original file line number	Diff line number	Diff line change
`@@ -98,6 +98,7 @@`
`98`	`98`	`}`
`99`	`99`	`this.youTubePlayer = new YT.Player(containerId, {`
`100`	`100`	`videoId: this.activeYouTubeId,`
	`101`	`+ host: this.youTubeNoCookie ? 'https://www.youtube-nocookie.com' : 'https://www.youtube.com',`
`101`	`102`	`width: this.ytWidth,`
`102`	`103`	`height: this.ytHeight,`
`103`	`104`	`playerVars: {`