blob: 5518df8636279da3ef257a48ded59fdbb5ee876f [file] [log] [blame]
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +02001import {injectScript, injectStyles, injectStylesheet} from '../../common/contentScriptsUtils.js';
2
Adrià Vilanova Martínez27c69962021-07-17 23:32:51 +02003import AvatarsHandler from './avatars.js';
Adrià Vilanova Martínez462280f2021-08-07 22:59:02 +02004import {batchLock} from './batchLock.js';
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +02005import {injectDarkModeButton, isDarkThemeOn} from './darkMode.js';
6import {applyDragAndDropFix} from './dragAndDropFix.js';
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +02007import {injectPreviousPostsLinks} from './profileHistoryLink.js';
8import {unifiedProfilesFix} from './unifiedProfiles.js';
9
avm99963b6f68b62021-08-12 23:13:06 +020010var mutationObserver, intersectionObserver, intersectionOptions, options, avatars;
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +020011
12const watchedNodesSelectors = [
13 // App container (used to set up the intersection observer and inject the dark
14 // mode button)
15 'ec-app',
16
17 // Load more bar (for the "load more"/"load all" buttons)
18 '.load-more-bar',
19
20 // Username span/editor inside ec-user (user profile view)
21 'ec-user .main-card .header > .name > span',
22 'ec-user .main-card .header > .name > ec-display-name-editor',
23
24 // Rich text editor
25 'ec-movable-dialog',
26 'ec-rich-text-editor',
27
28 // Read/unread bulk action in the list of thread, for the batch lock feature
29 'ec-bulk-actions material-button[debugid="mark-read-button"]',
30 'ec-bulk-actions material-button[debugid="mark-unread-button"]',
31
32 // Thread list items (used to inject the avatars)
33 'li',
34
35 // Thread list (used for the autorefresh feature)
36 'ec-thread-list',
37
38 // Unified profile iframe
39 'iframe',
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +020040];
41
42function handleCandidateNode(node) {
43 if (typeof node.classList !== 'undefined') {
44 if (('tagName' in node) && node.tagName == 'EC-APP') {
45 // Set up the intersectionObserver
46 if (typeof intersectionObserver === 'undefined') {
47 var scrollableContent = node.querySelector('.scrollable-content');
48 if (scrollableContent !== null) {
49 intersectionOptions = {
50 root: scrollableContent,
51 rootMargin: '0px',
52 threshold: 1.0,
53 };
54
55 intersectionObserver = new IntersectionObserver(
56 intersectionCallback, intersectionOptions);
57 }
58 }
59
60 // Inject the dark mode button
61 if (options.ccdarktheme && options.ccdarktheme_mode == 'switch') {
62 var rightControl = node.querySelector('header .right-control');
63 if (rightControl !== null)
64 injectDarkModeButton(rightControl, options.ccdarktheme_switch_status);
65 }
66 }
67
68 // Start the intersectionObserver for the "load more"/"load all" buttons
69 // inside a thread
70 if ((options.thread || options.threadall) &&
71 node.classList.contains('load-more-bar')) {
72 if (typeof intersectionObserver !== 'undefined') {
73 if (options.thread)
74 intersectionObserver.observe(node.querySelector('.load-more-button'));
75 if (options.threadall)
76 intersectionObserver.observe(node.querySelector('.load-all-button'));
77 } else {
78 console.warn(
79 '[infinitescroll] ' +
80 'The intersectionObserver is not ready yet.');
81 }
82 }
83
84 // Show the "previous posts" links
85 // Here we're selecting the 'ec-user > div' element (unique child)
86 if (options.history &&
87 (node.matches('ec-user .main-card .header > .name > span') ||
88 node.matches(
89 'ec-user .main-card .header > .name > ec-display-name-editor'))) {
90 injectPreviousPostsLinks(node);
91 }
92
93 // Fix the drag&drop issue with the rich text editor
94 //
95 // We target both tags because in different contexts different
96 // elements containing the text editor get added to the DOM structure.
97 // Sometimes it's a EC-MOVABLE-DIALOG which already contains the
98 // EC-RICH-TEXT-EDITOR, and sometimes it's the EC-RICH-TEXT-EDITOR
99 // directly.
100 if (options.ccdragndropfix && ('tagName' in node) &&
101 (node.tagName == 'EC-MOVABLE-DIALOG' ||
102 node.tagName == 'EC-RICH-TEXT-EDITOR')) {
103 applyDragAndDropFix(node);
104 }
105
106 // Inject the batch lock button in the thread list
Adrià Vilanova Martínez462280f2021-08-07 22:59:02 +0200107 if (options.batchlock && batchLock.nodeIsReadToggleBtn(node)) {
108 batchLock.addButton(node);
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200109 }
110
111 // Inject avatar links to threads in the thread list
112 if (options.threadlistavatars && ('tagName' in node) &&
113 (node.tagName == 'LI') &&
114 node.querySelector('ec-thread-summary') !== null) {
115 avatars.inject(node);
116 }
117
118 // Set up the autorefresh list feature
119 if (options.autorefreshlist && ('tagName' in node) &&
120 node.tagName == 'EC-THREAD-LIST') {
avm99963fd222672021-08-12 23:23:01 +0200121 window.TWPTAutoRefresh.setUp();
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200122 }
123
124 // Redirect unified profile iframe to dark version if applicable
125 if (node.tagName == 'IFRAME' && isDarkThemeOn(options) &&
126 unifiedProfilesFix.checkIframe(node)) {
127 unifiedProfilesFix.fixIframe(node);
128 }
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200129 }
130}
131
132function handleRemovedNode(node) {
133 // Remove snackbar when exiting thread list view
134 if (options.autorefreshlist && 'tagName' in node &&
135 node.tagName == 'EC-THREAD-LIST') {
avm99963fd222672021-08-12 23:23:01 +0200136 window.TWPTAutoRefresh.hideUpdatePrompt();
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200137 }
138}
139
140function mutationCallback(mutationList, observer) {
141 mutationList.forEach((mutation) => {
142 if (mutation.type == 'childList') {
143 mutation.addedNodes.forEach(function(node) {
144 handleCandidateNode(node);
145 });
146
147 mutation.removedNodes.forEach(function(node) {
148 handleRemovedNode(node);
149 });
150 }
151 });
152}
153
154function intersectionCallback(entries, observer) {
155 entries.forEach(entry => {
156 if (entry.isIntersecting) {
157 entry.target.click();
158 }
159 });
160};
161
162var observerOptions = {
163 childList: true,
164 subtree: true,
165};
166
167chrome.storage.sync.get(null, function(items) {
168 options = items;
169
Adrià Vilanova Martínez27c69962021-07-17 23:32:51 +0200170 // Initialize classes needed by the mutation observer
171 if (options.threadlistavatars)
172 avatars = new AvatarsHandler();
173
avm99963b6f68b62021-08-12 23:13:06 +0200174 // autoRefresh is initialized in start.js
avm99963d3f4ac02021-08-12 18:36:58 +0200175
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200176 // Before starting the mutation Observer, check whether we missed any
177 // mutations by manually checking whether some watched nodes already
178 // exist.
179 var cssSelectors = watchedNodesSelectors.join(',');
180 document.querySelectorAll(cssSelectors)
181 .forEach(node => handleCandidateNode(node));
182
183 mutationObserver = new MutationObserver(mutationCallback);
184 mutationObserver.observe(document.body, observerOptions);
185
186 if (options.fixedtoolbar) {
187 injectStyles(
188 'ec-bulk-actions{position: sticky; top: 0; background: var(--TWPT-primary-background, #fff); z-index: 96;}');
189 }
190
191 if (options.increasecontrast) {
192 injectStyles(
193 '.thread-summary.read:not(.checked){background: var(--TWPT-thread-read-background, #ecedee)!important;}');
194 }
195
196 if (options.stickysidebarheaders) {
197 injectStyles(
198 'material-drawer .main-header{background: var(--TWPT-drawer-background, #fff)!important; position: sticky; top: 0; z-index: 1;}');
199 }
200
201 if (options.enhancedannouncementsdot) {
202 injectStylesheet(
203 chrome.runtime.getURL('css/enhanced_announcements_dot.css'));
204 }
205
206 if (options.repositionexpandthread) {
Adrià Vilanova Martínez27c69962021-07-17 23:32:51 +0200207 injectStylesheet(chrome.runtime.getURL('css/reposition_expand_thread.css'));
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200208 }
209
210 if (options.ccforcehidedrawer) {
211 var drawer = document.querySelector('material-drawer');
212 if (drawer !== null && drawer.classList.contains('mat-drawer-expanded')) {
213 document.querySelector('.material-drawer-button').click();
214 }
215 }
216
217 if (options.batchlock) {
218 injectScript(chrome.runtime.getURL('batchLockInject.bundle.js'));
219 injectStylesheet(chrome.runtime.getURL('css/batchlock_inject.css'));
220 }
221
222 if (options.threadlistavatars) {
Adrià Vilanova Martínez27c69962021-07-17 23:32:51 +0200223 injectStylesheet(chrome.runtime.getURL('css/thread_list_avatars.css'));
Adrià Vilanova Martínez3465e772021-07-11 19:18:41 +0200224 }
225
226 if (options.autorefreshlist) {
227 injectStylesheet(chrome.runtime.getURL('css/autorefresh_list.css'));
228 }
229});