// ==UserScript==
// @name        [GC] Visualizer for Shop Ban
// @namespace   https://greasyfork.org/en/users/1225524-kaitlin
// @match       https://www.grundos.cafe/viewshop/*
// @grant       GM.addStyle
// @license     MIT
// @version     1.0
// @author      Cupkait
// @icon        https://i.imgur.com/4Hm2e6z.png
// @description Displays your current shop ban status in visual format directly on the page.
//  Next up: Settings! Probably always on, always off, alert only (and set what % you want it to appear at).
// ==/UserScript==
var shopBan = $('.big-image').attr('title').match(/\d+/g); // Grab current ban amount from image title.
var barColor = getBarColor(shopBan); // Determine color of bar based on how close you are to a ban.
setprogressGradient(barColor);
$('#greeting').remove();
$('.nomargin').eq(0).remove();
$('.nomargin').eq(0).append(`<div class="range" style="--p:${shopBan}"></div>`);
$('#page_footer').remove();
function getBarColor(shopBan) {
// This range of colors is kinda ugly in the middle right now
// but I'll worry about that later.
var colors = ['#70fa77', '#7ff166', '#8ce855', '#97df45', '#a0d535', '#a9cc26', '#b0c215', '#b7b800', '#bdae00', '#c2a400', '#c69a00', '#c98f00', '#cc8400', '#ce7a01', '#cf6f0e', '#cf6318', '#ce5820', '#cd4c27', '#ca402d', '#c73333'];
var colorIndex = Math.floor(shopBan / 5);
return colors[colorIndex];
}
// CSS required for the bar to appear correctly.
async function setprogressGradient(barColor) {
GM.addStyle(`.range {
position: relative;
background-color: #33333338;
width: 100%;
height: 15px;
margin-top: 5px;
transform: skew(30deg);
font-family: 'Courier', monospace;
}
.range:before {
--width: calc(var(--p) * 1%);
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background-color: ${barColor};
z-index: 0;
animation: load 2.5s forwards linear(0 0%, 0 2.27%, 0.02 4.53%, 0.04 6.8%, 0.06 9.07%, 0.1 11.33%, 0.14 13.6%, 0.25 18.15%, 0.39 22.7%, 0.56 27.25%, 0.77 31.8%, 1 36.35%, 0.89 40.9%, 0.85 43.18%, 0.81 45.45%, 0.79 47.72%, 0.77 50%, 0.75 52.27%, 0.75 54.55%, 0.75 56.82%, 0.77 59.1%, 0.79 61.38%, 0.81 63.65%, 0.85 65.93%, 0.89 68.2%, 1 72.7%, 0.97 74.98%, 0.95 77.25%, 0.94 79.53%, 0.94 81.8%, 0.94 84.08%, 0.95 86.35%, 0.97 88.63%, 1 90.9%, 0.99 93.18%, 0.98 95.45%, 0.99 97.73%, 1 100%);    }
.range:after {
counter-reset: progress var(--p);
content: counter(progress) '% to shop ban';
color: #000;
position: absolute;
right: 5%;
top: 50%;
transform: translateY(-50%) skewX(-30deg);
z-index: 1;
}
h1.greeting {
font-family:heffaklump;
font-size:22px;
font-weight:normal;
}
@keyframes load {
to {
width: var(--width);
}
}`);
}