Skip to content

Instantly share code, notes, and snippets.

@ajhsu
Last active January 29, 2020 15:35
Show Gist options
  • Save ajhsu/b7a01b7b067043934f01b73128fee942 to your computer and use it in GitHub Desktop.
Save ajhsu/b7a01b7b067043934f01b73128fee942 to your computer and use it in GitHub Desktop.
// ==UserScript==
// @name Wikipedia TLDR
// @version 0.0.4
// @author AJ Hsu <im.ajhsu@gmail.com>
// @match https://*.wikipedia.org/*
// @grant GM_addStyle
// ==/UserScript==
window.addEventListener('load', function handlePageLoaded() {
window.removeEventListener('load', handlePageLoaded);
// Create DOM elements for TLDR section.
const tldrSection = document.createElement('section');
const h2 = document.createElement('h2');
h2.innerText = 'TL;DR';
const hr = document.createElement('hr');
// Find the first paragraph.
const firstParagraph = Array.from(
document.querySelectorAll(
'#mw-content-text > .mw-parser-output > p:not([class])'
)
).find((p) => {
// Exclude possible not-real-first-paragraph(s).
return (
// Not an empty paragraph.
p.textContent.trim() !== '' &&
// Not a coordinate info.
p.querySelector('#coordinates') === null
);
});
tldrSection.appendChild(h2);
tldrSection.appendChild(firstParagraph);
tldrSection.appendChild(hr);
firstParagraph.style = `
background-color: #fff9c48c;
padding: 20px;
font-family: Monaco;
`;
hr.style = `
margin-bottom: 20px;
`;
// Insert TLDR section at very first top of content section.
document
.querySelector('#mw-content-text')
.insertBefore(
tldrSection,
document.querySelector('#mw-content-text').firstChild
);
});
// Global styles
GM_addStyle(`
.mw-body-content p,
table {
font-family: Courier;
letter-spacing: -0.5px;
}
.mw-body-content h1,
.mw-body-content h2,
.mw-body-content h3,
.mw-body-content h4,
.mw-body-content h5 {
font-family: Courier;
letter-spacing: -1px;
font-weight: bold;
}
`);
@ajhsu
Copy link
Author

ajhsu commented Feb 1, 2019

Before TLRD

screenshot 2019-02-01 2 56 25

After TLDR

screenshot 2019-02-01 2 56 17

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment