A rewrite of Poly+, my quality-of-life browser extension for Polytoria. Built entirely fresh using the WXT extension framework, Typescript, and with added better overall code quality.
extension
1import config from "@/utils/config.json";
2
3export async function displayId(userId: number) {
4 const statsCard = document.getElementById('user-stats-card');
5 if (!statsCard) return; // ? Incase the user is blocked, which means the stats card won't be present
6
7 const row = document.createElement('div');
8 row.classList.add('mb-1');
9 row.innerHTML = `
10 <b>
11 <i class="fa fa-hashtag text-center d-inline-block" style="width:1.3em"></i>
12 Player ID
13 </b>
14 <span class="float-end">
15 ${userId}
16 <a id="copy" href="#copy">
17 <i class="fad fa-copy" style="margin-left: 5px;"></i>
18 </a>
19 </span>
20 `;
21
22 const copyBtn = row.getElementsByTagName('a')[0];
23 copyBtn.addEventListener('click', () => {
24 navigator.clipboard.writeText(userId as unknown as string)
25 .then(() => {
26 const icon: HTMLElement = copyBtn.children[0] as HTMLElement;
27 copyBtn.classList.add('text-success');
28 icon.setAttribute('class', 'fa-duotone fa-circle-check');
29 icon.style.marginLeft = '3px';
30
31 setTimeout(() => {
32 copyBtn.classList.remove('text-success');
33 icon.setAttribute('class', 'fad fa-copy');
34 icon.style.marginLeft = '5px';
35 }, 1500);
36 })
37 .catch(() => {
38 alert('Failure to copy user ID to clipboard.');
39 });
40 });
41
42 statsCard.children[0].insertBefore(row, statsCard.querySelector('.mb-1:has(.fa-calendar)')!);
43};