Brickarcadium +

Extends the features available on brickarcadium.xyz.

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Brickarcadium +
// @version      1.4
// @description  Extends the features available on brickarcadium.xyz.
// @author       sfhefo#3251
// @match        *://*.brickarcadium.xyz/*
// @match        *://*.brickarcadium.xyz/*/*
// @match        *://*.brickarcadium.xyz/*/*/*
// @match        *://*.brickarcadium.xyz/*/*/*/*
// @license MIT
// @icon         http://images.thecoolwebsite.com/favicon.png
// @grant    GM_addStyle
// @namespace https://greasyfork.org/users/1227048
// ==/UserScript==

// colors and other stuff

function addGlass(bool) {
     var glass = "background: rgba( 255, 255, 255, 0.25 ) !important; \
     box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 ) !important; \
     backdrop-filter: blur( 8px ) !important; \
     -webkit-backdrop-filter: blur( 8px ) !important; \
     border-radius: 10px !important; \
     border: 1px solid rgba( 255, 255, 255, 0.18 ) !important;";
     if (bool == "true") {
          return glass;
     } else {
          return;
     }
}

function addGlass2(bool) {
     var glass2 = "background: rgba( 255, 255, 255, 0.25 ) !important; \
     box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 ) !important; \
     backdrop-filter: blur( 8px ) !important; \
     border: 1px solid rgba( 255, 255, 255, 0.18 ) !important;"
     if (bool == "true") {
          return glass2;
     } else {
          return;
     }
}

var ImageLink = "image: url('https://images.thecoolwebsite.com/wn95.jpg')";
var ImageLinkInput = "https://images.thecoolwebsite.com/wn95.jpg"
var MainColor = "#96B7D7";
var MainColor2 = "#6798C8";
var MainColor3 = "#3796F2";
var MainColor4 = "#FFFFFF";
var NavBarColor = "#282828";
var feedHeight = "2202px";
var rsizeType = "none";
var glassCheck = "false";

if (localStorage.getItem("rsize") !== null) {
    if (JSON.parse(localStorage.rsize) === true) {
        rsizeType = "vertical";
        console.log(rsizeType);
    }
}

if (localStorage.getItem("themeColor") === null) { // if there's no theme data
    ImageLink = "image: url('https://images.thecoolwebsite.com/wn95.jpg')"
    ImageLinkInput = "https://images.thecoolwebsite.com/wn95.jpg"
    MainColor = "#96B7D7";
    MainColor2 = "#6798C8";
    MainColor3 = "#3796F2";
    MainColor4 = "#FFFFFF";
    NavBarColor = "#282828";
    feedHeight = "2202px";
    glassCheck = "false";
} else { // else if there's theme data, get it all
    ImageLink = "image: url('" + localStorage.getItem("imageLink") + "')";
    ImageLinkInput = localStorage.getItem("imageLink")
    MainColor = localStorage.getItem("themeColor");
    MainColor2 = localStorage.getItem("fgColor1");
    MainColor3 = localStorage.getItem("fgColor2");
    MainColor4 = localStorage.getItem("txtcolor");
    NavBarColor = localStorage.getItem("nvbr");
    feedHeight = localStorage.getItem("feedHeight");
    glassCheck = localStorage.getItem("glassCheck");
}

if (localStorage.isBgUrl === "false") {
    ImageLink = "color:" + localStorage.bgColor;
    console.log(ImageLink);
} else {
    ImageLink = "image: url('" + localStorage.getItem("imageLink") + "')";
}

// css stuff

GM_addStyle ( `
    body {
        background-${ImageLink} !important;
        background-size: cover !important;
    }
    #platform {
        background-color: ${MainColor} !important;
        ${addGlass(glassCheck)}
    }
    #AvatarSpace {
         background-color: ${MainColor2} !important;
         ${addGlass(glassCheck)}
    }
    #AvatarSpace div {
         background-color: ${MainColor3} !important;
         ${addGlass2(glassCheck)}
    }
    #Mind > div > div {
         background-color: ${MainColor3} !important;
         width: 97% !important;
         ${addGlass(glassCheck)}
    }
    #Mind > div {
         background-color: ${MainColor2} !important;
         resize: ${rsizeType};
         overflow: auto;
         height: ${feedHeight};
         ${addGlass(glassCheck)}
    }
    div[style*="width:99.9%;"] {
         z-index: 2 !important;
    }
    #navbar {
         z-index: 3 !important;
         background-color: ${NavBarColor} !important;
    }
    #gearBox {
         background-color: ${NavBarColor} !important;
    }
    name {
        color: ${MainColor4} !important;
    }
    text {
        color: ${MainColor4} !important;
    }
    a {
        color: ${MainColor4} !important;
    }
    i {
        color: ${MainColor4} !important;
    }
    h3 {
        color: ${MainColor4} !important;
    }
    b {
        color: ${MainColor4} !important;
    }
    p {
        color: ${MainColor4} !important;
    }
    button:hover {
        cursor: pointer;
    }
    button:disabled {
        opacity: 50%;
        cursor: auto;
    }
    .rainbow {
        animation: rainbow 5s infinite !important;
    }
    .favcolor {
        border: none !important;
        border-radius: 0px !important;
        padding: 2px !important;
    }
    @keyframes  rainbow {
	  	0%{color: red;}
		17%{color: orange;}
		33%{color: yellow;}
		50%{color: green;}
		67%{color: blue;}
		84%{color: purple;}
	 	100%{color: red;}
	}
    .imglnk {
        width: 373px;
    }
` );

