User:Dispenser/alttextexplorer.js

/* If you want to use this script, simply add the following line to your Special:Mypage/monobook.js:

importScript('User:Dispenser/alttextexplorer.js'); // Linkback: User:Dispenser/alttextexplorer.js

  • (Please keep the comment so I can see how many people use this).
  • /

(function() {

return; // early exit - script is broken.

if(typeof(noaltcss) == 'undefined'){

appendCSS(".alt-block{background:#444; color:#fff; line-height:1.3em; font-size:0.8em; padding:2px; text-align:left;} .alt-block span{background:#444;}")

appendCSS(".alt-inline{border:1px solid #444; display:inline-block; position:relative;} .alt-inline div{background:#444; color:#fff; font-size:80%; position:absolute; top:0; display:none;; width:20em; z-index:15;} .alt-inline:hover div{display:block;}")

appendCSS("img.alt-nolink { border:2px solid sandybrown;}")

appendCSS("img.alt-none { border:2px solid red;}")

appendCSS("img.alt-nolink.alt-none, img.tex.alt-nolink { border:none;}")

}

var BlockNodes = /^(?:BR|BLOCKQUOTE|BUTTON|CENTER|DIV|H[1-6]|OL|UL|DL|TABLE|TR|TD|TH|P|PRE)$/

function addAlts() {

var image;

var bodyc = document.getElementById('bodyContent') || document.getElementById('content') || document.getElementById('mw_content')

var images = bodyc.getElementsByTagName('img')

for(var i=0; (image=images[i]); i++) {

// Skip skins or extensions icons

if(image.src.indexOf('/skins-1.5/') != -1 || image.src.indexOf('/extensions/') != -1)

continue

var useblock

var nt = image

var container = nt

while(true){

if(nt.nextSibling){

nt = nt.nextSibling

if(nt.nodeType==3){

if(/\S/.test(nt.nodeValue)){

useblock = false;

break;

}

}else if(nt.nodeType == 1){

useblock = BlockNodes.test( nt.tagName )

break;

}

} else {

// Assume that we are at the end of the elements

if(BlockNodes.test(container.parentNode.tagName)){

useblock = true;

break;

} else {

container = nt = container.parentNode;

}

}

}

/* Deal with geobox redpog elements */

if(useblock && container.parentNode.tagName == "DIV" && container.parentNode.style.position == "relative"){

if( container.parentNode.parentNode.tagName == "DIV" )

container = container.parentNode

else

useblock = false

}

/* Make changes */

if (image.alt == '') {

image.className += " alt-none";

} else if(useblock) {

var n = container.parentNode.insertBefore(document.createElement('div'), container.nextSibling);

n.appendChild(document.createElement('span')).appendChild(document.createTextNode(image.alt));

n.className = "alt-block";

n.style.width = (image.width - 2) + 'px';

} else {

var n = container.parentNode.insertBefore(document.createElement('span'), container);

n.appendChild(container);

n.className = "alt-inline"

n.appendChild(document.createElement('div')).appendChild(document.createTextNode(image.alt));

}

if(image.parentNode.tagName != 'A'){

image.className += " alt-nolink";

} else if(image.alt) {

var alt = escape(image.alt.replace(/ /g,'_'))

var a = image.src.match( new RegExp( RegExp.escape(alt)+"(|\\.\\w{3})$" ) )

if(a)

image.className += " alt-none"

}

}

}

if(doneOnloadHook) addAlts(); //if imported dynamically

else addOnloadHook(addAlts);

}());