82 lines
2.5 KiB
JavaScript
82 lines
2.5 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log("🦶🦶🦶🦶🦶 FOOTNOTES LOADED 🦶🦶🦶🦶🦶🦶")
|
|
|
|
const footnoteRefs = document.querySelectorAll('.footref')
|
|
|
|
footnoteRefs.forEach(ref => {
|
|
const footnoteId = ref.href.split('#')[1]
|
|
ref.setAttribute('data-footnote-id', footnoteId)
|
|
ref.href = 'javascript:void(0)';
|
|
|
|
ref.addEventListener('mouseenter', function() {
|
|
// Find footnote element
|
|
const footnoteId = this.getAttribute('data-footnote-id')
|
|
|
|
const footnoteElement = document.getElementById(footnoteId).parentElement.nextElementSibling.children[0]
|
|
|
|
if (footnoteElement) {
|
|
// Create tooltip container
|
|
const tooltip = document.createElement('div');
|
|
tooltip.className = 'footnote-tooltip'
|
|
tooltip.innerHTML = footnoteElement.innerHTML
|
|
|
|
// Position tooltip
|
|
const rect = this.getBoundingClientRect();
|
|
tooltip.style.position = 'absolute'
|
|
tooltip.style.top = (rect.bottom + window.scrollY + 5) + 'px'
|
|
tooltip.style.left = rect.left + 'px'
|
|
|
|
// Add to page
|
|
document.body.appendChild(tooltip)
|
|
|
|
// Store reference for cleanup
|
|
this._tooltip = tooltip
|
|
}
|
|
});
|
|
|
|
ref.addEventListener('mouseleave', function() {
|
|
// Remove tooltip
|
|
if (this._tooltip) {
|
|
this._tooltip.remove()
|
|
this._tooltip = null
|
|
}
|
|
});
|
|
});
|
|
|
|
// Hide footnotes section
|
|
document.querySelector("#footnotes").style.display='none'
|
|
});
|
|
|
|
function formatDayOfYear(dayOfYear, year) {
|
|
const date = new Date(year, 0, dayOfYear);
|
|
|
|
return date.toLocaleDateString('en-GB', {
|
|
day: 'numeric',
|
|
month: 'short',
|
|
year: 'numeric'
|
|
});
|
|
}
|
|
|
|
let selectedCell = null;
|
|
|
|
function showHabitPopup(cell) {
|
|
var bodyHtml = cell.getAttribute('data-body');
|
|
var doy = cell.getAttribute('data-doy');
|
|
var activity = cell.getAttribute('data-activity');
|
|
var status = cell.getAttribute('data-status');
|
|
activity = activity.replace(/^dailies-/, '').replace(/^./, c => c.toUpperCase())
|
|
|
|
if (!bodyHtml) bodyHtml = "<span class='center'><i>This section intentionally left blank.</i></span>"
|
|
|
|
bodyHtml = `<h3><span class="grid ${status}">${activity}</span> — ${formatDayOfYear(parseInt(doy), 2025)}</h3> ${bodyHtml}`
|
|
|
|
document.getElementById('habitPopupContent').innerHTML = bodyHtml;
|
|
|
|
if (selectedCell) {
|
|
selectedCell.classList.remove('habitgrid-selected');
|
|
}
|
|
|
|
cell.classList.add('habitgrid-selected');
|
|
selectedCell = cell;
|
|
}
|