// ==UserScript== // @name LinkedIn Tweeks // @namespace tweeks.io // @version 1.1 // @description Tune LinkedIn exactly how you want it // @author NextByte // @match https://www.linkedin.com/* // @grant GM_getValue // @grant GM_setValue // @grant GM_deleteValue // @grant GM_listValues // @run-at document-start // ==/UserScript== /* jshint esversion: 11 */ (function() { "use strict"; /** * Centralized logging utility */ const PREFIX = "LinkedIn Tweeks Userscript:"; /** * Standard log message * @param {...any} args */ function log(...args) { console.log(PREFIX, ...args); } /** * Debug log (disabled) * @param {...any} args */ function debug(...args) { void args; } /** * Warning message * @param {...any} args */ function warn(...args) { console.warn(PREFIX, ...args); } /** * Error message * @param {...any} args */ function error(...args) { console.error(PREFIX, ...args); } /** * Error with stack trace * @param {Error} err * @param {string} context */ function errorWithStack(err, context = "") { console.error(`${PREFIX} Error${context ? ` in ${context}` : ""}:`, err); if (err && err.stack) { console.error("Stack trace:", err.stack); } } /** * Simple event bus for coordinating between modules * Provides pub/sub pattern for decoupled communication */ class EventBus { constructor() { this.listeners = new Map; } /** * Subscribe to an event * @param {string} event - Event name * @param {Function} handler - Callback function * @returns {Function} Unsubscribe function */ subscribe(event, handler) { if (typeof handler !== "function") { warn("EventBus: Handler must be a function"); return () => {}; } if (!this.listeners.has(event)) { this.listeners.set(event, new Set); } this.listeners.get(event).add(handler); debug(`EventBus: Subscribed to "${event}"`); // Return unsubscribe function return () => { this.unsubscribe(event, handler); }; } /** * Unsubscribe from an event * @param {string} event * @param {Function} handler */ unsubscribe(event, handler) { if (this.listeners.has(event)) { this.listeners.get(event).delete(handler); debug(`EventBus: Unsubscribed from "${event}"`); // Clean up empty event sets if (this.listeners.get(event).size === 0) { this.listeners.delete(event); } } } /** * Emit an event with optional payload * @param {string} event * @param {any} payload */ emit(event, payload = null) { debug(`EventBus: Emitting "${event}"`, payload ? `with payload` : ""); if (!this.listeners.has(event)) { return; } const handlers = this.listeners.get(event); handlers.forEach(handler => { try { handler(payload); } catch (err) { warn(`EventBus: Error in handler for "${event}":`, err); } }); } /** * Subscribe to an event that fires only once * @param {string} event * @param {Function} handler * @returns {Function} Unsubscribe function */ once(event, handler) { const wrappedHandler = payload => { handler(payload); this.unsubscribe(event, wrappedHandler); }; return this.subscribe(event, wrappedHandler); } /** * Clear all listeners for an event (or all events if no event specified) * @param {string} [event] */ clear(event = null) { if (event) { this.listeners.delete(event); debug(`EventBus: Cleared listeners for "${event}"`); } else { this.listeners.clear(); debug("EventBus: Cleared all listeners"); } } /** * Get count of listeners for an event * @param {string} event * @returns {number} */ listenerCount(event) { return this.listeners.has(event) ? this.listeners.get(event).size : 0; } } // Export singleton instance const eventBus = new EventBus; // Event name constants for type safety const EVENTS = { // Application lifecycle APP_INIT: "app:init", APP_READY: "app:ready", APP_DESTROY: "app:destroy", // Settings events SETTINGS_LOADED: "settings:loaded", SETTINGS_UPDATED: "settings:updated", SETTINGS_RESET: "settings:reset", // Navigation events NAVIGATION_CHANGED: "navigation:changed", URL_CHANGED: "url:changed", // State events STATE_RESET: "state:reset", // UI events PANEL_OPENED: "panel:opened", PANEL_CLOSED: "panel:closed", TOAST_SHOW: "toast:show", ERROR_SHOW: "error:show", UI_MAIN_TOGGLE_DISABLED: "ui:main-toggle:disabled", UI_MAIN_TOGGLE_ENABLED: "ui:main-toggle:enabled", // Feature actions ACTION_UNFOLLOW_ALL: "action:unfollow-all", ACTION_UNFOLLOW_COMPLETE: "action:unfollow-all:complete", ACTION_SELECT_MESSAGES: "action:select-messages", ACTION_SELECT_MESSAGES_COMPLETE: "action:select-messages:complete", // Module lifecycle MODULE_FEED_INIT: "module:feed:init", MODULE_FEED_DESTROY: "module:feed:destroy", MODULE_JOBS_INIT: "module:jobs:init", MODULE_JOBS_DESTROY: "module:jobs:destroy", MODULE_MISC_INIT: "module:misc:init", MODULE_MISC_DESTROY: "module:misc:destroy", MODULE_TIMER_INIT: "module:timer:init", MODULE_TIMER_DESTROY: "module:timer:destroy", TIMER_EXPIRED: "timer:expired" }; /** * Constants and selectors for LinkedIn Tweeks Userscript * Centralized to facilitate maintenance when LinkedIn updates DOM */ // Schema version for settings migration const SCHEMA_VERSION = "v1"; // CSS class prefix to avoid conflicts with LinkedIn const CLASS_PREFIX = "linkedin-tweeks-us-"; // sessionStorage key for persisted timer state (per-tab) const TIMER_STORAGE_KEY = "linkedin-tweeks-timer-state"; // Feed post selectors const FEED_SELECTORS = [ '[data-id*="urn:li:activity"]', '[data-id*="urn:li:aggregate"]' ]; // Job listing selectors const JOB_SELECTORS = [ "[data-job-id]", "[data-occludable-job-id]", ".discovery-templates-vertical-list__list-item" ]; // Age filtering keywords - supports both old (1h •) and new (1h ago) LinkedIn formats const AGE_KEYWORDS = { hour: [ "h •", "h ago" ], day: [ "d •", "d ago" ], week: [ "w •", "w ago" ], month: [ "mo •", "mo ago" ], year: [ "y •", "y ago" ] }; // LinkedIn navigation URLs const URLS = { FEED: "https://www.linkedin.com/feed/", HOME: "https://www.linkedin.com/", JOBS: "https://www.linkedin.com/jobs/", MESSAGING: "/messaging/", NETWORK_MANAGER: "/mynetwork/network-manager/people-follow" }; // Sort by recent dropdown selectors const SORT_SELECTORS = { DROPDOWN_TRIGGER: "button.full-width.artdeco-dropdown__trigger.artdeco-dropdown__trigger--placement-bottom", RECENT_OPTION: "ul > li:nth-child(2) > div.artdeco-dropdown__item.artdeco-dropdown__item--is-dropdown" }; // Unfollow button selector const UNFOLLOW_BUTTON_SELECTOR = 'button[aria-label^="Click to stop"]'; // Timeout configurations (in milliseconds) const TIMEOUTS = { SELECTOR_WAIT: 1e4, // 10 seconds NAVIGATION_DEBOUNCE: 300, // 300ms URL_POLL_INTERVAL: 2e3, // 2 seconds FEED_INTERVAL_FALLBACK: 2e3, // 2 seconds JOBS_INTERVAL_FALLBACK: 2e3, // 2 seconds MISC_INTERVAL_FALLBACK: 2e3, // 2 seconds UNFOLLOW_DELAY: 150 }; // Default settings schema const DEFAULT_SETTINGS = { // Home section "main-toggle": true, "gentle-mode": true, "wide-mode": false, "dark-mode": false, "timer-enabled": false, "timer-duration": 5, "persist-timer": false, // Feed section "hide-whole-feed": false, "hide-by-age": "week", "feed-keywords": "", // Note: 'hide-polls' removed - LinkedIn's poll markup is unreliable "hide-videos": false, "hide-links": false, "hide-images": false, "hide-carousels": false, "hide-promoted": true, "hide-shared": false, "hide-followed": true, "hide-liked": true, "hide-other-reactions": false, "hide-commented-on": false, "hide-by-companies": true, "hide-by-people": false, "hide-suggested": true, "sort-by-recent": true, // Jobs section "job-keywords": "", "hide-promoted-jobs": false, "hide-job-guidance": false, "hide-ai-button": false, // Misc section "disable-postcount-prompt": false, "hide-linkedin-learning": true, "hide-advertisements": true, "hide-follow-recommendations": true, "hide-notification-count": false, "hide-profile-counters": false, "hide-community-panel": true, "hide-account-building": true, "hide-network-building": true, "hide-premium": true, "hide-news": false, "hide-bottom-messaging": false, // Internal initialized: `schema:${SCHEMA_VERSION}` }; // Settings metadata for validation const SETTINGS_METADATA = { "main-toggle": { type: "boolean", section: "home" }, "gentle-mode": { type: "boolean", section: "home" }, "wide-mode": { type: "boolean", section: "home" }, "dark-mode": { type: "boolean", section: "home" }, "timer-enabled": { type: "boolean", section: "home" }, "timer-duration": { type: "number", section: "home", min: 1, max: 120 }, "persist-timer": { type: "boolean", section: "home" }, "hide-whole-feed": { type: "boolean", section: "feed" }, "hide-by-age": { type: "select", section: "feed", options: [ "disabled", "hour", "day", "week", "month", "year" ] }, "feed-keywords": { type: "string", section: "feed" }, // Note: 'hide-polls' removed from schema - LinkedIn's poll markup is unreliable "hide-videos": { type: "boolean", section: "feed" }, "hide-links": { type: "boolean", section: "feed" }, "hide-images": { type: "boolean", section: "feed" }, "hide-carousels": { type: "boolean", section: "feed" }, "hide-promoted": { type: "boolean", section: "feed" }, "hide-shared": { type: "boolean", section: "feed" }, "hide-followed": { type: "boolean", section: "feed" }, "hide-liked": { type: "boolean", section: "feed" }, "hide-other-reactions": { type: "boolean", section: "feed" }, "hide-commented-on": { type: "boolean", section: "feed" }, "hide-by-companies": { type: "boolean", section: "feed" }, "hide-by-people": { type: "boolean", section: "feed" }, "hide-suggested": { type: "boolean", section: "feed" }, "sort-by-recent": { type: "boolean", section: "feed" }, "job-keywords": { type: "string", section: "jobs" }, "hide-promoted-jobs": { type: "boolean", section: "jobs" }, "hide-job-guidance": { type: "boolean", section: "jobs" }, "hide-ai-button": { type: "boolean", section: "jobs" }, "disable-postcount-prompt": { type: "boolean", section: "misc" }, "hide-linkedin-learning": { type: "boolean", section: "misc" }, "hide-advertisements": { type: "boolean", section: "misc" }, "hide-follow-recommendations": { type: "boolean", section: "misc" }, "hide-notification-count": { type: "boolean", section: "misc" }, "hide-profile-counters": { type: "boolean", section: "misc" }, "hide-community-panel": { type: "boolean", section: "misc" }, "hide-account-building": { type: "boolean", section: "misc" }, "hide-network-building": { type: "boolean", section: "misc" }, "hide-premium": { type: "boolean", section: "misc" }, "hide-news": { type: "boolean", section: "misc" }, "hide-bottom-messaging": { type: "boolean", section: "misc" }, initialized: { type: "string", section: "internal" } }; /** * Input sanitization utilities to prevent injection attacks * and ensure safe DOM operations */ /** * Sanitize keyword input: * - Trim whitespace * - Collapse multiple spaces * - Remove dangerous characters for DOM operations * @param {string} keyword * @returns {string} */ function sanitizeKeyword(keyword) { if (typeof keyword !== "string") return ""; return keyword.trim().replace(/\s+/g, " ").replace(/[\x00-\x1F\x7F]/g, ""); // Remove control characters } /** * Sanitize and parse comma-separated keyword list * @param {string} keywordString * @returns {string[]} */ function parseKeywords(keywordString) { if (typeof keywordString !== "string" || keywordString.trim() === "") { return []; } return keywordString.split(",").map(sanitizeKeyword).filter(k => k.length > 0); } /** * Sanitize settings value based on expected type * @param {any} value * @param {string} type - 'boolean', 'string', 'select', 'number' * @param {string[]} [options] - Valid options for select type * @param {number} [min] - Minimum value for number type * @param {number} [max] - Maximum value for number type * @returns {any} */ function sanitizeSettingValue(value, type, options = [], min = undefined, max = undefined) { switch (type) { case "boolean": return Boolean(value); case "string": return typeof value === "string" ? sanitizeKeyword(value) : ""; case "select": if (options.length > 0 && !options.includes(value)) { return options[0]; // Return first option as default } return value; case "number": { // Parse to number let num = typeof value === "number" ? value : parseInt(value, 10); // Check for NaN if (isNaN(num)) { // Return min if provided, otherwise 0 return min !== undefined ? min : 0; } // Clamp to min/max if provided if (min !== undefined && num < min) { return min; } if (max !== undefined && num > max) { return max; } return num; } default: return value; } } /** * Validate that a selector string is safe to use * @param {string} selector * @returns {boolean} */ function isValidSelector(selector) { if (typeof selector !== "string" || selector.trim() === "") { return false; } try { // Test if selector is valid by trying to query with it document.createDocumentFragment().querySelector(selector); return true; } catch (e) { return false; } } /** * Sanitize text content for safe text matching * Normalizes whitespace and removes invisible characters * @param {string} text * @returns {string} */ function sanitizeTextContent(text) { if (typeof text !== "string") return ""; return text.replace(/\s+/g, " ").replace(/[\x00-\x1F\x7F-\x9F]/g, "").trim(); } /** * GM API Compatibility Layer * Provides unified Promise-based interface for both modern (GM.*) and legacy (GM_*) APIs * This allows the script to run on both TamperMonkey (modern) and older Greasemonkey builds */ /** * Get a value from storage * @param {string} key * @param {*} defaultValue * @returns {Promise<*>} */ const gmGetValue = (key, defaultValue) => { // Legacy GM_getValue is synchronous, wrap in Promise if (typeof GM_getValue === "function") { return Promise.resolve(GM_getValue(key, defaultValue)); } // Modern GM.getValue returns a Promise if (typeof GM !== "undefined" && GM.getValue) { return GM.getValue(key, defaultValue); } // Fallback if neither API is available return Promise.resolve(defaultValue); }; /** * Set a value in storage * @param {string} key * @param {*} value * @returns {Promise} */ const gmSetValue = (key, value) => { // Legacy GM_setValue is synchronous, wrap in Promise if (typeof GM_setValue === "function") { GM_setValue(key, value); return Promise.resolve(); } // Modern GM.setValue returns a Promise if (typeof GM !== "undefined" && GM.setValue) { return GM.setValue(key, value); } // Fallback if neither API is available return Promise.resolve(); }; /** * Settings Manager * Handles storage, retrieval, validation, and change notifications for user settings */ class SettingsManager { constructor() { this.settings = { ...DEFAULT_SETTINGS }; this.initialized = false; } /** * Initialize settings from GM storage * @returns {Promise} */ async init() { try { log("Initializing settings..."); // Check if settings are already initialized const initialized = await gmGetValue("initialized", null); if (!initialized) { // First run - seed defaults log("First run detected, seeding default settings"); await this.seedDefaults(); } else { // Load existing settings await this.loadAll(); } this.initialized = true; eventBus.emit(EVENTS.SETTINGS_LOADED, this.settings); log("Settings initialized successfully"); } catch (err) { error("Failed to initialize settings:", err); throw err; } } /** * Seed default settings to GM storage * @returns {Promise} */ async seedDefaults() { try { const promises = Object.entries(DEFAULT_SETTINGS).map(([key, value]) => gmSetValue(key, value)); await Promise.all(promises); this.settings = { ...DEFAULT_SETTINGS }; log("Default settings seeded"); } catch (err) { error("Failed to seed defaults:", err); throw err; } } /** * Load all settings from GM storage * @returns {Promise} */ async loadAll() { try { // Load all values in parallel const keys = Object.keys(DEFAULT_SETTINGS); const promises = keys.map(async key => { const value = await gmGetValue(key, DEFAULT_SETTINGS[key]); return [ key, value ]; }); const entries = await Promise.all(promises); this.settings = Object.fromEntries(entries); log("All settings loaded from storage"); } catch (err) { error("Failed to load settings:", err); throw err; } } /** * Get a setting value with optional default * @param {string} key * @param {any} [fallback] * @returns {any} */ get(key, fallback = undefined) { if (key in this.settings) { return this.settings[key]; } if (fallback !== undefined) { return fallback; } return DEFAULT_SETTINGS[key]; } /** * Set a setting value with validation * @param {string} key * @param {any} value * @returns {Promise} Success */ async set(key, value) { try { // Validate key exists if (!(key in DEFAULT_SETTINGS)) { warn(`Unknown setting key: "${key}"`); return false; } // Get metadata for validation const metadata = SETTINGS_METADATA[key]; if (!metadata) { warn(`No metadata for setting: "${key}"`); return false; } // Sanitize and validate value const sanitizedValue = sanitizeSettingValue(value, metadata.type, metadata.options, metadata.min, metadata.max); // Store old value for change detection const oldValue = this.settings[key]; // Save to GM storage await gmSetValue(key, sanitizedValue); // Update local cache this.settings[key] = sanitizedValue; // Emit change event if value actually changed if (oldValue !== sanitizedValue) { eventBus.emit(EVENTS.SETTINGS_UPDATED, { key: key, value: sanitizedValue, oldValue: oldValue, allSettings: { ...this.settings } }); } return true; } catch (err) { error(`Failed to set "${key}":`, err); return false; } } /** * Set multiple settings at once * @param {Object} updates - Key-value pairs * @returns {Promise} Success */ async setMultiple(updates) { try { const promises = Object.entries(updates).map(([key, value]) => this.set(key, value)); const results = await Promise.all(promises); return results.every(result => result === true); } catch (err) { error("Failed to set multiple settings:", err); return false; } } /** * Reset a setting to its default value * @param {string} key * @returns {Promise} Success */ async reset(key) { if (key in DEFAULT_SETTINGS) { return await this.set(key, DEFAULT_SETTINGS[key]); } return false; } /** * Reset all settings to defaults * @returns {Promise} */ async resetAll() { try { log("Resetting all settings to defaults..."); await this.seedDefaults(); eventBus.emit(EVENTS.SETTINGS_RESET, this.settings); log("All settings reset"); } catch (err) { error("Failed to reset all settings:", err); throw err; } } /** * Get all current settings * @returns {Object} */ getAll() { return { ...this.settings }; } /** * Export settings as JSON string * @returns {string} */ export() { return JSON.stringify(this.settings, null, 2); } /** * Import settings from JSON string * @param {string} jsonString * @returns {Promise} Success */ async import(jsonString) { try { const imported = JSON.parse(jsonString); // Validate that imported data has valid keys const validKeys = Object.keys(imported).filter(key => key in DEFAULT_SETTINGS); if (validKeys.length === 0) { warn("No valid settings found in import data"); return false; } // Import only valid settings const updates = {}; validKeys.forEach(key => { updates[key] = imported[key]; }); await this.setMultiple(updates); log(`Imported ${validKeys.length} settings`); return true; } catch (err) { error("Failed to import settings:", err); return false; } } /** * Check if main toggle is enabled * @returns {boolean} */ isEnabled() { return this.get("main-toggle") === true; } /** * Check if gentle mode is enabled * @returns {boolean} */ isGentleMode() { return this.get("gentle-mode") === true; } /** * Get current mode ('hide' or 'dim') * @returns {string} */ getMode() { return this.isGentleMode() ? "dim" : "hide"; } } // Export singleton instance const settingsManager = new SettingsManager; /** * State Manager * Manages runtime state including observers, intervals, and counters * Provides reset functionality for navigation changes */ class StateManager { constructor() { this.reset(); } /** * Reset all runtime state * Note: Navigation watcher doesn't register with stateManager, so it persists */ reset() { debug("Resetting runtime state"); // Clear all intervals if (this.intervals) { this.intervals.forEach(intervalId => clearInterval(intervalId)); } // Disconnect all observers if (this.observers) { this.observers.forEach(observer => observer.disconnect()); } // Clear all timeouts if (this.timeouts) { this.timeouts.forEach(timeoutId => clearTimeout(timeoutId)); } // Reset state this.intervals = new Set; this.observers = new Set; this.timeouts = new Set; this.counters = {}; this.flags = {}; this.currentUrl = window.location.href; eventBus.emit(EVENTS.STATE_RESET); } /** * Register an interval * @param {number} intervalId */ addInterval(intervalId) { this.intervals.add(intervalId); debug(`Registered interval: ${intervalId}`); } /** * Clear and remove an interval * @param {number} intervalId */ removeInterval(intervalId) { if (this.intervals.has(intervalId)) { clearInterval(intervalId); this.intervals.delete(intervalId); debug(`Removed interval: ${intervalId}`); } } /** * Clear all intervals */ clearAllIntervals() { this.intervals.forEach(intervalId => clearInterval(intervalId)); this.intervals.clear(); debug("Cleared all intervals"); } /** * Register an observer * @param {MutationObserver|IntersectionObserver} observer */ addObserver(observer) { this.observers.add(observer); debug("Registered observer"); } /** * Disconnect and remove an observer * @param {MutationObserver|IntersectionObserver} observer */ removeObserver(observer) { if (this.observers.has(observer)) { observer.disconnect(); this.observers.delete(observer); debug("Removed observer"); } } /** * Disconnect all observers */ clearAllObservers() { this.observers.forEach(observer => observer.disconnect()); this.observers.clear(); debug("Cleared all observers"); } /** * Register a timeout * @param {number} timeoutId */ addTimeout(timeoutId) { this.timeouts.add(timeoutId); debug(`Registered timeout: ${timeoutId}`); } /** * Clear and remove a timeout * @param {number} timeoutId */ removeTimeout(timeoutId) { if (this.timeouts.has(timeoutId)) { clearTimeout(timeoutId); this.timeouts.delete(timeoutId); debug(`Removed timeout: ${timeoutId}`); } } /** * Clear all timeouts */ clearAllTimeouts() { this.timeouts.forEach(timeoutId => clearTimeout(timeoutId)); this.timeouts.clear(); debug("Cleared all timeouts"); } /** * Set a counter value * @param {string} name * @param {number} value */ setCounter(name, value) { this.counters[name] = value; } /** * Get a counter value * @param {string} name * @returns {number} */ getCounter(name) { return this.counters[name] || 0; } /** * Increment a counter * @param {string} name * @returns {number} New value */ incrementCounter(name) { this.counters[name] = (this.counters[name] || 0) + 1; return this.counters[name]; } /** * Reset a counter * @param {string} name */ resetCounter(name) { this.counters[name] = 0; } /** * Set a flag * @param {string} name * @param {boolean} value */ setFlag(name, value) { this.flags[name] = value; } /** * Get a flag * @param {string} name * @returns {boolean} */ getFlag(name) { return this.flags[name] || false; } /** * Toggle a flag * @param {string} name * @returns {boolean} New value */ toggleFlag(name) { this.flags[name] = !this.flags[name]; return this.flags[name]; } /** * Update current URL * @param {string} url */ setCurrentUrl(url) { this.currentUrl = url; } /** * Get current URL * @returns {string} */ getCurrentUrl() { return this.currentUrl; } /** * Get diagnostics for debugging * @returns {Object} */ getDiagnostics() { return { intervals: this.intervals.size, observers: this.observers.size, timeouts: this.timeouts.size, counters: { ...this.counters }, flags: { ...this.flags }, currentUrl: this.currentUrl }; } } // Export singleton instance const stateManager = new StateManager; /** * Navigation Watcher * Detects SPA navigation on LinkedIn using title observation and URL polling * Emits events when URL changes to trigger module re-initialization */ class NavigationWatcher { constructor() { this.lastUrl = window.location.href; this.observer = null; this.pollIntervalId = null; this.debounceTimeoutId = null; this.isInitialized = false; } /** * Initialize navigation watching */ init() { if (this.isInitialized) { warn("Navigation watcher already initialized"); return; } log("Initializing navigation watcher"); // Primary: Watch for title changes (reliable for LinkedIn SPA) this.observeTitle(); // Fallback: Poll URL every 2 seconds this.startUrlPolling(); this.isInitialized = true; } /** * Observe document title changes as indicator of navigation */ observeTitle() { const titleElement = document.querySelector("title"); if (!titleElement) { warn("Title element not found, relying on URL polling only"); return; } this.observer = new MutationObserver(() => { this.checkNavigation(); }); this.observer.observe(titleElement, { childList: true, characterData: true, subtree: true }); // Don't register with stateManager - navigation watcher should persist across resets debug("Title observer initialized"); } /** * Start polling URL for changes (fallback mechanism) */ startUrlPolling() { this.pollIntervalId = setInterval(() => { this.checkNavigation(); }, TIMEOUTS.URL_POLL_INTERVAL); // Don't register with stateManager - navigation watcher should persist across resets debug("URL polling started"); } /** * Check if URL has changed and emit event */ checkNavigation() { const currentUrl = window.location.href; if (currentUrl !== this.lastUrl) { debug(`Navigation detected: ${this.lastUrl} -> ${currentUrl}`); // Clear any existing debounce if (this.debounceTimeoutId) { clearTimeout(this.debounceTimeoutId); } // Debounce to avoid rapid-fire navigation events this.debounceTimeoutId = setTimeout(() => { this.handleNavigation(currentUrl); }, TIMEOUTS.NAVIGATION_DEBOUNCE); } } /** * Handle navigation change * @param {string} newUrl */ handleNavigation(newUrl) { const oldUrl = this.lastUrl; this.lastUrl = newUrl; log(`Navigated to: ${newUrl}`); // Update state manager stateManager.setCurrentUrl(newUrl); // Emit navigation event eventBus.emit(EVENTS.NAVIGATION_CHANGED, { oldUrl: oldUrl, newUrl: newUrl, timestamp: Date.now() }); // Also emit URL changed event (for backwards compatibility) eventBus.emit(EVENTS.URL_CHANGED, newUrl); } /** * Stop watching for navigation */ stop() { if (this.observer) { this.observer.disconnect(); this.observer = null; } if (this.pollIntervalId) { clearInterval(this.pollIntervalId); this.pollIntervalId = null; } if (this.debounceTimeoutId) { clearTimeout(this.debounceTimeoutId); this.debounceTimeoutId = null; } this.isInitialized = false; debug("Navigation watcher stopped"); } /** * Get current page type based on URL * @returns {string} */ static getPageType() { const url = window.location.href; if (url === "https://www.linkedin.com/feed/" || url === "https://www.linkedin.com/") { return "feed"; } if (url.startsWith("https://www.linkedin.com/jobs/")) { return "jobs"; } if (url.includes("/messaging/")) { return "messaging"; } if (url.includes("/mynetwork/network-manager/people-follow")) { return "network-manager"; } if (url.includes("/in/")) { return "profile"; } return "other"; } /** * Check if current page matches pattern * @param {string|RegExp} pattern * @returns {boolean} */ static matchesPage(pattern) { const url = window.location.href; if (typeof pattern === "string") { return url.includes(pattern); } if (pattern instanceof RegExp) { return pattern.test(url); } return false; } } // Export singleton instance const navigationWatcher = new NavigationWatcher; /** * DOM manipulation helpers with timeout support * Provides safe, defensive operations for interacting with LinkedIn's DOM */ /** * Check if element exists and is not a loading skeleton * @param {Element} element * @returns {boolean} */ function isRealElement(element) { if (!element) return false; return !element.innerHTML.includes("skeleton"); } /** * Wait for selector to appear in DOM (with timeout) * @param {string} selector * @param {number} [timeout=TIMEOUTS.SELECTOR_WAIT] * @returns {Promise} */ async function waitForSelector(selector, timeout = TIMEOUTS.SELECTOR_WAIT) { if (!isValidSelector(selector)) { warn(`Invalid selector: "${selector}"`); return null; } const startTime = Date.now(); while (Date.now() - startTime < timeout) { const element = document.querySelector(selector); if (isRealElement(element)) { debug(`Found selector "${selector}" after ${Date.now() - startTime}ms`); return element; } await new Promise(resolve => requestAnimationFrame(resolve)); } warn(`Timeout waiting for selector: "${selector}"`); return null; } /** * Wait for selector within a scoped container * @param {string} selector * @param {Element} scope * @param {number} [timeout=TIMEOUTS.SELECTOR_WAIT] * @returns {Promise} */ async function waitForSelectorScoped(selector, scope, timeout = TIMEOUTS.SELECTOR_WAIT) { if (!scope || !isValidSelector(selector)) { warn(`Invalid scoped selector: "${selector}"`); return null; } const startTime = Date.now(); const scopedSelector = `:scope ${selector}`; while (Date.now() - startTime < timeout) { const element = scope.querySelector(scopedSelector); if (isRealElement(element)) { debug(`Found scoped selector "${selector}" after ${Date.now() - startTime}ms`); return element; } await new Promise(resolve => requestAnimationFrame(resolve)); } warn(`Timeout waiting for scoped selector: "${selector}"`); return null; } /** * Wait for elements by class name * @param {string} className * @param {number} [timeout=TIMEOUTS.SELECTOR_WAIT] * @returns {Promise} */ async function waitForClassName(className, timeout = TIMEOUTS.SELECTOR_WAIT) { const startTime = Date.now(); while (Date.now() - startTime < timeout) { const elements = document.getElementsByClassName(className); if (elements.length > 0) { // Check if any element is real (not skeleton) const hasRealElement = Array.from(elements).some(isRealElement); if (hasRealElement) { debug(`Found className "${className}" after ${Date.now() - startTime}ms`); return elements; } } await new Promise(resolve => requestAnimationFrame(resolve)); } warn(`Timeout waiting for className: "${className}"`); return null; } /** * Apply class to element with our prefix * @param {Element} element * @param {string} className - Without prefix */ function addClass(element, className) { if (!element) return; element.classList.add(`${CLASS_PREFIX}${className}`); } /** * Remove class from element with our prefix * @param {Element} element * @param {string} className - Without prefix */ function removeClass(element, className) { if (!element) return; element.classList.remove(`${CLASS_PREFIX}${className}`); } /** * Hide element by adding hide class and aria-hidden * @param {Element} element * @param {string} mode - 'hide' or 'dim' * @param {boolean} [showIcon=true] */ function hideElement(element, mode, showIcon = true) { if (!element) return; // Remove existing mode classes removeClass(element, "hide"); removeClass(element, "dim"); removeClass(element, "show-icon"); // Add new mode addClass(element, mode); if (showIcon) { addClass(element, "show-icon"); } // Add accessibility attribute element.setAttribute("aria-hidden", "true"); // Mark as hidden with our data attribute (use setAttribute for hyphenated names) element.setAttribute(`data-${CLASS_PREFIX}hidden`, "true"); } /** * Show element by removing hide classes and aria-hidden * @param {Element} element */ function showElement(element) { if (!element) return; removeClass(element, "hide"); removeClass(element, "dim"); removeClass(element, "show-icon"); element.removeAttribute("aria-hidden"); element.setAttribute(`data-${CLASS_PREFIX}hidden`, "false"); } /** * Hide all elements matching className * @param {string} className * @param {string} mode * @param {boolean} [showIcon=true] * @param {boolean} [waitFor=false] - If false, applies immediately without waiting (non-blocking) * @returns {Promise} Count of hidden elements */ async function hideByClassName(className, mode, showIcon = true, waitFor = false) { let elements; if (waitFor) { // Blocking mode: wait for elements to appear elements = await waitForClassName(className); if (!elements) return 0; } else { // Non-blocking mode: apply immediately if elements exist elements = document.getElementsByClassName(className); if (!elements.length) return 0; } let count = 0; for (const el of elements) { if (isRealElement(el)) { hideElement(el, mode, showIcon); count++; } } return count; } /** * Show all elements matching className * @param {string} className * @param {boolean} [waitFor=false] - If false, applies immediately without waiting (non-blocking) * @returns {Promise} Count of shown elements */ async function showByClassName(className, waitFor = false) { let elements; if (waitFor) { // Blocking mode: wait for elements to appear elements = await waitForClassName(className); if (!elements) return 0; } else { // Non-blocking mode: apply immediately if elements exist elements = document.getElementsByClassName(className); if (!elements.length) return 0; } let count = 0; for (const el of elements) { if (isRealElement(el)) { showElement(el); count++; } } return count; } /** * Hide element by className and index * @param {string} className * @param {number} index * @param {string} mode * @param {boolean} [showIcon=true] * @param {boolean} [waitFor=false] - If false, applies immediately without waiting (non-blocking) * @returns {Promise} Success */ async function hideByClassNameAndIndex(className, index, mode, showIcon = true, waitFor = false) { let elements; if (waitFor) { elements = await waitForClassName(className); if (!elements) return false; } else { elements = document.getElementsByClassName(className); if (!elements.length) return false; } if (index >= elements.length) return false; if (!isRealElement(elements[index])) return false; hideElement(elements[index], mode, showIcon); return true; } /** * Show element by className and index * @param {string} className * @param {number} index * @param {boolean} [waitFor=false] - If false, applies immediately without waiting (non-blocking) * @returns {Promise} Success */ async function showByClassNameAndIndex(className, index, waitFor = false) { let elements; if (waitFor) { elements = await waitForClassName(className); if (!elements) return false; } else { elements = document.getElementsByClassName(className); if (!elements.length) return false; } if (index >= elements.length) return false; if (!isRealElement(elements[index])) return false; showElement(elements[index]); return true; } /** * Hide ancestor element by finding it via child className * @param {string} childClassName * @param {string} ancestorSelector * @param {string} mode * @param {boolean} [showIcon=true] * @param {boolean} [waitFor=false] - If false, applies immediately without waiting (non-blocking) * @returns {Promise} Count of hidden ancestors */ async function hideAncestorByChildClassName(childClassName, ancestorSelector, mode, showIcon = true, waitFor = false) { let elements; if (waitFor) { elements = await waitForClassName(childClassName); if (!elements) return 0; } else { elements = document.getElementsByClassName(childClassName); if (!elements.length) return 0; } let count = 0; for (const el of elements) { if (!isRealElement(el)) continue; const ancestor = el.closest(ancestorSelector); if (ancestor) { hideElement(ancestor, mode, showIcon); count++; } } return count; } /** * Show ancestor element by finding it via child className * @param {string} childClassName * @param {string} ancestorSelector * @param {boolean} [waitFor=false] - If false, applies immediately without waiting (non-blocking) * @returns {Promise} Count of shown ancestors */ async function showAncestorByChildClassName(childClassName, ancestorSelector, waitFor = false) { let elements; if (waitFor) { elements = await waitForClassName(childClassName); if (!elements) return 0; } else { elements = document.getElementsByClassName(childClassName); if (!elements.length) return 0; } let count = 0; for (const el of elements) { if (!isRealElement(el)) continue; const ancestor = el.closest(ancestorSelector); if (ancestor) { showElement(ancestor); count++; } } return count; } /** * Build custom selector string from selector array and type * @param {string[]} selectors * @param {string} type - 'all', 'blocked', 'shown', 'pristine' * @returns {string} */ function getCustomSelectors(selectors, type) { const PRISTINE = `:not([data-${CLASS_PREFIX}hidden])`; const VISIBLE = `[data-${CLASS_PREFIX}hidden="false"]`; const BLOCKED = `[data-${CLASS_PREFIX}hidden="true"]`; let result = []; switch (type) { case "all": result = selectors; break; case "blocked": result = selectors.map(selector => `${selector}${BLOCKED}`); break; case "shown": result = selectors.map(selector => `${selector}${VISIBLE}`); break; case "pristine": result = selectors.map(selector => `${selector}${VISIBLE},${selector}${PRISTINE}`); break; } return result.join(","); } /** * Feed Filtering Engine * Observer-first approach with fallback interval * Handles keyword filtering, age filtering, and feed visibility */ class FeedEngine { constructor() { this.feedContainer = null; this.observer = null; this.fallbackInterval = null; this.keywords = []; this.mode = "hide"; this.isActive = false; this.settings = null; } /** * Initialize feed filtering * @param {Object} settings */ async init(settings) { try { // Check if we're on a feed page if (!this.shouldActivate()) { debug("Not on feed page, skipping feed engine"); return; } // Check if main toggle is off if (!settings["main-toggle"]) { debug("Main toggle off, destroying feed engine"); this.destroy(); return; } log("Initializing feed engine"); this.settings = settings; this.mode = settings["gentle-mode"] ? "dim" : "hide"; this.keywords = this.buildKeywords(settings); // Handle special cases first if (settings["hide-whole-feed"]) { await this.toggleFeedVisibility(false); return; } // Show feed if hidden await this.toggleFeedVisibility(true); // Handle sort by recent if (settings["sort-by-recent"]) { this.handleSortByRecent(); } // Start filtering if we have keywords if (this.keywords.length > 0) { await this.startFiltering(settings); } this.isActive = true; eventBus.emit(EVENTS.MODULE_FEED_INIT); } catch (err) { errorWithStack(err, "feed init"); } } /** * Check if feed engine should activate on current page * @returns {boolean} */ shouldActivate() { const url = window.location.href; return url.startsWith(URLS.FEED) || url === URLS.HOME; } /** * Build keyword array from settings * @param {Object} settings * @returns {string[]} */ buildKeywords(settings) { let keywords = parseKeywords(settings["feed-keywords"]); // Add age filtering keywords const hideByAge = settings["hide-by-age"]; if (hideByAge && hideByAge !== "disabled") { this.addAgeKeywords(keywords, hideByAge); } // Add toggle-based keywords // Note: Poll detection disabled - LinkedIn's poll markup is unreliable // if (settings['hide-polls']) keywords.push('poll'); if (settings["hide-videos"]) { keywords.push('id="vjs_video_', "update-components-linkedin-video", "feed-shared-linkedin-video"); } if (settings["hide-links"]) keywords.push("https://lnkd.in/"); if (settings["hide-images"]) { keywords.push('class="update-components-image__image-link'); } if (settings["hide-promoted"]) { keywords.push("text::Promoted", "text::Sponsored"); } if (settings["hide-shared"]) keywords.push("feed-shared-mini-update-v2"); if (settings["hide-followed"]) keywords.push("text::following"); if (settings["hide-liked"]) { keywords.push("text::likes this", "text::like this"); } if (settings["hide-other-reactions"]) { keywords.push("text::loves this", "text::finds this insightful", "text::celebrates this", "text::is curious about this", "text::supports this", "text::finds this funny"); } if (settings["hide-commented-on"]) { keywords.push("text::commented on this"); } // Note: Company and people filters are handled separately in shouldHidePost // to avoid false positives from post content links if (settings["hide-suggested"]) keywords.push("text::Suggested"); if (settings["hide-carousels"]) { keywords.push("update-components-carousel", "feed-shared-carousel"); } debug(`Built ${keywords.length} feed keywords`); return keywords; } /** * Add age-based filtering keywords * @param {string[]} keywords * @param {string} age - 'hour', 'day', 'week', 'month', 'year' */ addAgeKeywords(keywords, age) { const addRange = (unit, max, cascade = true) => { const formats = AGE_KEYWORDS[unit]; // Add range (2-max) for all formats for (let x = 2; x <= max; x++) { formats.forEach(format => { keywords.push(`text::${x}${format}`); }); } // Add single unit for all formats (e.g., "1h •" and "1h ago") formats.forEach(format => { keywords.push(`text::1${format}`); }); // Cascade to older units if (cascade) { switch (unit) { case "hour": addRange("day", 30, true); break; case "day": addRange("week", 4, true); break; case "week": addRange("month", 12, true); break; case "month": addRange("year", 5, false); break; } } }; switch (age) { case "hour": addRange("hour", 24); break; case "day": addRange("day", 30); break; case "week": addRange("week", 4); break; case "month": addRange("month", 12); break; case "year": addRange("year", 5); break; } } /** * Start filtering with observer-first approach * @param {Object} settings */ async startFiltering(settings) { // Find feed container this.feedContainer = await this.findFeedContainer(); if (!this.feedContainer) { warn("Feed container not found, cannot start filtering"); return; } // Try observer-first approach const observerSuccess = this.setupObserver(); if (!observerSuccess) { // Fall back to interval warn("Observer setup failed, using fallback interval"); this.setupFallbackInterval(settings); } else { // Run initial scan this.scanAndFilterPosts(settings); } } /** * Find feed container element * @returns {Promise} */ async findFeedContainer() { // Try multiple possible selectors for feed container const selectors = [ ".scaffold-finite-scroll__content", ".feed-container-theme", "main.scaffold-layout__main" ]; for (const selector of selectors) { const element = await waitForSelector(selector, 5e3); if (element) { debug(`Found feed container: ${selector}`); return element; } } return null; } /** * Setup MutationObserver for feed changes * @returns {boolean} Success */ setupObserver() { if (!this.feedContainer) return false; try { // Disconnect and cleanup old observer if it exists if (this.observer) { stateManager.removeObserver(this.observer); this.observer = null; } this.observer = new MutationObserver(mutations => { // Check if new posts were added const hasNewPosts = mutations.some(mutation => mutation.type === "childList" && mutation.addedNodes.length > 0); if (hasNewPosts) { debug("New posts detected by observer"); this.scanAndFilterPosts(); } }); this.observer.observe(this.feedContainer, { childList: true, subtree: true }); stateManager.addObserver(this.observer); debug("Feed observer setup successful"); return true; } catch (err) { errorWithStack(err, "feed observer setup"); return false; } } /** * Setup fallback interval for filtering * @param {Object} settings */ setupFallbackInterval(settings) { // Clear existing interval if any if (this.fallbackInterval) { stateManager.removeInterval(this.fallbackInterval); } this.fallbackInterval = setInterval(() => { this.scanAndFilterPosts(settings); }, TIMEOUTS.FEED_INTERVAL_FALLBACK); stateManager.addInterval(this.fallbackInterval); debug("Feed fallback interval setup"); } /** * Scan and filter visible posts * @param {Object} [settings] */ scanAndFilterPosts(settings = null) { try { // Get all pristine posts (visible or not yet processed) const selector = getCustomSelectors(FEED_SELECTORS, "pristine"); const posts = document.querySelectorAll(selector); if (posts.length === 0) { debug("No pristine posts found"); return; } debug(`Scanning ${posts.length} posts`); // Check for low post count warning if (settings && posts.length < 6 && this.mode !== "dim" && !settings["disable-postcount-prompt"] && !stateManager.getFlag("postCountPrompted")) { this.showLowPostCountAlert(); stateManager.setFlag("postCountPrompted", true); } // Filter each post let hiddenCount = 0; posts.forEach(post => { if (this.shouldHidePost(post)) { hideElement(post, this.mode, true); hiddenCount++; // Make post clickable to reveal post.onclick = () => { showElement(post); }; } else { // Ensure visible posts are shown showElement(post); } }); if (hiddenCount > 0) { debug(`Hidden ${hiddenCount} posts`); stateManager.incrementCounter("postsHidden"); } } catch (err) { errorWithStack(err, "scanAndFilterPosts"); } } /** * Check if post should be hidden based on keywords * @param {Element} post * @returns {boolean} */ shouldHidePost(post) { if (!post) return false; // Check company/people filters first (scoped to author link only) if (this.settings) { if (this.settings["hide-by-companies"] && this.isPostByCompany(post)) { return true; } if (this.settings["hide-by-people"] && this.isPostByPerson(post)) { return true; } } // Check keyword-based filters if (this.keywords.length === 0) return false; const postText = sanitizeTextContent(post.textContent); const postHtml = post.innerHTML; return this.keywords.some(keyword => { // Check for text:: prefix for text-based matching if (keyword.startsWith("text::")) { const searchText = keyword.substring(6); return postText.toLowerCase().includes(searchText.toLowerCase()); } // Otherwise search in HTML return postHtml.includes(keyword); }); } /** * Check if post is authored by a company * @param {Element} post * @returns {boolean} */ isPostByCompany(post) { // Look for actor meta link (author link) in the post header const actorLink = post.querySelector('.update-components-actor__meta-link, .feed-shared-actor__meta-link, [data-control-name="actor"]'); if (!actorLink) return false; const href = actorLink.getAttribute("href") || ""; return href.includes("/company/") || href.includes("/showcase/"); } /** * Check if post is authored by a person * @param {Element} post * @returns {boolean} */ isPostByPerson(post) { // Look for actor meta link (author link) in the post header const actorLink = post.querySelector('.update-components-actor__meta-link, .feed-shared-actor__meta-link, [data-control-name="actor"]'); if (!actorLink) return false; const href = actorLink.getAttribute("href") || ""; return href.includes("/in/"); } /** * Show low post count alert */ showLowPostCountAlert() { alert("Scroll down to start blocking posts (LinkedIn needs at least 10 loaded to load new ones).\n\nTo disable this alert, toggle it under misc in LinkedIn Tweeks settings"); } /** * Reset blocked posts (show all hidden posts) */ resetBlockedPosts() { try { const selector = getCustomSelectors(FEED_SELECTORS, "blocked"); const posts = document.querySelectorAll(selector); posts.forEach(post => showElement(post)); log(`Reset ${posts.length} blocked posts`); } catch (err) { errorWithStack(err, "resetBlockedPosts"); } } /** * Toggle feed visibility * @param {boolean} shown */ async toggleFeedVisibility(shown) { // Only on feed page if (!window.location.href.startsWith(URLS.FEED)) { return; } const container = await waitForSelector(".scaffold-finite-scroll__content", 3e3); if (container) { if (shown) { container.classList.remove("linkedin-tweeks-us-hide"); debug("Feed shown"); } else { container.classList.add("linkedin-tweeks-us-hide"); debug("Feed hidden"); } } } /** * Handle sort by recent */ async handleSortByRecent() { try { // Only on feed/home pages const url = window.location.href; if (url !== URLS.FEED && url !== URLS.HOME) { return; } debug("Attempting to sort by recent"); const dropdownTrigger = await waitForSelector(SORT_SELECTORS.DROPDOWN_TRIGGER, 5e3); if (!dropdownTrigger) { debug("Sort dropdown not found"); return; } const parent = dropdownTrigger.parentElement; dropdownTrigger.click(); const recentOption = await waitForSelectorScoped(SORT_SELECTORS.RECENT_OPTION, parent, 3e3); if (recentOption) { recentOption.click(); log("Switched to Recent sort"); } } catch (err) { errorWithStack(err, "handleSortByRecent"); } } /** * Destroy feed engine and cleanup */ destroy() { if (this.observer) { stateManager.removeObserver(this.observer); this.observer = null; } if (this.fallbackInterval) { stateManager.removeInterval(this.fallbackInterval); this.fallbackInterval = null; } // Reset all posts this.resetBlockedPosts(); this.isActive = false; eventBus.emit(EVENTS.MODULE_FEED_DESTROY); debug("Feed engine destroyed"); } } // Export singleton instance const feedEngine = new FeedEngine; /** * Jobs Filtering Engine * Observer-first approach for job listing filtering * Handles job keywords, promoted jobs, and ancillary UI elements */ class JobsEngine { constructor() { this.jobsContainer = null; this.observer = null; this.fallbackInterval = null; this.keywords = []; this.mode = "hide"; this.isActive = false; } /** * Initialize jobs filtering * @param {Object} settings */ async init(settings) { try { // Check if we're on jobs page if (!this.shouldActivate()) { debug("Not on jobs page, skipping jobs engine"); return; } // Check if main toggle is off if (!settings["main-toggle"]) { debug("Main toggle off, destroying jobs engine"); this.destroy(); return; } log("Initializing jobs engine"); this.mode = settings["gentle-mode"] ? "dim" : "hide"; this.keywords = this.buildKeywords(settings); // Handle job guidance and AI button await this.handleJobGuidance(settings); await this.handleAiButton(settings); // Start filtering if we have keywords if (this.keywords.length > 0) { await this.startFiltering(); } this.isActive = true; eventBus.emit(EVENTS.MODULE_JOBS_INIT); } catch (err) { errorWithStack(err, "jobs init"); } } /** * Check if jobs engine should activate on current page * @returns {boolean} */ shouldActivate() { return window.location.href.startsWith(URLS.JOBS); } /** * Build keyword array from settings * @param {Object} settings * @returns {string[]} */ buildKeywords(settings) { let keywords = parseKeywords(settings["job-keywords"]); // Add "Promoted" if toggle enabled if (settings["hide-promoted-jobs"]) { keywords.push("Promoted"); } debug(`Built ${keywords.length} job keywords`); return keywords; } /** * Start filtering with observer-first approach */ async startFiltering() { // Try observer-first approach const observerSuccess = this.setupObserver(); if (!observerSuccess) { // Fall back to interval warn("Observer setup failed, using fallback interval"); this.setupFallbackInterval(); } else { // Run initial scan this.scanAndFilterJobs(); } } /** * Setup MutationObserver for jobs list changes * @returns {boolean} Success */ setupObserver() { // Find jobs container const jobsContainers = [ ".jobs-search-results-list", ".scaffold-layout__list", "main.scaffold-layout__main" ]; for (const selector of jobsContainers) { const container = document.querySelector(selector); if (container) { this.jobsContainer = container; break; } } if (!this.jobsContainer) { debug("Jobs container not found"); return false; } try { // Disconnect and cleanup old observer if it exists if (this.observer) { stateManager.removeObserver(this.observer); this.observer = null; } this.observer = new MutationObserver(mutations => { // Check if new jobs were added const hasNewJobs = mutations.some(mutation => mutation.type === "childList" && mutation.addedNodes.length > 0); if (hasNewJobs) { debug("New jobs detected by observer"); this.scanAndFilterJobs(); } }); this.observer.observe(this.jobsContainer, { childList: true, subtree: true }); stateManager.addObserver(this.observer); debug("Jobs observer setup successful"); return true; } catch (err) { errorWithStack(err, "jobs observer setup"); return false; } } /** * Setup fallback interval for filtering */ setupFallbackInterval() { // Clear existing interval if any if (this.fallbackInterval) { stateManager.removeInterval(this.fallbackInterval); } this.fallbackInterval = setInterval(() => { this.scanAndFilterJobs(); // Periodically reset to handle LinkedIn DOM refreshes const runCount = stateManager.incrementCounter("jobsRuns"); if (runCount % 10 === 0) { this.resetJobs(); } }, TIMEOUTS.JOBS_INTERVAL_FALLBACK); stateManager.addInterval(this.fallbackInterval); debug("Jobs fallback interval setup"); } /** * Scan and filter visible jobs */ scanAndFilterJobs() { try { // Get all job cards const selector = getCustomSelectors(JOB_SELECTORS, "all"); const jobs = document.querySelectorAll(selector); if (jobs.length === 0) { debug("No jobs found"); return; } debug(`Scanning ${jobs.length} jobs`); // Filter each job let hiddenCount = 0; jobs.forEach(job => { if (this.shouldHideJob(job)) { hideElement(job, this.mode, true); hiddenCount++; } else { // Remove hide/dim classes if not matching showElement(job); } }); if (hiddenCount > 0) { debug(`Hidden ${hiddenCount} jobs`); stateManager.incrementCounter("jobsHidden"); } } catch (err) { errorWithStack(err, "scanAndFilterJobs"); } } /** * Check if job should be hidden based on keywords * @param {Element} job * @returns {boolean} */ shouldHideJob(job) { if (!job || this.keywords.length === 0) return false; const jobHtml = job.innerHTML.toLowerCase(); return this.keywords.some(keyword => jobHtml.includes(keyword.toLowerCase())); } /** * Reset all jobs (remove filtering) */ resetJobs() { try { const selector = getCustomSelectors(JOB_SELECTORS, "all"); const jobs = document.querySelectorAll(selector); jobs.forEach(job => showElement(job)); debug(`Reset ${jobs.length} jobs`); } catch (err) { errorWithStack(err, "resetJobs"); } } /** * Handle job guidance visibility * @param {Object} settings */ async handleJobGuidance(settings) { try { if (settings["hide-job-guidance"]) { const count = await hideByClassName("artdeco-card mb2 pt5", this.mode, true); if (count > 0) { debug(`Hidden ${count} job guidance cards`); } } else { const count = await showByClassName("artdeco-card mb2 pt5"); if (count > 0) { debug(`Shown ${count} job guidance cards`); } } } catch (err) { errorWithStack(err, "handleJobGuidance"); } } /** * Handle AI button visibility * @param {Object} settings */ async handleAiButton(settings) { try { const className = "ember-view link-without-hover-state artdeco-button"; if (settings["hide-ai-button"]) { const count = await hideByClassName(className, this.mode, false); if (count > 0) { debug(`Hidden ${count} AI buttons`); } } else { const count = await showByClassName(className); if (count > 0) { debug(`Shown ${count} AI buttons`); } } } catch (err) { errorWithStack(err, "handleAiButton"); } } /** * Destroy jobs engine and cleanup */ destroy() { if (this.observer) { stateManager.removeObserver(this.observer); this.observer = null; } if (this.fallbackInterval) { stateManager.removeInterval(this.fallbackInterval); this.fallbackInterval = null; } // Reset all jobs this.resetJobs(); // Show job guidance and AI button showByClassName("artdeco-card mb2 pt5"); showByClassName("ember-view link-without-hover-state artdeco-button"); this.isActive = false; eventBus.emit(EVENTS.MODULE_JOBS_DESTROY); debug("Jobs engine destroyed"); } } // Export singleton instance const jobsEngine = new JobsEngine; /** * Miscellaneous UI Controls * Manages ancillary LinkedIn modules (ads, learning, premium, etc.) * Includes fix for profile counters bug */ class MiscEngine { constructor() { this.observer = null; this.fallbackInterval = null; this.mode = "hide"; this.settings = null; this.isActive = false; } /** * Initialize misc controls * @param {Object} settings */ async init(settings) { try { // Check if main toggle is off if (!settings["main-toggle"]) { debug("Main toggle off, destroying misc engine"); this.destroy(); return; } log("Initializing misc engine"); this.mode = settings["gentle-mode"] ? "dim" : "hide"; this.settings = settings; // Apply all toggles await this.handleAll(settings); // Setup observer or fallback interval for dynamic content this.setupMonitoring(); this.isActive = true; eventBus.emit(EVENTS.MODULE_MISC_INIT); } catch (err) { errorWithStack(err, "misc init"); } } /** * Setup monitoring for dynamic content */ setupMonitoring() { // Use fallback interval since misc elements appear throughout the page if (this.fallbackInterval) { stateManager.removeInterval(this.fallbackInterval); } this.fallbackInterval = setInterval(() => { if (this.settings) { this.handleAll(this.settings); } }, TIMEOUTS.MISC_INTERVAL_FALLBACK); stateManager.addInterval(this.fallbackInterval); debug("Misc monitoring setup"); } /** * Handle all misc toggles * @param {Object} settings */ async handleAll(settings) { try { // Layout and appearance modes this.handleWideMode(settings); this.handleDarkMode(settings); // Content filtering await this.handleLearning(settings); await this.handleAdvertisements(settings); await this.handleCommunityPanel(settings); await this.handleFollowRecommendations(settings); await this.handleAccountBuilding(settings); await this.handleNetworkBuilding(settings); await this.handlePremium(settings); await this.handleNews(settings); await this.handleNotificationCount(settings); await this.handleProfileCounters(settings); // Fixed implementation await this.handleBottomMessaging(settings); } catch (err) { errorWithStack(err, "handleAll"); } } /** * Handle LinkedIn Learning modules * @param {Object} settings */ async handleLearning(settings) { try { if (settings["hide-linkedin-learning"]) { await hideByClassName("learning-top-courses", this.mode, true, false); await hideByClassName("pv-course-recommendations", this.mode, true, false); } else { await showByClassName("learning-top-courses", false); await showByClassName("pv-course-recommendations", false); } } catch (err) { errorWithStack(err, "handleLearning"); } } /** * Handle advertisements * @param {Object} settings */ async handleAdvertisements(settings) { try { if (settings["hide-advertisements"]) { await hideByClassName("ad-banner-container", this.mode, true, false); await hideByClassName("ads-container", this.mode, true, false); await hideByClassName("ad-banner", this.mode, true, false); await hideByClassName("pv-right-rail__sticky-ad-banner", this.mode, true, false); } else { await showByClassName("ad-banner-container", false); await showByClassName("ads-container", false); await showByClassName("ad-banner", false); await showByClassName("pv-right-rail__sticky-ad-banner", false); } } catch (err) { errorWithStack(err, "handleAdvertisements"); } } /** * Handle community panels * @param {Object} settings */ async handleCommunityPanel(settings) { try { if (settings["hide-community-panel"]) { await hideByClassName("community-panel", this.mode, true, false); } else { await showByClassName("community-panel", false); } } catch (err) { errorWithStack(err, "handleCommunityPanel"); } } /** * Handle follow recommendations * @param {Object} settings */ async handleFollowRecommendations(settings) { try { if (settings["hide-follow-recommendations"]) { await hideByClassName("feed-follows-module", this.mode, true, false); } else { await showByClassName("feed-follows-module", false); } } catch (err) { errorWithStack(err, "handleFollowRecommendations"); } } /** * Handle account building prompts * @param {Object} settings */ async handleAccountBuilding(settings) { try { if (settings["hide-account-building"]) { await hideByClassName("artdeco-card ember-view mt2", this.mode, true, false); await hideByClassName("artdeco-card mb4 overflow-hidden ember-view", this.mode, true, false); } else { await showByClassName("artdeco-card ember-view mt2", false); await showByClassName("artdeco-card mb4 overflow-hidden ember-view", false); } } catch (err) { errorWithStack(err, "handleAccountBuilding"); } } /** * Handle network building prompts * @param {Object} settings */ async handleNetworkBuilding(settings) { try { if (settings["hide-network-building"]) { await hideByClassName("mn-abi-form", this.mode, true, false); await hideByClassName("pv-profile-pymk__container artdeco-card", this.mode, true, false); } else { await showByClassName("mn-abi-form", false); await showByClassName("pv-profile-pymk__container artdeco-card", false); } } catch (err) { errorWithStack(err, "handleNetworkBuilding"); } } /** * Handle premium upsell content * @param {Object} settings */ async handlePremium(settings) { try { if (settings["hide-premium"]) { await hideByClassName("premium-upsell-link", this.mode, false, false); await hideByClassName("gp-promo-embedded-card-three__card", this.mode, true, false); await hideByClassName("artdeco-card overflow-hidden ph1 mb2", this.mode, true, false); await hideByClassName("pvs-premium-upsell__container", this.mode, true, false); await hideByClassName("pvs-entity--blurred", this.mode, false, false); await hideByClassName("artdeco-card premium-accent-bar", this.mode, true, false); await hideByClassNameAndIndex("artdeco-tab ember-view", 1, this.mode, true, false); } else { await showByClassName("premium-upsell-link", false); await showByClassName("gp-promo-embedded-card-three__card", false); await showByClassName("artdeco-card overflow-hidden ph1 mb2", false); await showByClassName("pvs-premium-upsell__container", false); await showByClassName("pvs-entity--blurred", false); await showByClassName("artdeco-card premium-accent-bar", false); await showByClassNameAndIndex("artdeco-tab ember-view", 1, false); } } catch (err) { errorWithStack(err, "handlePremium"); } } /** * Handle news modules * @param {Object} settings */ async handleNews(settings) { try { if (settings["hide-news"]) { await hideByClassName("news-module", this.mode, true, false); await hideByClassName("news-module--with-game", this.mode, true, false); } else { await showByClassName("news-module", false); await showByClassName("news-module--with-game", false); } } catch (err) { errorWithStack(err, "handleNews"); } } /** * Handle notification count badge * @param {Object} settings */ async handleNotificationCount(settings) { try { if (settings["hide-notification-count"]) { await hideByClassName("notification-badge__count", "hide", false, false); } else { await showByClassName("notification-badge__count", false); } } catch (err) { errorWithStack(err, "handleNotificationCount"); } } /** * Handle profile counters * FIXED: Correctly calls showProfileCounters when toggle is disabled * @param {Object} settings */ async handleProfileCounters(settings) { try { if (settings["hide-profile-counters"]) { await hideAncestorByChildClassName("entity-list-wrapper", ".artdeco-card", this.mode, true, false); } else { // FIX: Call showProfileCounters instead of showNotifications await showAncestorByChildClassName("entity-list-wrapper", ".artdeco-card", false); } } catch (err) { errorWithStack(err, "handleProfileCounters"); } } /** * Handle bottom messaging tray (floating messenger in bottom-right corner) * Always uses 'hide' mode (not gentle mode) - persistent UI elements should be fully hidden * @param {Object} settings */ async handleBottomMessaging(settings) { try { // Respect main toggle - show tray when main toggle is off if (!settings["main-toggle"]) { await showByClassName("msg-overlay-list-bubble", false); return; } if (settings["hide-bottom-messaging"]) { // Force 'hide' mode regardless of gentle mode setting await hideByClassName("msg-overlay-list-bubble", "hide", false, false); } else { await showByClassName("msg-overlay-list-bubble", false); } } catch (err) { errorWithStack(err, "handleBottomMessaging"); } } /** * Handle wide mode * @param {Object} settings */ handleWideMode(settings) { try { const body = document.body; const wideClass = "linkedin-tweeks-wide-mode"; if (settings["wide-mode"]) { if (!body.classList.contains(wideClass)) { body.classList.add(wideClass); debug("Wide mode enabled"); } } else { if (body.classList.contains(wideClass)) { body.classList.remove(wideClass); debug("Wide mode disabled"); } } } catch (err) { errorWithStack(err, "handleWideMode"); } } /** * Handle dark mode * @param {Object} settings */ handleDarkMode(settings) { try { const html = document.documentElement; const darkClass = "linkedin-tweeks-dark-mode"; if (settings["dark-mode"]) { if (!html.classList.contains(darkClass)) { html.classList.add(darkClass); debug("Dark mode enabled"); } } else { if (html.classList.contains(darkClass)) { html.classList.remove(darkClass); debug("Dark mode disabled"); } } } catch (err) { errorWithStack(err, "handleDarkMode"); } } /** * Show all misc elements */ async showAll() { try { await showByClassName("learning-top-courses", false); await showByClassName("pv-course-recommendations", false); await showByClassName("ad-banner-container", false); await showByClassName("ads-container", false); await showByClassName("ad-banner", false); await showByClassName("pv-right-rail__sticky-ad-banner", false); await showByClassName("community-panel", false); await showByClassName("feed-follows-module", false); await showByClassName("artdeco-card ember-view mt2", false); await showByClassName("artdeco-card mb4 overflow-hidden ember-view", false); await showByClassName("mn-abi-form", false); await showByClassName("pv-profile-pymk__container artdeco-card", false); await showByClassName("premium-upsell-link", false); await showByClassName("gp-promo-embedded-card-three__card", false); await showByClassName("artdeco-card overflow-hidden ph1 mb2", false); await showByClassName("pvs-premium-upsell__container", false); await showByClassName("pvs-entity--blurred", false); await showByClassName("artdeco-card premium-accent-bar", false); await showByClassNameAndIndex("artdeco-tab ember-view", 1, false); await showByClassName("news-module", false); await showByClassName("news-module--with-game", false); await showByClassName("notification-badge__count", false); await showAncestorByChildClassName("entity-list-wrapper", ".artdeco-card", false); await showByClassName("msg-overlay-list-bubble", false); debug("Shown all misc elements"); } catch (err) { errorWithStack(err, "showAll"); } } /** * Destroy misc engine and cleanup */ destroy() { if (this.fallbackInterval) { stateManager.removeInterval(this.fallbackInterval); this.fallbackInterval = null; } // Remove wide/dark mode classes document.body.classList.remove("linkedin-tweeks-wide-mode"); document.documentElement.classList.remove("linkedin-tweeks-dark-mode"); // Show all elements this.showAll(); this.isActive = false; eventBus.emit(EVENTS.MODULE_MISC_DESTROY); debug("Misc engine destroyed"); } } // Export singleton instance const miscEngine = new MiscEngine; /** * Messaging Enhancements * Adds "Select all for deletion" functionality to LinkedIn messaging */ class MessagingEngine { constructor() { this.isActive = false; this.menuItemAdded = false; } /** * Initialize messaging enhancements */ async init() { try { // Check if we're on messaging page if (!this.shouldActivate()) { debug("Not on messaging page, skipping messaging engine"); return; } log("Initializing messaging engine"); // Wait for messaging UI to load await this.addSelectAllMenuItem(); this.isActive = true; } catch (err) { errorWithStack(err, "messaging init"); } } /** * Check if messaging engine should activate * @returns {boolean} */ shouldActivate() { return window.location.href.includes("/messaging/"); } /** * Add "Select all for deletion" menu item */ async addSelectAllMenuItem() { try { // Wait for conversation dropdown container const dropdownContainer = await waitForSelector(".msg-overlay-list-bubble__convo-card-dropdown", 1e4); if (!dropdownContainer) { warn("Messaging dropdown container not found"); return; } // Check if menu item already added if (dropdownContainer.querySelector(".linkedin-tweeks-us-select-all-messages")) { debug("Select all menu item already exists"); return; } // Create menu item using DOM methods (Trusted Types safe) const menuItem = document.createElement("li"); menuItem.className = "linkedin-tweeks-us-select-all-messages"; menuItem.style.cursor = "pointer"; const itemDiv = document.createElement("div"); itemDiv.className = "msg-overlay-list-bubble__dropdown-item"; const itemSpan = document.createElement("span"); itemSpan.textContent = "Select all for deletion (LinkedIn Tweeks)"; itemDiv.appendChild(itemSpan); menuItem.appendChild(itemDiv); // Add click handler menuItem.addEventListener("click", () => { this.handleSelectAllMessages(); }); // Append to dropdown dropdownContainer.appendChild(menuItem); this.menuItemAdded = true; log('Added "Select all for deletion" menu item'); } catch (err) { errorWithStack(err, "addSelectAllMenuItem"); } } /** * Handle select all messages action * @param {boolean} skipConfirmation - Skip confirmation prompt (for recursive calls) * @returns {Promise} Total number of messages selected */ async handleSelectAllMessages(skipConfirmation = false) { try { // Show confirmation dialog only on first call if (!skipConfirmation) { const confirmed = confirm("This will select all messages for deletion. You can then manually delete them.\n\nProceed?"); if (!confirmed) { debug("User cancelled select all messages"); return 0; } log("Starting select all messages..."); eventBus.emit(EVENTS.ACTION_SELECT_MESSAGES); } // Find all message checkboxes const checkboxes = document.querySelectorAll('.msg-conversation-listitem__checkbox input[type="checkbox"]'); if (checkboxes.length === 0) { if (!skipConfirmation) { alert("No message checkboxes found. Please navigate to your inbox."); } return 0; } // Scroll and select all let selectedCount = 0; for (const checkbox of checkboxes) { // Scroll into view checkbox.scrollIntoView({ behavior: "smooth", block: "center" }); // Check if not already selected if (!checkbox.checked) { checkbox.click(); selectedCount++; } // Small delay between selections await new Promise(resolve => setTimeout(resolve, 50)); } debug(`Selected ${selectedCount} messages in this batch`); // Scroll to load more if possible window.scrollTo(0, document.body.scrollHeight); await new Promise(resolve => setTimeout(resolve, 1e3)); // Recursive call if more messages loaded const newCheckboxes = document.querySelectorAll('.msg-conversation-listitem__checkbox input[type="checkbox"]'); if (newCheckboxes.length > checkboxes.length) { debug("More messages detected, continuing selection..."); const recursiveCount = await this.handleSelectAllMessages(true); const totalCount = selectedCount + recursiveCount; // Only show alert/emit event on initial call if (!skipConfirmation) { alert(`Selected ${totalCount} messages.\n\nYou can now delete them using LinkedIn's delete button.`); log(`Selected ${totalCount} messages for deletion`); eventBus.emit(EVENTS.ACTION_SELECT_MESSAGES_COMPLETE, { count: totalCount }); } return totalCount; } // Complete - no more messages to load if (!skipConfirmation) { alert(`Selected ${selectedCount} messages.\n\nYou can now delete them using LinkedIn's delete button.`); log(`Selected ${selectedCount} messages for deletion`); eventBus.emit(EVENTS.ACTION_SELECT_MESSAGES_COMPLETE, { count: selectedCount }); } return selectedCount; } catch (err) { errorWithStack(err, "handleSelectAllMessages"); if (!skipConfirmation) { alert("An error occurred while selecting messages. Please try again."); } // Re-throw error to propagate to parent call throw err; } } /** * Destroy messaging engine */ destroy() { // Remove menu item if added const menuItem = document.querySelector(".linkedin-tweeks-us-select-all-messages"); if (menuItem) { menuItem.remove(); this.menuItemAdded = false; } this.isActive = false; debug("Messaging engine destroyed"); } } // Export singleton instance const messagingEngine = new MessagingEngine; /** * Unfollow All Workflow * Handles bulk unfollowing on the network manager page * Includes confirmation, progress tracking, and cancellation support */ class UnfollowManager { constructor() { this.isRunning = false; this.shouldCancel = false; this.unfollowCount = 0; } /** * Initialize unfollow manager and subscribe to event */ init() { // Subscribe to unfollow action event eventBus.subscribe(EVENTS.ACTION_UNFOLLOW_ALL, () => { this.handleUnfollowAll(); }); debug("Unfollow manager initialized"); } /** * Handle unfollow all action */ async handleUnfollowAll() { try { // Check if already running if (this.isRunning) { warn("Unfollow already in progress"); return; } // Check if on correct page if (!this.isOnCorrectPage()) { this.showNavigationAlert(); return; } // Show confirmation const confirmed = confirm("This will unfollow all people in your network.\n\n" + "This action cannot be undone. Are you sure?\n\n" + "Click OK to proceed, or Cancel to abort."); if (!confirmed) { debug("User cancelled unfollow all"); return; } log("Starting unfollow all workflow"); this.isRunning = true; this.shouldCancel = false; this.unfollowCount = 0; // Start unfollowing await this.unfollowAll(); // Complete this.isRunning = false; const message = this.shouldCancel ? `Unfollow cancelled. ${this.unfollowCount} people unfollowed.` : `Successfully unfollowed ${this.unfollowCount} people.`; alert(message); log(message); eventBus.emit(EVENTS.ACTION_UNFOLLOW_COMPLETE, { count: this.unfollowCount, cancelled: this.shouldCancel }); } catch (err) { this.isRunning = false; errorWithStack(err, "handleUnfollowAll"); alert("An error occurred during unfollow process. Please check the console."); } } /** * Check if on network manager page * @returns {boolean} */ isOnCorrectPage() { return window.location.href.includes(URLS.NETWORK_MANAGER); } /** * Show navigation alert with instructions */ showNavigationAlert() { alert("Please navigate to your Following page first:\n\n" + "1. Go to My Network\n" + '2. Click "Following"\n' + "3. Then run this action again\n\n" + `URL should contain: ${URLS.NETWORK_MANAGER}`); } /** * Recursively unfollow all */ async unfollowAll() { // Check for cancellation if (this.shouldCancel) { debug("Unfollow cancelled by user"); return; } // Find all unfollow buttons const buttons = document.querySelectorAll(UNFOLLOW_BUTTON_SELECTOR); if (!buttons || buttons.length === 0) { log("No more unfollow buttons found"); return; } debug(`Found ${buttons.length} unfollow buttons`); // Click each button sequentially for (const button of buttons) { // Check for cancellation if (this.shouldCancel) { break; } try { // Scroll button into view window.scrollTo(0, button.offsetTop - 260); // Click button button.click(); this.unfollowCount++; debug(`Unfollowed person ${this.unfollowCount}`); // Delay between clicks await new Promise(resolve => setTimeout(resolve, TIMEOUTS.UNFOLLOW_DELAY)); } catch (err) { warn("Error clicking unfollow button:", err); } } // Scroll to bottom to load more window.scrollTo(0, document.body.scrollHeight); await new Promise(resolve => setTimeout(resolve, 1e3)); // Check if more buttons loaded const newButtons = document.querySelectorAll(UNFOLLOW_BUTTON_SELECTOR); if (newButtons && newButtons.length > 0 && !this.shouldCancel) { debug("More buttons detected, continuing..."); await this.unfollowAll(); } } /** * Cancel ongoing unfollow process */ cancel() { if (this.isRunning) { this.shouldCancel = true; log("Unfollow cancellation requested"); } } /** * Get current status * @returns {Object} */ getStatus() { return { isRunning: this.isRunning, unfollowCount: this.unfollowCount }; } } // Export singleton instance const unfollowManager = new UnfollowManager; /** * Timer Feature * Displays countdown timer in top-left corner to limit browsing time * Shows blocking modal when time expires */ class TimerEngine { constructor() { this.timeRemaining = 0; // seconds this.countdownInterval = null; this.timerElement = null; this.modalElement = null; this.isActive = false; this.isPaused = false; this.settings = null; this.lastSaveTime = null; this.baseDurationSeconds = null; } /** * Get validated timer duration (seconds) from current settings * @returns {number} */ getConfiguredDurationSeconds() { if (!this.settings) return 5 * 60; let durationMinutes = this.settings["timer-duration"]; if (typeof durationMinutes !== "number" || isNaN(durationMinutes) || durationMinutes < 1) { durationMinutes = 5; } if (durationMinutes > 120) { durationMinutes = 120; } return durationMinutes * 60; } /** * Save timer state to sessionStorage (per-tab) * Persists active browsing time only (no wall-clock subtraction). */ saveTimerState() { if (!this.settings || !this.settings["persist-timer"]) { return; } try { const state = { remainingMs: Math.max(0, this.timeRemaining * 1000), isPaused: Boolean(this.isPaused), durationSeconds: this.baseDurationSeconds ?? this.getConfiguredDurationSeconds() }; sessionStorage.setItem(TIMER_STORAGE_KEY, JSON.stringify(state)); this.lastSaveTime = Date.now(); debug("Timer state saved to sessionStorage"); } catch (err) { warn("Failed to save timer state:", err); } } /** * Load timer state from sessionStorage (per-tab) * @returns {{timeRemaining:number,isPaused:boolean}|null} Saved state or null if not available */ loadTimerState() { if (!this.settings || !this.settings["persist-timer"]) { return null; } try { const stateStr = sessionStorage.getItem(TIMER_STORAGE_KEY); if (!stateStr) { return null; } const state = JSON.parse(stateStr); // Validate state structure if (typeof state.remainingMs !== "number" || typeof state.durationSeconds !== "number") { warn("Invalid timer state structure, ignoring"); this.clearTimerState(); return null; } const configuredDurationSeconds = this.getConfiguredDurationSeconds(); if (state.durationSeconds !== configuredDurationSeconds) { this.clearTimerState(); return null; } const remainingMs = Math.max(0, state.remainingMs); const timeRemaining = Math.ceil(remainingMs / 1000); const isPaused = Boolean(state.isPaused); debug("Timer state loaded from sessionStorage"); return { timeRemaining, isPaused }; } catch (err) { warn("Failed to load timer state:", err); return null; } } /** * Clear saved timer state from sessionStorage */ clearTimerState() { try { sessionStorage.removeItem(TIMER_STORAGE_KEY); debug("Timer state cleared from sessionStorage"); } catch (err) { warn("Failed to clear timer state:", err); } } /** * Initialize timer * @param {Object} settings */ async init(settings) { try { this.settings = settings; // If persistence is disabled, ensure old state can't be restored later in this tab. if (!settings["persist-timer"]) { this.clearTimerState(); } // Check if timer is enabled if (!settings["timer-enabled"] || !settings["main-toggle"]) { debug("Timer disabled or main toggle off, destroying timer"); if (!settings["timer-enabled"]) { this.clearTimerState(); } this.destroy({ skipSave: true }); return; } log("Initializing timer"); // Validate and sanitize duration let durationMinutes = settings["timer-duration"]; // Handle invalid values (NaN, undefined, null, 0, negative) if (typeof durationMinutes !== "number" || isNaN(durationMinutes) || durationMinutes < 1) { warn("Invalid timer duration, using default: 5 minutes"); durationMinutes = 5; } // Clamp to valid range (1-120 minutes) if (durationMinutes > 120) { warn("Timer duration exceeds max (120), clamping to 120 minutes"); durationMinutes = 120; } this.baseDurationSeconds = durationMinutes * 60; this.timeRemaining = this.baseDurationSeconds; // convert to seconds debug(`Timer initialized with ${durationMinutes} minutes (${this.timeRemaining} seconds)`); // Try to load saved state if persist is enabled const savedState = this.loadTimerState(); if (savedState) { this.timeRemaining = savedState.timeRemaining; this.isPaused = savedState.isPaused || false; debug(`Restored timer state: ${this.timeRemaining}s remaining, paused: ${this.isPaused}`); } // Create timer display element this.createTimerElement(); // Update pause button to reflect restored state this.updatePauseButton(); // If restored/initialized at or below zero, treat as expired immediately if (this.timeRemaining <= 0) { this.timeRemaining = 0; this.isPaused = true; this.updateTimerDisplay(); this.updatePauseButton(); this.isActive = true; eventBus.emit(EVENTS.MODULE_TIMER_INIT); this.onTimeExpired(); return; } // Start countdown this.startCountdown(); this.isActive = true; eventBus.emit(EVENTS.MODULE_TIMER_INIT); } catch (err) { errorWithStack(err, "timer init"); } } /** * Format time as MM:SS * @param {number} seconds * @returns {string} */ formatTime(seconds) { const mins = Math.floor(seconds / 60); const secs = seconds % 60; return `${mins.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")}`; } /** * Create timer display element in top-left corner */ createTimerElement() { if (this.timerElement) { // Already exists, just update time this.updateTimerDisplay(); return; } const timer = document.createElement("div"); timer.className = `${CLASS_PREFIX}timer`; timer.setAttribute("role", "timer"); timer.setAttribute("aria-live", "polite"); const timeDisplay = document.createElement("div"); timeDisplay.className = `${CLASS_PREFIX}timer-time`; timeDisplay.textContent = this.formatTime(this.timeRemaining); const controls = document.createElement("div"); controls.className = `${CLASS_PREFIX}timer-controls`; const pauseBtn = document.createElement("button"); pauseBtn.className = `${CLASS_PREFIX}timer-btn ${CLASS_PREFIX}timer-pause-btn`; pauseBtn.textContent = "Pause"; pauseBtn.setAttribute("aria-label", "Pause timer"); pauseBtn.addEventListener("click", () => this.togglePause()); const resetBtn = document.createElement("button"); resetBtn.className = `${CLASS_PREFIX}timer-btn ${CLASS_PREFIX}timer-reset-btn`; resetBtn.textContent = "Reset"; resetBtn.setAttribute("aria-label", "Reset timer"); resetBtn.addEventListener("click", () => this.resetCountdown()); controls.appendChild(pauseBtn); controls.appendChild(resetBtn); timer.appendChild(timeDisplay); timer.appendChild(controls); document.body.appendChild(timer); this.timerElement = timer; debug("Timer element created"); } /** * Update timer display with current time */ updateTimerDisplay() { if (!this.timerElement) return; const timeDisplay = this.timerElement.querySelector(`.${CLASS_PREFIX}timer-time`); if (timeDisplay) { timeDisplay.textContent = this.formatTime(this.timeRemaining); // Add warning class when under 30 seconds if (this.timeRemaining <= 30 && this.timeRemaining > 0) { this.timerElement.classList.add(`${CLASS_PREFIX}timer--warning`); } else { this.timerElement.classList.remove(`${CLASS_PREFIX}timer--warning`); } } } /** * Start countdown */ startCountdown() { if (this.countdownInterval) { stateManager.removeInterval(this.countdownInterval); } // Don't reset pause state if it was already set (e.g., from restored state) // Only set to false if it's undefined/null (first initialization) if (this.isPaused === undefined || this.isPaused === null) { this.isPaused = false; } this.updatePauseButton(); // Use Page Visibility API to only count down when tab is active const decrementTime = () => { if (document.hidden || this.isPaused) { // Don't count down when tab is hidden or paused return; } if (this.timeRemaining <= 0) { this.timeRemaining = 0; this.updateTimerDisplay(); this.onTimeExpired(); return; } this.timeRemaining = Math.max(0, this.timeRemaining - 1); this.updateTimerDisplay(); // Save state every 5 seconds if persist is enabled if (this.settings["persist-timer"] && (!this.lastSaveTime || Date.now() - this.lastSaveTime >= 5000)) { this.saveTimerState(); } if (this.timeRemaining <= 0) { this.timeRemaining = 0; this.updateTimerDisplay(); this.onTimeExpired(); } }; this.countdownInterval = setInterval(decrementTime, 1e3); stateManager.addInterval(this.countdownInterval); debug("Countdown started"); } /** * Toggle pause/resume */ togglePause() { this.isPaused = !this.isPaused; this.updatePauseButton(); // Save state when pausing/resuming this.saveTimerState(); debug(`Timer ${this.isPaused ? "paused" : "resumed"}`); } /** * Update pause button text and state */ updatePauseButton() { if (!this.timerElement) return; const pauseBtn = this.timerElement.querySelector(`.${CLASS_PREFIX}timer-pause-btn`); if (pauseBtn) { pauseBtn.textContent = this.isPaused ? "Resume" : "Pause"; pauseBtn.setAttribute("aria-label", this.isPaused ? "Resume timer" : "Pause timer"); } } /** * Reset countdown to initial duration */ resetCountdown() { if (!this.settings) return; this.baseDurationSeconds = this.getConfiguredDurationSeconds(); this.timeRemaining = this.baseDurationSeconds; this.isPaused = false; this.updateTimerDisplay(); this.updatePauseButton(); // Ensure countdown is running (e.g., after expiration) this.startCountdown(); // Save state on reset this.saveTimerState(); // Close modal if open if (this.modalElement) { this.closeBlockingModal(); } debug("Timer reset"); } /** * Called when time expires */ onTimeExpired() { // Stop countdown if (this.countdownInterval) { stateManager.removeInterval(this.countdownInterval); this.countdownInterval = null; } this.timeRemaining = 0; this.isPaused = true; this.updateTimerDisplay(); this.updatePauseButton(); if (this.settings && this.settings["persist-timer"]) { this.saveTimerState(); } else { this.clearTimerState(); } // Show blocking modal this.showBlockingModal(); log("Timer expired"); eventBus.emit(EVENTS.TIMER_EXPIRED); } /** * Show blocking modal when time is up */ showBlockingModal() { if (this.modalElement) { // Modal already exists return; } const modal = document.createElement("div"); modal.className = `${CLASS_PREFIX}timer-modal`; modal.setAttribute("role", "dialog"); modal.setAttribute("aria-modal", "true"); modal.setAttribute("aria-labelledby", `${CLASS_PREFIX}timer-modal-title`); const overlay = document.createElement("div"); overlay.className = `${CLASS_PREFIX}timer-modal-overlay`; const content = document.createElement("div"); content.className = `${CLASS_PREFIX}timer-modal-content`; const title = document.createElement("h2"); title.id = `${CLASS_PREFIX}timer-modal-title`; title.className = `${CLASS_PREFIX}timer-modal-title`; title.textContent = "Time's Up!"; const message = document.createElement("p"); message.className = `${CLASS_PREFIX}timer-modal-message`; message.textContent = "Your LinkedIn browsing time has expired. Time to get back to work!"; const buttonContainer = document.createElement("div"); buttonContainer.className = `${CLASS_PREFIX}timer-modal-buttons`; const continueBtn = document.createElement("button"); continueBtn.className = `${CLASS_PREFIX}timer-modal-btn ${CLASS_PREFIX}timer-modal-btn--primary`; continueBtn.textContent = "Continue Anyway"; continueBtn.addEventListener("click", () => this.onContinueAnyway()); const closeBtn = document.createElement("button"); closeBtn.className = `${CLASS_PREFIX}timer-modal-btn ${CLASS_PREFIX}timer-modal-btn--secondary`; closeBtn.textContent = "Leave LinkedIn"; closeBtn.addEventListener("click", () => this.onLeaveSite()); buttonContainer.appendChild(continueBtn); buttonContainer.appendChild(closeBtn); content.appendChild(title); content.appendChild(message); content.appendChild(buttonContainer); modal.appendChild(overlay); modal.appendChild(content); document.body.appendChild(modal); this.modalElement = modal; // Focus the continue button for accessibility continueBtn.focus(); debug("Blocking modal shown"); } /** * Handle "Continue Anyway" button click */ onContinueAnyway() { // Extend time by same duration if (!this.settings) return; // Validate and sanitize duration (same as init) let durationMinutes = this.settings["timer-duration"]; if (typeof durationMinutes !== "number" || isNaN(durationMinutes) || durationMinutes < 1) { durationMinutes = 5; } if (durationMinutes > 120) { durationMinutes = 120; } this.baseDurationSeconds = durationMinutes * 60; this.timeRemaining = this.baseDurationSeconds; this.updateTimerDisplay(); // Save state after extending this.saveTimerState(); // Close modal and restart countdown this.closeBlockingModal(); this.startCountdown(); debug("Timer extended"); } /** * Handle "Leave LinkedIn" button click */ onLeaveSite() { // Close LinkedIn tab window.close(); // Fallback if window.close() doesn't work (some browsers block it) setTimeout(() => { window.location.href = "about:blank"; }, 100); } /** * Close blocking modal */ closeBlockingModal() { if (this.modalElement) { this.modalElement.remove(); this.modalElement = null; debug("Blocking modal closed"); } } /** * Destroy timer and cleanup * @param {{skipSave?: boolean}} [options] */ destroy(options = {}) { const skipSave = options && options.skipSave === true; // Save final state before destroying if persist is enabled if (!skipSave && this.settings && this.settings["persist-timer"] && this.isActive) { this.saveTimerState(); } if (this.countdownInterval) { stateManager.removeInterval(this.countdownInterval); this.countdownInterval = null; } if (this.timerElement) { this.timerElement.remove(); this.timerElement = null; } if (this.modalElement) { this.modalElement.remove(); this.modalElement = null; } this.isActive = false; this.isPaused = false; this.timeRemaining = 0; this.settings = null; this.lastSaveTime = null; this.baseDurationSeconds = null; eventBus.emit(EVENTS.MODULE_TIMER_DESTROY); debug("Timer destroyed"); } } // Export singleton instance const timerEngine = new TimerEngine; /** * CSS Styles for LinkedIn Tweeks Userscript * All classes prefixed with linkedin-tweeks-us- to avoid conflicts */ const CSS_STYLES = `\n/* Hide/Dim classes for filtered content */\n.${CLASS_PREFIX}hide {\n display: none !important;\n}\n\n.${CLASS_PREFIX}dim {\n opacity: 0.3 !important;\n filter: grayscale(80%) !important;\n transition: opacity 0.2s, filter 0.2s !important;\n}\n\n.${CLASS_PREFIX}dim:hover {\n opacity: 0.6 !important;\n filter: grayscale(40%) !important;\n}\n\n/* Show icon indicator for hidden/dimmed posts */\n.${CLASS_PREFIX}show-icon::before {\n content: '👁️';\n position: absolute;\n top: 10px;\n right: 10px;\n background: rgba(0, 0, 0, 0.7);\n color: white;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n z-index: 10;\n pointer-events: none;\n}\n\n/* Wide mode - expand feed and main content */\nbody.linkedin-tweeks-wide-mode .scaffold-finite-scroll__content {\n max-width: 100% !important;\n}\n\nbody.linkedin-tweeks-wide-mode .scaffold-layout__main {\n max-width: 100% !important;\n}\n\nbody.linkedin-tweeks-wide-mode .feed-shared-update-v2 {\n max-width: 100% !important;\n}\n\n/* Additional wide-mode selectors for LinkedIn's layout structure */\nbody.linkedin-tweeks-wide-mode .scaffold-layout-container {\n max-width: 100% !important;\n}\n\nbody.linkedin-tweeks-wide-mode .scaffold-layout {\n max-width: 100% !important;\n}\n\nbody.linkedin-tweeks-wide-mode main {\n max-width: 100% !important;\n}\n\nbody.linkedin-tweeks-wide-mode .core-rail {\n max-width: 100% !important;\n}\n\nbody.linkedin-tweeks-wide-mode .scaffold-layout__row {\n max-width: 100% !important;\n}\n\n/* Dark mode - apply filter to entire page */\nhtml.linkedin-tweeks-dark-mode {\n filter: invert(1) hue-rotate(180deg);\n}\n\n/* Invert images and videos back so they look normal */\nhtml.linkedin-tweeks-dark-mode img,\nhtml.linkedin-tweeks-dark-mode video,\nhtml.linkedin-tweeks-dark-mode [style*="background-image"] {\n filter: invert(1) hue-rotate(180deg);\n}\n\n/* Launcher button */\n.${CLASS_PREFIX}launcher {\n position: fixed;\n top: 20px;\n right: 20px;\n width: 56px;\n height: 56px;\n border-radius: 50%;\n background: #0066da;\n color: white;\n border: none;\n cursor: pointer;\n box-shadow: 0 4px 12px rgba(0, 102, 218, 0.4);\n z-index: 9999;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.3s ease;\n font-size: 24px;\n}\n\n.${CLASS_PREFIX}launcher:hover {\n background: #0052a3;\n box-shadow: 0 6px 16px rgba(0, 102, 218, 0.6);\n transform: scale(1.05);\n}\n\n.${CLASS_PREFIX}launcher:active {\n transform: scale(0.95);\n}\n\n/* Settings panel */\n.${CLASS_PREFIX}panel {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 420px;\n max-width: 90vw;\n max-height: 85vh;\n background: white;\n border-radius: 12px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);\n z-index: 10000;\n display: none;\n flex-direction: column;\n overflow: hidden;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n}\n\n.${CLASS_PREFIX}panel.${CLASS_PREFIX}panel-visible {\n display: flex;\n}\n\n/* Panel header */\n.${CLASS_PREFIX}panel-header {\n background: #0066da;\n color: white;\n padding: 16px 20px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: move;\n flex: 0 0 auto;\n}\n\n.${CLASS_PREFIX}panel-title {\n display: flex;\n align-items: center;\n gap: 10px;\n font-size: 18px;\n font-weight: 600;\n}\n\n.${CLASS_PREFIX}panel-version {\n background: rgba(255, 255, 255, 0.2);\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 500;\n}\n\n.${CLASS_PREFIX}panel-close {\n background: none;\n border: none;\n color: white;\n font-size: 24px;\n cursor: pointer;\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n transition: background 0.2s;\n}\n\n.${CLASS_PREFIX}panel-close:hover {\n background: rgba(255, 255, 255, 0.2);\n}\n\n/* Tab navigation */\n.${CLASS_PREFIX}tabs {\n display: flex;\n background: #f3f6f8;\n border-bottom: 1px solid #e0e0e0;\n overflow-x: auto;\n flex: 0 0 auto;\n}\n\n.${CLASS_PREFIX}tab {\n flex: 1;\n padding: 12px 16px;\n background: none;\n border: none;\n cursor: pointer;\n font-size: 14px;\n font-weight: 500;\n color: #666;\n transition: all 0.2s;\n border-bottom: 2px solid transparent;\n white-space: nowrap;\n}\n\n.${CLASS_PREFIX}tab:hover {\n background: rgba(0, 102, 218, 0.05);\n color: #0066da;\n}\n\n.${CLASS_PREFIX}tab.${CLASS_PREFIX}tab-active {\n color: #0066da;\n border-bottom-color: #0066da;\n background: white;\n}\n\n/* Panel content */\n.${CLASS_PREFIX}panel-content {\n flex: 1 1 auto;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 20px;\n min-height: 0;\n}\n\n.${CLASS_PREFIX}section {\n margin-bottom: 24px;\n}\n\n.${CLASS_PREFIX}section-title {\n font-size: 14px;\n font-weight: 600;\n color: #333;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n/* Switch control */\n.${CLASS_PREFIX}control {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px;\n background: #f9f9f9;\n border-radius: 8px;\n margin-bottom: 8px;\n transition: background 0.2s;\n}\n\n.${CLASS_PREFIX}control:hover {\n background: #f0f0f0;\n}\n\n.${CLASS_PREFIX}control-label {\n font-size: 14px;\n color: #333;\n flex: 1;\n cursor: pointer;\n}\n\n.${CLASS_PREFIX}control-label-help {\n font-size: 12px;\n color: #666;\n display: block;\n margin-top: 4px;\n}\n\n/* Vertical control layout for text inputs and selects */\n.${CLASS_PREFIX}control-vertical {\n flex-direction: column;\n align-items: stretch;\n justify-content: flex-start;\n gap: 6px;\n}\n\n.${CLASS_PREFIX}control-vertical .${CLASS_PREFIX}control-label {\n margin-bottom: 0;\n font-weight: 600;\n}\n\n.${CLASS_PREFIX}control-vertical .${CLASS_PREFIX}control-label--block {\n display: block;\n cursor: default;\n}\n\n.${CLASS_PREFIX}switch {\n position: relative;\n width: 48px;\n height: 24px;\n}\n\n.${CLASS_PREFIX}switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n\n.${CLASS_PREFIX}switch-slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #ccc;\n transition: 0.3s;\n border-radius: 24px;\n}\n\n.${CLASS_PREFIX}switch-slider:before {\n position: absolute;\n content: "";\n height: 18px;\n width: 18px;\n left: 3px;\n bottom: 3px;\n background-color: white;\n transition: 0.3s;\n border-radius: 50%;\n}\n\n.${CLASS_PREFIX}switch input:checked + .${CLASS_PREFIX}switch-slider {\n background-color: #0066da;\n}\n\n.${CLASS_PREFIX}switch input:checked + .${CLASS_PREFIX}switch-slider:before {\n transform: translateX(24px);\n}\n\n/* Select dropdown */\n.${CLASS_PREFIX}select {\n width: 100%;\n padding: 10px 12px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n line-height: 1.5;\n height: auto;\n min-height: 44px;\n background: white;\n cursor: pointer;\n transition: border 0.2s;\n box-sizing: border-box;\n vertical-align: middle;\n}\n\n.${CLASS_PREFIX}select:hover {\n border-color: #0066da;\n}\n\n.${CLASS_PREFIX}select:focus {\n outline: none;\n border-color: #0066da;\n box-shadow: 0 0 0 3px rgba(0, 102, 218, 0.1);\n}\n\n/* Text input */\n.${CLASS_PREFIX}input {\n width: 100%;\n padding: 10px 12px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n line-height: 1.5;\n transition: border 0.2s;\n}\n\n.${CLASS_PREFIX}input:hover {\n border-color: #0066da;\n}\n\n.${CLASS_PREFIX}input:focus {\n outline: none;\n border-color: #0066da;\n box-shadow: 0 0 0 3px rgba(0, 102, 218, 0.1);\n}\n\n/* Keyword chips */\n.${CLASS_PREFIX}chips {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n padding: 8px;\n border: 1px solid #ddd;\n border-radius: 6px;\n min-height: 40px;\n background: white;\n}\n\n.${CLASS_PREFIX}chip {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n background: #e3f2fd;\n color: #0066da;\n padding: 4px 10px;\n border-radius: 16px;\n font-size: 13px;\n}\n\n.${CLASS_PREFIX}chip-remove {\n background: none;\n border: none;\n color: #0066da;\n cursor: pointer;\n font-size: 16px;\n line-height: 1;\n padding: 0;\n width: 16px;\n height: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.${CLASS_PREFIX}chip-remove:hover {\n color: #d32f2f;\n}\n\n/* Button */\n.${CLASS_PREFIX}button {\n width: 100%;\n padding: 12px 16px;\n background: #0066da;\n color: white;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.${CLASS_PREFIX}button:hover {\n background: #0052a3;\n}\n\n.${CLASS_PREFIX}button:active {\n transform: scale(0.98);\n}\n\n.${CLASS_PREFIX}button:disabled {\n background: #ccc;\n cursor: not-allowed;\n}\n\n.${CLASS_PREFIX}button-secondary {\n background: #f3f6f8;\n color: #333;\n}\n\n.${CLASS_PREFIX}button-secondary:hover {\n background: #e0e0e0;\n}\n\n/* Panel footer */\n.${CLASS_PREFIX}panel-footer {\n padding: 16px 20px;\n background: #f9f9f9;\n border-top: 1px solid #e0e0e0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.${CLASS_PREFIX}panel-links {\n display: flex;\n justify-content: center;\n gap: 16px;\n font-size: 13px;\n}\n\n.${CLASS_PREFIX}panel-link {\n color: #0066da;\n text-decoration: none;\n transition: color 0.2s;\n}\n\n.${CLASS_PREFIX}panel-link:hover {\n color: #0052a3;\n text-decoration: underline;\n}\n\n.${CLASS_PREFIX}panel-footer-text {\n text-align: center;\n font-size: 12px;\n color: #666;\n}\n\n/* Toast notifications */\n.${CLASS_PREFIX}toast {\n position: fixed;\n bottom: 90px;\n right: 20px;\n background: #333;\n color: white;\n padding: 12px 20px;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n z-index: 10001;\n font-size: 14px;\n animation: ${CLASS_PREFIX}slideIn 0.3s ease-out;\n}\n\n@keyframes ${CLASS_PREFIX}slideIn {\n from {\n transform: translateX(400px);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n.${CLASS_PREFIX}toast-success {\n background: #4caf50;\n}\n\n.${CLASS_PREFIX}toast-error {\n background: #f44336;\n}\n\n.${CLASS_PREFIX}toast-warning {\n background: #ff9800;\n}\n\n/* Error banner */\n.${CLASS_PREFIX}error-banner {\n background: #fff3cd;\n border: 1px solid #ffc107;\n border-radius: 6px;\n padding: 12px;\n margin-bottom: 16px;\n font-size: 13px;\n color: #856404;\n}\n\n.${CLASS_PREFIX}error-banner strong {\n display: block;\n margin-bottom: 4px;\n}\n\n/* Overlay */\n.${CLASS_PREFIX}overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.5);\n z-index: 9998;\n display: none;\n}\n\n.${CLASS_PREFIX}overlay.${CLASS_PREFIX}overlay-visible {\n display: block;\n}\n\n/* Main toggle disabled state - panel-level modifier */\n.${CLASS_PREFIX}panel--disabled .${CLASS_PREFIX}control--disabled {\n opacity: 0.5;\n pointer-events: none;\n cursor: not-allowed;\n}\n\n.${CLASS_PREFIX}panel--disabled .${CLASS_PREFIX}control--disabled .${CLASS_PREFIX}control-label {\n color: #999;\n cursor: not-allowed;\n}\n\n.${CLASS_PREFIX}panel--disabled .${CLASS_PREFIX}control--disabled .${CLASS_PREFIX}switch {\n cursor: not-allowed;\n}\n\n.${CLASS_PREFIX}panel--disabled .${CLASS_PREFIX}control--disabled .${CLASS_PREFIX}switch-slider {\n cursor: not-allowed;\n background-color: #e0e0e0;\n}\n\n/* Disabled tab buttons */\n.${CLASS_PREFIX}tab--disabled {\n opacity: 0.5;\n cursor: not-allowed !important;\n pointer-events: auto;\n color: #999 !important;\n}\n\n.${CLASS_PREFIX}tab--disabled:hover {\n background: none !important;\n color: #999 !important;\n}\n\n/* Disabled banner at top of General tab */\n.${CLASS_PREFIX}disabled-banner {\n background: #fff3cd;\n border: 1px solid #ffc107;\n border-radius: 6px;\n padding: 12px 16px;\n margin-bottom: 16px;\n font-size: 14px;\n color: #856404;\n}\n\n.${CLASS_PREFIX}disabled-banner p {\n margin: 0;\n font-weight: 500;\n}\n\n/* Disabled overlay for tab content */\n.${CLASS_PREFIX}disabled-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.85);\n backdrop-filter: blur(2px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10;\n pointer-events: all;\n cursor: not-allowed;\n}\n\n.${CLASS_PREFIX}disabled-overlay-message {\n background: #f3f6f8;\n border: 2px solid #e0e0e0;\n border-radius: 8px;\n padding: 20px 24px;\n font-size: 14px;\n font-weight: 500;\n color: #666;\n text-align: center;\n max-width: 80%;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n\n/* Tab content needs relative positioning for overlay */\n.${CLASS_PREFIX}tab-content {\n position: relative;\n}\n\n/* Accessibility */\n.${CLASS_PREFIX}sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n/* Focus styles */\n*:focus-visible {\n outline: 2px solid #0066da;\n outline-offset: 2px;\n}\n\n/* Prevent focus on disabled elements */\n.${CLASS_PREFIX}panel--disabled .${CLASS_PREFIX}control--disabled *:focus-visible,\n.${CLASS_PREFIX}tab--disabled:focus-visible {\n outline: none;\n}\n\n/* Disabled elements should show not-allowed cursor */\n.${CLASS_PREFIX}panel--disabled .${CLASS_PREFIX}control--disabled * {\n cursor: not-allowed !important;\n}\n\n.${CLASS_PREFIX}tab--disabled {\n cursor: not-allowed !important;\n}\n\n/* Dark mode support (if enabled) */\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}panel {\n background: #1e1e1e;\n color: #e0e0e0;\n}\n\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}tabs {\n background: #2a2a2a;\n border-bottom-color: #444;\n}\n\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}tab {\n color: #bbb;\n}\n\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}tab-active {\n background: #1e1e1e;\n color: #4da3ff;\n}\n\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}control {\n background: #2a2a2a;\n color: #e0e0e0;\n}\n\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}control-label {\n color: #e0e0e0;\n}\n\n.${CLASS_PREFIX}dark-mode .${CLASS_PREFIX}panel-footer {\n background: #2a2a2a;\n border-top-color: #444;\n}\n\n/* Timer styles */\n.${CLASS_PREFIX}timer {\n position: fixed;\n top: 20px;\n left: 20px;\n background: rgba(255, 255, 255, 0.95);\n border: 2px solid #0066cc;\n border-radius: 8px;\n padding: 12px 16px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n z-index: 999999;\n font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;\n min-width: 140px;\n}\n\n.${CLASS_PREFIX}timer-time {\n font-size: 24px;\n font-weight: bold;\n color: #0066cc;\n text-align: center;\n margin-bottom: 8px;\n font-variant-numeric: tabular-nums;\n letter-spacing: 0.05em;\n}\n\n.${CLASS_PREFIX}timer--warning .${CLASS_PREFIX}timer-time {\n color: #d32f2f;\n animation: ${CLASS_PREFIX}timer-pulse 1s ease-in-out infinite;\n}\n\n.${CLASS_PREFIX}timer--warning {\n border-color: #d32f2f;\n}\n\n@keyframes ${CLASS_PREFIX}timer-pulse {\n 0%, 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.6;\n }\n}\n\n.${CLASS_PREFIX}timer-controls {\n display: flex;\n gap: 6px;\n justify-content: center;\n}\n\n.${CLASS_PREFIX}timer-btn {\n padding: 4px 10px;\n font-size: 11px;\n font-weight: 500;\n border: 1px solid #ddd;\n border-radius: 4px;\n background: white;\n color: #666;\n cursor: pointer;\n transition: all 0.2s ease;\n font-family: inherit;\n}\n\n.${CLASS_PREFIX}timer-btn:hover {\n background: #f5f5f5;\n border-color: #0066cc;\n color: #0066cc;\n}\n\n.${CLASS_PREFIX}timer-btn:active {\n transform: scale(0.95);\n}\n\n/* Timer modal */\n.${CLASS_PREFIX}timer-modal {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 9999999;\n display: flex;\n align-items: center;\n justify-content: center;\n font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;\n}\n\n.${CLASS_PREFIX}timer-modal-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.8);\n backdrop-filter: blur(4px);\n}\n\n.${CLASS_PREFIX}timer-modal-content {\n position: relative;\n background: white;\n border-radius: 12px;\n padding: 32px;\n max-width: 450px;\n width: 90%;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);\n text-align: center;\n}\n\n.${CLASS_PREFIX}timer-modal-title {\n font-size: 28px;\n font-weight: 700;\n color: #d32f2f;\n margin: 0 0 16px 0;\n}\n\n.${CLASS_PREFIX}timer-modal-message {\n font-size: 16px;\n color: #333;\n line-height: 1.6;\n margin: 0 0 24px 0;\n}\n\n.${CLASS_PREFIX}timer-modal-buttons {\n display: flex;\n gap: 12px;\n justify-content: center;\n}\n\n.${CLASS_PREFIX}timer-modal-btn {\n padding: 12px 24px;\n font-size: 14px;\n font-weight: 600;\n border-radius: 6px;\n border: none;\n cursor: pointer;\n transition: all 0.2s ease;\n font-family: inherit;\n min-width: 140px;\n}\n\n.${CLASS_PREFIX}timer-modal-btn--primary {\n background: #0066cc;\n color: white;\n}\n\n.${CLASS_PREFIX}timer-modal-btn--primary:hover {\n background: #0052a3;\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3);\n}\n\n.${CLASS_PREFIX}timer-modal-btn--secondary {\n background: #f5f5f5;\n color: #666;\n}\n\n.${CLASS_PREFIX}timer-modal-btn--secondary:hover {\n background: #e0e0e0;\n color: #333;\n}\n\n.${CLASS_PREFIX}timer-modal-btn:active {\n transform: translateY(0);\n}\n` /** * Settings Panel UI * Builds and manages the in-page settings interface */; class SettingsPanel { constructor() { this.panel = null; this.overlay = null; this.launcher = null; this.currentTab = "home"; this.isVisible = false; this.isMasterEnabled = true; // Track main toggle state } /** * Initialize and inject the settings panel */ async init() { try { log("Initializing settings panel"); // Inject CSS this.injectStyles(); // Create launcher button this.createLauncher(); // Create overlay this.createOverlay(); // Create panel this.createPanel(); // Setup event listeners this.setupEventListeners(); debug("Settings panel initialized"); } catch (err) { console.error("Failed to initialize settings panel:", err); } } /** * Inject CSS styles */ injectStyles() { const styleEl = document.createElement("style"); styleEl.id = `${CLASS_PREFIX}styles`; styleEl.textContent = CSS_STYLES; document.head.appendChild(styleEl); } /** * Create launcher button */ createLauncher() { this.launcher = document.createElement("button"); this.launcher.className = `${CLASS_PREFIX}launcher`; this.launcher.title = "LinkedIn Tweeks Settings"; this.launcher.setAttribute("aria-label", "Open LinkedIn Tweeks settings"); this.launcher.textContent = "⚙️"; this.launcher.addEventListener("click", () => { this.toggle(); }); document.body.appendChild(this.launcher); } /** * Create overlay */ createOverlay() { this.overlay = document.createElement("div"); this.overlay.className = `${CLASS_PREFIX}overlay`; this.overlay.addEventListener("click", () => { this.close(); }); document.body.appendChild(this.overlay); } /** * Create main panel using DOM methods (CSP-safe) */ createPanel() { this.panel = document.createElement("div"); this.panel.className = `${CLASS_PREFIX}panel`; this.panel.setAttribute("role", "dialog"); this.panel.setAttribute("aria-label", "LinkedIn Tweeks Settings"); // Header const header = document.createElement("div"); header.className = `${CLASS_PREFIX}panel-header`; const title = document.createElement("div"); title.className = `${CLASS_PREFIX}panel-title`; const titleText = document.createElement("span"); titleText.textContent = "LinkedIn Tweeks"; title.appendChild(titleText); const closeBtn = document.createElement("button"); closeBtn.className = `${CLASS_PREFIX}panel-close`; closeBtn.setAttribute("aria-label", "Close settings"); closeBtn.textContent = "×"; header.appendChild(title); header.appendChild(closeBtn); // Tabs const tabs = document.createElement("div"); tabs.className = `${CLASS_PREFIX}tabs`; tabs.setAttribute("role", "tablist"); const tabsData = [ { name: "home", label: "General", active: true }, { name: "feed", label: "Feed", active: false }, { name: "jobs", label: "Jobs", active: false }, { name: "misc", label: "Misc", active: false } ]; tabsData.forEach(tabData => { const tab = document.createElement("button"); tab.className = `${CLASS_PREFIX}tab${tabData.active ? ` ${CLASS_PREFIX}tab-active` : ""}`; tab.setAttribute("data-tab", tabData.name); tab.setAttribute("role", "tab"); tab.setAttribute("aria-selected", tabData.active.toString()); tab.textContent = tabData.label; tabs.appendChild(tab); }); // Content const content = document.createElement("div"); content.className = `${CLASS_PREFIX}panel-content`; content.setAttribute("role", "tabpanel"); tabsData.forEach(tabData => { const tabContent = document.createElement("div"); tabContent.className = `${CLASS_PREFIX}tab-content`; tabContent.setAttribute("data-tab-content", tabData.name); if (!tabData.active) tabContent.style.display = "none"; content.appendChild(tabContent); }); // Assemble panel this.panel.appendChild(header); this.panel.appendChild(tabs); this.panel.appendChild(content); document.body.appendChild(this.panel); // Populate tab content this.populateTabContent(); } /** * Populate tab content with controls */ populateTabContent() { const settings = settingsManager.getAll(); // Home tab this.renderHomeTab(settings); // Feed tab this.renderFeedTab(settings); // Jobs tab this.renderJobsTab(settings); // Misc tab this.renderMiscTab(settings); } /** * Apply main toggle state to entire panel * Governs whether other settings are accessible * @param {boolean} isEnabled */ applyMainToggleState(isEnabled) { this.isMasterEnabled = isEnabled; // Toggle panel-level CSS class if (isEnabled) { this.panel.classList.remove(`${CLASS_PREFIX}panel--disabled`); } else { this.panel.classList.add(`${CLASS_PREFIX}panel--disabled`); } // Handle General tab controls (except master toggle) const homeTab = this.panel.querySelector('[data-tab-content="home"]'); if (homeTab) { const controls = homeTab.querySelectorAll("[data-setting]"); controls.forEach(control => { const settingKey = control.getAttribute("data-setting"); // Skip the master toggle itself if (settingKey === "main-toggle") { return; } // Disable/enable the control control.disabled = !isEnabled; control.setAttribute("aria-disabled", (!isEnabled).toString()); // Also disable the parent switch/control wrapper const controlWrapper = control.closest(`.${CLASS_PREFIX}control`); if (controlWrapper) { if (isEnabled) { controlWrapper.classList.remove(`${CLASS_PREFIX}control--disabled`); } else { controlWrapper.classList.add(`${CLASS_PREFIX}control--disabled`); } } }); // Add/remove disabled banner this.updateDisabledBanner(homeTab, isEnabled); } // Handle tab buttons (Feed, Jobs, Misc) const tabs = this.panel.querySelectorAll(`.${CLASS_PREFIX}tab`); tabs.forEach(tab => { const tabName = tab.getAttribute("data-tab"); // Skip home tab if (tabName === "home") { return; } if (isEnabled) { tab.removeAttribute("aria-disabled"); tab.removeAttribute("tabindex"); tab.classList.remove(`${CLASS_PREFIX}tab--disabled`); } else { tab.setAttribute("aria-disabled", "true"); tab.setAttribute("tabindex", "-1"); tab.classList.add(`${CLASS_PREFIX}tab--disabled`); } }); // Handle tab content (add overlay when disabled) const tabContents = this.panel.querySelectorAll(`.${CLASS_PREFIX}tab-content`); tabContents.forEach(content => { const tabName = content.getAttribute("data-tab-content"); // Skip home tab if (tabName === "home") { return; } if (isEnabled) { // Remove overlay if it exists const overlay = content.querySelector(`.${CLASS_PREFIX}disabled-overlay`); if (overlay) { overlay.remove(); } } else { // Add overlay if it doesn't exist if (!content.querySelector(`.${CLASS_PREFIX}disabled-overlay`)) { const overlay = document.createElement("div"); overlay.className = `${CLASS_PREFIX}disabled-overlay`; const message = document.createElement("div"); message.className = `${CLASS_PREFIX}disabled-overlay-message`; message.textContent = "Enable LinkedIn Tweeks in the General tab to configure these settings"; overlay.appendChild(message); content.appendChild(overlay); } } }); // Emit tracking event if (isEnabled) { eventBus.emit(EVENTS.UI_MAIN_TOGGLE_ENABLED); debug("Main toggle enabled - all controls active"); } else { eventBus.emit(EVENTS.UI_MAIN_TOGGLE_DISABLED); debug("Main toggle disabled - controls locked"); } } /** * Update the disabled banner in General tab * @param {Element} homeTab * @param {boolean} isEnabled */ updateDisabledBanner(homeTab, isEnabled) { const existingBanner = homeTab.querySelector(`.${CLASS_PREFIX}disabled-banner`); if (!isEnabled && !existingBanner) { // Add banner const banner = document.createElement("div"); banner.className = `${CLASS_PREFIX}disabled-banner`; const text = document.createElement("p"); text.textContent = "LinkedIn Tweeks is disabled. Turn it on above to configure features."; banner.appendChild(text); homeTab.insertBefore(banner, homeTab.firstChild); } else if (isEnabled && existingBanner) { // Remove banner existingBanner.remove(); } } /** * Render Home tab */ renderHomeTab(settings) { const container = this.panel.querySelector('[data-tab-content="home"]'); container.replaceChildren(); // Clear existing content (CSP-safe) container.appendChild(this.createSection("General Settings", [ this.createSwitch("main-toggle", "Enable LinkedIn Tweeks", "Master toggle for all features", settings["main-toggle"]), this.createSwitch("gentle-mode", "Gentle Mode", "Dim items instead of hiding them", settings["gentle-mode"]), this.createSwitch("wide-mode", "Wide Mode", "Expand feed to full width", settings["wide-mode"]), this.createSwitch("dark-mode", "Dark Mode", "Apply dark theme to LinkedIn", settings["dark-mode"]) ])); container.appendChild(this.createSection("Timer", [ this.createSwitch("timer-enabled", "Enable Timer", "Show countdown timer to limit browsing time", settings["timer-enabled"]), this.createNumberInput("timer-duration", "Duration (minutes)", settings["timer-duration"], 1, 120), this.createSwitch("persist-timer", "Persist Timer", "Save timer state across page reloads", settings["persist-timer"]) ])); } /** * Render Feed tab */ renderFeedTab(settings) { const container = this.panel.querySelector('[data-tab-content="feed"]'); container.replaceChildren(); // Clear existing content (CSP-safe) container.appendChild(this.createSection("Feed Controls", [ this.createSwitch("hide-whole-feed", "Hide Entire Feed", "Hide the entire feed column", settings["hide-whole-feed"]), this.createSwitch("sort-by-recent", "Sort by Recent", "Automatically sort feed by most recent", settings["sort-by-recent"]) ])); container.appendChild(this.createSection("Age Filtering", [ this.createSelect("hide-by-age", "Hide posts older than", [ "disabled", "hour", "day", "week", "month", "year" ], settings["hide-by-age"]) ])); container.appendChild(this.createSection("Custom Keywords", [ this.createTextInput("feed-keywords", "Keywords (comma-separated)", settings["feed-keywords"]) ])); container.appendChild(this.createSection("Content Filters", [ // Note: 'hide-polls' toggle disabled - LinkedIn's poll markup is unreliable/absent // this.createSwitch('hide-polls', 'Hide Polls', null, settings['hide-polls']), this.createSwitch("hide-videos", "Hide Videos", null, settings["hide-videos"]), this.createSwitch("hide-images", "Hide Images", null, settings["hide-images"]), this.createSwitch("hide-links", "Hide Shortened Links", null, settings["hide-links"]), this.createSwitch("hide-carousels", "Hide Carousels", null, settings["hide-carousels"]), this.createSwitch("hide-promoted", "Hide Promoted Posts", null, settings["hide-promoted"]), this.createSwitch("hide-suggested", "Hide Suggested Posts", null, settings["hide-suggested"]) ])); container.appendChild(this.createSection("Interaction Filters", [ this.createSwitch("hide-shared", "Hide Shared Posts", null, settings["hide-shared"]), this.createSwitch("hide-followed", 'Hide "Following" Posts', null, settings["hide-followed"]), this.createSwitch("hide-liked", 'Hide "Liked" Posts', null, settings["hide-liked"]), this.createSwitch("hide-other-reactions", "Hide Other Reactions", null, settings["hide-other-reactions"]), this.createSwitch("hide-commented-on", 'Hide "Commented On" Posts', null, settings["hide-commented-on"]) ])); container.appendChild(this.createSection("Source Filters", [ this.createSwitch("hide-by-companies", "Hide Company Posts", null, settings["hide-by-companies"]), this.createSwitch("hide-by-people", "Hide Individual Posts", null, settings["hide-by-people"]) ])); } /** * Render Jobs tab */ renderJobsTab(settings) { const container = this.panel.querySelector('[data-tab-content="jobs"]'); container.replaceChildren(); // Clear existing content (CSP-safe) container.appendChild(this.createSection("Job Filtering", [ this.createTextInput("job-keywords", "Keywords to hide (comma-separated)", settings["job-keywords"]), this.createSwitch("hide-promoted-jobs", "Hide Promoted Jobs", null, settings["hide-promoted-jobs"]), this.createSwitch("hide-job-guidance", "Hide Job Guidance", null, settings["hide-job-guidance"]), this.createSwitch("hide-ai-button", "Hide AI Apply Button", null, settings["hide-ai-button"]) ])); } /** * Render Misc tab */ renderMiscTab(settings) { const container = this.panel.querySelector('[data-tab-content="misc"]'); container.replaceChildren(); // Clear existing content (CSP-safe) container.appendChild(this.createSection("UI Elements", [ this.createSwitch("hide-linkedin-learning", "Hide LinkedIn Learning", null, settings["hide-linkedin-learning"]), this.createSwitch("hide-advertisements", "Hide Advertisements", null, settings["hide-advertisements"]), this.createSwitch("hide-follow-recommendations", "Hide Follow Recommendations", null, settings["hide-follow-recommendations"]), this.createSwitch("hide-community-panel", "Hide Community Panel", null, settings["hide-community-panel"]), this.createSwitch("hide-premium", "Hide Premium Upsells", null, settings["hide-premium"]), this.createSwitch("hide-news", "Hide News Module", null, settings["hide-news"]), this.createSwitch("hide-profile-counters", "Hide Profile Counters", null, settings["hide-profile-counters"]), this.createSwitch("hide-notification-count", "Hide Notification Count", null, settings["hide-notification-count"]), this.createSwitch("hide-account-building", "Hide Account Building", null, settings["hide-account-building"]), this.createSwitch("hide-network-building", "Hide Network Building", null, settings["hide-network-building"]), this.createSwitch("hide-bottom-messaging", "Hide Messaging Tray (bottom-right corner)", null, settings["hide-bottom-messaging"]), this.createSwitch("disable-postcount-prompt", "Disable Post Count Alert", null, settings["disable-postcount-prompt"]) ])); // Actions section with button const actionsSection = this.createSection("Actions", []); const button = document.createElement("button"); button.className = `${CLASS_PREFIX}button`; button.id = `${CLASS_PREFIX}unfollow-all`; button.textContent = "Unfollow All"; actionsSection.appendChild(button); container.appendChild(actionsSection); } /** * Helper to create a section with title and controls */ createSection(title, controls) { const section = document.createElement("div"); section.className = `${CLASS_PREFIX}section`; const titleEl = document.createElement("div"); titleEl.className = `${CLASS_PREFIX}section-title`; titleEl.textContent = title; section.appendChild(titleEl); controls.forEach(control => section.appendChild(control)); return section; } /** * Create switch control DOM element */ createSwitch(key, label, help, checked) { const control = document.createElement("div"); control.className = `${CLASS_PREFIX}control`; const labelEl = document.createElement("label"); labelEl.className = `${CLASS_PREFIX}control-label`; labelEl.setAttribute("for", `${CLASS_PREFIX}${key}`); labelEl.textContent = label; if (help) { const helpSpan = document.createElement("span"); helpSpan.className = `${CLASS_PREFIX}control-label-help`; helpSpan.textContent = help; labelEl.appendChild(document.createTextNode(" ")); labelEl.appendChild(helpSpan); } // Wrap the switch in a label so clicking the slider toggles the checkbox const switchLabel = document.createElement("label"); switchLabel.className = `${CLASS_PREFIX}switch`; const input = document.createElement("input"); input.type = "checkbox"; input.id = `${CLASS_PREFIX}${key}`; input.setAttribute("data-setting", key); if (checked) input.checked = true; const slider = document.createElement("span"); slider.className = `${CLASS_PREFIX}switch-slider`; switchLabel.appendChild(input); switchLabel.appendChild(slider); control.appendChild(labelEl); control.appendChild(switchLabel); return control; } /** * Create select control DOM element */ createSelect(key, label, options, selected) { const control = document.createElement("div"); control.className = `${CLASS_PREFIX}control ${CLASS_PREFIX}control-vertical`; const labelEl = document.createElement("label"); labelEl.className = `${CLASS_PREFIX}control-label ${CLASS_PREFIX}control-label--block`; labelEl.setAttribute("for", `${CLASS_PREFIX}${key}`); labelEl.textContent = label; const select = document.createElement("select"); select.className = `${CLASS_PREFIX}select`; select.id = `${CLASS_PREFIX}${key}`; select.setAttribute("data-setting", key); options.forEach(opt => { const option = document.createElement("option"); option.value = opt; option.textContent = opt; if (opt === selected) option.selected = true; select.appendChild(option); }); control.appendChild(labelEl); control.appendChild(select); return control; } /** * Create text input DOM element */ createTextInput(key, label, value) { const control = document.createElement("div"); control.className = `${CLASS_PREFIX}control ${CLASS_PREFIX}control-vertical`; const labelEl = document.createElement("label"); labelEl.className = `${CLASS_PREFIX}control-label ${CLASS_PREFIX}control-label--block`; labelEl.setAttribute("for", `${CLASS_PREFIX}${key}`); labelEl.textContent = label; const input = document.createElement("input"); input.type = "text"; input.className = `${CLASS_PREFIX}input`; input.id = `${CLASS_PREFIX}${key}`; input.setAttribute("data-setting", key); input.value = value || ""; control.appendChild(labelEl); control.appendChild(input); return control; } /** * Create number input DOM element */ createNumberInput(key, label, value, min, max) { const control = document.createElement("div"); control.className = `${CLASS_PREFIX}control ${CLASS_PREFIX}control-vertical`; const labelEl = document.createElement("label"); labelEl.className = `${CLASS_PREFIX}control-label ${CLASS_PREFIX}control-label--block`; labelEl.setAttribute("for", `${CLASS_PREFIX}${key}`); labelEl.textContent = label; const input = document.createElement("input"); input.type = "number"; input.className = `${CLASS_PREFIX}input`; input.id = `${CLASS_PREFIX}${key}`; input.setAttribute("data-setting", key); // Ensure value is valid number, fall back to min if provided if (typeof value === "number" && !isNaN(value) && value > 0) { input.value = value; } else if (min !== undefined) { input.value = min; } else { input.value = 1; // Absolute fallback } if (min !== undefined) input.min = min; if (max !== undefined) input.max = max; control.appendChild(labelEl); control.appendChild(input); return control; } /** * Setup event listeners (one-time setup) */ setupEventListeners() { // Close button const closeBtn = this.panel.querySelector(`.${CLASS_PREFIX}panel-close`); closeBtn.addEventListener("click", () => { this.close(); }); // Tab switching with main toggle guard const tabs = this.panel.querySelectorAll(`.${CLASS_PREFIX}tab`); tabs.forEach(tab => { tab.addEventListener("click", e => { const tabName = tab.dataset.tab; // Allow home tab always if (tabName === "home") { this.switchTab(tabName); return; } // Guard other tabs when master is disabled if (!this.isMasterEnabled) { e.preventDefault(); e.stopPropagation(); this.showToast("Enable LinkedIn Tweeks first (in General tab)", "warning"); debug("Tab click blocked - main toggle is disabled"); return; } // Allow tab switch this.switchTab(tabName); }); }); // Keyboard shortcuts (only set up once) document.addEventListener("keydown", e => { if (e.key === "Escape" && this.isVisible) { this.close(); } }); // Wire control listeners this.wireControlListeners(); } /** * Wire listeners for control inputs (called after content re-render) */ wireControlListeners() { // Settings inputs const inputs = this.panel.querySelectorAll("[data-setting]"); inputs.forEach(input => { input.addEventListener("change", e => { this.handleSettingChange(e.target); }); }); // Unfollow All button const unfollowBtn = this.panel.querySelector(`#${CLASS_PREFIX}unfollow-all`); if (unfollowBtn) { unfollowBtn.addEventListener("click", () => { eventBus.emit(EVENTS.ACTION_UNFOLLOW_ALL); }); } } /** * Handle setting change */ async handleSettingChange(input) { const key = input.dataset.setting; let value; if (input.type === "checkbox") { value = input.checked; } else if (input.type === "number") { value = parseInt(input.value, 10); } else { value = input.value; } debug(`Setting changed: ${key} = ${value}`); // Special handling for main toggle to keep UI and storage in sync if (key === "main-toggle") { const oldValue = this.isMasterEnabled; // Try to save first const success = await settingsManager.set(key, value); if (success) { // Save succeeded - apply the new state this.applyMainToggleState(value); this.showToast("Setting saved", "success"); } else { // Save failed - revert the toggle and keep old state input.checked = oldValue; this.showToast("Failed to save setting", "error"); debug(`Main toggle save failed, reverted to ${oldValue}`); } return; } // Non-main-toggle settings: save normally const success = await settingsManager.set(key, value); if (success) { if (key === "persist-timer" && value === false) { timerEngine.clearTimerState(); } if (key === "timer-enabled" && value === false) { timerEngine.clearTimerState(); timerEngine.destroy({ skipSave: true }); } this.showToast("Setting saved", "success"); } else { this.showToast("Failed to save setting", "error"); } } /** * Switch tab */ switchTab(tabName) { // Update tab buttons const tabs = this.panel.querySelectorAll(`.${CLASS_PREFIX}tab`); tabs.forEach(tab => { if (tab.dataset.tab === tabName) { tab.classList.add(`${CLASS_PREFIX}tab-active`); tab.setAttribute("aria-selected", "true"); } else { tab.classList.remove(`${CLASS_PREFIX}tab-active`); tab.setAttribute("aria-selected", "false"); } }); // Update tab content const contents = this.panel.querySelectorAll(`.${CLASS_PREFIX}tab-content`); contents.forEach(content => { if (content.dataset.tabContent === tabName) { content.style.display = "block"; } else { content.style.display = "none"; } }); this.currentTab = tabName; } /** * Show toast notification */ showToast(message, type = "info") { const toast = document.createElement("div"); toast.className = `${CLASS_PREFIX}toast ${CLASS_PREFIX}toast-${type}`; toast.textContent = message; document.body.appendChild(toast); setTimeout(() => { toast.remove(); }, 3e3); } /** * Toggle panel visibility */ toggle() { if (this.isVisible) { this.close(); } else { this.open(); } } /** * Open panel */ open() { this.panel.classList.add(`${CLASS_PREFIX}panel-visible`); this.overlay.classList.add(`${CLASS_PREFIX}overlay-visible`); this.isVisible = true; // Refresh settings values this.populateTabContent(); // Re-wire event listeners after content refresh this.wireControlListeners(); // Recompute and apply main toggle state const currentMainToggle = settingsManager.get("main-toggle", true); this.applyMainToggleState(currentMainToggle); eventBus.emit(EVENTS.PANEL_OPENED); debug("Panel opened"); } /** * Close panel */ close() { this.panel.classList.remove(`${CLASS_PREFIX}panel-visible`); this.overlay.classList.remove(`${CLASS_PREFIX}overlay-visible`); this.isVisible = false; eventBus.emit(EVENTS.PANEL_CLOSED); debug("Panel closed"); } } // Export singleton instance const settingsPanel = new SettingsPanel; /** * LinkedIn Tweeks TamperMonkey Userscript * Main entry point and application controller */ class LinkedInTweeksApp { constructor() { this.initialized = false; this.modules = { feed: feedEngine, jobs: jobsEngine, misc: miscEngine, messaging: messagingEngine, timer: timerEngine }; } /** * Initialize the application */ async init() { try { log("=".repeat(50)); log("LinkedIn Tweeks Userscript Starting..."); log("=".repeat(50)); // Initialize settings await settingsManager.init(); // Initialize state manager stateManager.reset(); // Initialize navigation watcher navigationWatcher.init(); // Initialize unfollow manager unfollowManager.init(); // Initialize settings panel await settingsPanel.init(); // Setup event listeners this.setupEventListeners(); // Initial module activation await this.activateModules(); this.initialized = true; eventBus.emit(EVENTS.APP_READY); log("LinkedIn Tweeks Userscript Ready!"); log("=".repeat(50)); } catch (err) { console.error("Failed to initialize LinkedIn Tweeks:", err); alert("LinkedIn Tweeks failed to initialize. Please check the console for details."); } } /** * Setup event listeners for application lifecycle */ setupEventListeners() { // Settings updated - reinitialize modules eventBus.subscribe(EVENTS.SETTINGS_UPDATED, async payload => { debug("Settings updated, reinitializing modules"); // Destroy existing modules first to prevent observer leaks this.destroyModules(); stateManager.reset(); await this.activateModules(); }); // Navigation changed - reset and reinitialize eventBus.subscribe(EVENTS.NAVIGATION_CHANGED, async payload => { log(`Navigation detected: ${payload.newUrl}`); // Destroy all modules this.destroyModules(); // Reset state (navigation watcher not registered, so it persists) stateManager.reset(); // Wait a bit for page to settle await new Promise(resolve => setTimeout(resolve, 500)); // Reactivate modules for new page await this.activateModules(); }); // Settings reset - reload all eventBus.subscribe(EVENTS.SETTINGS_RESET, async () => { log("Settings reset, reloading application"); // Destroy existing modules first to prevent observer leaks this.destroyModules(); stateManager.reset(); await this.activateModules(); }); } /** * Activate modules based on current page and settings */ async activateModules() { try { const settings = settingsManager.getAll(); debug("Activating modules for current page"); // Start misc init without blocking (runs on all pages) // misc uses non-blocking helpers + 2s interval, so it doesn't need to block page-specific modules const miscPromise = this.modules.misc.init(settings); // Initialize timer if enabled (runs on all pages) const timerPromise = this.modules.timer.init(settings); // Page-specific modules (run immediately without waiting for misc/timer) const url = window.location.href; if (url.startsWith("https://www.linkedin.com/feed/") || url === "https://www.linkedin.com/") { await this.modules.feed.init(settings); } else if (url.startsWith("https://www.linkedin.com/jobs/")) { await this.modules.jobs.init(settings); } else if (url.includes("/messaging/")) { await this.modules.messaging.init(); } // Wait for misc and timer to complete (doesn't block page-specific modules) await Promise.all([ miscPromise, timerPromise ]); debug("Module activation complete"); } catch (err) { console.error("Error activating modules:", err); } } /** * Destroy all active modules */ destroyModules() { debug("Destroying all modules"); Object.values(this.modules).forEach(module => { if (module.isActive && typeof module.destroy === "function") { try { module.destroy(); } catch (err) { warn(`Error destroying module:`, err); } } }); } /** * Shutdown the application */ shutdown() { log("Shutting down LinkedIn Tweeks..."); // Stop navigation watcher navigationWatcher.stop(); // Destroy all modules this.destroyModules(); // Reset state stateManager.reset(); // Clear event bus eventBus.clear(); eventBus.emit(EVENTS.APP_DESTROY); this.initialized = false; log("LinkedIn Tweeks shutdown complete"); } } // Only run in top-level window, not in iframes if (window.self !== window.top) { debug("Running inside iframe, skipping initialization"); } else { // Create application instance const app = new LinkedInTweeksApp; // Wait for DOM to be ready if (document.readyState === "loading") { document.addEventListener("DOMContentLoaded", () => { app.init(); }); } else { // DOM already loaded app.init(); } // Handle cleanup on page unload window.addEventListener("beforeunload", () => { if (app.initialized) { app.shutdown(); } }); } })();