Safe autoplay on Chromium

2 files changed, 29 insertions, 6 deletions

diff --git a/res/client.js b/res/client.js
index aa76441..c7d2369 100644
--- a/res/client.js
+++ b/res/client.js
@@ -1959,6 +1959,7 @@ client_players_Iframe.prototype = {
 	}
 };
 var client_players_Raw = function(main,player) {
+	this.playAllowed = true;
 	this.playerEl = window.document.querySelector("#ytapiplayer");
 	this.main = main;
 	this.player = player;
@@ -2013,10 +2014,13 @@ client_players_Raw.prototype = {
 		}
 		this.video.oncanplaythrough = ($_=this.player,$bind($_,$_.onCanBePlayed));
 		this.video.onseeking = ($_=this.player,$bind($_,$_.onSetTime));
-		this.video.onplay = ($_=this.player,$bind($_,$_.onPlay));
+		this.video.onplay = function(e1) {
+			_gthis.playAllowed = true;
+			_gthis.player.onPlay();
+			return;
+		};
 		this.video.onpause = ($_=this.player,$bind($_,$_.onPause));
 		this.playerEl.appendChild(this.video);
-		this.video.pause();
 	}
 	,removeVideo: function() {
 		if(this.video == null) {
@@ -2026,10 +2030,20 @@ client_players_Raw.prototype = {
 		this.video = null;
 	}
 	,play: function() {
+		var _gthis = this;
 		if(this.video == null) {
 			return;
 		}
-		this.video.play();
+		if(!this.playAllowed) {
+			return;
+		}
+		var promise = this.video.play();
+		if(promise == null) {
+			return;
+		}
+		promise.catch(function(error) {
+			return _gthis.playAllowed = false;
+		});
 	}
 	,pause: function() {
 		if(this.video == null) {
diff --git a/src/client/players/Raw.hx b/src/client/players/Raw.hx
index 44a33f2..5637b1c 100644
--- a/src/client/players/Raw.hx
+++ b/src/client/players/Raw.hx
@@ -13,6 +13,7 @@ class Raw implements IPlayer {
 	final main:Main;
 	final player:Player;
 	final playerEl:Element = ge("#ytapiplayer");
+	var playAllowed = true;
 	var video:VideoElement;
 
 	public function new(main:Main, player:Player) {
@@ -60,10 +61,12 @@ class Raw implements IPlayer {
 		}, 3000);
 		video.oncanplaythrough = player.onCanBePlayed;
 		video.onseeking = player.onSetTime;
-		video.onplay = player.onPlay;
+		video.onplay = e -> {
+			playAllowed = true;
+			player.onPlay();
+		}
 		video.onpause = player.onPause;
 		playerEl.appendChild(video);
-		video.pause();
 	}
 
 	public function removeVideo():Void {
@@ -74,7 +77,13 @@ class Raw implements IPlayer {
 
 	public function play():Void {
 		if (video == null) return;
-		video.play();
+		if (!playAllowed) return;
+		final promise = video.play();
+		if (promise == null) return;
+		promise.catchError(error -> {
+			// Do not try to play video anymore or Chromium will hide play button
+			playAllowed = false;
+		});
 	}
 
 	public function pause():Void {