Merge pull request #2110 from raszpl/rename-autoplay

Rename autoplay to reflect its real function

_locales/en/messages.json

@@ -122,8 +122,8 @@
     "autoPictureInPicture": {
         "message": "Auto Picture-In-Picture"
     },
-    "autoplay": {
-        "message": "Autoplay"
+    "autoplay_disable": {
+        "message": "Force Autoplay Off"
     },
     "avoidAv1": {
         "message": "Avoid AV1"
@@ -1325,4 +1325,4 @@
     "youtubesDark": {
         "message": "YouTube's dark"
     }
-}
+}

background.js

@@ -32,6 +32,12 @@ chrome.runtime.onInstalled.addListener(function (installed) {
 	if(installed.reason == 'update') {
 		//      var thisVersion = chrome.runtime.getManifest().version;
 		//      console.log("Updated from " + installed.previousVersion + " to " + thisVersion + "!");
+		chrome.storage.local.get('player_autoplay', function (result) {
+			if (result.player_autoplay === false) {
+				chrome.storage.local.set({player_autoplay_disable: true});
+				chrome.storage.local.remove(['player_autoplay'], (i) => {});
+			}
+		});    
 		chrome.storage.local.get('channel_default_tab', function (result) {
 			if (result.channel_default_tab === '/home') {
 				chrome.storage.local.set({channel_default_tab: '/'});

js&css/extension/www.youtube.com/general/general.js

@@ -263,7 +263,7 @@ target.itPopupWindowButton.addEventListener('click', function (event) {
 			if (  vertical && !shorts ){ height = width * 0.6}
 		}
 
-			window.open('https://www.youtube.com/embed/' + this.dataset.id + '?autoplay=' + (extension.storage.get('player_autoplay') == false ? '0' : '1'), '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
+			window.open('https://www.youtube.com/embed/' + this.dataset.id + '?autoplay=' + (extension.storage.get('player_autoplay_disable') ? '0' : '1'), '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
 				chrome.runtime.sendMessage({
 				action: 'fixPopup',
 				width: width,
@@ -582,4 +582,4 @@ extension.features.openNewTab = function (){
 		}
 	}
 	}
-}
+}

js&css/web-accessible/core.js

@@ -46,7 +46,7 @@ var ImprovedTube = {
 	focus: false,
 	played_before_blur: false,
 	played_time: 0,
-	ignore_autoplay_off: false,
+	user_interacted: false,
 	mini_player__mode: false,
 	mini_player__move: false,
 	mini_player__cursor: '',

js&css/web-accessible/functions.js

@@ -337,7 +337,7 @@ ImprovedTube.playerOnPlay = function () {
 			this.removeEventListener('ended', ImprovedTube.playerOnEnded, true);
 			this.addEventListener('ended', ImprovedTube.playerOnEnded, true);
 
-			ImprovedTube.autoplay();
+			ImprovedTube.autoplayDisable();
 			ImprovedTube.playerLoudnessNormalization();
 
 			return original.apply(this, arguments);
@@ -432,23 +432,23 @@ ImprovedTube.playerOnEnded = function (event) {
 
 ImprovedTube.onkeydown = function () {
 	window.addEventListener('keydown', function () {
-		if (ImprovedTube.elements.player && ImprovedTube.elements.player.className.indexOf('ad-showing') === -1) {
-			ImprovedTube.ignore_autoplay_off = true;
+		if (ImprovedTube.elements.player && ImprovedTube.elements.player.classList.contains('ad-showing')) {
+			ImprovedTube.user_interacted = true;
 		}
 	}, true);
 };
 
 ImprovedTube.onmousedown = function (event) {
 	window.addEventListener('mousedown', function (event) {
-		if (ImprovedTube.elements.player && ImprovedTube.elements.player.className.indexOf('ad-showing') === -1) {
+		if (ImprovedTube.elements.player && ImprovedTube.elements.player.classList.contains('ad-showing')) {
 			var path = event.composedPath();
 
 			for (var i = 0, l = path.length; i < l; i++) {
 				if (path[i].className
 					&& path[i].className.indexOf
 					&& (path[i].className.indexOf('html5-main-video') !== -1
 						|| path[i].className.indexOf('ytp-play-button') !== -1)) {
-					ImprovedTube.ignore_autoplay_off = true;
+					ImprovedTube.user_interacted = true;
 				}
 			}
 		}

js&css/web-accessible/www.youtube.com/player.js

@@ -1,17 +1,17 @@
 /*------------------------------------------------------------------------------
-AUTOPLAY
+AUTOPLAY DISABLE
 ------------------------------------------------------------------------------*/
-ImprovedTube.autoplay = function () {
+ImprovedTube.autoplayDisable = function () {
     var video = ImprovedTube.elements.player;
     if (ImprovedTube.video_url !== location.href) {
-        ImprovedTube.ignore_autoplay_off = false;
+        this.user_interacted = false;
     }
     // if (allow autoplay is false) and  (no ads playing) and
 	// ( there is a video and ( (it is not in a playlist and  auto play is off ) or ( playlist auto play is off and it is not in a playlist ) ) ) or (if we are in a channel and the channel trailer autoplay is off)  )
-    if (ImprovedTube.ignore_autoplay_off === false && video.classList.contains('ad-showing') === false &&
+    if (!this.user_interacted && video.classList.contains('ad-showing') === false &&
         ( 
 // quick fix #1703  thanks to @AirRaid#9957
-            (/* document.documentElement.dataset.pageType === "video" */ location.href.indexOf('/watch?') !== -1 && ((location.href.indexOf('list=') === -1 && ImprovedTube.storage.player_autoplay === false) || (ImprovedTube.storage.playlist_autoplay === false && location.href.indexOf('list=') !== -1))) ||
+            (/* document.documentElement.dataset.pageType === "video" */ location.href.indexOf('/watch?') !== -1 && ((location.href.indexOf('list=') === -1 && ImprovedTube.storage.player_autoplay_disable) || (ImprovedTube.storage.playlist_autoplay === false && location.href.indexOf('list=') !== -1))) ||
             (/* document.documentElement.dataset.pageType === "channel" */ ImprovedTube.regex.channel.test(location.href) && ImprovedTube.storage.channel_trailer_autoplay === false)
         )
     )         
@@ -881,7 +881,7 @@ ImprovedTube.playerPopupButton = function () {
 				const videoID = location.search.match(ImprovedTube.regex.video_id)[1],
 					listMatch = location.search.match(ImprovedTube.regex.playlist_id),
 					popup = window.open(
-						`${location.protocol}//www.youtube.com/embed/${videoID}?start=${parseInt(ytPlayer.getCurrentTime())}&autoplay=${(ImprovedTube.storage.player_autoplay ?? true) ? '1' : '0'}${listMatch?`&list=${listMatch[1]}`:''}`,
+						`${location.protocol}//www.youtube.com/embed/${videoID}?start=${parseInt(ytPlayer.getCurrentTime())}&autoplay=${ImprovedTube.storage.player_autoplay_disable ? '0' : '1'}${listMatch?`&list=${listMatch[1]}`:''}`,
 						'_blank',
 						`directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${ytPlayer.offsetWidth / 3},height=${ytPlayer.offsetHeight / 3}`
 					);

js&css/web-accessible/www.youtube.com/playlist.js

@@ -137,7 +137,7 @@ ImprovedTube.playlistShuffle = function () {
 /**
  * ## Creates a playlist popup button (with ID `it-popup-playlist-button`)
  * - used by/in {@linkcode ImprovedTube.playlistPopupUpdate}
- * - checks {@linkcode ImprovedTube.storage.player_autoplay} if to autoplay the popuped playlist/video
+ * - checks {@linkcode ImprovedTube.storage.player_autoplay_disable} if to autoplay the popuped playlist/video
  * - checks {@linkcode ImprovedTube.elements.player} to get video ID and current time, if available, otherwise starts first video of playlist
  * - popup has video players width/height or window (inner) width/height when video player is not available
  * - the button has the playlist ID as `list` in its dataset and reads from it to open the popup
@@ -170,16 +170,16 @@ ImprovedTube.playlistPopupCreateButton = function (playlistID, altButtonStyle, c
 				ImprovedTube.elements.player.pauseVideo();
 				const listID = this.dataset.list,
 					videoID = videoURL.match(ImprovedTube.regex.video_id)[1],
-					popup = window.open(`${location.protocol}//www.youtube.com/embed/${videoID}?autoplay=${(ImprovedTube.storage.player_autoplay ?? true) ? '1' : '0'}&start=${videoURL.match(ImprovedTube.regex.video_time)?.[1] ?? '0'}&list=${listID}`, '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
+					popup = window.open(`${location.protocol}//www.youtube.com/embed/${videoID}?autoplay=${ImprovedTube.storage.player_autoplay_disable ? '0' : '1'}&start=${videoURL.match(ImprovedTube.regex.video_time)?.[1] ?? '0'}&list=${listID}`, '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
 				//! If the video is not in the playlist or not within the first 200 entries, then it automatically selects the first video in the list.
 				//! But this is okay since this button is mainly for the playlist, not the video (see the video popup button in player.js).
 				popup.addEventListener('load', function () {
 					"use strict";
 					//~ check if the video ID in the link of the video title matches the original video ID in the URL and if not reload as a videoseries/playlist (without the videoID and start-time).
 					const videoLink = this.document.querySelector('div#player div.ytp-title-text>a[href]');
-					if (videoLink && videoLink.href.match(ImprovedTube.regex.video_id)[1] !== videoID) this.location.href = `${location.protocol}//www.youtube.com/embed/videoseries?autoplay=${(ImprovedTube.storage.player_autoplay ?? true) ? '1' : '0'}&list=${listID}`;
+					if (videoLink && videoLink.href.match(ImprovedTube.regex.video_id)[1] !== videoID) this.location.href = `${location.protocol}//www.youtube.com/embed/videoseries?autoplay=${ImprovedTube.storage.player_autoplay_disable ? '0' : '1'}&list=${listID}`;
 				}, {passive: true, once: true});
-			} else window.open(`${location.protocol}//www.youtube.com/embed/videoseries?autoplay=${(ImprovedTube.storage.player_autoplay ?? true) ? '1' : '0'}&list=${this.dataset.list}`, '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
+			} else window.open(`${location.protocol}//www.youtube.com/embed/videoseries?autoplay=${ImprovedTube.storage.player_autoplay_disable ? '0' : '1'}&list=${this.dataset.list}`, '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
 			//~ change focused tab to URL-less popup
 			ImprovedTube.messages.send({
 				action: 'fixPopup',
@@ -196,7 +196,7 @@ ImprovedTube.playlistPopupCreateButton = function (playlistID, altButtonStyle, c
 							if ( !vertical &&  shorts ){ width = height * 0.6}
 							if (  vertical && !shorts ){ height = width * 0.6}		}
 			"use strict";
-			window.open(`${location.protocol}//www.youtube.com/embed/videoseries?autoplay=${(ImprovedTube.storage.player_autoplay ?? true) ? '1' : '0'}&list=${this.dataset.list}`, '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
+			window.open(`${location.protocol}//www.youtube.com/embed/videoseries?autoplay=${ImprovedTube.storage.player_autoplay_disable ? '0' : '1'}&list=${this.dataset.list}`, '_blank', `directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=${width / 3},height=${height / 3}`);
 			//~ change focused tab to URL-less popup
 			ImprovedTube.messages.send({
 				action: 'fixPopup',
@@ -252,4 +252,4 @@ try {
 		else panelItemButtons.appendChild(this.elements.buttons['it-popup-playlist-button-panel'] = this.playlistPopupCreateButton(playlistID, true, true));
 	} else if (playlistID != null && this.elements.buttons['it-popup-playlist-button-panel'].dataset.list !== playlistID) this.elements.buttons['it-popup-playlist-button-panel'].dataset.list = playlistID;
 } catch (error) {    console.error("Error appending playlist button panel:", error);}
-}};
+}};

js&css/web-accessible/www.youtube.com/shortcuts.js

@@ -732,7 +732,7 @@ ImprovedTube.shortcutPopupPlayer = function () {
 	if (document.documentElement.dataset.pageType === 'video' && player) {
 		player.pauseVideo();
 
-		window.open('//www.youtube.com/embed/' + location.href.match(/watch\?v=([A-Za-z0-9\-\_]+)/g)[0].slice(8) + '?start=' + parseInt(player.getCurrentTime()) + '&autoplay=' + (ImprovedTube.storage.player_autoplay == false ? '0' : '1'), '_blank', 'directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=' + player.offsetWidth + ',height=' + player.offsetHeight);
+		window.open('//www.youtube.com/embed/' + location.href.match(/watch\?v=([A-Za-z0-9\-\_]+)/g)[0].slice(8) + '?start=' + parseInt(player.getCurrentTime()) + '&autoplay=' + (ImprovedTube.storage.player_autoplay_disable ? '0' : '1'), '_blank', 'directories=no,toolbar=no,location=no,menubar=no,status=no,titlebar=no,scrollbars=no,resizable=no,width=' + player.offsetWidth + ',height=' + player.offsetHeight);
 	}
 };
 

menu/skeleton-parts/player.js

@@ -126,11 +126,11 @@ extension.skeleton.main.layers.section.player.on.click = {
 			max: 3.17,
 			step: .01
 		},
-		autoplay: {
+		autoplay_disable: {
 			component: 'switch',
 			text: 'autoplay',
-			value: true,
-			storage: 'player_autoplay'
+			value: false,
+			storage: 'player_autoplay_disable'
 		},
 		up_next_autoplay: {
 			component: 'switch',