reddit styles

reddit themes for the common folk

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name        reddit styles
// @namespace   http://nucular.github.io
// @version     0.6.1
// @description reddit themes for the common folk
// @copyright   2015, nucular
// @license     MIT License
// @include     http://www.reddit.com/*
// @include     https://www.reddit.com/*
// @run-at      document-start
// @grant       GM_getValue
// @grant       GM_setValue
// @require     https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js
// ==/UserScript==

var featured = [
    "NautClassic",
    "serene",
    "carbon",
    "edurne",
    "mindashq"
];

var activated = GM_getValue("activated", false);
var subreddit = GM_getValue("subreddit", "");
var excluded = GM_getValue("excluded", "").split(",");
var otherpages = GM_getValue("otherpages", true);
var dontoverride = GM_getValue("dontoverride", false);

function setActivated(a) {
    activated = a;
    GM_setValue("activated", a);
}

function setOtherPages(a) {
    otherpages = a;
    GM_setValue("otherpages", a);
}

function setDontOverride(a) {
    dontoverride = a;
    GM_setValue("dontoverride", a);
}

function setSubreddit(s) {
    var sane = s.replace(/\/r\/|[^\w]/g, "");
    subreddit = sane;
    if ($("#styles_subreddit").length > 0)
        $("#styles_subreddit").val(sane);
    GM_setValue("subreddit", sane);
}

function setExcluded(e) {
    var split = e.split(",");
    var sane = [];
    for (var i = 0; i < split.length; i++) {
        var v = split[i].replace(/\/r\/|[^\w*?+]/g, "");
        if (v)
            sane.push(v);
    }
    excluded = sane;
    sane = sane.join(",");
    if ($("#styles_excluded").length > 0)
        $("#styles_excluded").val(sane);
    GM_setValue("excluded", sane);
}

function loadStyle() {
    if (subreddit == "") {
        return;
    }
    // jQuery may not be loaded yet here
    var links = document.getElementsByTagName("link");
    var href = "https://www.reddit.com/r/" + subreddit + "/stylesheet/";
    
    var done = false;
    for (var i = 0; i < links.length; i++) {
        if (links[i].title == "applied_subreddit_stylesheet") {
            if (links[i].href != href)
                links[i].href = href;
            done = true;
        }
    }
    if (!done) {
        // Assume we're on another page
        var link = document.createElement("link");
        link.title = "applied_subreddit_stylesheet";
        link.rel = "stylesheet";
        link.href = href;
        document.head.appendChild(link);
    }
}

function loadPrefs() {
    document.addEventListener("DOMContentLoaded", function() {
        $("<tr><th>reddit styles</th><td class='prefright'>"
         + "<input name='styles_activated' id='styles_activated' type='checkbox'>"
         + "<label class='' for='styles_activated'>activate <a href='https://greasyfork.org/en/scripts/9451-reddit-styles'>reddit styles</a></label> "
         + "<span class='details'>use the custom theme of any subreddit everywhere</span>"
         + "<br>"
         + "use theme from /r/<input name='styles_subreddit' id='styles_subreddit' type='text' style='width: 150px'> "
         + "<span class='details' id='styles_featured'>e.g.&nbsp;</span>"
         + "<br>"
         + "exclude subreddits <input name='styles_excluded' id='styles_excluded' type='text' style='width: 150px'> "
         + "<span class='details'>separated by commas, use * and ? as wildcards</span>"
         + "<br>"
         + "<input name='styles_otherpages' id='styles_otherpages' type='checkbox'>"
         + "<label class='' for='styles_otherpages'>style other pages too (if available)</label> "
         + "<span class='details'>e.g the front, subreddits, compose/messages and explore pages</span>"
         + "<br>"
         + "<input name='styles_dontoverride' id='styles_dontoverride' type='checkbox'>"
         + "<label class='' for='styles_dontoverride'>don't override if a subreddit already has a custom theme</label> "
         + "<span class='details'>this will delay the loading of your custom stylesheet though</span>"
         + "</tr></td>").prependTo(".content.preftable > tbody");
    
        for (var i = 0; i < featured.length; i++) {
            $("<a></a>")
                .attr("href", "https://www.reddit.com/r/" + featured[i])
                .text(featured[i])
                .appendTo("#styles_featured")
                .on("click", function(e) {
                    e.preventDefault();
                    setSubreddit($(this).text());
                });
            if (i < featured.length-1)
                $("<span>,</span>").appendTo("#styles_featured");
        }
    
        $("#styles_activated")
            .on("change", function(e) {
                setActivated(this.checked);
            })[0].checked = activated;
        $("#styles_otherpages")
            .on("change", function(e) {
                setOtherPages(this.checked);
            })[0].checked = otherpages;
        $("#styles_dontoverride")
            .on("change", function(e) {
                setDontOverride(this.checked);
            })[0].checked = dontoverride;
        $("#styles_subreddit")
            .val(subreddit)
            .on("change", function(e) {
                setSubreddit($(this).val());
            });
        $("#styles_excluded")
            .val(excluded.join(","))
            .on("change", function(e) {
                setExcluded($(this).val());
            });
    });
}


var page = window.location.pathname.match(/^(\/\w+)/);
if (!page) page = "/";
else page = page[1];

if (activated) {
    // Subreddits
    if (page == "/r") {
        var sub = window.location.pathname.match(/^\/r\/([\w+]+)/)[1];
        // First check if the sub is excluded
        for (var i = 0; i < excluded.length; i++) {
            if (sub.match(new RegExp("^" + excluded[i].replace(/([\*\?])/g, ".$1") + "$")))
                return;
        }
        // Gotta poke the server about this, sadly
        if (dontoverride) {
            var http = new XMLHttpRequest();
            http.open("HEAD", "https://www.reddit.com/r/" + sub + "/stylesheet/");
            http.onreadystatechange = function() {
                if (this.readyState == this.HEADERS_RECEIVED) {
                    if (this.status == 403 || this.status == 404) { // 403 = banned/private, 404 = no style
                        loadStyle();
                        setInterval(loadStyle, 300);
                    }
                }
            };
            http.send();
        } else {
            loadStyle();
            setInterval(loadStyle, 300);
        }
    }
    
    // Other areas
    else if (otherpages && page != "/prefs") { //(page == "/" || page == "/compose" || page == "/subreddits" || page == "/messages" || page == "/explore")) {
        loadStyle();
        setInterval(loadStyle, 300);
    }
}
// Preferences
if (page == "/prefs") {
    loadPrefs();
}