Imgur numbered images

Numbers image galeries on Imgur

ही स्क्रिप्ट इंस्टॉल करण्यासाठी तुम्हाला Tampermonkey, Greasemonkey किंवा Violentmonkey यासारखे एक्स्टेंशन इंस्टॉल करावे लागेल.

You will need to install an extension such as Tampermonkey to install this script.

ही स्क्रिप्ट इंस्टॉल करण्यासाठी तुम्हाला Tampermonkey किंवा Violentmonkey यासारखे एक्स्टेंशन इंस्टॉल करावे लागेल..

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

ही स्क्रिप्ट इंस्टॉल करण्यासाठी तुम्हाला Tampermonkey यासारखे एक्स्टेंशन इंस्टॉल करावे लागेल..

ही स्क्रिप्ट इंस्टॉल करण्यासाठी तुम्हाला एक युझर स्क्रिप्ट व्यवस्थापक एक्स्टेंशन इंस्टॉल करावे लागेल.

(माझ्याकडे आधीच युझर स्क्रिप्ट व्यवस्थापक आहे, मला इंस्टॉल करू द्या!)

ही स्टाईल इंस्टॉल करण्यासाठी तुम्हाला Stylus सारखे एक्स्टेंशन इंस्टॉल करावे लागेल.

ही स्टाईल इंस्टॉल करण्यासाठी तुम्हाला Stylus सारखे एक्स्टेंशन इंस्टॉल करावे लागेल.

ही स्टाईल इंस्टॉल करण्यासाठी तुम्हाला Stylus सारखे एक्स्टेंशन इंस्टॉल करावे लागेल.

ही स्टाईल इंस्टॉल करण्यासाठी तुम्हाला एक युझर स्टाईल व्यवस्थापक इंस्टॉल करावे लागेल.

ही स्टाईल इंस्टॉल करण्यासाठी तुम्हाला एक युझर स्टाईल व्यवस्थापक इंस्टॉल करावे लागेल.

ही स्टाईल इंस्टॉल करण्यासाठी तुम्हाला एक युझर स्टाईल व्यवस्थापक इंस्टॉल करावे लागेल.

(माझ्याकडे आधीच युझर स्टाईल व्यवस्थापक आहे, मला इंस्टॉल करू द्या!)

// ==UserScript==
// @name        Imgur numbered images
// @description Numbers image galeries on Imgur
// @version     1
// @namespace   powertomato.ovh
// @match       https://imgur.com/gallery/*
// @grant       none
// ==/UserScript==
var script = document.createElement("script");
document.head.append(script);
script.textContent = `
function numberItems(images) {
    var s = document.getElementById('numberItems');
    if(s) s.parentNode.removeChild(s);
    var rules = [
      '.Gallery-Content--mediaContainer{position:relative;}',
      '.Gallery-Content--mediaContainer:after{position:absolute;top:0.5em;right:100%;padding:0.5em;border-radius:3px 0 0 3px;background:#2c2f34;}'
    ];
    for(var i = 0; i < images.length; i++) {
      rules.push(\`.Gallery-Content--mediaContainer:nth-of-type(\${i+1}):after{content:"#\${i+1}\\\";}\`);
    }
    s = document.createElement('style');
    s.setAttribute('id','numberItems');
    s.appendChild(document.createTextNode(rules.join('\\n')));
    document.head.appendChild(s);
    waitForChange(numberItems);
  }
  var len = null;
  var postId = null;
  function waitForChange(fn) {
    let images = document.querySelectorAll(".Gallery-Content--mediaContainer");
    let currentPostId = JSON.parse(window.postDataJSON)["id"];
    if(len != images.length || postId != currentPostId) {
      len = images.length;
      postId = currentPostId;
      fn(images);
    } else {
      setTimeout(function() { waitForChange(fn) }, 50)
    }
  };
  waitForChange(numberItems);
`;