buttons.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. import { isMobile, isShorts } from "./state";
  2. import { isInViewport } from "./utils";
  3. function getButtons() {
  4. //--- If Watching Youtube Shorts: ---//
  5. if (isShorts()) {
  6. let elements = document.querySelectorAll(
  7. isMobile()
  8. ? "ytm-like-button-renderer"
  9. : "#like-button > ytd-like-button-renderer"
  10. );
  11. for (let element of elements) {
  12. //Youtube Shorts can have multiple like/dislike buttons when scrolling through videos
  13. //However, only one of them should be visible (no matter how you zoom)
  14. if (isInViewport(element)) {
  15. return element;
  16. }
  17. }
  18. }
  19. //--- If Watching On Mobile: ---//
  20. if (isMobile()) {
  21. return document.querySelector(".slim-video-action-bar-actions");
  22. }
  23. //--- If Menu Element Is Displayed: ---//
  24. if (document.getElementById("menu-container")?.offsetParent === null) {
  25. return document.querySelector("ytd-menu-renderer.ytd-watch-metadata > div");
  26. //--- If Menu Element Isnt Displayed: ---//
  27. } else {
  28. return document
  29. .getElementById("menu-container")
  30. ?.querySelector("#top-level-buttons-computed");
  31. }
  32. }
  33. function getLikeButton() {
  34. return getButtons().children[0].tagName ===
  35. "YTD-SEGMENTED-LIKE-DISLIKE-BUTTON-RENDERER"
  36. ? getButtons().children[0].children[0]
  37. : getButtons().children[0];
  38. }
  39. function getLikeTextContainer() {
  40. return (
  41. getLikeButton().querySelector("#text") ??
  42. getLikeButton().getElementsByTagName("yt-formatted-string")[0]
  43. );
  44. }
  45. function getDislikeButton() {
  46. return getButtons().children[0].tagName ===
  47. "YTD-SEGMENTED-LIKE-DISLIKE-BUTTON-RENDERER"
  48. ? getButtons().children[0].children[1]
  49. : getButtons().children[1];
  50. }
  51. function getDislikeTextContainer() {
  52. let result =
  53. getDislikeButton().querySelector("#text") ??
  54. getDislikeButton().getElementsByTagName("yt-formatted-string")[0] ??
  55. getDislikeButton().querySelector("span[role='text']");
  56. if (result == null) {
  57. let textSpan = document.createElement("span");
  58. textSpan.id = "text";
  59. getDislikeButton().querySelector("button").appendChild(textSpan);
  60. getDislikeButton().querySelector("button").style.width = "auto";
  61. result = getDislikeButton().querySelector("#text");
  62. }
  63. return result;
  64. }
  65. function checkForSignInButton() {
  66. if (
  67. document.querySelector(
  68. "a[href^='https://accounts.google.com/ServiceLogin']"
  69. )
  70. ) {
  71. return true;
  72. } else {
  73. return false;
  74. }
  75. }
  76. export {
  77. getButtons,
  78. getLikeButton,
  79. getDislikeButton,
  80. getLikeTextContainer,
  81. getDislikeTextContainer,
  82. checkForSignInButton,
  83. };