Console Cats

console-cats.js

// ==UserScript==
// @name         Console Cats
// @iconURL      https://cataas.com/cat?width=32&height=32
// @version      0.4
// @description  Gives you cats in the console
// @author       https://github.com/EdieLemoine
// @match        *://*/*
// @grant        none
// @downloadURL  https://gist.githubusercontent.com/EdieLemoine/4a2e8bccb8bacf679df3afbdde6e8023/raw/console-cats.js
// @updateURL    https://gist.githubusercontent.com/EdieLemoine/4a2e8bccb8bacf679df3afbdde6e8023/raw/console-cats.js
// ==/UserScript==

(function() {
  'use strict';

  const loadCat = (params) => {
    console.log('%cLoading a new cat...', 'color: #7776ff; font-weight: bold;');

    fetch(`https://cataas.com/cat${params ? '/' + params : ''}?type=sm`).then(res => res.blob()).then(res => {
      const reader = new FileReader();

      reader.readAsDataURL(res);
      reader.onloadend = () => {
        const base64 = reader.result;

        // get size from image
        const img = new Image();
        img.src = base64;
        img.onload = () => {
          console.log('%cCat loaded!', 'color: #33ff33; font-weight: bold;');

          console.log('%c ',
            `background: url(${base64}); background-size: contain; background-repeat: no-repeat; background-position: center; padding: ${img.height
            / 2}px ${img.width / 2}px;`);
        };
      };
    });
  };

  window.giveMeACat = (tag) => {
    loadCat(tag);
  };

  window.giveMeACatGif = () => {
    loadCat('gif');
  };

  window.giveMeACatSaying = (text) => {
    loadCat(`says/${text}`);
  };
})();