☰

YouTube Uploads Sorter Button

Adds a button to a YouTube channel's videos page which sorts recent uploads by views

当前为 2025-02-23 提交的版本，查看 最新版本。

// ==UserScript==
// @name         YouTube Uploads Sorter Button
// @namespace    http://tampermonkey.net/
// @version      0.15.0
// @description  Adds a button to a YouTube channel's videos page which sorts recent uploads by views
// @author       Lex
// @match        *://*.youtube.com/@*
// @match        *://*.youtube.com/*/featured
// @match        *://*.youtube.com/*/videos
// @exclude-match *://*.youtube.com/watch
// @require      https://code.jquery.com/jquery-3.2.1.min.js
// @grant        none
// ==/UserScript==

(function($) {
    'use strict';

    function addButton() {
        if ($("#sortViewButton").length == 0) {
            const chip = $("<button>").attr("id", "sortViewButton").click(sortByViews);
            chip.css({"border": "none", "border-radius": "8px", "padding": "8px 15px", "margin-left": "1em", "cursor": "pointer"})
            const container = $("#chips-wrapper iron-selector");
            chip.appendTo(container);
            setTimeout(() => {
              chip[0].innerText = "Sort by Views";
            }, 0)
        }
    }

    function parseViewNumber(str) {
      /* Parses 405K, 1.5M etc */
      let multiplier = 1;
      if (str.endsWith("K")) {
        multiplier = 1000;
      } else if (str.endsWith("M")) {
        multiplier = 1000000;
      }
      return parseFloat(str) * multiplier;
    }

    function getViewsShort(e) {
      // viewsText = "405K views"
      const viewsText = $(e).find(".inline-metadata-item")[0].textContent;
      const viewsStr = viewsText.split(" ")[0];
      return parseViewNumber(viewsStr);
    }

    function getViewsVideo(e) {
      const viewsTitle = $(e).find('a#video-title-link')[0].getAttribute("aria-label");
      //console.log(`Found title: ${viewsTitle}`);
      if (viewsTitle.search(/No views$/) > -1) // video has no views yet
          return 0;
      else {
          const views = parseInt(/([\d,]+) views( - play Short)?$/.exec(viewsTitle)[1].replace(/,/g, ""));
          return views;
      }
    }

    function getViews(e) {
        // Try to get the views of a regular video, and if that fails try to get views as a Short
        try {
          return getViewsVideo(e);
        } catch(err) {
          try {
            return getViewsShort(e);
          } catch(err) {
            return 0;
          }
        }
    }

    function sortByViews() {
        console.log("Sorting...");
        const items = $("ytd-rich-item-renderer");
        console.log(`Found ${items.length} videos on the page.`);
        //console.log(items);
        //console.log(getViews(items[0]));

        // Array of each parent for a given index.
        // e.g. if there are 4 videos in the first row container, the first 4 indexes are that first row
        const parents = [...items].map(e => e.parentNode);
        //console.log(parents);
        const sorted = items.toArray().sort(function(a, b) {
            return getViews(b) - getViews(a);
        });
        const infiniteScrollItem = document.getElementsByTagName("ytd-continuation-item-renderer")[0]
        console.log(infiniteScrollItem)
        infiniteScrollItem.parentNode.removeChild(infiniteScrollItem)
        for (let item of sorted) {
          // Remove item from its parent and append it to the ordered parent
          const parent = parents.shift();
          //console.log("Parent: ", parent);
          //console.log("Removing", item, "from its parent");
          item.parentNode.removeChild(item);
          parent.append(item);
        }
        sorted.slice(-1)[0].parentNode.append(infiniteScrollItem)
    }

    function waitForLoad(query, callback) {
        if (document.querySelector(query)) {
            callback();
        } else {
            setTimeout(waitForLoad.bind(null, query, callback), 100);
        }
    }

    waitForLoad("#chips-wrapper", addButton);
})(window.jQuery);