☰

YouTube Uploads Sorter Button

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

当前为 2023-05-16 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube Uploads Sorter Button
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.14.7
  5. // @description  Adds a button to a YouTube channel's videos page which sorts recent uploads by views
  6. // @author       Lex
  7. // @match        *://*.youtube.com/@*
  8. // @match        *://*.youtube.com/*/featured
  9. // @match        *://*.youtube.com/*/videos
  10. // @exclude-match *://*.youtube.com/watch
  11. // @require      https://code.jquery.com/jquery-3.2.1.min.js
  12. // @grant        none
  13. // ==/UserScript==
  14.  
  15. (function($) {
  16.     'use strict';
  17.  
  18.     function addButton() {
  19.         if ($("#sortViewButton").length == 0) {
  20.             const chip = $("<yt-chip-cloud-chip-renderer>").attr("chip-style", "STYLE_DEFAULT").attr("id", "sortViewButton").click(sortByViews);
  21.             const container = $("#chips-wrapper iron-selector");
  22.             chip.appendTo(container);
  23.             setTimeout(() => {
  24.               chip[0].innerText = "Sort by Views";
  25.             }, 0)
  26.         }
  27.     }
  28.  
  29.     function parseViewNumber(str) {
  30.       /* Parses 405K, 1.5M etc */
  31.       let multiplier = 1;
  32.       if (str.endsWith("K")) {
  33.         multiplier = 1000;
  34.       } else if (str.endsWith("M")) {
  35.         multiplier = 1000000;
  36.       }
  37.       return parseFloat(str) * multiplier;
  38.     }
  39.  
  40.     function getViewsShort(e) {
  41.       // viewsText = "405K views"
  42.       const viewsText = $(e).find(".inline-metadata-item")[0].textContent;
  43.       const viewsStr = viewsText.split(" ")[0];
  44.       return parseViewNumber(viewsStr);
  45.     }
  46.  
  47.     function getViewsVideo(e) {
  48.       const viewsTitle = $(e).find('a#video-title-link')[0].getAttribute("aria-label");
  49.       //console.log(`Found title: ${viewsTitle}`);
  50.       if (viewsTitle.search(/No views$/) > -1) // video has no views yet
  51.           return 0;
  52.       else {
  53.           const views = parseInt(/([\d,]+) views( - play Short)?$/.exec(viewsTitle)[1].replace(/,/g, ""));
  54.           return views;
  55.       }
  56.     }
  57.  
  58.     function getViews(e) {
  59.         // Try to get the views of a regular video, and if that fails try to get views as a Short
  60.         try {
  61.           return getViewsVideo(e);
  62.         } catch(err) {
  63.           try {
  64.             return getViewsShort(e);
  65.           } catch(err) {
  66.             return 0;
  67.           }
  68.         }
  69.     }
  70.  
  71.     function sortByViews() {
  72.         console.log("Sorting...");
  73.         const items = $("ytd-rich-item-renderer");
  74.         console.log(`Found ${items.length} videos on the page.`);
  75.         //console.log(items);
  76.         //console.log(getViews(items[0]));
  77.  
  78.         // Array of each parent for a given index.
  79.         // e.g. if there are 4 videos in the first row container, the first 4 indexes are that first row
  80.         const parents = [...items].map(e => e.parentNode);
  81.         //console.log(parents);
  82.         const sorted = items.toArray().sort(function(a, b) {
  83.             return getViews(b) - getViews(a);
  84.         });
  85.         for (let item of sorted) {
  86.           // Remove item from its parent and append it to the ordered parent
  87.           const parent = parents.shift();
  88.           //console.log("Parent: ", parent);
  89.           //console.log("Removing", item, "from its parent");
  90.           item.parentNode.removeChild(item);
  91.           parent.append(item);
  92.         }
  93.     }
  94.  
  95.     function waitForLoad(query, callback) {
  96.         if (document.querySelector(query)) {
  97.             callback();
  98.         } else {
  99.             setTimeout(waitForLoad.bind(null, query, callback), 100);
  100.         }
  101.     }
  102.  
  103.     waitForLoad("#chips-wrapper", addButton);
  104. })(window.jQuery);