Hide Amazon Cart

Auto-hide annoying cart sidebar

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey, Greasemonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Userscripts.

За да инсталирате скрипта, трябва да инсталирате разширение като Tampermonkey.

За да инсталирате този скрипт, трябва да имате инсталиран скриптов мениджър.

(Вече имам скриптов мениджър, искам да го инсталирам!)

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

(Вече имам инсталиран мениджър на стиловете, искам да го инсталирам!)

// ==UserScript==
// @name        Hide Amazon Cart
// @namespace   https://github.com/spapadim
// @match       https://www.amazon.com/*
// @run-at      document-start
// @grant       none
// @version     1.0
// @author      [email protected]
// @description Auto-hide annoying cart sidebar
// ==/UserScript==

(function () {
  // Perform the actual DOM modification, assuming sidebar is loaded
  function hideSidebar() {
    var sidebar = document.querySelector("div#nav-flyout-ewc");

    if (!sidebar) {
      console.warn("No cart sidebar element found... skipping.");
      return
    }
    
    const ensureHidden = () => {
      if (sidebar.style.display != "none") {  // Avoid mutation infinite loop...
        console.info("Hiding Amazon cart sidebar")
        // Hide sidebar itself
        sidebar.style.display = "none";
        // Hide "arrow" (margin notch), if present/loaded
        var notchArrow = document.querySelector("div#nav-flyout-anchor");
        if (notchArrow) {
          notchArrow.style.display = "none";
        }
        // Remove HTML body padding (set equal to width of sidebar)
        document.querySelector("body").style.paddingRight = 0;
      }
    };

    // Hide now and...
    ensureHidden();

    // ...register event to re-hide whenever Amazon un-hides (mutation observer
    // is permanent, since sidebar placement/size seem to use JS, not just CSS...)
    const sidebarObserver = new MutationObserver((mutationList, observer) => {
      //console.info("Sidebar attr mutation:", mutationList);
      ensureHidden();
    });
    sidebarObserver.observe(
      sidebar, {
        childList: false,
        attributes: true,
        // attributeOldValue: true,
        attributeFilter: ["style"]
      }
    );
  }
  
  // We could run userscript at document-end instead of doing this, 
  // but then the cart is annoyingly visible for a second or so...
  const docObserver = new MutationObserver((mutationList, observer) => {
    //console.info("Document descendant mutation:", mutationList);
    // Search for sidebar div among all added DOM nodes
    var sidebars = mutationList.flatMap(
      mutation => Array.prototype.find.call(
        mutation.addedNodes, 
        node => node.matches && node.matches("div#nav-flyout-ewc")
      ) || []
    );
    if (sidebars.length > 0) {
      // It appeared, squash it!
      console.info("Detected sidebar div:", sidebars)
      docObserver.disconnect();
      hideSidebar();
    }
  });
  docObserver.observe(
    document, {
      subtree: true,
      childList: true,
      attributes: false,
      characterData: false
    }
  );
})();