This repository has been archived by the owner on May 12, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
reddit-toggle-custom-css.user.js
93 lines (77 loc) · 3.47 KB
/
reddit-toggle-custom-css.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
// ==UserScript==
// @name Reddit Toggle Custom Subreddit CSS
// @namespace https://github.com/Poorchop/userscripts
// @description Adds a small checkbox for toggling custom subreddit CSS
// @include /https?:\/\/[a-z]+\.reddit\.com\//
// @version 1.1
// @grant GM_addStyle
// ==/UserScript==
/* jshint browser: true, esnext: true */
let subredditCSSManager = {
stylesheetList: [],
customCSSNode: document.querySelector("[title='applied_subreddit_stylesheet']"),
SubredditStylesheet: function (subreddit, stylesheet) {
this.subreddit = subreddit;
this.stylesheet = stylesheet;
},
getSubredditName: function () {
let subredditNameNodes = document.getElementsByClassName("redditname");
return subredditNameNodes[1].firstElementChild.textContent;
},
initialize: function () {
// Grab the stylesheet link before removing the href value
if (this.customCSSNode.hasAttribute("href")) {
let subredditName = this.getSubredditName();
let stylesheet = document.querySelector("[title='applied_subreddit_stylesheet']").getAttribute("href");
let setMatchingStylesheet = new this.SubredditStylesheet(subredditName, stylesheet);
if (this.stylesheetList.length) {
for (let i = 0, j = this.stylesheetList.length; i < j; i++) {
if (JSON.stringify(setMatchingStylesheet) !== JSON.stringify(this.stylesheetList[i])) {
this.stylesheetList.push(setMatchingStylesheet);
}
}
} else {
this.stylesheetList.push(setMatchingStylesheet);
}
GM_addStyle('.side .md th, .side .md td { padding: 0; }');
this.customCSSNode.removeAttribute("href");
}
}
};
function checkboxHandler() {
if (document.getElementById("toggle-subreddit-css").value === "off") {
let subredditName = subredditCSSManager.getSubredditName();
document.getElementById("toggle-subreddit-css").value = "on";
for (let i = 0, j = subredditCSSManager.stylesheetList.length; i < j; i++) {
if (subredditName === subredditCSSManager.stylesheetList[i].subreddit) {
subredditCSSManager.customCSSNode.setAttribute("href", subredditCSSManager.stylesheetList[i].stylesheet);
subredditCSSManager.stylesheetList.splice(i, 1);
}
}
} else {
subredditCSSManager.initialize();
document.getElementById("toggle-subreddit-css").value = "off";
subredditCSSManager.customCSSNode.removeAttribute("href");
}
}
function addCheckbox() {
if (!document.getElementById("toggle-subreddit-css")) {
let newCheckbox = document.createElement("input");
newCheckbox.setAttribute("type", "checkbox");
newCheckbox.setAttribute("id", "toggle-subreddit-css");
let newLabel = document.createElement("label");
newLabel.setAttribute("for", "toggle-subreddit-css");
let newContent = document.createTextNode(" Toggle custom subreddit CSS");
newLabel.appendChild(newContent);
let target = document.getElementsByClassName("redditname")[1].parentNode;
target.insertBefore(newCheckbox, target.childNodes[1]);
target.insertBefore(newLabel, target.childNodes[2]);
target.insertBefore(document.createElement("br"), target.childNodes[3]);
target.childNodes[3].style.marginBottom="5px";
document.getElementById("toggle-subreddit-css").checked = false;
document.getElementById("toggle-subreddit-css").value = "off";
subredditCSSManager.initialize();
}
}
addCheckbox();
document.getElementById("toggle-subreddit-css").addEventListener("click", checkboxHandler);