update translations

Fix skip audio notification not working on firefox

manifest/chrome-manifest-extra.json

@@ -30,7 +30,7 @@
       "icons/close.png",
       "icons/skipIcon.svg",
       "icons/refresh.svg",
-      "icons/beep.ogg",
+      "icons/beep.oga",
       "icons/pause.svg",
       "icons/stop.svg",
       "icons/skip.svg",

manifest/manifest-v2-extra.json

@@ -22,7 +22,7 @@
         "icons/close.png",
         "icons/skipIcon.svg",
         "icons/refresh.svg",
-        "icons/beep.ogg",
+        "icons/beep.oga",
         "icons/pause.svg",
         "icons/stop.svg",
         "icons/skip.svg",

manifest/manifest.json

@@ -1,7 +1,7 @@
 {
     "name": "__MSG_fullName__",
     "short_name": "SponsorBlock",
-    "version": "5.9.4",
+    "version": "5.9.6",
     "default_locale": "en",
     "description": "__MSG_Description__",
     "homepage_url": "https://sponsor.ajay.app",

public/options/options.css

@@ -118,13 +118,13 @@ html, body {
 
 .option-group > div {
     min-height: 50px;
-    padding: 20px 0;
+    padding: 15px 0;
     border-bottom: 1px solid var(--border-color);
     border-image: linear-gradient(to right, var(--border-color), #00000000 80%)  1;
 }
 
 .categoryExtraOptions {
-    padding-bottom: 20px;
+    padding-bottom: 15px;
 }
 
 #music_offtopic_autoSkipOnMusicVideos {
@@ -271,11 +271,11 @@ input[type='number'] {
 
 .small-description {
     font-size: 13px;
-    padding: 15px 0 0 20px;
+    padding: 5px 0 0 20px;
 }
 
 .small-description td {
-    padding: 10px 0 20px 20px;
+    padding: 2.5px 0 10px 20px;
 }
 
 .indent {
@@ -283,7 +283,7 @@ input[type='number'] {
 }
 
 .categoryTableElement td {
-    padding-top: 10px;
+    padding-top: 5px;
     border-top: 1px solid var(--border-color);
 }
 
@@ -353,7 +353,8 @@ input[type='number'] {
 
     font-size: 14px;
 
-    display: table;
+    display: flex;
+    align-items: center;
 }
 
 .switch-container .switch-label {

src/content.ts

@@ -1721,7 +1721,7 @@ function skipToTime({v, skipTime, skippingSegments, openNotice, forceAutoSkip, u
 
     if (autoSkip && Config.config.audioNotificationOnSkip
             && !isSubmittingSegment && !getVideo()?.muted) {
-        const beep = new Audio(chrome.runtime.getURL("icons/beep.ogg"));
+        const beep = new Audio(chrome.runtime.getURL("icons/beep.oga"));
         beep.volume = getVideo().volume * 0.1;
         const oldMetadata = navigator.mediaSession.metadata
         beep.play();

src/js-components/previewBar.ts

@@ -647,8 +647,21 @@ class PreviewBar {
                         if (changedData.scale !== null) {
                             const transformScale = (changedData.scale) / progressBar.clientWidth;
 
+                            const scale = Math.max(0, Math.min(1 - calculatedLeft, (transformScale - cursor) / fullSectionWidth - calculatedLeft));
                             customChangedElement.style.transform =
-                                `scaleX(${Math.max(0, Math.min(1 - calculatedLeft, (transformScale - cursor) / fullSectionWidth - calculatedLeft))}`;
+                                `scaleX(${scale})`;
+                            if (customChangedElement.style.backgroundSize) {
+                                const backgroundSize = Math.max(changedData.scale / scale, fullSectionWidth * progressBar.clientWidth);
+                                customChangedElement.style.backgroundSize = `${backgroundSize}px`;
+
+                                if (changedData.scale < (cursor + fullSectionWidth) * progressBar.clientWidth) {
+                                    customChangedElement.style.backgroundPosition = `-${backgroundSize - fullSectionWidth * progressBar.clientWidth}px`;
+                                } else {
+                                    // Passed this section
+                                    customChangedElement.style.backgroundPosition = `-${cursor * progressBar.clientWidth}px`;
+                                }
+                            }
+
                             if (firstUpdate) {
                                 customChangedElement.style.transition = "none";
                                 setTimeout(() => customChangedElement.style.removeProperty("transition"), 50);

src/utils/thumbnails.ts

@@ -64,8 +64,18 @@ function thumbnailHoverListener(e: MouseEvent) {
     }
 }
 
+function getLink(thumbnail: HTMLImageElement): HTMLAnchorElement | null {
+    if (isOnInvidious()) {
+        return thumbnail.parentElement as HTMLAnchorElement | null;
+    } else if (thumbnail.nodeName.toLowerCase() === "yt-thumbnail-view-model") {
+        return thumbnail.closest("yt-lockup-view-model")?.querySelector("a.yt-lockup-metadata-view-model-wiz__title");
+    } else {
+        return thumbnail.querySelector("#thumbnail");
+    }
+}
+
 function extractVideoID(thumbnail: HTMLImageElement): VideoID | null {
-    const link = (isOnInvidious() ? thumbnail.parentElement : thumbnail.querySelector("#thumbnail")) as HTMLAnchorElement
+    const link = getLink(thumbnail);
     if (!link || link.nodeName !== "A" || !link.href) return null; // no link found
 
     return parseYouTubeVideoIDFromURL(link.href)?.videoID;