-
Notifications
You must be signed in to change notification settings - Fork 9
/
Copy pathreddit-custom-theme.user.js
153 lines (124 loc) · 3.74 KB
/
reddit-custom-theme.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
// ==UserScript==
// @name Reddit custom theme
// @namespace https://github.com/Farow/userscripts
// @description Applies a subreddit stylesheet everywhere
// @include https://*.reddit.com/*
// @version 1.0.0
// @grant GM_xmlhttpRequest
// @connect reddit.com
// @connect redditmedia.com
// @run-at document-start
// ==/UserScript==
/*
changelog:
2016-05-28 - 1.0.0 - initial release
*/
/* subreddit template */
let subreddit = 'carbon_beta';
/* custom reddit logo */
let snoo_logo = '//i.imgur.com/4vikRBL.png';
/* css that is applied after the stylesheet */
let custom_css = '.md p { color: #aaaaaa; } [hidden] { display: none !important; }';
let observer = new MutationObserver(head_monitor);
let stylesheet_url = localStorage.getItem('custom_css_theme');
try {
init();
}
catch (error) {
console.log(error);
}
function init () {
let link = document.createElement('link');
let observe = 1;
link.id = 'custom_css_theme';
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = stylesheet_url ? stylesheet_url : '/r/' + subreddit + '/stylesheet/';
link.title = 'applied_subreddit_stylesheet';
/* append the custom stylesheet */
document.head.appendChild(link);
/* check if subreddit stylesheet has already been loaded */
for (let node of document.head.children) {
if (is_stylesheet(node) && node.title == 'applied_subreddit_stylesheet') {
node.remove();
observe = 0;
break;
}
}
/* check for changes to the stylesheet url */
GM_xmlhttpRequest({
method: 'GET',
url: '/r/' + subreddit + '/stylesheet/',
onload: update_stylesheet_url,
});
/* subreddit stylesheet hasn't been added yet */
if (observe) {
observer.observe(document.head, { childList: true });
}
/* apply final touches after dom loads */
document.addEventListener('DOMContentLoaded', dom_load);
}
function head_monitor (mutations) {
for (let mutation of mutations) {
for (let node of mutation.addedNodes) {
if (is_stylesheet(node)) {
/* reddit default theme, move custom theme below it */
if (node.href.startsWith(window.location.protocol + '//www.redditstatic.com')) {
let custom_css_theme = document.getElementById('custom_css_theme');
document.head.appendChild(custom_css_theme);
}
/* subreddit theme, remove it */
else if (node.title == 'applied_subreddit_stylesheet') {
node.remove();
}
}
}
}
}
function update_stylesheet_url (response) {
if (response.status != 200 || stylesheet_url == response.finalUrl) {
return;
}
localStorage.setItem('custom_css_theme', response.finalUrl);
if (!stylesheet_url) {
return;
}
/* old url was cached, update with new */
let custom_css_theme = document.getElementById('custom_css_theme');
if (custom_css_theme) {
custom_css_theme.href = response.finalUrl;
}
}
function dom_load () {
/* no need to monitor <head> anymore */
observer.disconnect();
/* reddit's logo image is not part of a subreddit stylesheet, so we need to fix it */
let header = document.getElementById('header-img');
if (header) {
/* on subreddits the logo is an <img> */
if (header.nodeName == 'IMG') {
header.src = snoo_logo;
}
/* on other pages it's a link with a background image */
else if (header.nodeName == 'A') {
header.style.setProperty('background', 'url(' + snoo_logo + ') 0% 0%');
}
}
/* apply custom/user CSS for fixups */
if (custom_css) {
add_style(custom_css);
}
}
function is_stylesheet (node) {
return node.nodeName == 'LINK' &&
node.rel == 'stylesheet' &&
node.id != 'custom_css_theme'
;
}
function add_style (css) {
let style = document.createElement('style');
style.type = 'text/css';
style.appendChild(document.createTextNode(css));
document.head.appendChild(style);
return style;
}