User:Ilikecomputers/common.js

//A very hackey way to fix a niche styling issue: //Example markup: // * This is a bullet point // ** "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;        var curSibling = sibling.childNodes[0];        while (curSibling.childNodes.length > 0 && curSibling.childNodes[0].nodeName === 'UL') {            curSibling.classList.add('nodoublebullet');            curSibling = curSibling.childNodes[0].childNodes[0];        }    } }); document.styleSheets[0].insertRule(".nodoublebullet::marker {content: ''}");

/* SPOILER ENHANCER SUITE 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 adds a custom "Show all spoilers" button (only tested on vector 2022) allows you to toggle all spoilers with Ctrl + Shift + S also fixes hyperlinks in spoilers visible by default in the cosmos skin function isContainedInSpoiler(e) { if (e.parentNode.classList.contains('spoiler')) { return true; } if (e.parentNode.nodeName === 'BODY') { return false; } else { return isContainedInSpoiler(e.parentNode); } } document.querySelectorAll('a').forEach(function (e) { if (isContainedInSpoiler(e)) e.style.color = 'white';}); function changeLinksColor(showLink, element) { // deals with hyperlinks inside spoilers element.childNodes.forEach(function (f) {   	if (f.style) {            f.style.color = showLink ? '' : 'white';    	}        if (f.childNodes.length > 0) {            changeLinksColor(showLink, f);        }    }); } var spoilersRevealed = false; function toggleAllSpoilers { spoilersRevealed = !spoilersRevealed; document.querySelectorAll('.spoiler').forEach(function (e) {		if (spoilersRevealed) {			e.classList.add('spoilerRevealed');		} else {			e.classList.remove('spoilerRevealed');		}		changeLinksColor(spoilersRevealed, e);	}); toggleSpoilers.textContent = spoilersRevealed ? "Hide all spoilers (Ctrl + Shift + S)" : "Show all spoilers (Ctrl + Shift + S)"; } //allows toggling of spoilers with Ctrl + Shift + S document.body.addEventListener('keydown', function (e) {	if (e.shiftKey && e.ctrlKey && e.key === 'S') {		e.preventDefault;		toggleAllSpoilers;	} }); //the "show all spoilers" button, and elements needed to make it fit into the vector 2022 skin var toggleSpoilers = document.createElement('a'); toggleSpoilers.textContent = "Show all spoilers (Ctrl + Shift + S)"; toggleSpoilers.addEventListener('click', toggleAllSpoilers);

var toggleSpoilersLi = document.createElement('li'); toggleSpoilersLi.classList.add('mw-list-item'); toggleSpoilersLi.appendChild(toggleSpoilers);

try { document.querySelector('#p-navigation').childNodes[3].childNodes[1].appendChild(toggleSpoilersLi); } catch (e){ console.log("Oops! It looks like the toggle spoiler button cannot find a place!"); } 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  { changeLinksColor(true, e); e.style.color = 'black'; });   e.addEventListener('mouseout', function  { e.style.color = 'white'; if (!e.classList.contains('spoilerRevealed')) { changeLinksColor(false, e); }   });    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}");