☰

Twitter Click'n'Save

Add buttons to download images and videos in Twitter, also does some other enhancements.

当前为 2022-10-14 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Twitter Click'n'Save
  3. // @version     0.13.4-2022.10.14
  4. // @namespace   gh.alttiri
  5. // @description Add buttons to download images and videos in Twitter, also does some other enhancements.
  6. // @match       https://twitter.com/*
  7. // @homepageURL https://github.com/AlttiRi/twitter-click-and-save
  8. // @supportURL  https://github.com/AlttiRi/twitter-click-and-save/issues
  9. // @license     GPL-3.0
  10. // @grant       GM_registerMenuCommand
  11. // ==/UserScript==
  12. // ---------------------------------------------------------------------------------------------------------------------
  13. // ---------------------------------------------------------------------------------------------------------------------
  14.  
  15. if (globalThis.GM_registerMenuCommand /* undefined in Firefox with VM */ || typeof GM_registerMenuCommand === "function") {
  16.     GM_registerMenuCommand("Show settings", showSettings);
  17. }
  18.  
  19. // --- For debug --- //
  20. const verbose = false;
  21.  
  22. const isFirefox = navigator.userAgent.toLowerCase().indexOf("firefox") !== -1;
  23. const settings = loadSettings();
  24.  
  25. function loadSettings() {
  26.     const defaultSettings = {
  27.         hideTrends: true,
  28.         hideSignUpSection: true,
  29.         hideTopicsToFollow: false,
  30.         hideTopicsToFollowInstantly: false,
  31.         hideSignUpBottomBarAndMessages: true,
  32.         doNotPlayVideosAutomatically: false,
  33.         goFromMobileToMainSite: false,
  34.  
  35.         highlightVisitedLinks: true,
  36.         highlightOnlySpecialVisitedLinks: true,
  37.         expandSpoilers: true,
  38.  
  39.         directLinks: true,
  40.         handleTitle: true,
  41.  
  42.         imagesHandler: true,
  43.         videoHandler: true,
  44.         addRequiredCSS: true,
  45.         preventBlinking: false,
  46.  
  47.         hideLoginPopup: false,
  48.         addBorder: false,
  49.  
  50.         downloadProgress: true,
  51.         strictTrackingProtectionFix: false,
  52.     };
  53.  
  54.     let savedSettings;
  55.     try {
  56.         savedSettings = JSON.parse(localStorage.getItem("ujs-click-n-save-settings")) || {};
  57.     } catch (e) {
  58.         console.error("[ujs]", e);
  59.         localStorage.removeItem("ujs-click-n-save-settings");
  60.         savedSettings = {};
  61.     }
  62.     savedSettings = Object.assign(defaultSettings, savedSettings);
  63.     return savedSettings;
  64. }
  65. function showSettings() {
  66.     closeSetting();
  67.     if (window.scrollY > 0) {
  68.         document.querySelector("html").classList.add("ujs-scroll-initial");
  69.         document.body.classList.add("ujs-scrollbar-width-margin-right");
  70.     }
  71.     document.body.classList.add("ujs-no-scroll");
  72.  
  73.     const modalWrapperStyle = `
  74.     width: 100%;
  75.     height: 100%;
  76.     position: fixed;
  77.     display: flex;
  78.     justify-content: center;
  79.     align-items: center;
  80.     z-index: 99999;
  81.     backdrop-filter: blur(4px);
  82.     background-color: rgba(255, 255, 255, 0.5);
  83.   `;
  84.     const modalSettingsStyle = `
  85.     background-color: white;
  86.     min-width: 320px;
  87.     min-height: 320px;
  88.     border: 1px solid darkgray;
  89.     padding: 8px;
  90.     box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  91.   `;
  92.     const s = settings;
  93.     const downloadProgressFFTitle = `Disable the download progress if you use Firefox with "Enhanced Tracking Protection" set to "Strict" and ViolentMonkey, or GreaseMonkey extension`;
  94.     const strictTrackingProtectionFixFFTitle = `Choose this if you use ViolentMonkey, or GreaseMonkey in Firefox with "Enhanced Tracking Protection" set to "Strict". It is not required in case you use TamperMonkey.`;
  95.     document.body.insertAdjacentHTML("afterbegin", `
  96.   <div class="ujs-modal-wrapper" style="${modalWrapperStyle}">
  97.       <div class="ujs-modal-settings" style="${modalSettingsStyle}">
  98.           <fieldset>
  99.               <legend>Optional</legend>
  100.               <label><input type="checkbox" ${s.hideTrends ? "checked" : ""} name="hideTrends">Hide <b>Trends</b> (in the right column)*<br/></label>
  101.               <label><input type="checkbox" ${s.hideSignUpSection ? "checked" : ""} name="hideSignUpSection">Hide <b title='"New to Twitter?" (If yoy are not logged in)'>Sign Up</b> section (in the right column)*<br/></label>
  102.               <label><input type="checkbox" ${s.hideSignUpBottomBarAndMessages ? "checked" : ""} name="hideSignUpBottomBarAndMessages">Hide <b>Sign Up Bar</b> and <b>Messages</b> (in the bottom)<br/></label>
  103.               <label hidden><input type="checkbox" ${s.doNotPlayVideosAutomatically ? "checked" : ""} name="doNotPlayVideosAutomatically">Do <i>Not</i> Play Videos Automatically</b><br/></label>
  104.               <label hidden><input type="checkbox" ${s.goFromMobileToMainSite ? "checked" : ""} name="goFromMobileToMainSite">Redirect from Mobile version (beta)<br/></label>
  105.               <label title="Makes the button more visible"><input type="checkbox" ${s.addBorder ? "checked" : ""} name="addBorder">Add a white border to the download button<br/></label>
  106.               <label title="Hides the modal login pop up. Useful if you have no account. \nWARNING: Currently it will close any popup, not only the login one.\nIt's reccommended to use only if you do not have an account to hide the annoiyng login popup."><input type="checkbox" ${s.hideLoginPopup ? "checked" : ""} name="hideLoginPopup">Hide <strike>Login</strike> Popups (beta)<br/></label>
  107.           </fieldset>
  108.           <fieldset>
  109.               <legend>Recommended</legend>
  110.               <label><input type="checkbox" ${s.highlightVisitedLinks ? "checked" : ""} name="highlightVisitedLinks">Highlight Visited Links<br/></label>
  111.               <label title="In most cases absolute links are 3rd-party links"><input type="checkbox" ${s.highlightOnlySpecialVisitedLinks ? "checked" : ""} name="highlightOnlySpecialVisitedLinks">Highlight Only Absolute Visited Links<br/></label>
  112.   
  113.               <label title="Note: since the recent update the most NSFW spoilers are impossible to expand without an account"><input type="checkbox" ${s.expandSpoilers ? "checked" : ""} name="expandSpoilers">Expand Spoilers (if possible)*<br/></label>
  114.           </fieldset>
  115.           <fieldset>
  116.               <legend>Highly Recommended</legend>
  117.               <label><input type="checkbox" ${s.directLinks ? "checked" : ""} name="directLinks">Direct Links</label><br/>
  118.               <label><input type="checkbox" ${s.handleTitle ? "checked" : ""} name="handleTitle">Enchance Title*<br/></label>
  119.           </fieldset>
  120.           <fieldset ${isFirefox ? '': 'style="display: none"'}>
  121.               <legend>Firefox only</legend>
  122.               <label title='${downloadProgressFFTitle}'><input type="radio" ${s.downloadProgress ? "checked" : ""} name="firefoxDownloadProgress" value="downloadProgress">Download Progress<br/></label>
  123.               <label title='${strictTrackingProtectionFixFFTitle}'><input type="radio" ${s.strictTrackingProtectionFix ? "checked" : ""} name="firefoxDownloadProgress" value="strictTrackingProtectionFix">Strict Tracking Protection Fix<br/></label>
  124.           </fieldset>
  125.           <fieldset>
  126.               <legend>Main</legend>
  127.               <label><input type="checkbox" ${s.imagesHandler ? "checked" : ""} name="imagesHandler">Image Download Button<br/></label>
  128.               <label><input type="checkbox" ${s.videoHandler ? "checked" : ""} name="videoHandler">Video Download Button<br/></label>
  129.               <label hidden><input type="checkbox" ${s.addRequiredCSS ? "checked" : ""} name="addRequiredCSS">Add Required CSS*<br/></label><!-- * Only for the image download button in /photo/1 mode -->
  130.           </fieldset>
  131.           <fieldset>
  132.               <legend title="Outdated due to Twitter's updates, or impossible to reimplement">Outdated</legend>
  133.               <strike>
  134.  
  135.               <label title="It seems Twitter no more shows this section."><input type="checkbox" ${s.hideTopicsToFollow ? "checked" : ""} name="hideTopicsToFollow">Hide <b>Topics To Follow</b> (in the right column)*<br/></label>
  136.               <label title="Prevent the tweet backgroubd blinking on the button/image click. \nOutdated. \nTwitter have removed this disgusting behavior. This option is more no need."><input type="checkbox" ${s.preventBlinking ? "checked" : ""} name="preventBlinking">Prevent blinking on click (outdated)<br/></label>
  137.  
  138.               <label hidden><input type="checkbox" ${s.hideTopicsToFollowInstantly ? "checked" : ""} name="hideTopicsToFollowInstantly">Hide <b>Topics To Follow</b> Instantly*<br/></label>
  139.               </strike>
  140.           </fieldset>
  141.           <hr>
  142.           <div style="display: flex; justify-content: space-around;">
  143.               <button class="ujs-save-setting-button"  style="padding: 5px">Save Settings</button>
  144.               <button class="ujs-close-setting-button" style="padding: 5px">Close Settings</button>
  145.           </div>
  146.           <hr>
  147.           <h4 style="margin: 0; padding-left: 8px; color: #444;">Notes:</h4>
  148.           <ul style="margin: 2px; padding-left: 16px; color: #444;">
  149.             <li>Click on <b>Save Settings</b> and <b>reload the page</b> to apply changes.</li>
  150.             <li><b>*</b>-marked settings are language dependent. Currently, the follow languages are supported:<br/> "en", "ru", "es", "zh", "ja".</li>
  151.             <li hidden>The extension downloads only from twitter.com, not from <b>mobile</b>.twitter.com</li>
  152.           </ul>
  153.       </div>
  154.   </div>`);
  155.  
  156.     document.querySelector("body > .ujs-modal-wrapper .ujs-save-setting-button").addEventListener("click", saveSetting);
  157.     document.querySelector("body > .ujs-modal-wrapper .ujs-close-setting-button").addEventListener("click", closeSetting);
  158.  
  159.     function saveSetting() {
  160.         const entries = [...document.querySelectorAll("body > .ujs-modal-wrapper input[type=checkbox]")]
  161.             .map(checkbox => [checkbox.name, checkbox.checked]);
  162.         const radioEntries = [...document.querySelectorAll("body > .ujs-modal-wrapper input[type=radio]")]
  163.             .map(checkbox => [checkbox.value, checkbox.checked])
  164.         const settings = Object.fromEntries([entries, radioEntries].flat());
  165.         settings.hideTopicsToFollowInstantly = settings.hideTopicsToFollow;
  166.         // console.log("[ujs]", settings);
  167.         localStorage.setItem("ujs-click-n-save-settings", JSON.stringify(settings));
  168.     }
  169.  
  170.     function closeSetting() {
  171.         document.body.classList.remove("ujs-no-scroll");
  172.         document.body.classList.remove("ujs-scrollbar-width-margin-right");
  173.         document.querySelector("html").classList.remove("ujs-scroll-initial");
  174.         document.querySelector("body > .ujs-modal-wrapper")?.remove();
  175.     }
  176. }
  177.  
  178. // ---------------------------------------------------------------------------------------------------------------------
  179. // ---------------------------------------------------------------------------------------------------------------------
  180.  
  181. // --- Features to execute --- //
  182. const doNotPlayVideosAutomatically = false;
  183.  
  184. function execFeaturesOnce() {
  185.     settings.goFromMobileToMainSite         && Features.goFromMobileToMainSite();
  186.     settings.addRequiredCSS                 && Features.addRequiredCSS();
  187.     settings.hideSignUpBottomBarAndMessages && Features.hideSignUpBottomBarAndMessages(doNotPlayVideosAutomatically);
  188.     settings.hideTrends                     && Features.hideTrends();
  189.     settings.highlightVisitedLinks          && Features.highlightVisitedLinks();
  190.     settings.hideTopicsToFollowInstantly    && Features.hideTopicsToFollowInstantly();
  191.     settings.hideLoginPopup                 && Features.hideLoginPopup();
  192. }
  193. function execFeaturesImmediately() {
  194.     settings.expandSpoilers     && Features.expandSpoilers();
  195. }
  196. function execFeatures() {
  197.     settings.imagesHandler      && Features.imagesHandler(settings.preventBlinking);
  198.     settings.videoHandler       && Features.videoHandler(settings.preventBlinking);
  199.     settings.expandSpoilers     && Features.expandSpoilers();
  200.     settings.hideSignUpSection  && Features.hideSignUpSection();
  201.     settings.hideTopicsToFollow && Features.hideTopicsToFollow();
  202.     settings.directLinks        && Features.directLinks();
  203.     settings.handleTitle        && Features.handleTitle();
  204. }
  205.  
  206. // ---------------------------------------------------------------------------------------------------------------------
  207. // ---------------------------------------------------------------------------------------------------------------------
  208.  
  209. if (verbose) {
  210.     console.log("[ujs][settings]", settings);
  211.     // showSettings();
  212. }
  213.  
  214. // --- [VM/GM + Firefox ~90+ + Enabled "Strict Tracking Protection"] fix --- //
  215. const fetch = (settings.strictTrackingProtectionFix && typeof wrappedJSObject === "object" && typeof wrappedJSObject.fetch === "function") ? function(resource, init = {}) {
  216.     verbose && console.log("wrappedJSObject.fetch", resource, init);
  217.  
  218.     if (init.headers instanceof Headers) {
  219.         // Since `Headers` are not allowed for structured cloning.
  220.         init.headers = Object.fromEntries(init.headers.entries());
  221.     }
  222.  
  223.     return wrappedJSObject.fetch(cloneInto(resource, document), cloneInto(init, document));
  224. } : globalThis.fetch;
  225.  
  226. // --- "Imports" --- //
  227. const {
  228.     sleep, fetchResource, downloadBlob,
  229.     addCSS,
  230.     getCookie,
  231.     throttle,
  232.     xpath, xpathAll,
  233.     responseProgressProxy,
  234. } = getUtils({verbose});
  235. const LS = hoistLS({verbose});
  236.  
  237. const API = hoistAPI();
  238. const Tweet = hoistTweet();
  239. const Features = hoistFeatures();
  240. const I18N = getLanguageConstants();
  241.  
  242. // --- That to use for the image history --- //
  243. // "TWEET_ID" or "IMAGE_NAME"
  244. const imagesHistoryBy = LS.getItem("ujs-images-history-by", "IMAGE_NAME");
  245. // With "TWEET_ID" downloading of 1 image of 4 will mark all 4 images as "already downloaded"
  246. // on the next time when the tweet will appear.
  247. // "IMAGE_NAME" will count each image of a tweet, but it will take more data to store.
  248.  
  249. // ---------------------------------------------------------------------------------------------------------------------
  250. // ---------------------------------------------------------------------------------------------------------------------
  251. // --- Script runner --- //
  252.  
  253. (function starter(feats) {
  254.     const {once, onChangeImmediate, onChange} = feats;
  255.  
  256.     once();
  257.     onChangeImmediate();
  258.     const onChangeThrottled = throttle(onChange, 250);
  259.     onChangeThrottled();
  260.  
  261.     const targetNode = document.querySelector("body");
  262.     const observerOptions = {
  263.         subtree: true,
  264.         childList: true,
  265.     };
  266.     const observer = new MutationObserver(callback);
  267.     observer.observe(targetNode, observerOptions);
  268.  
  269.     function callback(mutationList, observer) {
  270.         verbose && console.log(mutationList);
  271.         onChangeImmediate();
  272.         onChangeThrottled();
  273.     }
  274. })({
  275.     once: execFeaturesOnce,
  276.     onChangeImmediate: execFeaturesImmediately,
  277.     onChange: execFeatures
  278. });
  279.  
  280. // ---------------------------------------------------------------------------------------------------------------------
  281. // ---------------------------------------------------------------------------------------------------------------------
  282. // --- Twitter Specific code --- //
  283.  
  284. const downloadedImages = new LS("ujs-twitter-downloaded-images-names");
  285. const downloadedImageTweetIds = new LS("ujs-twitter-downloaded-image-tweet-ids");
  286. const downloadedVideoTweetIds = new LS("ujs-twitter-downloaded-video-tweet-ids");
  287.  
  288. // --- Twitter.Features --- //
  289. function hoistFeatures() {
  290.     class Features {
  291.         static goFromMobileToMainSite() {
  292.             if (location.href.startsWith("https://mobile.twitter.com/")) {
  293.                 location.href = location.href.replace("https://mobile.twitter.com/", "https://twitter.com/");
  294.             }
  295.             // TODO: add #redirected, remove by timer // to prevent a potential infinity loop
  296.         }
  297.  
  298.         static createButton({url, downloaded, isVideo}) {
  299.             const btn = document.createElement("div");
  300.             btn.innerHTML = `
  301. <div class="ujs-btn-common ujs-btn-background"></div>
  302. <div class="ujs-btn-common ujs-hover"></div>
  303. <div class="ujs-btn-common ujs-shadow"></div>
  304. <div class="ujs-btn-common ujs-progress" style="--progress: 0%"></div>
  305. <div class="ujs-btn-common ujs-btn-error-text"></div>`.slice(1);
  306.             btn.classList.add("ujs-btn-download");
  307.             if (!downloaded) {
  308.                 btn.classList.add("ujs-not-downloaded");
  309.             } else {
  310.                 btn.classList.add("ujs-already-downloaded");
  311.             }
  312.             if (isVideo) {
  313.                 btn.classList.add("ujs-video");
  314.             }
  315.             if (url) {
  316.                 btn.dataset.url = url;
  317.             }
  318.             return btn;
  319.         }
  320.  
  321.         static hasBlinkListenerWeakSet;
  322.         static _preventBlinking(clickBtnElem) {
  323.             const weakSet = Features.hasBlinkListenerWeakSet || (Features.hasBlinkListenerWeakSet = new WeakSet());
  324.             let wrapper;
  325.             clickBtnElem.addEventListener("mouseenter", () => {
  326.                 if (!weakSet.has(clickBtnElem)) {
  327.                     wrapper = Features._preventBlinkingHandler(clickBtnElem);
  328.                     weakSet.add(clickBtnElem);
  329.                 }
  330.             });
  331.             clickBtnElem.addEventListener("mouseleave", () => {
  332.                 verbose && console.log("[ujs] Btn mouseleave");
  333.                 if (wrapper?.observer?.disconnect) {
  334.                     weakSet.delete(clickBtnElem);
  335.                     wrapper.observer.disconnect();
  336.                 }
  337.             });
  338.         }
  339.         static _preventBlinkingHandler(clickBtnElem) {
  340.             let targetNode = clickBtnElem.closest("[aria-labelledby]");
  341.             if (!targetNode) {
  342.                 return;
  343.             }
  344.             let config = {attributes: true, subtree: true, attributeOldValue: true};
  345.             const wrapper = {};
  346.             wrapper.observer = new MutationObserver(callback);
  347.             wrapper.observer.observe(targetNode, config);
  348.  
  349.             function callback(mutationsList, observer) {
  350.                 for (const mutation of mutationsList) {
  351.                     if (mutation.type === "attributes" && mutation.attributeName === "class") {
  352.                         if (mutation.target.classList.contains("ujs-btn-download")) {
  353.                             return;
  354.                         }
  355.                         // Don't allow to change classList
  356.                         mutation.target.className = mutation.oldValue;
  357.  
  358.                         // Recreate, to prevent an infinity loop
  359.                         wrapper.observer.disconnect();
  360.                         wrapper.observer = new MutationObserver(callback);
  361.                         wrapper.observer.observe(targetNode, config);
  362.                     }
  363.                 }
  364.             }
  365.  
  366.             return wrapper;
  367.         }
  368.  
  369.         // Banner/Background
  370.         static async _downloadBanner(url, btn) {
  371.             const username = location.pathname.slice(1).split("/")[0];
  372.  
  373.             btn.classList.add("ujs-downloading");
  374.  
  375.             // https://pbs.twimg.com/profile_banners/34743251/1596331248/1500x500
  376.             const {
  377.                 id, seconds, res
  378.             } = url.match(/(?<=\/profile_banners\/)(?<id>\d+)\/(?<seconds>\d+)\/(?<res>\d+x\d+)/)?.groups || {};
  379.  
  380.             const {blob, lastModifiedDate, extension, name} = await fetchResource(url);
  381.  
  382.             Features.verifyBlob(blob, url, btn);
  383.  
  384.             const filename = `[twitter][bg] ${username}—${lastModifiedDate}—${id}—${seconds}.${extension}`;
  385.             downloadBlob(blob, filename, url);
  386.  
  387.             btn.classList.remove("ujs-downloading");
  388.             btn.classList.add("ujs-downloaded");
  389.         }
  390.  
  391.         static _ImageHistory = class {
  392.             static getImageNameFromUrl(url) {
  393.                 const _url = new URL(url);
  394.                 const {filename} = (_url.origin + _url.pathname).match(/(?<filename>[^\/]+$)/).groups;
  395.                 return filename.match(/^[^.]+/)[0]; // remove extension
  396.             }
  397.             static isDownloaded({id, url}) {
  398.                 if (imagesHistoryBy === "TWEET_ID") {
  399.                     return downloadedImageTweetIds.hasItem(id);
  400.                 } else if (imagesHistoryBy === "IMAGE_NAME") {
  401.                     const name = Features._ImageHistory.getImageNameFromUrl(url);
  402.                     return downloadedImages.hasItem(name);
  403.                 }
  404.             }
  405.             static async markDownloaded({id, url}) {
  406.                 if (imagesHistoryBy === "TWEET_ID") {
  407.                     await downloadedImageTweetIds.pushItem(id);
  408.                 } else if (imagesHistoryBy === "IMAGE_NAME") {
  409.                     const name = Features._ImageHistory.getImageNameFromUrl(url);
  410.                     await downloadedImages.pushItem(name);
  411.                 }
  412.             }
  413.         }
  414.         static async imagesHandler(preventBlinking) {
  415.             verbose && console.log("[ujs-cns][imagesHandler]");
  416.             const images = document.querySelectorAll("img");
  417.             for (const img of images) {
  418.  
  419.                 if (img.width < 150 || img.dataset.handled) {
  420.                     continue;
  421.                 }
  422.                 verbose && console.log(img, img.width);
  423.  
  424.                 img.dataset.handled = "true";
  425.  
  426.                 const btn = Features.createButton({url: img.src});
  427.                 btn.addEventListener("click", Features._imageClickHandler);
  428.  
  429.                 let anchor = img.closest("a");
  430.                 // if an image is _opened_ "https://twitter.com/UserName/status/1234567890123456789/photo/1" [fake-url]
  431.                 if (!anchor) {
  432.                     anchor = img.parentNode;
  433.                 }
  434.                 anchor.append(btn);
  435.                 if (preventBlinking) {
  436.                     Features._preventBlinking(btn);
  437.                 }
  438.  
  439.                 const downloaded = Features._ImageHistory.isDownloaded({
  440.                     id: Tweet.of(btn).id,
  441.                     url: btn.dataset.url
  442.                 });
  443.                 if (downloaded) {
  444.                     btn.classList.add("ujs-already-downloaded");
  445.                 }
  446.             }
  447.         }
  448.         static async _imageClickHandler(event) {
  449.             event.preventDefault();
  450.             event.stopImmediatePropagation();
  451.  
  452.             const btn = event.currentTarget;
  453.             const btnErrorTextElem = btn.querySelector(".ujs-btn-error-text");
  454.             let url = btn.dataset.url;
  455.  
  456.             const isBanner = url.includes("/profile_banners/");
  457.             if (isBanner) {
  458.                 return Features._downloadBanner(url, btn);
  459.             }
  460.  
  461.             const {id, author} = Tweet.of(btn);
  462.             verbose && console.log(id, author);
  463.  
  464.             const btnProgress = btn.querySelector(".ujs-progress");
  465.             if (btn.textContent !== "") {
  466.                 btnErrorTextElem.textContent = "";
  467.             }
  468.             btn.classList.remove("ujs-error");
  469.             btn.classList.add("ujs-downloading");
  470.  
  471.             let onProgress = null;
  472.             if (settings.downloadProgress) {
  473.                 onProgress = ({loaded, total}) => btnProgress.style.cssText = "--progress: " + loaded / total * 90 + "%";
  474.             }
  475.  
  476.             const originals = ["orig", "4096x4096"];
  477.             const samples = ["large", "medium", "900x900", "small", "360x360", /*"240x240", "120x120", "tiny"*/];
  478.             let isSample = false;
  479.             const previewSize = new URL(url).searchParams.get("name");
  480.             if (!samples.includes(previewSize)) {
  481.                 samples.push(previewSize);
  482.             }
  483.  
  484.             function handleImgUrl(url) {
  485.                 const urlObj = new URL(url);
  486.                 if (originals.length) {
  487.                     urlObj.searchParams.set("name", originals.shift());
  488.                 } else if (samples.length) {
  489.                     isSample = true;
  490.                     urlObj.searchParams.set("name", samples.shift());
  491.                 } else {
  492.                     throw new Error("All fallback URLs are failed to download.");
  493.                 }
  494.                 url = urlObj.toString();
  495.                 verbose && console.log("[handleImgUrl]", url);
  496.                 return url;
  497.             }
  498.  
  499.             async function safeFetchResource(url) {
  500.                 while (true) {
  501.                     url = handleImgUrl(url);
  502.                     try {
  503.                         return await fetchResource(url, onProgress);
  504.                     } catch (e) {
  505.                         if (!originals.length) {
  506.                             btn.classList.add("ujs-error");
  507.                             btnErrorTextElem.textContent = "";
  508.                             // Add ⚠
  509.                             btnErrorTextElem.style = `background-image: url("https://abs-0.twimg.com/emoji/v2/svg/26a0.svg"); background-size: 1.5em; background-position: center; background-repeat: no-repeat;`;
  510.                             btn.title = "[warning] Original images are not available.";
  511.                         }
  512.                         if (!samples.length) {
  513.                             btnErrorTextElem.textContent = "";
  514.                             // Add ❌
  515.                             btnErrorTextElem.style = `background-image: url("https://abs-0.twimg.com/emoji/v2/svg/274c.svg"); background-size: 1.5em; background-position: center; background-repeat: no-repeat;`;
  516.                             btn.title = "Failed to download the image.";
  517.                             throw new Error("[error] Fallback URLs are failed.");
  518.                         }
  519.                     }
  520.                 }
  521.             }
  522.  
  523.             const {blob, lastModifiedDate, extension, name} = await safeFetchResource(url);
  524.  
  525.             Features.verifyBlob(blob, url, btn);
  526.  
  527.             btnProgress.style.cssText = "--progress: 100%";
  528.  
  529.             const sampleText = !isSample ? "" : "[sample]";
  530.             const filename = `[twitter]${sampleText} ${author}—${lastModifiedDate}—${id}—${name}.${extension}`;
  531.             downloadBlob(blob, filename, url);
  532.  
  533.             const downloaded = btn.classList.contains("already-downloaded");
  534.             if (!downloaded && !isSample) {
  535.                 await Features._ImageHistory.markDownloaded({id, url});
  536.             }
  537.             btn.classList.remove("ujs-downloading");
  538.             btn.classList.add("ujs-downloaded");
  539.  
  540.             await sleep(40);
  541.             btnProgress.style.cssText = "--progress: 0%";
  542.         }
  543.  
  544.         static tweetVidWeakMap = new WeakMap();
  545.         static async videoHandler(preventBlinking) {
  546.             const videos = document.querySelectorAll("video");
  547.  
  548.             for (const vid of videos) {
  549.                 if (vid.dataset.handled) {
  550.                     continue;
  551.                 }
  552.                 verbose && console.log(vid);
  553.                 vid.dataset.handled = "true";
  554.  
  555.                 const poster = vid.getAttribute("poster");
  556.  
  557.                 const btn = Features.createButton({isVideo: true, url: poster});
  558.                 btn.addEventListener("click", Features._videoClickHandler);
  559.  
  560.                 let elem = vid.parentNode.parentNode.parentNode;
  561.                 elem.after(btn);
  562.                 if (preventBlinking) {
  563.                     Features._preventBlinking(btn);
  564.                 }
  565.  
  566.                 const tweet = Tweet.of(btn);
  567.                 const id = tweet.id;
  568.                 const tweetElem = tweet.elem;
  569.                 let vidNumber = 0;
  570.  
  571.                 const map = Features.tweetVidWeakMap;
  572.                 if (map.has(tweetElem)) {
  573.                     vidNumber = map.get(tweetElem) + 1;
  574.                     map.set(tweetElem, vidNumber);
  575.                 } else {
  576.                     map.set(tweetElem, vidNumber);
  577.                 }
  578.  
  579.                 const historyId = vidNumber ? id + "-" + vidNumber : id;
  580.  
  581.                 const downloaded = downloadedVideoTweetIds.hasItem(historyId);
  582.                 if (downloaded) {
  583.                     btn.classList.add("ujs-already-downloaded");
  584.                 }
  585.             }
  586.         }
  587.         static async _videoClickHandler(event) {
  588.             event.preventDefault();
  589.             event.stopImmediatePropagation();
  590.  
  591.             const btn = event.currentTarget;
  592.             const btnErrorTextElem = btn.querySelector(".ujs-btn-error-text");
  593.             let {id, author} = Tweet.of(btn);
  594.  
  595.             if (btn.textContent !== "") {
  596.                 btnErrorTextElem.textContent = "";
  597.             }
  598.             btn.classList.remove("ujs-error");
  599.             btn.classList.add("ujs-downloading");
  600.  
  601.             const posterUrl = btn.dataset.url;
  602.  
  603.             let video; // {bitrate, content_type, url}
  604.             let vidNumber = 0;
  605.             try {
  606.                 ({video, tweetId: id, screenName: author, vidNumber} = await API.getVideoInfo(id, author, posterUrl));
  607.                 verbose && console.log(video);
  608.             } catch (e) {
  609.                 btn.classList.add("ujs-error");
  610.                 btnErrorTextElem.textContent = "Error";
  611.                 btn.title = "API.getVideoInfo Error";
  612.                 throw new Error("API.getVideoInfo Error");
  613.             }
  614.  
  615.             const btnProgress = btn.querySelector(".ujs-progress");
  616.  
  617.             const url = video.url;
  618.             let onProgress = null;
  619.             if (settings.downloadProgress) {
  620.                 onProgress = ({loaded, total}) => btnProgress.style.cssText = "--progress: " + loaded / total * 90 + "%";
  621.             }
  622.  
  623.             const {blob, lastModifiedDate, extension, name} = await fetchResource(url, onProgress);
  624.  
  625.             btnProgress.style.cssText = "--progress: 100%";
  626.  
  627.             Features.verifyBlob(blob, url, btn);
  628.  
  629.             const filename = `[twitter] ${author}—${lastModifiedDate}—${id}—${name}.${extension}`;
  630.             downloadBlob(blob, filename, url);
  631.  
  632.             const downloaded = btn.classList.contains("ujs-already-downloaded");
  633.             const historyId = vidNumber ? id + "-" + vidNumber : id;
  634.             if (!downloaded) {
  635.                 await downloadedVideoTweetIds.pushItem(historyId);
  636.             }
  637.             btn.classList.remove("ujs-downloading");
  638.             btn.classList.add("ujs-downloaded");
  639.  
  640.             await sleep(40);
  641.             btnProgress.style.cssText = "--progress: 0%";
  642.         }
  643.  
  644.         static verifyBlob(blob, url, btn) {
  645.             if (!blob.size) {
  646.                 btn.classList.add("ujs-error");
  647.                 btn.querySelector(".ujs-btn-error-text").textContent = "Error";
  648.                 btn.title = "Download Error";
  649.                 throw new Error("Zero size blob: " + url);
  650.             }
  651.         }
  652.  
  653.         static addRequiredCSS() {
  654.             const code = getUserScriptCSS();
  655.             addCSS(code);
  656.         }
  657.  
  658.         // it depends of `directLinks()` use only it after `directLinks()`
  659.         static handleTitle(title) {
  660.  
  661.             if (!I18N.QUOTES) { // Unsupported lang, no QUOTES, ON_TWITTER, TWITTER constants
  662.                 return;
  663.             }
  664.  
  665.             // if not an opened tweet
  666.             if (!location.href.match(/twitter\.com\/[^\/]+\/status\/\d+/)) {
  667.                 return;
  668.             }
  669.  
  670.             let titleText = title || document.title;
  671.             if (titleText === Features.lastHandledTitle) {
  672.                 return;
  673.             }
  674.             Features.originalTitle = titleText;
  675.  
  676.             const [OPEN_QUOTE, CLOSE_QUOTE] = I18N.QUOTES;
  677.             const urlsToReplace = [
  678.                 ...titleText.matchAll(new RegExp(`https:\\/\\/t\\.co\\/[^ ${CLOSE_QUOTE}]+`, "g"))
  679.             ].map(el => el[0]);
  680.             // the last one may be the URL to the tweet // or to an embedded shared URL
  681.  
  682.             const map = new Map();
  683.             const anchors = document.querySelectorAll(`a[data-redirect^="https://t.co/"]`);
  684.             for (const anchor of anchors) {
  685.                 if (urlsToReplace.includes(anchor.dataset.redirect)) {
  686.                     map.set(anchor.dataset.redirect, anchor.href);
  687.                 }
  688.             }
  689.  
  690.             const lastUrl = urlsToReplace.slice(-1)[0];
  691.             let lastUrlIsAttachment = false;
  692.             let attachmentDescription = "";
  693.             if (!map.has(lastUrl)) {
  694.                 const a = document.querySelector(`a[href="${lastUrl}?amp=1"]`);
  695.                 if (a) {
  696.                     lastUrlIsAttachment = true;
  697.                     attachmentDescription = document.querySelectorAll(`a[href="${lastUrl}?amp=1"]`)[1].innerText;
  698.                     attachmentDescription = attachmentDescription.replaceAll("\n", " — ");
  699.                 }
  700.             }
  701.  
  702.             for (const [key, value] of map.entries()) {
  703.                 titleText = titleText.replaceAll(key, value + ` (${key})`);
  704.             }
  705.  
  706.             titleText = titleText.replace(new RegExp(`${I18N.ON_TWITTER}(?= ${OPEN_QUOTE})`), ":");
  707.             titleText = titleText.replace(new RegExp(`(?<=${CLOSE_QUOTE}) \\\/ ${I18N.TWITTER}$`), "");
  708.             if (!lastUrlIsAttachment) {
  709.                 const regExp = new RegExp(`(?<short> https:\\/\\/t\\.co\\/.{6,14})${CLOSE_QUOTE}$`);
  710.                 titleText = titleText.replace(regExp, (match, p1, p2, offset, string) => `${CLOSE_QUOTE} —${p1}`);
  711.             } else {
  712.                 titleText = titleText.replace(lastUrl, `${lastUrl} (${attachmentDescription})`);
  713.             }
  714.             document.title = titleText; // Note: some characters will be removed automatically (`\n`, extra spaces)
  715.             Features.lastHandledTitle = document.title;
  716.         }
  717.         static lastHandledTitle = "";
  718.         static originalTitle = "";
  719.  
  720.         static profileUrlCache = new Map();
  721.         static async directLinks() {
  722.             verbose && console.log("[ujs][directLinks]");
  723.             const hasHttp = url => Boolean(url.match(/^https?:\/\//));
  724.             const anchors = xpathAll(`.//a[@dir="ltr" and child::span and not(@data-handled)]`);
  725.             for (const anchor of anchors) {
  726.                 const redirectUrl = new URL(anchor.href);
  727.                 const shortUrl = redirectUrl.origin + redirectUrl.pathname; // remove "?amp=1"
  728.                 anchor.dataset.redirect = shortUrl;
  729.                 anchor.dataset.handled = "true";
  730.                 anchor.rel = "nofollow noopener noreferrer";
  731.  
  732.                 if (Features.profileUrlCache.has(shortUrl)) {
  733.                     anchor.href = Features.profileUrlCache.get(shortUrl);
  734.                     continue;
  735.                 }
  736.  
  737.                 const nodes = xpathAll(`./span[text() != "…"]|./text()`, anchor);
  738.                 let url = nodes.map(node => node.textContent).join("");
  739.  
  740.                 const doubleProtocolPrefix = url.match(/(?<dup>^https?:\/\/)(?=https?:)/)?.groups.dup;
  741.                 if (doubleProtocolPrefix) {
  742.                     url = url.slice(doubleProtocolPrefix.length);
  743.                     const span = anchor.querySelector(`[aria-hidden="true"]`);
  744.                     if (hasHttp(span.textContent)) { // Fix Twitter's bug related to text copying
  745.                         span.style = "display: none;";
  746.                     }
  747.                 }
  748.  
  749.                 anchor.href = url;
  750.  
  751.                 if (anchor.dataset?.testid === "UserUrl") {
  752.                     const href = anchor.getAttribute("href");
  753.                     const profileUrl = hasHttp(href) ? href : "https://" + href;
  754.                     anchor.href = profileUrl;
  755.                     verbose && console.log("[ujs][directLinks][UserUrl]", profileUrl);
  756.  
  757.                     // Restore if URL's text content is too long
  758.                     if (anchor.textContent.endsWith("…")) {
  759.                         anchor.href = shortUrl;
  760.  
  761.                         try {
  762.                             const author = location.pathname.slice(1).match(/[^\/]+/)[0];
  763.                             const expanded_url = await API.getUserInfo(author); // todo: make lazy
  764.                             anchor.href = expanded_url;
  765.                             Features.profileUrlCache.set(shortUrl, expanded_url);
  766.                         } catch (e) {
  767.                             verbose && console.error(e);
  768.                         }
  769.                     }
  770.                 }
  771.             }
  772.             if (anchors.length) {
  773.                 Features.handleTitle(Features.originalTitle);
  774.             }
  775.         }
  776.  
  777.         // Do NOT throttle it
  778.         static expandSpoilers() {
  779.             const main = document.querySelector("main[role=main]");
  780.             if (!main) {
  781.                 return;
  782.             }
  783.  
  784.             if (!I18N.YES_VIEW_PROFILE) { // Unsupported lang, no YES_VIEW_PROFILE, SHOW_NUDITY, VIEW constants
  785.                 return;
  786.             }
  787.  
  788.             const a = main.querySelectorAll("[data-testid=primaryColumn] [role=button]");
  789.             if (a) {
  790.                 const elems = [...a];
  791.                 const button = elems.find(el => el.textContent === I18N.YES_VIEW_PROFILE);
  792.                 if (button) {
  793.                     button.click();
  794.                 }
  795.  
  796.                 // "Content warning: Nudity"
  797.                 // "The Tweet author flagged this Tweet as showing sensitive content."
  798.                 // "Show"
  799.                 const buttonShow = elems.find(el => el.textContent === I18N.SHOW_NUDITY);
  800.                 if (buttonShow) {
  801.                     // const verifying = a.previousSibling.textContent.includes("Nudity"); // todo?
  802.                     // if (verifying) {
  803.                     buttonShow.click();
  804.                     // }
  805.                 }
  806.             }
  807.  
  808.             // todo: expand spoiler commentary in photo view mode (.../photo/1)
  809.             const b = main.querySelectorAll("article [role=presentation] div[role=button]");
  810.             if (b) {
  811.                 const elems = [...b];
  812.                 const buttons = elems.filter(el => el.textContent === I18N.VIEW);
  813.                 if (buttons.length) {
  814.                     buttons.forEach(el => el.click());
  815.                 }
  816.             }
  817.         }
  818.  
  819.         static hideSignUpSection() { // "New to Twitter?"
  820.             if (!I18N.SIGNUP) {// Unsupported lang, no SIGNUP constant
  821.                 return;
  822.             }
  823.             const elem = document.querySelector(`section[aria-label="${I18N.SIGNUP}"][role=region]`);
  824.             if (elem) {
  825.                 elem.parentNode.classList.add("ujs-hidden");
  826.             }
  827.         }
  828.  
  829.         // Call it once.
  830.         // "Don’t miss what’s happening" if you are not logged in.
  831.         // It looks that `#layers` is used only for this bar.
  832.         static hideSignUpBottomBarAndMessages(doNotPlayVideosAutomatically) {
  833.             if (doNotPlayVideosAutomatically) {
  834.                 addCSS(`
  835.                     #layers > div:nth-child(1) {
  836.                         display: none;
  837.                     }
  838.                 `);
  839.             } else {
  840.                 addCSS(`
  841.                     #layers > div:nth-child(1) {
  842.                         height: 1px;
  843.                         opacity: 0;
  844.                     }
  845.                 `);
  846.             }
  847.         }
  848.  
  849.         // "Trends for you"
  850.         static hideTrends() {
  851.             if (!I18N.TRENDS) { // Unsupported lang, no TRENDS constant
  852.                 return;
  853.             }
  854.             addCSS(`
  855.                 [aria-label="${I18N.TRENDS}"]
  856.                 {
  857.                     display: none;
  858.                 }
  859.             `);
  860.         }
  861.  
  862.         static highlightVisitedLinks() {
  863.             if (settings.highlightOnlySpecialVisitedLinks) {
  864.                 addCSS(`
  865.                     a[href^="http"]:visited {
  866.                         color: darkorange;
  867.                     }
  868.                 `);
  869.                 return;
  870.             }
  871.             addCSS(`
  872.                 a:visited {
  873.                     color: darkorange;
  874.                 }
  875.             `);
  876.         }
  877.  
  878.         // Hides "TOPICS TO FOLLOW" only in the right column, NOT in timeline.
  879.         // Use it once. To prevent blinking.
  880.         static hideTopicsToFollowInstantly() {
  881.             if (!I18N.TOPICS_TO_FOLLOW) { // Unsupported lang, no TOPICS_TO_FOLLOW constant
  882.                 return;
  883.             }
  884.             addCSS(`
  885.                 div[aria-label="${I18N.TOPICS_TO_FOLLOW}"] {
  886.                     display: none;
  887.                 }
  888.             `);
  889.         }
  890.  
  891.         // Hides container and "separator line"
  892.         static hideTopicsToFollow() {
  893.             if (!I18N.TOPICS_TO_FOLLOW) { // Unsupported lang, no TOPICS_TO_FOLLOW constant
  894.                 return;
  895.             }
  896.  
  897.             const elem = xpath(`.//section[@role="region" and child::div[@aria-label="${I18N.TOPICS_TO_FOLLOW}"]]/../..`);
  898.             if (!elem) {
  899.                 return;
  900.             }
  901.             elem.classList.add("ujs-hidden");
  902.  
  903.             elem.previousSibling.classList.add("ujs-hidden"); // a "separator line" (empty element of "TRENDS", for example)
  904.             // in fact it's a hack // todo rework // may hide "You might like" section [bug]
  905.         }
  906.  
  907.         // todo split to two methods
  908.         // todo fix it, currently it works questionably
  909.         // not tested with non eng langs
  910.         static footerHandled = false;
  911.         static hideAndMoveFooter() { // "Terms of Service   Privacy Policy   Cookie Policy"
  912.             let footer = document.querySelector(`main[role=main] nav[aria-label=${I18N.FOOTER}][role=navigation]`);
  913.             const nav  = document.querySelector("nav[aria-label=Primary][role=navigation]"); // I18N."Primary" [?]
  914.  
  915.             if (footer) {
  916.                 footer = footer.parentNode;
  917.                 const separatorLine = footer.previousSibling;
  918.  
  919.                 if (Features.footerHandled) {
  920.                     footer.remove();
  921.                     separatorLine.remove();
  922.                     return;
  923.                 }
  924.  
  925.                 nav.append(separatorLine);
  926.                 nav.append(footer);
  927.                 footer.classList.add("ujs-show-on-hover");
  928.                 separatorLine.classList.add("ujs-show-on-hover");
  929.  
  930.                 Features.footerHandled = true;
  931.             }
  932.         }
  933.  
  934.         static hideLoginPopup() { // When you are not logged in
  935.             const targetNode = document.querySelector("html");
  936.             const observerOptions = {
  937.                 attributes: true,
  938.             };
  939.             const observer = new MutationObserver(callback);
  940.             observer.observe(targetNode, observerOptions);
  941.  
  942.             function callback(mutationList, observer) {
  943.                 const html = document.querySelector("html");
  944.                 console.log(mutationList);
  945.                 // overflow-y: scroll; overscroll-behavior-y: none; font-size: 15px;                     // default
  946.                 // overflow: hidden; overscroll-behavior-y: none; font-size: 15px; margin-right: 15px;   // popup
  947.                 if (html.style["overflow"] === "hidden") {
  948.                     html.style["overflow"] = "";
  949.                     html.style["overflow-y"] = "scroll";
  950.                     html.style["margin-right"] = "";
  951.                 }
  952.                 const popup = document.querySelector(`#layers div[data-testid="sheetDialog"]`);
  953.                 if (popup) {
  954.                     popup.closest(`div[role="dialog"]`).remove();
  955.                     verbose && (document.title = "⚒" + document.title);
  956.                     // observer.disconnect();
  957.                 }
  958.             }
  959.         }
  960.  
  961.     }
  962.  
  963.     return Features;
  964. }
  965.  
  966. // --- Twitter.RequiredCSS --- //
  967. function getUserScriptCSS() {
  968.     const labelText = I18N.IMAGE || "Image";
  969.  
  970.     // By default, the scroll is showed all time, since <html style="overflow-y: scroll;>,
  971.     // so it works — no need to use `getScrollbarWidth` function from SO (13382516).
  972.     const scrollbarWidth = window.innerWidth - document.body.offsetWidth;
  973.  
  974.     const css = `
  975. .ujs-hidden {
  976.     display: none;
  977. }
  978. .ujs-no-scroll {
  979.     overflow-y: hidden;
  980. }
  981. .ujs-scroll-initial {
  982.     overflow-y: initial!important;
  983. }
  984. .ujs-scrollbar-width-margin-right {
  985.     margin-right: ${scrollbarWidth}px;
  986. }
  987.  
  988. .ujs-show-on-hover:hover {
  989.     opacity: 1;
  990.     transition: opacity 1s ease-out 0.1s;
  991. }
  992. .ujs-show-on-hover {
  993.     opacity: 0;
  994.     transition: opacity 0.5s ease-out;
  995. }
  996.  
  997. :root {
  998.     --ujs-shadow-1: linear-gradient(to top, rgba(0,0,0,0.15), rgba(0,0,0,0.05));
  999.     --ujs-shadow-2: linear-gradient(to top, rgba(0,0,0,0.25), rgba(0,0,0,0.05));
  1000.     --ujs-shadow-3: linear-gradient(to top, rgba(0,0,0,0.45), rgba(0,0,0,0.15));
  1001.     --ujs-shadow-4: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0.25));
  1002.     --ujs-red:   #e0245e;
  1003.     --ujs-blue:  #1da1f2;
  1004.     --ujs-green: #4caf50;
  1005.     --ujs-gray:  #c2cbd0;
  1006.     --ujs-error: white;
  1007. }
  1008.  
  1009. .ujs-progress {
  1010.   background-image: linear-gradient(to right, var(--ujs-green) var(--progress), transparent 0%);
  1011. }
  1012.  
  1013. .ujs-shadow {
  1014.   background-image: var(--ujs-shadow-1);
  1015. }
  1016. .ujs-btn-download:hover .ujs-hover {
  1017.   background-image: var(--ujs-shadow-2);
  1018. }
  1019. .ujs-btn-download.ujs-downloading .ujs-shadow {
  1020.   background-image: var(--ujs-shadow-3);
  1021. }
  1022. .ujs-btn-download:active .ujs-shadow {
  1023.   background-image: var(--ujs-shadow-4);
  1024. }
  1025.  
  1026. article[role=article]:hover .ujs-btn-download {
  1027.     opacity: 1;
  1028. }
  1029. div[aria-label="${labelText}"]:hover .ujs-btn-download {
  1030.     opacity: 1;
  1031. }
  1032. .ujs-btn-download.ujs-downloaded {
  1033.     opacity: 1;
  1034. }
  1035. .ujs-btn-download.ujs-downloading {
  1036.     opacity: 1;
  1037. }
  1038.  
  1039. .ujs-btn-download {
  1040.   cursor: pointer;
  1041.   top: 0.5em;
  1042.   left: 0.5em;
  1043.   position: absolute;
  1044.   opacity: 0;
  1045. }
  1046. .ujs-btn-common {
  1047.   width: 33px;
  1048.   height: 33px;
  1049.   border-radius: 0.3em;
  1050.   top: 0;
  1051.   position: absolute;
  1052.   border: 1px solid transparent;
  1053.   border-color: var(--ujs-gray);
  1054.   ${settings.addBorder ? "border: 2px solid white;" : "border-color: var(--ujs-gray);"}
  1055. }
  1056. .ujs-not-downloaded .ujs-btn-background {
  1057.   background: var(--ujs-red);
  1058. }
  1059.  
  1060. .ujs-already-downloaded .ujs-btn-background {
  1061.   background: var(--ujs-blue);
  1062. }
  1063.  
  1064. .ujs-downloaded .ujs-btn-background {
  1065.   background: var(--ujs-green);
  1066. }
  1067.  
  1068. .ujs-error .ujs-btn-background {
  1069.   background: var(--ujs-error);
  1070. }
  1071.  
  1072. .ujs-btn-error-text {
  1073.   display: flex;
  1074.   align-items: center;
  1075.   justify-content: center;
  1076.   color: black;
  1077.   font-size: 100%;
  1078. }`;
  1079.     return css.slice(1);
  1080. }
  1081.  
  1082. /*
  1083. Features depend on:
  1084.  
  1085. addRequiredCSS: IMAGE
  1086.  
  1087. expandSpoilers:     YES_VIEW_PROFILE,   SHOW_NUDITY,  VIEW
  1088. handleTitle:        QUOTES,             ON_TWITTER,   TWITTER
  1089. hideSignUpSection:  SIGNUP
  1090. hideTrends:         TRENDS
  1091. hideTopicsToFollowInstantly: TOPICS_TO_FOLLOW,
  1092.  
  1093. hideTopicsToFollow:          TOPICS_TO_FOLLOW,
  1094.  
  1095. [unused]
  1096. hideAndMoveFooter:  FOOTER
  1097. */
  1098.  
  1099. // --- Twitter.LangConstants --- //
  1100. function getLanguageConstants() { //todo: "de", "fr"
  1101.     const defaultQuotes = [`"`, `"`];
  1102.  
  1103.     const SUPPORTED_LANGUAGES = ["en",                     "ru",                     "es",                                 "zh",               "ja",                       ];
  1104.  
  1105.     // texts
  1106.     const VIEW                = ["View",                   "Посмотреть",             "Ver",                                "查看",             "表示",                      ];
  1107.     const YES_VIEW_PROFILE    = ["Yes, view profile",      "Да, посмотреть профиль", "Sí, ver perfil",                     "是，查看个人资料",   "プロフィールを表示する",      ];
  1108.  
  1109.     const SHOW_NUDITY         = ["Show",                   "Показать",               "Mostrar",                            "显示",              "表示",                     ];
  1110.     // aria-label texts
  1111.     const IMAGE               = ["Image",                  "Изображение",            "Imagen",                             "图像",              "画像",                     ];
  1112.     const SIGNUP              = ["Sign up",                "Зарегистрироваться",     "Regístrate",                         "注册",             "アカウント作成",              ];
  1113.     const TRENDS              = ["Timeline: Trending now", "Лента: Актуальные темы", "Cronología: Tendencias del momento", "时间线：当前趋势",   "タイムライン: トレンド",      ];
  1114.     const TOPICS_TO_FOLLOW    = ["Timeline: ",             "Лента: ",                "Cronología: ",                       "时间线：", /*[1]*/  "タイムライン: ",  /*[1]*/    ];
  1115.     const WHO_TO_FOLLOW       = ["Who to follow",          "Кого читать",            "A quién seguir",                     "推荐关注",          "おすすめユーザー"             ];
  1116.     const FOOTER              = ["Footer",                 "Нижний колонтитул",      "Pie de página",                      "页脚",             "フッター",                   ];
  1117.     // *1 — it's a suggestion, need to recheck. But I can't find a page where I can check it. Was it deleted?
  1118.  
  1119.     // document.title "{AUTHOR}{ON_TWITTER} {QUOTES[0]}{TEXT}{QUOTES[1]} / {TWITTER}"
  1120.     const QUOTES              = [defaultQuotes,            [`«`, `»`],               defaultQuotes,                        defaultQuotes,      [`「`, `」`],                ];
  1121.     const ON_TWITTER          = [" on Twitter:",           " в Твиттере:",           " en Twitter:",                       " 在 Twitter:",      "さんはTwitterを使っています", ];
  1122.     const TWITTER             = ["Twitter",                "Твиттер",                "Twitter",                            "Twitter",          "Twitter",                  ];
  1123.  
  1124.     const lang = document.querySelector("html").getAttribute("lang");
  1125.     const langIndex = SUPPORTED_LANGUAGES.indexOf(lang);
  1126.  
  1127.     return {
  1128.         SUPPORTED_LANGUAGES,
  1129.         VIEW: VIEW[langIndex],
  1130.         YES_VIEW_PROFILE: YES_VIEW_PROFILE[langIndex],
  1131.         SIGNUP: SIGNUP[langIndex],
  1132.         TRENDS: TRENDS[langIndex],
  1133.         TOPICS_TO_FOLLOW: TOPICS_TO_FOLLOW[langIndex],
  1134.         WHO_TO_FOLLOW: WHO_TO_FOLLOW[langIndex],
  1135.         FOOTER: FOOTER[langIndex],
  1136.         QUOTES: QUOTES[langIndex],
  1137.         ON_TWITTER: ON_TWITTER[langIndex],
  1138.         TWITTER: TWITTER[langIndex],
  1139.         IMAGE: IMAGE[langIndex],
  1140.         SHOW_NUDITY: SHOW_NUDITY[langIndex],
  1141.     }
  1142. }
  1143.  
  1144. // --- Twitter.Tweet --- //
  1145. function hoistTweet() {
  1146.     class Tweet {
  1147.         constructor({elem, url}) {
  1148.             if (url) {
  1149.                 this.elem = null;
  1150.                 this.url = url;
  1151.             } else {
  1152.                 this.elem = elem;
  1153.                 this.url = Tweet.getUrl(elem);
  1154.             }
  1155.         }
  1156.  
  1157.         static of(innerElem) {
  1158.             // Workaround for media from a quoted tweet
  1159.             const url = innerElem.closest(`a[href^="/"]`)?.href;
  1160.             if (url && url.includes("/status/")) {
  1161.                 return new Tweet({url});
  1162.             }
  1163.  
  1164.             const elem = innerElem.closest(`[data-testid="tweet"]`);
  1165.             if (!elem) { // opened image
  1166.                 verbose && console.log("no-tweet elem");
  1167.             }
  1168.             return new Tweet({elem});
  1169.         }
  1170.  
  1171.         static getUrl(elem) {
  1172.             if (!elem) { // if opened image
  1173.                 return location.href;
  1174.             }
  1175.  
  1176.             const tweetAnchor = [...elem.querySelectorAll("a")].find(el => {
  1177.                 return el.childNodes[0]?.nodeName === "TIME";
  1178.             });
  1179.  
  1180.             if (tweetAnchor) {
  1181.                 return tweetAnchor.href;
  1182.             }
  1183.             // else if selected tweet
  1184.             return location.href;
  1185.         }
  1186.  
  1187.         get author() {
  1188.             return this.url.match(/(?<=twitter\.com\/).+?(?=\/)/)?.[0];
  1189.         }
  1190.  
  1191.         get id() {
  1192.             return this.url.match(/(?<=\/status\/)\d+/)?.[0];
  1193.         }
  1194.     }
  1195.  
  1196.     return Tweet;
  1197. }
  1198.  
  1199. // --- Twitter.API --- //
  1200. function hoistAPI() {
  1201.     class API {
  1202.         static guestToken = getCookie("gt");
  1203.         static csrfToken  = getCookie("ct0");  // todo: lazy — not available at the first run
  1204.         // Guest/Suspended account Bearer token
  1205.         static guestAuthorization = "Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA";
  1206.  
  1207.         // Seems to be outdated at 2022.05
  1208.         static async _requestBearerToken() {
  1209.             const scriptSrc = [...document.querySelectorAll("script")]
  1210.                 .find(el => el.src.match(/https:\/\/abs\.twimg\.com\/responsive-web\/client-web\/main[\w.]*\.js/)).src;
  1211.  
  1212.             let text;
  1213.             try {
  1214.                 text = await (await fetch(scriptSrc)).text();
  1215.             } catch (e) {
  1216.                 console.error(e, scriptSrc);
  1217.                 throw e;
  1218.             }
  1219.  
  1220.             const authorizationKey = text.match(/(?<=")AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D.+?(?=")/)[0];
  1221.             const authorization = `Bearer ${authorizationKey}`;
  1222.  
  1223.             return authorization;
  1224.         }
  1225.  
  1226.         static async getAuthorization() {
  1227.             if (!API.authorization) {
  1228.                 API.authorization = await API._requestBearerToken();
  1229.             }
  1230.             return API.authorization;
  1231.         }
  1232.  
  1233.         static async apiRequest(url) {
  1234.             const _url = url.toString();
  1235.             verbose && console.log("[ujs][apiRequest]", _url);
  1236.  
  1237.             // Hm... it is always the same. Even for a logged user.
  1238.             // const authorization = API.guestToken ? API.guestAuthorization : await API.getAuthorization();
  1239.             const authorization = API.guestAuthorization;
  1240.  
  1241.             // for debug
  1242.             verbose && sessionStorage.setItem("guestAuthorization", API.guestAuthorization);
  1243.             verbose && sessionStorage.setItem("authorization", API.authorization);
  1244.             verbose && sessionStorage.setItem("x-csrf-token", API.csrfToken);
  1245.             verbose && sessionStorage.setItem("x-guest-token", API.guestToken);
  1246.  
  1247.             const headers = new Headers({
  1248.                 authorization,
  1249.                 "x-csrf-token": API.csrfToken,
  1250.                 "x-twitter-client-language": "en",
  1251.                 "x-twitter-active-user": "yes"
  1252.             });
  1253.             if (API.guestToken) {
  1254.                 headers.append("x-guest-token", API.guestToken);
  1255.             } else { // may be skipped
  1256.                 headers.append("x-twitter-auth-type", "OAuth2Session");
  1257.             }
  1258.  
  1259.             let json;
  1260.             try {
  1261.                 const response = await fetch(_url, {headers});
  1262.                 json = await response.json();
  1263.             } catch (e) {
  1264.                 console.error(e, _url);
  1265.                 throw e;
  1266.             }
  1267.  
  1268.             verbose && console.log("[ujs][apiRequest]", JSON.stringify(json, null, " "));
  1269.             // 429 - [{code: 88, message: "Rate limit exceeded"}] — for suspended accounts
  1270.  
  1271.             return json;
  1272.         }
  1273.  
  1274.         // @return {bitrate, content_type, url, vidNumber}
  1275.         static async getVideoInfo(tweetId, screenName, posterUrl) {
  1276.             // const url = new URL(`https://api.twitter.com/2/timeline/conversation/${tweetId}.json`); // only for suspended/anon
  1277.             const url = new URL(`https://twitter.com/i/api/2/timeline/conversation/${tweetId}.json`);
  1278.             url.searchParams.set("tweet_mode", "extended");
  1279.  
  1280.             const json = await API.apiRequest(url);
  1281.             let tweetData = json.globalObjects.tweets[tweetId];
  1282.  
  1283.             if (tweetData.quoted_status_id_str) {
  1284.                 tweetId = tweetData.quoted_status_id_str;
  1285.                 const userIdStr = json.globalObjects.tweets[tweetId].user_id_str;
  1286.                 screenName = json.globalObjects.users[userIdStr].screen_name;
  1287.                 tweetData = json.globalObjects.tweets[tweetId];
  1288.             }
  1289.  
  1290.             // types: "photo", "video", "animated_gif"
  1291.             
  1292.             let vidNumber = tweetData.extended_entities.media
  1293.                 .filter(e => e.type !== "photo")
  1294.                 .findIndex(e => e.media_url_https === posterUrl);
  1295.  
  1296.             let mediaIndex = tweetData.extended_entities.media
  1297.                 .findIndex(e => e.media_url_https === posterUrl);
  1298.  
  1299.             if (vidNumber === -1 || mediaIndex === -1) {
  1300.                 verbose && console.log("[ujs][warning]: vidNumber === -1 || mediaIndex === -1");
  1301.                 vidNumber = 0;
  1302.                 mediaIndex = 0;
  1303.             }
  1304.             const videoVariants = tweetData.extended_entities.media[mediaIndex].video_info.variants;
  1305.             verbose && console.log("[getVideoInfo]", videoVariants);
  1306.  
  1307.             const video = videoVariants
  1308.                 .filter(el => el.bitrate !== undefined) // if content_type: "application/x-mpegURL" // .m3u8
  1309.                 .reduce((acc, cur) => cur.bitrate > acc.bitrate ? cur : acc);
  1310.  
  1311.             if (!video) {
  1312.                 throw new Error("No video URL");
  1313.             }
  1314.  
  1315.             return {video, tweetId, screenName, vidNumber};
  1316.         }
  1317.  
  1318.         static async getUserInfo(username) {
  1319.             const qHash = "Bhlf1dYJ3bYCKmLfeEQ31A"; // todo: change
  1320.             const variables = JSON.stringify({
  1321.                 "screen_name": username,
  1322.                 "withSafetyModeUserFields": true,
  1323.                 "withSuperFollowsUserFields": true
  1324.             });
  1325.             const url = `https://twitter.com/i/api/graphql/${qHash}/UserByScreenName?variables=${encodeURIComponent(variables)}`;
  1326.             const json = await API.apiRequest(url);
  1327.             verbose && console.log("[getUserInfo]", json);
  1328.             return json.data.user.result.legacy.entities.url?.urls[0].expanded_url;
  1329.         }
  1330.     }
  1331.  
  1332.     return API;
  1333. }
  1334.  
  1335. // ---------------------------------------------------------------------------------------------------------------------
  1336. // ---------------------------------------------------------------------------------------------------------------------
  1337. // --- Common Utils --- //
  1338.  
  1339. // --- LocalStorage util class --- //
  1340. function hoistLS(settings = {}) {
  1341.     const {
  1342.         verbose, // debug "messages" in the document.title
  1343.     } = settings;
  1344.  
  1345.     class LS {
  1346.         constructor(name) {
  1347.             this.name = name;
  1348.         }
  1349.         getItem(defaultValue) {
  1350.             return LS.getItem(this.name, defaultValue);
  1351.         }
  1352.         setItem(value) {
  1353.             LS.setItem(this.name, value);
  1354.         }
  1355.         removeItem() {
  1356.             LS.removeItem(this.name);
  1357.         }
  1358.         async pushItem(value) {  // array method
  1359.             await LS.pushItem(this.name, value);
  1360.         }
  1361.         async popItem(value) {   // array method
  1362.             await LS.popItem(this.name, value);
  1363.         }
  1364.         hasItem(value) {         // array method
  1365.             return LS.hasItem(this.name, value);
  1366.         }
  1367.  
  1368.         static getItem(name, defaultValue) {
  1369.             const value = localStorage.getItem(name);
  1370.             if (value === undefined) {
  1371.                 return undefined;
  1372.             }
  1373.             if (value === null) { // when there is no such item
  1374.                 LS.setItem(name, defaultValue);
  1375.                 return defaultValue;
  1376.             }
  1377.             return JSON.parse(value);
  1378.         }
  1379.         static setItem(name, value) {
  1380.             localStorage.setItem(name, JSON.stringify(value));
  1381.         }
  1382.         static removeItem(name) {
  1383.             localStorage.removeItem(name);
  1384.         }
  1385.         static async pushItem(name, value) {
  1386.             const array = LS.getItem(name, []);
  1387.             array.push(value);
  1388.             LS.setItem(name, array);
  1389.  
  1390.             //sanity check
  1391.             await sleep(50);
  1392.             if (!LS.hasItem(name, value)) {
  1393.                 if (verbose) {
  1394.                     document.title = "🟥" + document.title;
  1395.                 }
  1396.                 await LS.pushItem(name, value);
  1397.             }
  1398.         }
  1399.         static async popItem(name, value) { // remove from an array
  1400.             const array = LS.getItem(name, []);
  1401.             if (array.indexOf(value) !== -1) {
  1402.                 array.splice(array.indexOf(value), 1);
  1403.                 LS.setItem(name, array);
  1404.  
  1405.                 //sanity check
  1406.                 await sleep(50);
  1407.                 if (LS.hasItem(name, value)) {
  1408.                     if (verbose) {
  1409.                         document.title = "🟨" + document.title;
  1410.                     }
  1411.                     await LS.popItem(name, value);
  1412.                 }
  1413.             }
  1414.         }
  1415.         static hasItem(name, value) { // has in array
  1416.             const array = LS.getItem(name, []);
  1417.             return array.indexOf(value) !== -1;
  1418.         }
  1419.     }
  1420.  
  1421.     return LS;
  1422. }
  1423.  
  1424. // --- Just groups them in a function for the convenient code looking --- //
  1425. function getUtils({verbose}) {
  1426.     function sleep(time) {
  1427.         return new Promise(resolve => setTimeout(resolve, time));
  1428.     }
  1429.  
  1430.     async function fetchResource(url, onProgress = props => console.log(props)) {
  1431.         try {
  1432.             let response = await fetch(url, {
  1433.                 // cache: "force-cache",
  1434.             });
  1435.             const lastModifiedDateSeconds = response.headers.get("last-modified");
  1436.             const contentType = response.headers.get("content-type");
  1437.  
  1438.             const lastModifiedDate = dateToDayDateString(lastModifiedDateSeconds);
  1439.             const extension = contentType ? extensionFromMime(contentType) : null;
  1440.  
  1441.             if (onProgress) {
  1442.                 response = responseProgressProxy(response, onProgress);
  1443.             }
  1444.  
  1445.             const blob = await response.blob();
  1446.  
  1447.             // https://pbs.twimg.com/media/AbcdEFgijKL01_9?format=jpg&name=orig                                     -> AbcdEFgijKL01_9
  1448.             // https://pbs.twimg.com/ext_tw_video_thumb/1234567890123456789/pu/img/Ab1cd2345EFgijKL.jpg?name=orig   -> Ab1cd2345EFgijKL.jpg
  1449.             // https://video.twimg.com/ext_tw_video/1234567890123456789/pu/vid/946x720/Ab1cd2345EFgijKL.mp4?tag=10  -> Ab1cd2345EFgijKL.mp4
  1450.             const _url = new URL(url);
  1451.             const {filename} = (_url.origin + _url.pathname).match(/(?<filename>[^\/]+$)/).groups;
  1452.  
  1453.             const {name} = filename.match(/(?<name>^[^.]+)/).groups;
  1454.             return {blob, lastModifiedDate, contentType, extension, name};
  1455.         } catch (error) {
  1456.             verbose && console.error("[fetchResource]", url, error);
  1457.             throw error;
  1458.         }
  1459.     }
  1460.  
  1461.     function extensionFromMime(mimeType) {
  1462.         let extension = mimeType.match(/(?<=\/).+/)[0];
  1463.         extension = extension === "jpeg" ? "jpg" : extension;
  1464.         return extension;
  1465.     }
  1466.  
  1467.     // the original download url will be posted as hash of the blob url, so you can check it in the download manager's history
  1468.     function downloadBlob(blob, name, url) {
  1469.         const anchor = document.createElement("a");
  1470.         anchor.setAttribute("download", name || "");
  1471.         const blobUrl = URL.createObjectURL(blob);
  1472.         anchor.href = blobUrl + (url ? ("#" + url) : "");
  1473.         anchor.click();
  1474.         setTimeout(() => URL.revokeObjectURL(blobUrl), 30000);
  1475.     }
  1476.  
  1477.     // "Sun, 10 Jan 2021 22:22:22 GMT" -> "2021.01.10"
  1478.     function dateToDayDateString(dateValue, utc = true) {
  1479.         const _date = new Date(dateValue);
  1480.         function pad(str) {
  1481.             return str.toString().padStart(2, "0");
  1482.         }
  1483.         const _utc = utc ? "UTC" : "";
  1484.         const year  = _date[`get${_utc}FullYear`]();
  1485.         const month = _date[`get${_utc}Month`]() + 1;
  1486.         const date  = _date[`get${_utc}Date`]();
  1487.  
  1488.         return year + "." + pad(month) + "." + pad(date);
  1489.     }
  1490.  
  1491.     function addCSS(css) {
  1492.         const styleElem = document.createElement("style");
  1493.         styleElem.textContent = css;
  1494.         document.body.append(styleElem);
  1495.         return styleElem;
  1496.     }
  1497.  
  1498.     function getCookie(name) {
  1499.         verbose && console.log(document.cookie);
  1500.         const regExp = new RegExp(`(?<=${name}=)[^;]+`);
  1501.         return document.cookie.match(regExp)?.[0];
  1502.     }
  1503.  
  1504.     function throttle(runnable, time = 50) {
  1505.         let waiting = false;
  1506.         let queued = false;
  1507.         let context;
  1508.         let args;
  1509.  
  1510.         return function() {
  1511.             if (!waiting) {
  1512.                 waiting = true;
  1513.                 setTimeout(function() {
  1514.                     if (queued) {
  1515.                         runnable.apply(context, args);
  1516.                         context = args = undefined;
  1517.                     }
  1518.                     waiting = queued = false;
  1519.                 }, time);
  1520.                 return runnable.apply(this, arguments);
  1521.             } else {
  1522.                 queued = true;
  1523.                 context = this;
  1524.                 args = arguments;
  1525.             }
  1526.         }
  1527.     }
  1528.  
  1529.     function throttleWithResult(func, time = 50) {
  1530.         let waiting = false;
  1531.         let args;
  1532.         let context;
  1533.         let timeout;
  1534.         let promise;
  1535.  
  1536.         return async function() {
  1537.             if (!waiting) {
  1538.                 waiting = true;
  1539.                 timeout = new Promise(async resolve => {
  1540.                     await sleep(time);
  1541.                     waiting = false;
  1542.                     resolve();
  1543.                 });
  1544.                 return func.apply(this, arguments);
  1545.             } else {
  1546.                 args = arguments;
  1547.                 context = this;
  1548.             }
  1549.  
  1550.             if (!promise) {
  1551.                 promise = new Promise(async resolve => {
  1552.                     await timeout;
  1553.                     const result = func.apply(context, args);
  1554.                     args = context = promise = undefined;
  1555.                     resolve(result);
  1556.                 });
  1557.             }
  1558.             return promise;
  1559.         }
  1560.     }
  1561.  
  1562.     function xpath(path, node = document) {
  1563.         let xPathResult = document.evaluate(path, node, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
  1564.         return xPathResult.singleNodeValue;
  1565.     }
  1566.     function xpathAll(path, node = document) {
  1567.         let xPathResult = document.evaluate(path, node, null, XPathResult.ORDERED_NODE_ITERATOR_TYPE, null);
  1568.         const nodes = [];
  1569.         try {
  1570.             let node = xPathResult.iterateNext();
  1571.  
  1572.             while (node) {
  1573.                 nodes.push(node);
  1574.                 node = xPathResult.iterateNext();
  1575.             }
  1576.             return nodes;
  1577.         } catch (e) {
  1578.             // todo need investigate it
  1579.             console.error(e); // "The document has mutated since the result was returned."
  1580.             return [];
  1581.         }
  1582.     }
  1583.  
  1584.     const identityContentEncodings = new Set([null, "identity", "no encoding"]);
  1585.     function getOnProgressProps(response) {
  1586.         const {headers, status, statusText, url, redirected, ok} = response;
  1587.         const isIdentity = identityContentEncodings.has(headers.get("Content-Encoding"));
  1588.         const compressed = !isIdentity;
  1589.         const _contentLength = parseInt(headers.get("Content-Length")); // `get()` returns `null` if no header present
  1590.         const contentLength = isNaN(_contentLength) ? null : _contentLength;
  1591.         const lengthComputable = isIdentity && _contentLength !== null;
  1592.  
  1593.         // Original XHR behaviour; in TM it equals to `contentLength`, or `-1` if `contentLength` is `null` (and `0`?).
  1594.         const total = lengthComputable ? contentLength : 0;
  1595.         const gmTotal = contentLength > 0 ? contentLength : -1; // Like `total` is in TM and GM.
  1596.  
  1597.         return {
  1598.             gmTotal, total, lengthComputable,
  1599.             compressed, contentLength,
  1600.             headers, status, statusText, url, redirected, ok
  1601.         };
  1602.     }
  1603.     function responseProgressProxy(response, onProgress) {
  1604.         const onProgressProps = getOnProgressProps(response);
  1605.         let loaded = 0;
  1606.         const reader = response.body.getReader();
  1607.         const readableStream = new ReadableStream({
  1608.             async start(controller) {
  1609.                 while (true) {
  1610.                     const {done, /** @type {Uint8Array} */ value} = await reader.read();
  1611.                     if (done) {
  1612.                         break;
  1613.                     }
  1614.                     loaded += value.length;
  1615.                     try {
  1616.                         onProgress({loaded, ...onProgressProps});
  1617.                     } catch (e) {
  1618.                         console.error("[onProgress]:", e);
  1619.                     }
  1620.                     controller.enqueue(value);
  1621.                 }
  1622.                 controller.close();
  1623.                 reader.releaseLock();
  1624.             },
  1625.             cancel() {
  1626.                 void reader.cancel();
  1627.             }
  1628.         });
  1629.         return new ResponseEx(readableStream, response);
  1630.     }
  1631.     class ResponseEx extends Response {
  1632.         [Symbol.toStringTag] = "ResponseEx";
  1633.  
  1634.         constructor(body, {headers, status, statusText, url, redirected, type}) {
  1635.             super(body, {
  1636.                 status, statusText, headers: {
  1637.                     ...headers,
  1638.                     "content-type": headers.get("content-type").split("; ")[0] // Fixes Blob type ("text/html; charset=UTF-8") in TM
  1639.                 }
  1640.             });
  1641.             this._type = type;
  1642.             this._url = url;
  1643.             this._redirected = redirected;
  1644.             this._headers = headers; // `HeadersLike` is more user-friendly for debug than the original `Headers` object
  1645.         }
  1646.         get redirected() { return this._redirected; }
  1647.         get url() { return this._url; }
  1648.         get type() { return this._type || "basic"; }
  1649.         /** @returns {HeadersLike} */
  1650.         get headers() { return this._headers; }
  1651.     }
  1652.  
  1653.     return {
  1654.         sleep, fetchResource, extensionFromMime, downloadBlob, dateToDayDateString,
  1655.         addCSS,
  1656.         getCookie,
  1657.         throttle, throttleWithResult,
  1658.         xpath, xpathAll,
  1659.         responseProgressProxy,
  1660.     }
  1661. }
  1662.  
  1663. // ---------------------------------------------------------------------------------------------------------------------
  1664. // ---------------------------------------------------------------------------------------------------------------------