var navbar = document.getElementById("navbar");
navbar.innerHTML = navbar.innerHTML + " | <span class='rainbow'> Running Brickarcadium + </span>" // adds rainbow text that says "Running Brickarcadium +"

if (document.URL == "https://www.brickarcadium.xyz/Dashboard/") { // checks if the user is on the dashboard
    var avatarSpace = document.getElementById('AvatarSpace');
    var info = avatarSpace.querySelector('center');

    info.innerHTML = info.innerHTML + '<br> <b>User Count: <span id="count">Loading...</span></b>'; // registered user counter

    fetch('https://thecoolwebsite.com/usrcounter.php')
        .then(response => response.json())
        .then(data => {
        document.getElementById('count').textContent = data.count;
    });
    const resizeObserver = new ResizeObserver(entries => {
        for (const entry of entries) {
            const targetElement = entry.target;

            const { width, height } = entry.contentRect;
            localStorage.setItem("feedHeight", Number(Math.round(height)) + "px");
        }
    });
    const targetElement = document.getElementById('Mind').querySelector('div');
    resizeObserver.observe(targetElement);
} else if (document.URL == "https://www.brickarcadium.xyz/Settings/") { // else if the user is in the settings
    var platform = document.getElementById("platform")
    platform.innerHTML = platform.innerHTML + "<br> \
    <br> \
    <div style='settingsBlock'> \
    <img src='http://images.thecoolwebsite.com/favicon.png'></img><br> \
    <text>Image as background:</text> \
    <input type='checkbox' id='b'> \
    <br> \
    <text id='btext' style='display: none;'>Background color:</text> \
    <input style='display: none;' type='color' id='bcolor' class='favcolor' name='favcolor' value='" + localStorage.bgColor + "'> \
    <text class='imgtext'>Background Image Link:</text> \
    <input value=" + ImageLinkInput + " class='imglnk' id='imglnk'> \
    <br> \
    <text>Background 2 color:</text> \
    <input type='color' id='favcolor' class='favcolor' name='favcolor' value='" + MainColor + "'> \
    <br> \
    <text>Foreground 1 color:</text> \
    <input type='color' id='favcolor2' class='favcolor' name='favcolor' value='" + MainColor2 + "'> \
    <br> \
    <text>Foreground 2 color:</text> \
    <input type='color' id='favcolor3' class='favcolor' name='favcolor' value='" + MainColor3 + "'> \
    <br> \
    <text>Text color:</text> \
    <input type='color' id='favcolor4' class='favcolor' name='favcolor' value='" + MainColor4 + "'> \
    <br> \
    <text>Navbar color:</text> \
    <input type='color' id='favcolor5' class='favcolor' name='favcolor' value='" + NavBarColor + "'> \
    <br> \
    <text>Resizable feed:</text>\
    <input type='checkbox' id='rsizeCheck'> \
    <br> \
    <text>Glass Panels:</text>\
    <input type='checkbox' id='glassCheck'> \
    <br> \
    <br> \
    <button id='submitChanges'>Apply Changes</button> \
    <br> \
    <button id='resetChanges' style='background-color:red !important;'>Reset Changes</button> \
    </div>" // adds the brickarcadium + settings
    var submitButton = document.getElementById("submitChanges");
    var resetButton = document.getElementById("resetChanges");

    var color = document.getElementById("favcolor");
    var fgcolor = document.getElementById("favcolor2");
    var fgcolor2 = document.getElementById("favcolor3");
    var textcolor = document.getElementById("favcolor4");
    var imgLink = document.getElementById("imglnk");
    var nvbr = document.getElementById("favcolor5");
    var resFeed = document.getElementById("rsizeCheck");
    var b = document.getElementById("b");
    var g = document.getElementById("glassCheck");
    var btext = document.getElementById("btext");
    var bcolor = document.getElementById("bcolor")

    function removeGMStyleRule(styleRuleToRemove) {
        var styleElements = document.querySelectorAll('style');
        for (var i = 0; i < styleElements.length; i++) {
            var styleContent = styleElements[i].textContent || styleElements[i].innerText;
            if (styleContent.includes(styleRuleToRemove)) {
                styleElements[i].parentNode.removeChild(styleElements[i]);
                return true;
            }
        }
        return false;
    }
    if (localStorage.getItem("isBgUrl") !== null) {
        if (JSON.parse(localStorage.isBgUrl) == true) {
            GM_addStyle('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
            removeGMStyleRule('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
            document.getElementById("b").checked = true
        } else {
            GM_addStyle('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
            removeGMStyleRule('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
            document.getElementById("b").checked = false
        }
    }
    if (localStorage.getItem("glassCheck") !== null) {
        if (JSON.parse(localStorage.glassCheck) == true) {
            document.getElementById("glassCheck").checked = true
        } else {
            document.getElementById("glassCheck").checked = false
        }
    }

    submitButton.addEventListener('click', function handleClick(event) { // if the submit button is clicked, store all of the data the user entered
        setTheme(color.value, 'themeColor');
        setTheme(fgcolor.value, 'fgColor1');
        setTheme(fgcolor2.value, 'fgColor2');
        setTheme(textcolor.value, 'txtcolor');
        setTheme(imgLink.value, 'imageLink');
        setTheme(nvbr.value, 'nvbr');
        setTheme(bcolor.value, 'bgColor');
        setTheme(b.checked.toString(), "isBgUrl");
    });

    resetButton.addEventListener('click', function handleClick(event) { // if the reset button is clicked, delete all of the data the user entered before
        resetTheme();
    });
    b.addEventListener('click', function handleClick(event) { // when the checkbox is clicked, check if the checkbox is ticked or not
        localStorage.setItem("isBgUrl", b.checked);
        if (b.checked == true) { // if the checkbox is ticked, remove all of the background color stuff and replace it with background link stuff
            GM_addStyle('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
            removeGMStyleRule('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
        } else { // if the checkbox is not ticked, remove all of the background link stuff and replace it with the background color stuff
            GM_addStyle('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
            removeGMStyleRule('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
        }
    });
    g.addEventListener('click', function handleClick(event) {
        localStorage.setItem("glassCheck", g.checked);
    });
    resFeed.addEventListener('click', function handleClick(event) {
        localStorage.setItem("rsize", resFeed.checked);
        console.log(resFeed.checked);
    });
    resFeed.checked = JSON.parse(localStorage.rsize);
    console.log(localStorage.getItem("rsize"))

    function setTheme(color, name) {
        localStorage.setItem(name, color);
        window.location = window.location;
    }
    function checkCheckbox() {
        GM_addStyle('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
        removeGMStyleRule('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
    }

    function resetTheme() {
        delete localStorage.themeColor;
        delete localStorage.isBgUrl;
        window.location = window.location;
    }
    if (localStorage.getItem("isBgUrl") == null || localStorage.isBgUrl === "true") {
        b.checked = true
        console.log(true)
        GM_addStyle('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
        removeGMStyleRule('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
    } else {
        b.checked = false
        GM_addStyle('#imglnk {display: none !important;} #btext {display: inline !important;} #bcolor {display: inline !important;} .imgtext {display: none !important;} imglnk {display: none !important;}')
        removeGMStyleRule('#imglnk {display: inline !important;} #btext {display: none !important;} #bcolor {display: none !important;} .imgtext {display: inline !important;} imglnk {display: inline !important;}')
    }

} else if (document.URL == "https://www.brickarcadium.xyz/Emporium/") { // adds a face category
    document.getElementById("platform").querySelector("div").innerHTML = "<br><a style='color:grey;font-size:22.5px;' href='?type=HEAD'>Hats</a><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=HEAD_2'>Second Hat</a><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=HAIR'>Hair</a><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=FACE'>Mouths</a><br> \
		                        <br><a style='color:grey;font-size:22.5px;' href='?type=FACE'>Faces</a></div> \
                                <br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=MASK'>Face Wear</a><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=BODY'>Body</a><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=TOOL'>Tools</a><br><br><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=SHIRT'>Shirts</a><br> \
								<br><a style='color:grey;font-size:22.5px;' href='?type=TROU'>Pants</a><br> \
								<br><a style='color:grey;font-size:22.5px;font-weight:bold;' href='upload'>Upload</a><br>"
}