User:Ilikecomputers/cosmos.js

//A very hackey way to fix a niche styling issue:
//Example markup:
//  * This is a bullet point
//  ** {{quote|this is a quote}}
//  ** This is a bullet point after a quote <-- this will have double bullet points
document.querySelectorAll('table').forEach(function (e) {
    if (e.nextElementSibling && e.nextElementSibling.nodeName === 'UL') {
     var sibling = e.nextElementSibling;
     if (sibling.childNodes[0].childNodes[0].nodeName === 'UL') {
     sibling.childNodes[0].classList.add('nodoublebullet');
     }
    }
 })
 document.styleSheets[0].insertRule(".nodoublebullet::marker {content: ''}");
 
 //combines the function of the toggle spoiler and spoiler hover gadgets
 //hover over spoilers to reveal them, they'll disappear after the cursor leaves the box
 //click on spoilers to permanently reveal them, then click on them again to hide them
 //also fixes hyperlinks in spoilers visible by default in the cosmos skin
 document.querySelectorAll('a').forEach(function (e) {if (e.parentNode.classList.contains('spoiler')) e.style.color = 'white'});
 document.querySelectorAll('.spoiler').forEach(function (e) {
     e.classList.remove('spoilerhidden'); //this fidgety hack removes the !important colour rule added by the spoilerhidden class
     e.style.color = 'white';
     e.addEventListener('mouseover', function () {
        e.childNodes.forEach(function (f) {
            if (f.nodeName === 'A') {
                f.style.color = 'rgb(6, 69, 173)';
            }
        });
         e.style.color = 'black';
     });
     e.addEventListener('mouseout', function () {
         e.style.color = 'white';
         e.childNodes.forEach(function (f) {
            if (f.nodeName === 'A') {
                f.style.color = 'white';
            }
        });
     })
     e.addEventListener('click', function () {
         if (e.classList.contains('spoilerRevealed')) {
             e.classList.remove('spoilerRevealed');
         } else {
             e.classList.add('spoilerRevealed');
         }
     })
 })
 document.styleSheets[0].insertRule(".spoilerRevealed {color: black !important}");
 document.styleSheets[0].insertRule(".spoiler {cursor: pointer}");