Twitter logout on scroll

README.md

Twitter logout on scroll

Source

Idea by Benjamin Parry.

I’m in the market for a browser extension that launches the log out modal after 3 scrolls of my Twitter feed.

Paging @trysmudford

Dev mode

1. Download the three files into a folder
2. Visit chrome://extensions/
3. Toggle developer tools
4. Load unpackaged
5. Choose the folder

index.js

(() => {
  const MEGA_MODE = false;

  const debounce = (callback, wait) => {
    let timeout = null;
    return (...args) => {
      const next = () => callback(...args);
      clearTimeout(timeout);
      timeout = setTimeout(next, wait);
    };
  };

  const onScroll = debounce(
    () => {
      if (scrolled++ === 2) {
        window.removeEventListener('scroll', onScroll);

        if (MEGA_MODE) {
          const logoutLink = document.querySelector('[href*="/logout"]');
          if (logoutLink) {
            logoutLink.click();
          } else {
            window.location.href = '/logout';
          }
          return;
        }

        const popup = document.createElement('a');
        const style = document.createElement('style');
        style.innerHTML = `@keyframes logoutSlideDown {
          to {
            transform: translateY(0);
          }
        }`;

        popup.style = `position: fixed;
        z-index: 1000;
        top: 0;
        right: 0;
        transform: translateY(-100%);
        animation: 1s logoutSlideDown forwards;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
        background: #FFF;
        color: #333;
        padding: 0.5em 1em;
        box-shadow: 0 0 8px rgba(0,0,0,0.2);`;

        popup.innerText = 'Logout';
        popup.href = '/logout';
        document.body.appendChild(popup);
        document.body.appendChild(style);
      }
    },
    50,
    true
  );

  let scrolled = 0;
  window.addEventListener('scroll', onScroll);
})();

manifest.json

{
  "manifest_version": 2,
  "name": "Twitter logout on scroll",
  "version": "0.1",
  "content_scripts": [
    {
      "matches": [
        "https://twitter.com/*"
      ],
      "js": [
        "index.js"
      ]
    }
  ]
}

Try Mudford, you’re my hero! 👏