Display Twitter IDs in contest standings.
// ==UserScript==
// @name AtCoder Contest Standings with Twitter ID
// @namespace https://twitter.com/KakurenboUni
// @version 1.0.0
// @match https://atcoder.jp/contests/*/standings*
// @description Display Twitter IDs in contest standings.
// @author uni-kakurenbo
// @license MIT
// @supportURL https://twitter.com/KakurenboUni
// ==/UserScript==
void function() {
'use strict';
const cache = new Map();
const STORAGE_ID_PREFIX = "AtCoder-Standings-with-Twitter-ID"
window.onload = async function() {
await rendered();
const $checkboxes = Array.from(document.querySelectorAll("div.checkbox"));
const $newElement = document.createElement("div");
$newElement.innerHTML = `<label><input id="checkbox-twitter" type="checkbox"> Twitter ID を表示</label>`;
$newElement.className = "checkbox";
$checkboxes[2].after($newElement);
const $new_checkbox = document.querySelector("input#checkbox-twitter");
$new_checkbox.checked = localStorage.getItem(`${STORAGE_ID_PREFIX}.enable`) === "true";
setVisuality();
if(isAvailable() && $new_checkbox.checked) display();
$new_checkbox.addEventListener('click', ({ target : { checked } }) => {
if(checked) display();
else hide();
});
$checkboxes.at(-1).addEventListener("click", setVisuality);
document.querySelectorAll(".standings-per-page").forEach(element => {
element.addEventListener("click", setVisuality);
})
function isAvailable() {
return +document.querySelector("a.standings-per-page.selected").textContent <= 50 || $checkboxes.at(-1).querySelector("input").checked
}
function setVisuality() {
if(isAvailable()) $new_checkbox.disabled = false;
else { $new_checkbox.checked = false; $new_checkbox.disabled = true; }
}
};
function display() {
const $usernames = document.querySelectorAll(".standings-rank + .standings-username .username")
$usernames.forEach(async ($username) => {
const username = $username.textContent;
const existing = cache.get(username);
let twitterId = "";
if(existing) {
twitterId = existing;
} else {
const response = await fetch($username.href);
const row_text = await response.text();
const twitterInfomation = row_text.match(/href='\/\/twitter.com\/(.*)'/);
if(!twitterInfomation) return;
twitterId = twitterInfomation[1];
cache.set(username, twitterId)
}
const $span = document.createElement("span");
$span.className = "twitter-link";
$span.style["margin-left"] = "5px"
$span.style["margin-right"] = "2px"
$span.innerHTML = `<a href="https://twitter.com/@${twitterId}" target="_blank" rel="noopener noreferrer">@${twitterId}</a>`
$username.after($span);
})
localStorage.setItem(`${STORAGE_ID_PREFIX}.enable`, true);
}
function hide() {
const $targets = document.querySelectorAll(".twitter-link")
$targets.forEach($target => $target.remove());
localStorage.setItem(`${STORAGE_ID_PREFIX}.enable`, false);
}
async function rendered() {
let timer;
await new Promise((resolve) => {
observer();
function observer() {
if(document.querySelector("div.checkbox")) {
resolve();
}
timer = setTimeout(observer, 10);
};
});
clearTimeout(timer)
}
}();