CF-rating-chart-patch

Some modification to make Codeforces rating chart better

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

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

Tendrás que instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Tendrás que instalar una extensión como Tampermonkey antes de poder instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name         CF-rating-chart-patch
// @version      0.1.0
// @description  Some modification to make Codeforces rating chart better
// @match        *://codeforces.com/profile/*
// @grant        none
// @run-at       document-start
// @namespace https://greasyfork.org/users/410786
// ==/UserScript==
 
const oldCode = String.raw`
    grid: { hoverable: true, markings: markings }
};

var plot = $.plot($("#placeholder"), datas, options);

function showTooltip(x, y, contents) {
    $('<div id="tooltip">' + contents + '</div>').css( {
        position: 'absolute',
        display: 'none',
        top: y - 20,
        left: x + 10,
        border: '1px solid #fdd',
        padding: '2px',
        'font-size' : '11px',
        'background-color': '#fee',
        opacity: 0.80
    }).appendTo("body").fadeIn(200);
}

var ctx = plot.getCanvas().getContext("2d");

var prev = -1;
$("#placeholder").bind("plothover", function (event, pos, item) {
    if (item) {
        if (prev != item.dataIndex) {
            $("#tooltip").remove();
            var params = data[item.seriesIndex][item.dataIndex];

            var total = params[1];
            var change = params[5] > 0 ? "+" + params[5] : params[5];
            var contestName = params[11];
            var contestId = params[2];
            var contestUrl = params[7];
            var rank = params[6];
            var title = params[8];
            var html = "= " + total + " (" + change + "), " + title + "<br/>"
                            + "Rank: " + rank + "<br/>"
                            + "<a href='" + contestUrl + "'>" + contestName + "</a>";
            if (change > 0)
                html += "<br/><a style='font-weight: bold;' href=\"/bestRatingChanges/" + params[10] + "\">Share it!</a>";
            showTooltip(item.pageX, item.pageY, html);
            setTimeout(function () {
                $("#tooltip").fadeOut(200);
                prev = -1;
            }, 4000);
            prev = item.dataIndex;
        }
    }
});`;

const newCode = '\ngrid: { hoverable: true, clickable: true, markings: markings } };' + (function(){
	// NOTE: toString does not work 100% of the time. Use String.raw instead if it doesn't work.
	var plot = $.plot($("#placeholder"), datas, options);

	function showTooltip(x, y, contents) {
		$('<div id="tooltip">' + contents + '</div>').css( {
			position: 'absolute',
			display: 'none',
			top: y - 20,
			left: x,
			border: '1px solid #fdd',
			padding: '2px',
			'font-size' : '11px',
			'background-color': '#fee',
			opacity: 0.80
		}).appendTo("body").fadeIn(200);
	}

	var ctx = plot.getCanvas().getContext("2d");

	$("#placeholder").bind("plotclick", function (event, pos, item) {
		if (item) {
			var params = data[item.seriesIndex][item.dataIndex];

			var total = params[1];
			var change = params[5] > 0 ? "+" + params[5] : params[5];
			var contestName = params[11];
			var contestId = params[2];
			var contestUrl = params[7];
			var rank = params[6];
			var title = params[8];

			window.open(contestUrl)
		}
	});

	var prev = -1;
	var tooltipFadeoutTimeoutId = null;

	function clearTooltipFadeout () {
		if (tooltipFadeoutTimeoutId !== null)
			clearTimeout(tooltipFadeoutTimeoutId);
	}

	function tooltipFadeout () {
		$("#tooltip").fadeOut(200);
		prev = -1;
		tooltipFadeoutTimeoutId = null;
	}

	document.addEventListener('click', function (event) {
		if (event.target.id !== 'tooltip')
			tooltipFadeout();
	});

	function setTooltipFadeout () {
		clearTooltipFadeout();
		tooltipFadeoutTimeoutId = setTimeout(tooltipFadeout, 4000);
	}

	$("#placeholder").bind("plothover", function (event, pos, item) {
		if (item) {
			if (prev != item.dataIndex) {
				$("#tooltip").remove();
				var params = data[item.seriesIndex][item.dataIndex];

				var total = params[1];
				var change = params[5] > 0 ? "+" + params[5] : params[5];
				var contestName = params[11];
				var contestId = params[2];
				var contestUrl = params[7];
				var rank = params[6];
				var title = params[8];
				var html = "= " + total + " (" + change + "), " + title + "<br/>"
								+ "Rank: " + rank + "<br/>"
								+ "<a href='" + contestUrl + "'>" + contestName + "</a>";
				if (change > 0)
					html += "<br/><a style='font-weight: bold;' href=\"/bestRatingChanges/" + params[10] + "\">Share it!</a>";
				showTooltip(item.pageX, item.pageY, html);
				prev = item.dataIndex;

				$("#tooltip").bind("mouseenter", clearTooltipFadeout).bind("mouseleave", setTooltipFadeout);
			}
		} else {
			setTooltipFadeout();
		}
	}).bind("mouseleave", setTooltipFadeout);
	// this will always work because mouseleave of placeholder is fired before
	// mouseenter of tooltip (stackoverflow.com/q/10011493)

}).toString().replace(/}$/,'').replace(/^function.*?(\s*)\s*{/,'')


var script_modified = false;
new MutationObserver(function(mutations, observer){
	for (let r of mutations){
		let t=r.target
		if(t.tagName==='SCRIPT'){
			var ind = t.innerHTML.indexOf(oldCode);
			if (ind >= 0) {
				t.innerHTML = t.innerHTML.substr(0, ind) + newCode + t.innerHTML.substr(ind+oldCode.length)
				observer.disconnect();
				script_modified = true;
				console.log('CF script modified')
				return;
			}
		}
	}
}).observe(document,{
	childList:true,
	subtree:true,
});

window.addEventListener('load', function(){
	if (!script_modified)
		console.log('NOTE: script is not working')
})