Display the alt text of images on the Rank V6 page of Midjourney
// ==UserScript==
// @name Display Image Alt Text on Rank V6
// @namespace http://tampermonkey.net/
// @version 2023-12-16
// @description Display the alt text of images on the Rank V6 page of Midjourney
// @author GuiTx - ChatGPT
// @match https://www.midjourney.com/rank-v6
// @icon https://www.google.com/s2/favicons?sz=64&domain=midjourney.com
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
// Function to add alt text div to an image
function addAltTextToImage(image) {
if (image.parentNode.classList.contains('alt-text-added')) {
return; // Skip if alt text already added
}
// Create a new div element to hold the alt text
var altTextDiv = document.createElement('div');
altTextDiv.textContent = image.alt;
altTextDiv.style.cssText = `
position: absolute;
top: 0;
left: 0;
color: white;
background-color: rgba(0, 0, 0, 0.7);
padding: 5px;
border-radius: 5px;
font-size: 12px;
max-width: 100%;
word-wrap: break-word;
`;
// Position the div over the image
var containerDiv = document.createElement('div');
containerDiv.style.cssText = 'position: relative; display: inline-block;';
image.parentNode.insertBefore(containerDiv, image);
containerDiv.appendChild(image);
containerDiv.appendChild(altTextDiv);
containerDiv.classList.add('alt-text-added');
}
// Observer to handle dynamically loaded images
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
mutation.addedNodes.forEach(function(node) {
if (node.nodeName === 'IMG' && node.alt) {
addAltTextToImage(node);
}
});
});
});
// Start observing the body for added nodes
observer.observe(document.body, { childList: true, subtree: true });
// Initial run for images already on the page
document.querySelectorAll('img[alt]').forEach(addAltTextToImage);
})();