-
-
Notifications
You must be signed in to change notification settings - Fork 2
/
script.user.js
185 lines (169 loc) · 7.82 KB
/
script.user.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
// ==UserScript==
// @name Fuck Elon Musk
// @namespace https://greasyfork.org/scripts/471597-elon-musk
// @version 0.7.0
// @description Fuck Elon Musk! Let's bring Twitter back.
// @author Ray (https://github.com/so1ve)
// @license MIT
// @run-at document-start
// @homepageURL https://github.com/so1ve/fuck-elonmusk
// @supportURL https://github.com/so1ve/fuck-elonmusk
// @match https://twitter.com/**
// @grant GM_addStyle
// ==/UserScript==
(() => {
"use strict";
const COLOR_CSS =
'.__FUCK_MUSK_BLUE__ { color: rgb(29, 155, 240) !important; } @media (prefers-color-scheme: dark) { a[href="/home"][aria-label="Twitter"] .__FUCK_MUSK_BLUE__ { color: rgb(231, 233, 234) !important; } }';
const TWITTER_LOGO_G = `<g><path d="M23.643 4.937c-.835.37-1.732.62-2.675.733.962-.576 1.7-1.49 2.048-2.578-.9.534-1.897.922-2.958 1.13-.85-.904-2.06-1.47-3.4-1.47-2.572 0-4.658 2.086-4.658 4.66 0 .364.042.718.12 1.06-3.873-.195-7.304-2.05-9.602-4.868-.4.69-.63 1.49-.63 2.342 0 1.616.823 3.043 2.072 3.878-.764-.025-1.482-.234-2.11-.583v.06c0 2.257 1.605 4.14 3.737 4.568-.392.106-.803.162-1.227.162-.3 0-.593-.028-.877-.082.593 1.85 2.313 3.198 4.352 3.234-1.595 1.25-3.604 1.995-5.786 1.995-.376 0-.747-.022-1.112-.065 2.062 1.323 4.51 2.093 7.14 2.093 8.57 0 13.255-7.098 13.255-13.254 0-.2-.005-.402-.014-.602.91-.658 1.7-1.477 2.323-2.41z"></path></g>`;
const TWITTER_LOGO = `<svg viewBox="0 0 24 24" aria-hidden="true" class="__FUCK_MUSK_BLUE__ r-4qtqp9 r-yyyyoo r-16y2uox r-8kz0gk r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-lrsllp">${TWITTER_LOGO_G}</svg>`;
/**
* @see https://greasyfork.org/zh-CN/scripts/471576-f-kelonmusk-twitter-com
*/
const TWITTER_LOGO_FOR_SHORTCUT_ICON = `data:image/svg+xml,%3Csvg width='500' height='500' viewBox='0 0 500 500' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3Etwitter-logo%3C/title%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M170.2264 442.7654c162.2648 0 251.0168-140.0367 251.0168-261.4758 0-3.9775 0-7.9371-.258-11.8788 17.2659-13.009 32.1701-29.1167 44.0148-47.5687-16.1013 7.4318-33.1817 12.3057-50.6712 14.4587 18.4168-11.4849 32.2005-29.5486 38.786-50.8295-17.3177 10.7044-36.2637 18.2483-56.0204 22.3062-27.3466-30.29-70.8-37.7036-105.9942-18.0837-35.194 19.62-53.3763 61.3941-44.351 101.8979-70.9346-3.7043-137.0242-38.6047-181.8212-96.0154-23.4157 41.9903-11.4554 95.7083 27.3136 122.6754-14.0397-.4335-27.7732-4.3786-40.0416-11.5025v1.1646c.0115 43.7452 29.6141 81.4229 70.778 90.085-12.9882 3.6897-26.6156 4.229-39.8352 1.5766 11.5575 37.4355 44.6783 63.0807 82.4224 63.8192-31.2398 25.5748-69.831 39.4584-109.564 39.4166A172.495 172.495 0 0 1 35 401.4854c40.345 26.9696 87.2885 41.275 135.2264 41.2083' fill='%231DA1F2'/%3E%3Cpath d='M35 35h430v430H35z'/%3E%3C/g%3E%3C/svg%3E%0A`;
const FUCKER_X =
'<g><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></g>';
/**
* @param {string} selector
* @returns {Promise<HTMLElement[]>}
*/
const waitForElements = (selector) =>
new Promise((resolve) => {
if (document.querySelectorAll(selector).length > 0) {
return resolve(document.querySelectorAll(selector));
}
const observer = new MutationObserver(() => {
if (document.querySelectorAll(selector).length > 0) {
resolve(document.querySelectorAll(selector));
observer.disconnect();
}
});
try {
observer.observe(document.body, {
childList: true,
subtree: true,
});
} catch {
// If failed, try again after 100ms
setTimeout(() => {
resolve(waitForElements(selector));
}, 100);
}
});
const createObserver = (valueToWatch) => (callback) => {
let oldValue = valueToWatch();
const observer = new MutationObserver(() => {
if (oldValue !== valueToWatch()) {
oldValue = valueToWatch();
callback();
}
});
function observe() {
observer.observe(document.body, {
childList: true,
subtree: true,
});
}
const timer = setInterval(() => {
if (document.body) {
clearInterval(timer);
observe();
}
}, 100);
};
const observeUrlChange = createObserver(() => document.location.href);
const observeTitleChange = createObserver(() => document.title);
const ICON_SELECTOR = 'link[rel="shortcut icon"]';
const LOGO_SELECTOR = 'a[href="/home"][aria-label="Twitter"]';
const NAVBAR_LOGO_SELECTOR =
'div[data-testid="TopNavBar"] > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2)';
const PLACEHOLDER_SELECTOR = "#placeholder";
const HOMEPAGE_ICON_SELECTOR = "main > div > div > div > div > div > svg";
const HOMEPAGE_LEFT_ICON_SELECTOR =
"main > div > div > div > div:nth-child(2) > div > svg";
const LOGOUT_ICON_SELECTOR =
'div[data-testid="confirmationSheetDialog"] > svg';
const NOTIFICATIONS_SELECTOR = "article";
const VERFIED_SELECTOR = 'a[href="/i/verified-choose"]';
const createStyleMaker =
(selector) =>
/**
* @param {boolean} show
*/
(show) =>
`${selector} { display: ${show ? "flex" : "none"}; }`;
const makeTwitterLogoStyle = createStyleMaker(LOGO_SELECTOR);
const makeTwitterNavbarLogoStyle = createStyleMaker(NAVBAR_LOGO_SELECTOR);
const makePlaceholderStyle = createStyleMaker(PLACEHOLDER_SELECTOR);
const makeHomepageIconStyle = createStyleMaker(HOMEPAGE_ICON_SELECTOR);
const makeHomepageLeftIconStyle = createStyleMaker(
HOMEPAGE_LEFT_ICON_SELECTOR,
);
const makeLogoutIconStyle = createStyleMaker(LOGOUT_ICON_SELECTOR);
const makeVerifiedStyle = createStyleMaker(VERFIED_SELECTOR);
function initChangers() {
GM_addStyle(COLOR_CSS);
waitForElements(ICON_SELECTOR).then(([iconEl]) => {
iconEl.href = TWITTER_LOGO_FOR_SHORTCUT_ICON;
});
GM_addStyle(makeVerifiedStyle(false));
GM_addStyle(makePlaceholderStyle(false));
waitForElements(PLACEHOLDER_SELECTOR).then(([placeholder]) => {
placeholder.children[0].innerHTML = TWITTER_LOGO;
GM_addStyle(makePlaceholderStyle(true));
});
GM_addStyle(makeTwitterLogoStyle(false));
waitForElements(LOGO_SELECTOR).then(([a]) => {
a.children[0].innerHTML = TWITTER_LOGO;
GM_addStyle(makeTwitterLogoStyle(true));
});
if (location.pathname === "/") {
GM_addStyle(makeHomepageIconStyle(false));
waitForElements(HOMEPAGE_ICON_SELECTOR).then(([svg]) => {
svg.classList.add("__FUCK_MUSK_BLUE__");
svg.innerHTML = TWITTER_LOGO_G;
GM_addStyle(makeHomepageIconStyle(true));
});
GM_addStyle(makeHomepageLeftIconStyle(false));
waitForElements(HOMEPAGE_LEFT_ICON_SELECTOR).then(([svg]) => {
svg.innerHTML = TWITTER_LOGO_G;
GM_addStyle(makeHomepageLeftIconStyle(true));
});
}
if (location.pathname === "/home") {
GM_addStyle(makeTwitterNavbarLogoStyle(false));
waitForElements(NAVBAR_LOGO_SELECTOR).then(([div]) => {
div.children[1].classList.add("__FUCK_MUSK_BLUE__");
div.children[1].innerHTML = TWITTER_LOGO;
GM_addStyle(makeTwitterNavbarLogoStyle(true));
});
}
if (location.pathname === "/logout") {
GM_addStyle(makeLogoutIconStyle(false));
waitForElements(LOGOUT_ICON_SELECTOR).then(([svg]) => {
svg.classList.add("__FUCK_MUSK_BLUE__");
svg.innerHTML = TWITTER_LOGO_G;
GM_addStyle(makeLogoutIconStyle(true));
});
}
if (location.pathname === "/notifications") {
waitForElements(NOTIFICATIONS_SELECTOR).then((notifications) => {
for (const notification of notifications) {
const svg = notification.children[0].children[0].children[0];
if (svg.innerHTML === FUCKER_X) {
svg.classList.add("__FUCK_MUSK_BLUE__");
svg.innerHTML = TWITTER_LOGO_G;
}
}
});
}
}
initChangers();
observeUrlChange(initChangers);
window.addEventListener("resize", initChangers);
observeTitleChange(() => {
if (document.title.endsWith("X")) {
document.title = `${document.title.slice(0, -1)}Twitter`;
}
});
})();