`;
// Attach listeners using the specific IDs
panelElement.querySelector(`#${SCRIPT_ID}-save-settings`)?.addEventListener('click', () => this.handleSaveClick(panelElement));
panelElement.querySelector(`#${SCRIPT_ID}-purge-cache`)?.addEventListener('click', () => this.handlePurgeClick(panelElement));
}
// Called by STM when the tab is activated
activatePanel(panelElement) {
Logger.log(`STM Activating panel for ${SCRIPT_ID}`);
const contentWrapper = panelElement.querySelector(`#${SCRIPT_ID}-panel-content`);
if (!contentWrapper) return;
// Update input values from current settings
const expiryInput = contentWrapper.querySelector(`#${SCRIPT_ID}-cache-expiry`);
const thumbCheckbox = contentWrapper.querySelector(`#${SCRIPT_ID}-show-thumbnails`);
const saveStatusSpan = contentWrapper.querySelector(`#${SCRIPT_ID}-save-status`);
const purgeStatusSpan = contentWrapper.querySelector(`#${SCRIPT_ID}-purge-status`);
if (expiryInput) expiryInput.value = this.settings.cacheExpiryDays;
if (thumbCheckbox) thumbCheckbox.checked = this.settings.showThumbnails;
// Clear status messages on activation
if (saveStatusSpan) saveStatusSpan.textContent = '';
if (purgeStatusSpan) purgeStatusSpan.textContent = '';
}
async handleSaveClick(panelElement) {
const contentWrapper = panelElement.querySelector(`#${SCRIPT_ID}-panel-content`);
if (!contentWrapper) { Logger.error("Cannot find panel content for saving."); return; }
const expiryInput = contentWrapper.querySelector(`#${SCRIPT_ID}-cache-expiry`);
const thumbCheckbox = contentWrapper.querySelector(`#${SCRIPT_ID}-show-thumbnails`);
const statusSpan = contentWrapper.querySelector(`#${SCRIPT_ID}-save-status`);
if (!expiryInput || !thumbCheckbox || !statusSpan) { Logger.error("Missing settings elements in panel."); return; }
const days = parseInt(expiryInput.value, 10);
if (isNaN(days) || days <= 0 || !Number.isInteger(days)) {
this.showStatus(statusSpan, 'Invalid number of days!', 'red');
Logger.warn('Attempted to save invalid cache expiry days:', expiryInput.value);
return;
}
// Update settings via the SettingsManager instance
this.settings.cacheExpiryDays = days;
this.settings.showThumbnails = thumbCheckbox.checked;
await this.settings.save();
this.showStatus(statusSpan, 'Settings saved!', 'lime');
Logger.log(`Settings saved via UI: Cache expiry ${days} days, Show Thumbnails ${thumbCheckbox.checked}.`);
// Apply thumbnail setting change immediately
if (!this.settings.showThumbnails) {
// Hide any currently visible thumbnail popup if setting is disabled
const thumbnailPreview = window.ytle?.thumbnailPreview; // Access instance if exposed
thumbnailPreview?.hide();
}
}
async handlePurgeClick(panelElement) {
const contentWrapper = panelElement.querySelector(`#${SCRIPT_ID}-panel-content`);
if (!contentWrapper) { Logger.error("Cannot find panel content for purging."); return; }
const statusSpan = contentWrapper.querySelector(`#${SCRIPT_ID}-purge-status`);
if (!statusSpan) { Logger.error("Missing purge status element."); return; }
if (!confirm('Are you sure you want to purge the entire YouTube title cache?\nThis cannot be undone and will trigger re-fetching of all titles.')) {
this.showStatus(statusSpan, 'Purge cancelled.', 'grey');
return;
}
this.showStatus(statusSpan, 'Purging cache...', 'orange');
const success = await this.cache.purgeAll();
if (success) {
this.showStatus(statusSpan, 'Cache purged! Re-enhancing links...', 'lime');
// Trigger a re-enhancement of all known links
await this.enhancer.reEnhanceAll();
this.showStatus(statusSpan, 'Cache purged! Re-enhancement complete.', 'lime', 3000); // Update message after re-enhancement
} else {
this.showStatus(statusSpan, 'Purge failed!', 'red');
}
}
showStatus(spanElement, message, color, duration = 3000) {
if (!spanElement) return;
spanElement.textContent = message;
spanElement.style.color = color;
// Clear message after duration, only if the message hasn't changed
setTimeout(() => {
if (spanElement.textContent === message) {
spanElement.textContent = '';
spanElement.style.color = 'var(--settings-text, #ccc)'; // Reset color
}
}, duration);
}
// --- Updated STM Registration with Timeout ---
async registerWithSTM() {
if (this.stmRegistrationAttempted) {
Logger.log('STM registration already attempted, skipping.');
return;
}
this.stmRegistrationAttempted = true;
let stmAttempts = 0;
const MAX_STM_ATTEMPTS = 20; // 20 attempts
const STM_RETRY_DELAY_MS = 250; // 250ms delay
const MAX_WAIT_TIME_MS = MAX_STM_ATTEMPTS * STM_RETRY_DELAY_MS; // ~5 seconds total
const checkAndRegister = () => {
stmAttempts++;
// Use Logger.log for debugging attempts if needed
// Logger.log(`STM check attempt ${stmAttempts}/${MAX_STM_ATTEMPTS}...`);
// *** Check unsafeWindow directly ***
if (typeof unsafeWindow !== 'undefined'
&& typeof unsafeWindow.SettingsTabManager !== 'undefined'
&& typeof unsafeWindow.SettingsTabManager.ready !== 'undefined')
{
Logger.log('Found SettingsTabManager on unsafeWindow. Proceeding with registration...');
// Found it, call the async registration function, but don't wait for it here.
// Let the rest of the script initialization continue.
performStmRegistration().catch(err => {
Logger.error("Async registration with STM failed after finding it:", err);
// Even if registration fails *after* finding STM, we proceed without the panel.
});
// STM found (or at least its .ready property), stop polling.
return; // Exit the polling function
}
// STM not found/ready yet, check if we should give up
if (stmAttempts >= MAX_STM_ATTEMPTS) {
Logger.warn(`SettingsTabManager not found or not ready after ${MAX_STM_ATTEMPTS} attempts (${(MAX_WAIT_TIME_MS / 1000).toFixed(1)} seconds). Proceeding without settings panel.`);
// Give up polling, DO NOT call setTimeout again.
return; // Exit the polling function
}
// STM not found, limit not reached, schedule next attempt
// Optional: Log if STM exists but .ready is missing
// if (typeof unsafeWindow !== 'undefined' && typeof unsafeWindow.SettingsTabManager !== 'undefined') {
// Logger.log('Found SettingsTabManager on unsafeWindow, but .ready property is missing. Waiting...');
// } else {
// Logger.log('SettingsTabManager not found on unsafeWindow or not ready yet. Waiting...');
// }
setTimeout(checkAndRegister, STM_RETRY_DELAY_MS); // Retry after a delay
};
const performStmRegistration = async () => {
// This function now only runs if STM.ready was detected
try {
// *** Access via unsafeWindow ***
// Ensure SettingsTabManager and .ready still exist before awaiting
if (typeof unsafeWindow?.SettingsTabManager?.ready === 'undefined') {
// Should not happen if called correctly, but check defensively
Logger.error('SettingsTabManager.ready disappeared before registration could complete.');
return; // Cannot register
}
const STM = await unsafeWindow.SettingsTabManager.ready;
// *** End Access via unsafeWindow ***
Logger.log('SettingsTabManager ready, registering tab...');
const registrationSuccess = STM.registerTab({
scriptId: SCRIPT_ID,
tabTitle: SCRIPT_NAME,
order: 110, // Keep your desired order
onInit: this.initializePanel.bind(this),
onActivate: this.activatePanel.bind(this)
});
if (registrationSuccess) {
Logger.log(`Tab registration request sent successfully for ${SCRIPT_ID}.`);
} else {
Logger.warn(`STM registration for ${SCRIPT_ID} returned false (tab might already exist or other issue).`);
}
} catch (err) {
Logger.error('Failed during SettingsTabManager.ready await or registerTab call:', err);
// No need to retry here, just log the failure.
}
};
// Start the check/wait process *asynchronously*.
// This allows the main script initialization to continue immediately.
checkAndRegister();
}
}
// --- Main Application Class ---
class YouTubeLinkEnhancerApp {
constructor() {
this.settingsManager = new SettingsManager();
this.titleCache = new TitleCache(this.settingsManager);
this.apiFetcher = new ApiFetcher();
this.linkEnhancer = new LinkEnhancer(this.titleCache, this.apiFetcher, this.settingsManager);
this.thumbnailPreview = new ThumbnailPreview(this.settingsManager, this.apiFetcher);
this.settingsUI = new SettingsUI(this.settingsManager, this.titleCache, this.linkEnhancer);
this.observer = null;
// Expose instances for debugging/potential external interaction (optional)
// Be cautious with exposing internal state/methods
window.ytle = {
settings: this.settingsManager,
cache: this.titleCache,
enhancer: this.linkEnhancer,
thumbnailPreview: this.thumbnailPreview,
ui: this.settingsUI
};
}
async initialize() {
Logger.log('Initializing...');
// 1. Load settings
await this.settingsManager.load();
// 2. Add styles & create UI elements
this.linkEnhancer.addStyles();
this.thumbnailPreview.createPopupElement();
// 3. Attach global listeners
this.thumbnailPreview.attachListeners();
// 4. Register settings UI
await this.settingsUI.registerWithSTM();
// 5. Initial scan & process existing links
Logger.log('Running initial link processing...');
const initialLinks = this.linkEnhancer.findLinksInNode(document.body);
await this.linkEnhancer.processLinks(initialLinks);
Logger.log('Initial processing complete.');
// 6. Setup MutationObserver
this.setupObserver();
Logger.log('Initialization complete.');
}
setupObserver() {
this.observer = new MutationObserver(async (mutationsList) => {
let linksToProcess = new Set();
for (const mutation of mutationsList) {
if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
for (const addedNode of mutation.addedNodes) {
// Only process element nodes
if (addedNode.nodeType === Node.ELEMENT_NODE) {
const foundLinks = this.linkEnhancer.findLinksInNode(addedNode);
foundLinks.forEach(link => {
// Add link if it's potentially enhanceable (no videoId yet, or failed/not enhanced)
if (!link.dataset.videoId || !link.dataset.ytEnhanced || link.dataset.ytFailed) {
linksToProcess.add(link);
}
});
}
}
}
// Optional: Handle attribute changes if needed (e.g., href changes on existing links)
// else if (mutation.type === 'attributes' && mutation.attributeName === 'href') {
// const targetLink = mutation.target;
// if (targetLink.matches && targetLink.matches('.divMessage a') && targetLink.closest('.divMessage')) {
// // Handle potential re-enhancement if href changed
// delete targetLink.dataset.ytEnhanced;
// delete targetLink.dataset.ytFailed;
// delete targetLink.dataset.videoId;
// targetLink.classList.remove('youtubelink');
// linksToProcess.add(targetLink);
// }
//}
}
if (linksToProcess.size > 0) {
// Debounce slightly? Or process immediately? Immediate is simpler.
Logger.log(`Observer detected ${linksToProcess.size} new/updated potential links.`);
await this.linkEnhancer.processLinks([...linksToProcess]);
}
});
this.observer.observe(document.body, {
childList: true,
subtree: true,
// attributes: true, // Uncomment if you want to observe href changes
// attributeFilter: ['href'] // Only observe href attribute changes
});
Logger.log('MutationObserver started.');
}
}
// --- Script Entry Point ---
const app = new YouTubeLinkEnhancerApp();
app.initialize().catch(err => {
Logger.error("Initialization failed:", err);
});
})();