Fix: Add smart hardware check and network probe for HD thumbnails

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

@@ -77,17 +77,41 @@ ImprovedTube.forcedTheaterMode = function () {
 		}
 	}
 };
+
 /*------------------------------------------------------------------------------
- HD THUMBNAIL
+ HD THUMBNAIL (Smart Hardware & Network Probe)
 ------------------------------------------------------------------------------*/
-ImprovedTube.playerHdThumbnail = function () {
-	if (this.storage.player_hd_thumbnail === true) {
-		var thumbnail = ImprovedTube.elements.player_thumbnail;
+ImprovedTube.playerHdThumbnail = function (thumbnailElement) {
+    if (this.storage.player_hd_thumbnail === true) {
+        var thumbnail = thumbnailElement || ImprovedTube.elements.player_thumbnail;
+
+        if (!thumbnail || !thumbnail.style) return;
+
+        var currentBg = thumbnail.style.backgroundImage;
+        if (currentBg && currentBg.indexOf("/hqdefault.jpg") !== -1) {
+
+            var rect = thumbnail.getBoundingClientRect();
+            var physicalWidth = (rect.width || thumbnail.clientWidth || 0) * (window.devicePixelRatio || 1);
 
-		if (thumbnail.style.backgroundImage.indexOf("/hqdefault.jpg") !== -1) {
-			thumbnail.style.backgroundImage = thumbnail.style.backgroundImage.replace("/hqdefault.jpg", "/maxresdefault.jpg");
-		}
-	}
+            if (physicalWidth === 0) {
+                return;
+            }
+
+            if (physicalWidth > 400) {
+
+                var maxResUrl = currentBg.replace("/hqdefault.jpg", "/maxresdefault.jpg");
+                var extractedUrl = maxResUrl.replace(/^url\(["']?/, '').replace(/["']?\)$/, '');
+
+                var probe = new Image();
+                probe.onload = function () {
+                    thumbnail.style.backgroundImage = maxResUrl;
+                };
+                probe.onerror = function () {
+                };
+                probe.src = extractedUrl;
+            }
+        }
+    }
 };
 /*------------------------------------------------------------------------------
  ALWAYS SHOW PROGRESS BAR

menu/skeleton-parts/appearance.js

@@ -418,7 +418,18 @@ extension.skeleton.main.layers.section.appearance.on.click.player = {
 				player_hd_thumbnail: {
 					component: "switch",
 					text: "hdThumbnail",
-					tags: "preview"
+					tags: "preview",
+					on: {
+						render: function() {
+							var maxPhysicalWidth = window.screen.width * (window.devicePixelRatio || 1);
+
+							if (maxPhysicalWidth < 1000) {
+								this.style.display = 'none';
+							} else {
+								this.style.display = '';
+							}
+						}
+					}
 				},
 				hide_scroll_for_details: {
 					component: "switch",
@@ -525,11 +536,6 @@ extension.skeleton.main.layers.section.appearance.on.click.player = {
 				text: "durationWithSpeed",
 				value: false
 			},
-			player_hd_thumbnail: {
-				component: "switch",
-				text: "hdThumbnail",
-				tags: "preview"
-			},
 			hide_scroll_for_details: {
 				component: "switch",
 				text: "hideScrollForDetails",

menu/skeleton-parts/general.js

@@ -287,7 +287,17 @@ extension.skeleton.main.layers.section.general = {
 						text: 'hd',
 						value: 'maxresdefault'
 					}],
-					tags: 'preview quality'
+					tags: 'preview quality',
+					on: {
+						render: function() {
+							var maxPhysicalWidth = window.screen.width * (window.devicePixelRatio || 1);
+							if (maxPhysicalWidth < 1000) {
+								this.style.display = 'none';
+							} else {
+								this.style.display = ''; 
+							}
+						}
+					}
 				},
 				change_thumbnails_per_row: {
 					component: 'select',