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