AtCoder Submission User Colorizer

提出一覧のユーザ名を色付けします

נכון ליום 10-03-2024. ראה הגרסה האחרונה.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

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

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

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

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

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

(I already have a user script manager, let me install it!)

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.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         AtCoder Submission User Colorizer
// @namespace    http://tampermonkey.net/
// @version      1.3
// @description  提出一覧のユーザ名を色付けします
// @author       morio_prog
// @match        https://atcoder.jp/contests/*/submissions*
// @grant        none
// @license      CC0
// @require      https://unpkg.com/lscache/lscache.min.js
// ==/UserScript==

$(function() {
    'use strict';

    const lastUpdateKey = 'user-colorizer-ranking-last-update';
    const rankingKey = 'user-colorizer-ranking';
    const OUT_OF_RANK = Number.MAX_VALUE;   // > 100

    function getColor(rating) {
        if (rating >= 2800) return '#FF0000';
        if (rating >= 2400) return '#FF8000';
        if (rating >= 2000) return '#C0C000';
        if (rating >= 1600) return '#0000FF';
        if (rating >= 1200) return '#00C0C0';
        if (rating >=  800) return '#008000';
        if (rating >=  400) return '#804000';
        if (rating >     0) return '#808080';
        return '#000000';
    }

    function getColorClass(rating) {
        if (rating >= 2800) return 'user-red';
        if (rating >= 2400) return 'user-orange';
        if (rating >= 2000) return 'user-yellow';
        if (rating >= 1600) return 'user-blue';
        if (rating >= 1200) return 'user-cyan';
        if (rating >=  800) return 'user-green';
        if (rating >=  400) return 'user-brown';
        if (rating >     0) return 'user-gray';
        return 'user-unrated';
    }

    function getAchRate(rating) {
        const base = Math.floor(rating / 400) * 400;
        return ((rating - base) / 400) * 100;
    }

    function colorize(u, ranking, rating) {
        /* */if (ranking <=   1) $(u).before('<img style="vertical-align: middle;" src="//img.atcoder.jp/assets/icon/crown_champion.png">&nbsp;');
        else if (ranking <=  10) $(u).before('<img style="vertical-align: middle;" src="//img.atcoder.jp/assets/icon/crown_gold.png">&nbsp;');
        else if (ranking <=  30) $(u).before('<img style="vertical-align: middle;" src="//img.atcoder.jp/assets/icon/crown_silver.png">&nbsp;');
        else if (ranking <= 100) $(u).before('<img style="vertical-align: middle;" src="//img.atcoder.jp/assets/icon/crown_bronze.png">&nbsp;');
        else if (rating > 0) {
            const color = getColor(rating);
            const achRate = getAchRate(rating);
            $(u).before(`
                <span style="
                    display: inline-block;
                    height: 12px;
                    width: 12px;
                    vertical-align: center;
                    border-radius: 50%;
                    border: solid 1px ${color};
                    background: -webkit-linear-gradient(
                        bottom,
                        ${color} 0%,
                        ${color} ${achRate}%,
                        rgba(255, 255, 255, 0.0) ${achRate}%,
                        rgba(255, 255, 255, 0.0) 100%);
                "></span>
            `);
        }
        $(u).addClass(getColorClass(rating));
    }

    function getRankingMap() {
        return new Promise(function(callback) {
            const currentTime = new Date().getTime();
            const lastUpdateTime = localStorage.getItem(lastUpdateKey);
            // Update every 3 hours
            if (lastUpdateTime && currentTime < Number(lastUpdateTime) + 3 * 60 * 60 * 1000) {
                callback(JSON.parse(localStorage.getItem(rankingKey)));
            } else {
                let ranking = {};
                $.ajax({
                    url: "https://atcoder.jp/ranking",
                    type: 'GET',
                    dataType: 'html'
                })
                .done(function(data) {
                    $($.parseHTML(data)).find('.username > span').each(function(idx) {
                        const userName = $(this).text();
                        ranking[userName] = idx + 1;
                    });
                })
                .then(function() {
                    localStorage.setItem(lastUpdateKey, currentTime);
                    localStorage.setItem(rankingKey, JSON.stringify(ranking));
                    callback(ranking);
                });
            }
        });
    }

    function getRanking(rankingMap, userName) {
        if (userName in rankingMap) return rankingMap[userName];
        return OUT_OF_RANK;
    }

    lscache.flushExpired();
    getRankingMap().then((rankingMap) => {
        let index = 0;
        $('a[href*="/users"]').each(function(_, u) {
            // Skip "My Profile"
            if ($(u).find('span').length) return true;
            const partUri = $(this).attr('href');
            const userName = partUri.slice(7);
            const lskey = "rating-" + userName;
            const ranking = getRanking(rankingMap, userName);
            let rating = lscache.get(lskey);

            if (rating !== null) {
                colorize(u, ranking, rating);
                return;
            }

            index += 1;
            setTimeout(function() {
                $.ajax({
                    url: "https://atcoder.jp" + partUri + "/history/json",
                    type: 'GET',
                    dataType: 'json'
                })
                .done(function(data) {
                    const ratedCount = data.length;
                    if (ratedCount == 0) {
                        rating = 0;
                    } else {
                        rating = data[ratedCount - 1]["NewRating"];
                    }
                    // Update every 3 hours
                    lscache.set(lskey, rating, 3 * 60);
                })
                .then(function() {
                    colorize(u, ranking, rating);
                });
            }, index * 300);
        });
    });

});