Shows Bloomberg article footnotes in a popup similar to Wikipedia
// ==UserScript==
// @name Bloomberg Footnote Popup
// @version 1.1
// @description Shows Bloomberg article footnotes in a popup similar to Wikipedia
// @author https://greasyfork.org/en/users/1390485-fdsaasdf
// @match https://www.bloomberg.com/*
// @grant none
// @license MIT
// @namespace https://greasyfork.org/users/1390485
// ==/UserScript==
(function() {
'use strict';
// Styles for the popup
const styles = `
.citation-popup {
position: absolute;
max-width: 300px;
background: white;
border: 1px solid #ccc;
border-radius: 4px;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
padding: 12px;
font-size: 14px;
line-height: 1.4;
z-index: 1000;
display: none;
}
.citation-popup a {
color: #2962ff;
text-decoration: underline;
}
.citation-popup a:hover {
text-decoration: none;
}
`;
// Add styles to the document
const styleSheet = document.createElement('style');
styleSheet.textContent = styles;
document.head.appendChild(styleSheet);
// Create popup element
const popup = document.createElement('div');
popup.className = 'citation-popup';
document.body.appendChild(popup);
// Function to position popup near the citation link
function positionPopup(link) {
const rect = link.getBoundingClientRect();
const scrollX = window.scrollX || window.pageXOffset;
const scrollY = window.scrollY || window.pageYOffset;
// Position popup below and slightly to the right of the citation
popup.style.left = (rect.left + scrollX) + 'px';
popup.style.top = (rect.bottom + scrollY + 5) + 'px';
// Adjust position if popup would go off-screen
const popupRect = popup.getBoundingClientRect();
if (popupRect.right > window.innerWidth) {
popup.style.left = (window.innerWidth - popupRect.width - 10) + 'px';
}
}
// Function to get citation text from the footnotes section
function getCitationText(citationId) {
// Remove 'inline-' prefix to get the footer reference ID
const footerRefId = citationId.replace('inline-', 'footer-');
const footnote = document.getElementById(footerRefId);
if (footnote) {
// Clone the footnote to preserve its structure
const footnoteClone = footnote.cloneNode(true);
// Remove any "View in article" links
const viewInArticleLinks = footnoteClone.querySelectorAll('a[href^="#inline-ref"]');
viewInArticleLinks.forEach(link => link.remove());
// Remove the counter div by matching the class pattern
const counter = footnoteClone.querySelector('[class*="FootnoteItem_counter-"]');
if (counter) {
counter.remove();
}
// Get the div that contains all the paragraphs
const contentDiv = footnoteClone.querySelector('div');
if (contentDiv) {
// Replace image placeholders with a more readable format
const imgPlaceholders = contentDiv.querySelectorAll('p[data-component="paragraph"]');
imgPlaceholders.forEach(p => {
if (p.textContent.includes('[imgviz')) {
p.textContent = '[Image]';
}
});
return contentDiv.innerHTML.trim();
}
return footnoteClone.innerHTML.trim();
}
return 'Citation not found';
}
// Function to show popup
function showPopup(citationId, link) {
const citationHtml = getCitationText(citationId);
popup.innerHTML = citationHtml;
popup.style.display = 'block';
positionPopup(link);
}
// Function to hide popup with delay for smoother UX
let hideTimeout;
function hidePopup() {
hideTimeout = setTimeout(() => {
popup.style.display = 'none';
}, 100); // Small delay to allow for mouse movement between link and popup
}
// Function to cancel hide if mouse moves to popup
function cancelHide() {
if (hideTimeout) {
clearTimeout(hideTimeout);
}
}
// Find all citation links
function initializeCitationLinks() {
// Updated selector to match Bloomberg's HTML structure
const citationLinks = document.querySelectorAll('a[data-component="footnote-link"]');
citationLinks.forEach(link => {
// Show popup on hover
link.addEventListener('mouseenter', (e) => {
cancelHide();
showPopup(link.id, link);
});
// Start hide timer when mouse leaves
link.addEventListener('mouseleave', hidePopup);
// Prevent default link behavior
link.addEventListener('click', (e) => {
e.preventDefault();
});
});
}
// Add event listeners to the popup itself
popup.addEventListener('mouseenter', cancelHide);
popup.addEventListener('mouseleave', hidePopup);
// Initialize when DOM is ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initializeCitationLinks);
} else {
initializeCitationLinks();
}
// Handle dynamic content loading (if Bloomberg uses AJAX)
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.addedNodes.length) {
initializeCitationLinks();
}
});
});
observer.observe(document.body, {
childList: true,
subtree: true
});
})();