Drawaria Minimalistic

Вы давно хотели убрать всю рекламу в драварии? Сделать красивейшее меню? А может ещё и кнопки? Тогда этот скрипт поможет вам!

θα χρειαστεί να εγκαταστήσετε μια επέκταση όπως το Tampermonkey, το Greasemonkey ή το Violentmonkey για να εγκαταστήσετε αυτόν τον κώδικα.

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

θα χρειαστεί να εγκαταστήσετε μια επέκταση όπως το Tampermonkey ή το Violentmonkey για να εγκαταστήσετε αυτόν τον κώδικα.

θα χρειαστεί να εγκαταστήσετε μια επέκταση όπως το Tampermonkey ή το Userscripts για να εγκαταστήσετε αυτόν τον κώδικα.

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

Θα χρειαστεί να εγκαταστήσετε μια επέκταση διαχείρισης κώδικα χρήστη για να εγκαταστήσετε αυτόν τον κώδικα.

(Έχω ήδη έναν διαχειριστή κώδικα χρήστη, επιτρέψτε μου να τον εγκαταστήσω!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(Έχω ήδη έναν διαχειριστή στυλ χρήστη, επιτρέψτε μου να τον εγκαταστήσω!)

// ==UserScript==
// @name         Drawaria Minimalistic
// @namespace    http://tampermonkey.net/
// @version      1.5.1
// @description  Вы давно хотели убрать всю рекламу в драварии? Сделать красивейшее меню? А может ещё и кнопки? Тогда этот скрипт поможет вам!
// @author       𝓚𝓡𝓘𝓢𝓟𝓘 𝓥𝓐.
// @match       https://drawaria.online/
// @grant        none
// @license MIT
// ==/UserScript==

(function() {
    'use strict';


    const removeSelectors = [
        ".extimages",
        "#gameadsbanner",
        ".sitelogo",
        ".footer",
        "#browserwarning",
        "#yandex_rtb_R-A-669506-1",
        ".row.promlinks"
    ];
    removeSelectors.forEach(sel => document.querySelectorAll(sel).forEach(el => el.remove()));


    let bgDiv = document.createElement("div");
    bgDiv.id = "bgDiv";
    Object.assign(bgDiv.style, {
        position: "fixed",
        top: "0",
        left: "0",
        width: "100%",
        height: "100%",
        zIndex: "0",
        pointerEvents: "none",
        backgroundSize: "200% 200%",
        transition: "background 0.5s"
    });
    document.body.insertBefore(bgDiv, document.body.firstChild);


    const loginContainer = document.getElementById("login-midcol");
    if (loginContainer) loginContainer.style.background = "transparent";


    const menu = document.createElement("div");
    Object.assign(menu.style, {
        position: "fixed",
        top: "10px",
        left: "10px",
        zIndex: 9999,
        padding: "10px",
        borderRadius: "10px",
        background: "rgba(0,0,0,0.7)",
        color: "white",
        fontFamily: "sans-serif",
        cursor: "move",
        userSelect: "none",
        width: "200px"
    });

    menu.innerHTML =
        `<label>Выбор градиента:</label>
        <select id="gradient-picker" style="margin:5px 0; padding:5px; width:100%;">
            <option value="linear-gradient(135deg, rgb(0,198,255), rgb(0,114,255))">Синий-голубой</option>
            <option value="linear-gradient(135deg, rgb(255,0,128), rgb(255,102,0))">Розовый-оранж</option>
            <option value="linear-gradient(135deg, rgb(0,255,128), rgb(0,128,255))">Зелёный-синий</option>
        </select>

        <label>Тип градиента:</label>
        <select id="gradient-type" style="margin:5px 0; padding:5px; width:100%;">
            <option value="static">Статический</option>
            <option value="animated">Переливающийся</option>
        </select>

        <div style="margin-top:5px;">
            <button id="menu-decrease" style="padding:3px 6px;">-</button>
            <button id="menu-increase" style="padding:3px 6px;">+</button>
        </div>
    `;

    document.body.appendChild(menu);

    const gradientPicker = document.getElementById("gradient-picker");
    const gradientType = document.getElementById("gradient-type");
    const buttons = document.querySelectorAll(".btn");

    function applyGradient() {
        const grad = gradientPicker.value;
        const type = gradientType.value;

        if (type === "animated") {
            bgDiv.style.background = grad;
            bgDiv.style.backgroundSize = "200% 200%";
            bgDiv.style.animation = "gradientAnim 10s ease infinite";
        } else {
            bgDiv.style.background = grad;
            bgDiv.style.animation = "none";
        }

        buttons.forEach(btn => {
            btn.style.background = grad;
            btn.style.color = "white";
            btn.style.fontWeight = "bold";
            btn.style.border = "none";
        });

        gradientPicker.style.background = grad;
        gradientPicker.style.color = "white";
    }

    gradientPicker.addEventListener("change", applyGradient);
    gradientType.addEventListener("change", applyGradient);
    applyGradient();


    document.getElementById("menu-decrease").addEventListener("click", () => menu.style.transform = "scale(0.7)");
    document.getElementById("menu-increase").addEventListener("click", () => menu.style.transform = "scale(1.3)");


    let isDragging = false, offsetX, offsetY;
    menu.addEventListener('mousedown', e => {
        isDragging = true;
        offsetX = e.clientX - menu.offsetLeft;
        offsetY = e.clientY - menu.offsetTop;
    });
    document.addEventListener('mousemove', e => {
        if (isDragging){
            menu.style.left = (e.clientX - offsetX) + "px";
            menu.style.top = (e.clientY - offsetY) + "px";
        }
    });
    document.addEventListener('mouseup', e => { isDragging = false; });


    const styleSheet = document.createElement("style");
    styleSheet.innerHTML =
        `@keyframes gradientAnim {
            0% {background-position:0% 50%;}
            50% {background-position:100% 50%;}
            100% {background-position:0% 50%;}
        }
    `;
    document.head.appendChild(styleSheet);

})();