Merge branch 'main' into fix-like-dislike-bar-offset

9 files changed, 324 insertions, 24 deletions

diff --git a/Extensions/UserScript/Return Youtube Dislike.user.js b/Extensions/UserScript/Return Youtube Dislike.user.js
index 4dd048c..f3062fa 100644
--- a/Extensions/UserScript/Return Youtube Dislike.user.js
+++ b/Extensions/UserScript/Return Youtube Dislike.user.js
@@ -100,7 +100,8 @@ function getLikeButton() {
 function getLikeTextContainer() {
   return (
     getLikeButton().querySelector("#text") ??
-    getLikeButton().getElementsByTagName("yt-formatted-string")[0]
+    getLikeButton().getElementsByTagName("yt-formatted-string")[0] ??
+    getLikeButton().querySelector("span[role='text']")
   );
 }
 
@@ -227,16 +228,24 @@ function setDislikes(dislikesCount) {
 }
 
 function getLikeCountFromButton() {
-  if (isShorts()) {
-    //Youtube Shorts don't work with this query. It's not nessecary; we can skip it and still see the results.
-    //It should be possible to fix this function, but it's not critical to showing the dislike count.
+  try {
+    if (isShorts()) {
+      //Youtube Shorts don't work with this query. It's not necessary; we can skip it and still see the results.
+      //It should be possible to fix this function, but it's not critical to showing the dislike count.
+      return false;
+    }
+    let likeButton = getLikeButton()
+    .querySelector("yt-formatted-string#text") ??
+    getLikeButton().querySelector("button");
+
+    let likesStr = likeButton.getAttribute("aria-label")
+    .replace(/\D/g, "");
+    return likesStr.length > 0 ? parseInt(likesStr) : false;
+  }
+  catch {
     return false;
   }
-  let likesStr = getLikeButton()
-    .querySelector("yt-formatted-string#text")
-    .getAttribute("aria-label")
-    .replace(/\D/g, "");
-  return likesStr.length > 0 ? parseInt(likesStr) : false;
+
 }
 
 (typeof GM_addStyle != "undefined"
diff --git a/Extensions/combined/_locales/sv_SE/messages.json b/Extensions/combined/_locales/sv_SE/messages.json
new file mode 100644
index 0000000..7ed2ce8
--- /dev/null
+++ b/Extensions/combined/_locales/sv_SE/messages.json
@@ -0,0 +1,134 @@
+{
+  "extensionName": {
+    "message": "Return YouTube Dislike"
+  },
+  "extensionNameBeta": {
+    "message": "Return YouTube Dislike Beta"
+  },
+  "extensionDesc": {
+    "message": "Återställer förmågan att se ogilla"
+  },
+  "textDeveloper": {
+    "message": "av Dmitry Selivanov & Community"
+  },
+  "linkWebsite": {
+    "message": "Hemsida"
+  },
+  "linkFAQ": {
+    "message": "FAQ"
+  },
+  "linkDonate": {
+    "message": "Donera"
+  },
+  "linkHelp": {
+    "message": "Hjälp"
+  },
+  "linkChangelog": {
+    "message": "Ändringslogg"
+  },
+  "legendSettings": {
+    "message": "Inställningar"
+  },
+  "textSettings": {
+    "message": "Inaktivera gilla-/ogilla-inskickningar"
+  },
+  "textLikesDisabled": {
+    "message": "Inaktiverad av ägaren"
+  },
+  "textSettingsHover": {
+    "message": "Slutar räkna dina gilla och ogilla."
+  },
+  "textRoundingNumbers": {
+    "message": "Avrunda statistiken neråt för gilla/ogilla (standard YouTube-beteende)"
+  },
+  "textRoundingNumbersHover": {
+    "message": "Visa avrundad statistik."
+  },
+  "textConsistentFormat": {
+    "message": "Gör formatet på gilla och ogilla konsekvent"
+  },
+  "textConsistentFormatHover": {
+    "message": "Omformatera som siffror."
+  },
+  "textNumberFormat": {
+    "message": "Sifforformat:"
+  },
+  "textColorizeRatioBar": {
+    "message": "Färgsätt förhållandefältet"
+  },
+  "textColorizeRatioBarHover": {
+    "message": "Använd anpassade färger för förhållandefältet."
+  },
+  "textColorizeThumbs": {
+    "message": "Färglägg tummarna"
+  },
+  "textColorizeThumbsHover": {
+    "message": "Använd anpassade färger för tumikoner."
+  },
+  "textColorTheme": {
+    "message": "Färgtema:"
+  },
+  "textColorTheme1": {
+    "message": "Klassisk"
+  },
+  "textColorTheme2": {
+    "message": "Tillgänglig"
+  },
+  "textColorTheme3": {
+    "message": "Neon"
+  },
+  "textTempUnavailable": {
+    "message": "Tillfälligt otillgänglig"
+  },
+  "textUpdate": {
+    "message": "Uppdatera till"
+  },
+  "version30installed": {
+    "message": "Version 3.0.0.1 installerad"
+  },
+  "whatsnew": {
+    "message": "Vad är nytt"
+  },
+  "shortsSupport": {
+    "message": "YouTube Shorts Support"
+  },
+  "customColors": {
+    "message": "Anpassade färger för knappar och fältet ogilla"
+  },
+  "customNumberFormats": {
+    "message": "Anpassade sifforformat"
+  },
+  "considerDonating": {
+    "message": "Det enda som håller tillägget i gång är dina donationer, överväg att stöda projektet."
+  },
+  "roundNumbers": {
+    "message": "Visa avrundade siffror"
+  },
+  "roundNumbersHover": {
+    "message": "Avrunda siffrorna neråt (standard YouTube-beteende)."
+  },
+  "reformatLikes": {
+    "message": "Omformatera som siffror"
+  },
+  "reformatLikesHover": {
+    "message": "Gör formatet på gilla och ogilla konsekvent."
+  },
+  "numberFormat": {
+    "message": "Sifforformat:"
+  },
+  "colorizeRatio": {
+    "message": "Färgsätt förhållandefältet"
+  },
+  "colorizeRatioHover": {
+    "message": "Använd anpassade färger för förhållandefältet."
+  },
+  "colorizeThumbs": {
+    "message": "Färglägg tummarna"
+  },
+  "colorizeThumbsHover": {
+    "message": "Använd anpassade färger för tumikoner."
+  },
+  "colorTheme": {
+    "message": "Färgtema:"
+  }
+}
diff --git a/Extensions/combined/_locales/uk/messages.json b/Extensions/combined/_locales/uk/messages.json
new file mode 100644
index 0000000..4919c6e
--- /dev/null
+++ b/Extensions/combined/_locales/uk/messages.json
@@ -0,0 +1,134 @@
+{
+  "extensionName": {
+    "message": "Return YouTube Dislike"
+  },
+  "extensionNameBeta": {
+    "message": "Return YouTube Dislike Beta"
+  },
+  "extensionDesc": {
+    "message": "Повертає здатність бачити відмітки «Не подобається»"
+  },
+  "textDeveloper": {
+    "message": "від Дмитра Селіванова та спільноти"
+  },
+  "linkWebsite": {
+    "message": "Вебсайт"
+  },
+  "linkFAQ": {
+    "message": "ЧаПи"
+  },
+  "linkDonate": {
+    "message": "Підтримати"
+  },
+  "linkHelp": {
+    "message": "Допомога"
+  },
+  "linkChangelog": {
+    "message": "Журнал змін"
+  },
+  "legendSettings": {
+    "message": "Налаштування"
+  },
+  "textSettings": {
+    "message": "Вимкнути надсилання відміток"
+  },
+  "textLikesDisabled": {
+    "message": "Вимкнуто власником"
+  },
+  "textSettingsHover": {
+    "message": "Вимикає надсилання відміток «Подобається»/«Не подобається»."
+  },
+  "textRoundingNumbers": {
+    "message": "Округлює значення відміток (стандартний параметр YouTube)"
+  },
+  "textRoundingNumbersHover": {
+    "message": "Показувати заокруглені значення."
+  },
+  "textConsistentFormat": {
+    "message": "Зробить формат «Подобається» та «Не подобається» однаковим"
+  },
+  "textConsistentFormatHover": {
+    "message": "Форматувати як числа."
+  },
+  "textNumberFormat": {
+    "message": "Формат значень:"
+  },
+  "textColorizeRatioBar": {
+    "message": "Обрати кольори стрічки співвідношення"
+  },
+  "textColorizeRatioBarHover": {
+    "message": "Змінює кольори стрічки співвідношення на обрані вами."
+  },
+  "textColorizeThumbs": {
+    "message": "Обрати кольори відміток"
+  },
+  "textColorizeThumbsHover": {
+    "message": "Змінює кольори піктограм відміток на обрані вами."
+  },
+  "textColorTheme": {
+    "message": "Кольорова схема:"
+  },
+  "textColorTheme1": {
+    "message": "Класика"
+  },
+  "textColorTheme2": {
+    "message": "Доступність"
+  },
+  "textColorTheme3": {
+    "message": "Неон"
+  },
+  "textTempUnavailable": {
+    "message": "Тимчасово недоступно"
+  },
+  "textUpdate": {
+    "message": "Оновлення до"
+  },
+  "version30installed": {
+    "message": "Версію 3.0.0.1 встановлено"
+  },
+  "whatsnew": {
+    "message": "Що нового"
+  },
+  "shortsSupport": {
+    "message": "Підтримка YouTube Shorts"
+  },
+  "customColors": {
+    "message": "Користувальницькі кольори стрічки співвідношення та кнопок"
+  },
+  "customNumberFormats": {
+    "message": "Користувацькі формати значень"
+  },
+  "considerDonating": {
+    "message": "Розширення досі існує лише за допомогою ваших пожертв, будь ласка, підтримайте проєкт."
+  },
+  "roundNumbers": {
+    "message": "Показувати заокруглені значення"
+  },
+  "roundNumbersHover": {
+    "message": "Округлює значення відміток (стандартний параметр YouTube)"
+  },
+  "reformatLikes": {
+    "message": "Форматувати як числа"
+  },
+  "reformatLikesHover": {
+    "message": "Зробить формат «Подобається» та «Не подобається» однаковим"
+  },
+  "numberFormat": {
+    "message": "Формат значень:"
+  },
+  "colorizeRatio": {
+    "message": "Обрати кольори стрічки співвідношення"
+  },
+  "colorizeRatioHover": {
+    "message": "Змінює кольори стрічки співвідношення на обрані вами.."
+  },
+  "colorizeThumbs": {
+    "message": "Обрати кольори відміток"
+  },
+  "colorizeThumbsHover": {
+    "message": "Змінює кольори піктограм відміток на обрані вами."
+  },
+  "colorTheme": {
+    "message": "Кольорова схема:"
+  }
+}
diff --git a/Extensions/combined/content-style.css b/Extensions/combined/content-style.css
index d8da7db..4e53f87 100644
--- a/Extensions/combined/content-style.css
+++ b/Extensions/combined/content-style.css
@@ -30,12 +30,21 @@
 }
 
 .ryd-tooltip {
-  position: relative;
   display: block;
   height: 2px;
+}
+
+.ryd-tooltip-old-design {
+  position: relative;
   top: 9px;
 }
 
+.ryd-tooltip-new-design {
+  position: absolute;
+  bottom: -10px;
+  left: -4px;
+}
+
 .ryd-tooltip-bar-container {
   width: 100%;
   height: 2px;
@@ -44,3 +53,12 @@
   padding-bottom: 12px;
   top: -6px;
 }
+
+/* required to make the ratio bar visible in the new design */
+ytd-menu-renderer.ytd-watch-metadata {
+  overflow-y: visible !important;
+}
+
+#top-level-buttons-computed {
+  position: relative !important;
+}
diff --git a/Extensions/combined/manifest-chrome.json b/Extensions/combined/manifest-chrome.json
index 3e396a0..dddd2f6 100644
--- a/Extensions/combined/manifest-chrome.json
+++ b/Extensions/combined/manifest-chrome.json
@@ -2,7 +2,7 @@
   "name": "__MSG_extensionName__",
   "description": "__MSG_extensionDesc__",
   "default_locale": "en",
-  "version": "3.0.0.5",
+  "version": "3.0.0.6",
   "manifest_version": 3,
   "background": {
     "service_worker": "ryd.background.js"
diff --git a/Extensions/combined/manifest-firefox.json b/Extensions/combined/manifest-firefox.json
index 07be68e..3ce248f 100644
--- a/Extensions/combined/manifest-firefox.json
+++ b/Extensions/combined/manifest-firefox.json
@@ -2,7 +2,7 @@
   "name": "__MSG_extensionName__",
   "description": "__MSG_extensionDesc__",
   "default_locale": "en",
-  "version": "3.0.0.6",
+  "version": "3.0.0.7",
   "manifest_version": 2,
   "background": {
     "scripts": ["ryd.background.js"]
diff --git a/Extensions/combined/src/bar.js b/Extensions/combined/src/bar.js
index a3a5e53..fea42a9 100644
--- a/Extensions/combined/src/bar.js
+++ b/Extensions/combined/src/bar.js
@@ -58,14 +58,12 @@ function createRateBar(likes, dislikes) {
 
         (
           document.getElementById(
-            isNewDesign() ? "actions-inner" : "menu-container"
+            isNewDesign() ? "top-level-buttons-computed" : "menu-container"
           ) || document.querySelector("ytm-slim-video-action-bar-renderer")
         ).insertAdjacentHTML(
           "beforeend",
           `
-              <div class="ryd-tooltip" style="width: ${widthPx}px${
-            isNewDesign() ? "; margin-bottom: -2px" : ""
-          }">
+              <div class="ryd-tooltip ryd-tooltip-${isNewDesign() ? "new" : "old"}-design" style="width: ${widthPx}px">
               <div class="ryd-tooltip-bar-container">
                 <div
                     id="ryd-bar-container"
diff --git a/Extensions/combined/src/buttons.js b/Extensions/combined/src/buttons.js
index ab413a6..b78670c 100644
--- a/Extensions/combined/src/buttons.js
+++ b/Extensions/combined/src/buttons.js
@@ -24,7 +24,7 @@ function getButtons() {
   //---   If Menu Element Is Displayed:   ---//
   if (document.getElementById("menu-container")?.offsetParent === null) {
     return document.querySelector("ytd-menu-renderer.ytd-watch-metadata > div");
-    //---   If Menu Element Isnt Displayed:   ---//
+    //---   If Menu Element Isn't Displayed:   ---//
   } else {
     return document
       .getElementById("menu-container")
@@ -42,7 +42,8 @@ function getLikeButton() {
 function getLikeTextContainer() {
   return (
     getLikeButton().querySelector("#text") ??
-    getLikeButton().getElementsByTagName("yt-formatted-string")[0]
+    getLikeButton().getElementsByTagName("yt-formatted-string")[0] ??
+    getLikeButton().querySelector("span[role='text']")
   );
 }
 
diff --git a/Extensions/combined/src/state.js b/Extensions/combined/src/state.js
index 42dde2b..58c3e29 100644
--- a/Extensions/combined/src/state.js
+++ b/Extensions/combined/src/state.js
@@ -135,11 +135,14 @@ function getState(storedData) {
 
 //---   Sets The Likes And Dislikes Values   ---//
 function setLikes(likesCount) {
+  cLog(`SET likes ${likesCount}`)
   getLikeTextContainer().innerText = likesCount;
 }
 
 function setDislikes(dislikesCount) {
+  cLog(`SET dislikes ${dislikesCount}`)
   getDislikeTextContainer()?.removeAttribute("is-empty");
+  getDislikeTextContainer()?.removeAttribute('is-empty');
   if (!isLikesDisabled()) {
     if (isMobile()) {
       getButtons().children[1].querySelector(
@@ -163,14 +166,17 @@ function setDislikes(dislikesCount) {
 function getLikeCountFromButton() {
   try {
     if (isShorts()) {
-      //Youtube Shorts don't work with this query. It's not nessecary; we can skip it and still see the results.
+      //Youtube Shorts don't work with this query. It's not necessary; we can skip it and still see the results.
       //It should be possible to fix this function, but it's not critical to showing the dislike count.
       return false;
     }
-    let likesStr = getLikeButton()
-      .querySelector("yt-formatted-string#text")
-      .getAttribute("aria-label")
-      .replace(/\D/g, "");
+
+    let likeButton = getLikeButton()
+    .querySelector("yt-formatted-string#text") ??
+    getLikeButton().querySelector("button");
+
+    let likesStr = likeButton.getAttribute("aria-label")
+    .replace(/\D/g, "");
     return likesStr.length > 0 ? parseInt(likesStr) : false;
   } catch {
     return false;
@@ -191,7 +197,7 @@ function processResponse(response, storedData) {
   createRateBar(storedData.likes, storedData.dislikes);
   if (extConfig.coloredThumbs === true) {
     if (isShorts()) {
-      // for shorts, leave deactived buttons in default color
+      // for shorts, leave deactivated buttons in default color
       let shortLikeButton = getLikeButton().querySelector(
         "tp-yt-paper-button#button"
       );