userscripts/chess.js at main · dylanarmstrong/userscripts · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
// ==UserScript==
// @author       dylanarmstrong
// @description  Add analyze in lichess on chess.com game over screen
// @match        https://www.chess.com/*
// @name         chess
// @namespace    https://github.com/dylanarmstrong/userscripts/
// @run-at       document-body
// @supportURL   https://github.com/dylanarmstrong/userscripts/issues
// @updateURL    https://raw.githubusercontent.com/dylanarmstrong/userscripts/main/chess.js
// @version      2
// ==/UserScript==

/**
 * Add button to analyze games on lichess after games.
 */
(function main() {
  // eslint-disable-next-line prefer-const
  let timer;

  const getLink = async () => {
    const gameId = new URL(location.href).pathname.split("/").at(-1);
    const playerName = document
      .querySelector("#notifications-request")
      .getAttribute("username");

    const gameUrl = await fetch(
      `https://api.chess.com/pub/player/${playerName}/games/archives`,
    )
      .then((r) => r.json())
      .then((index) => index.archives.at(-1));

    const { pgn } = await fetch(gameUrl)
      .then((r) => r.json())
      .then((index) => index.games.find((game) => game.url.endsWith(gameId)));

    const { url } = await fetch("https://lichess.org/api/import", {
      body: `pgn=${encodeURIComponent(pgn)}`,
      headers: {
        accept: "application/json",
        "content-type": "application/x-www-form-urlencoded;charset=UTF-8",
      },
      method: "post",
    }).then((r) => r.json());

    return url;
  };

  const addLink = async (event) => {
    const { currentTarget } = event;
    currentTarget.removeEventListener("click", addLink);

    currentTarget.textContent = "Loading...";
    const url = await getLink();
    currentTarget.textContent = "Lichess Review";
    currentTarget.href = url;
    currentTarget.click();
  };

  const getElement = () => {
    const element = document.querySelector("#__lichess__");
    if (element) {
      element.remove();
    }

    const link = document.createElement("a");
    link.id = "__lichess__";

    link.style["-moz-user-select"] = "auto";
    link.style["-webkit-user-select"] = "auto";

    link.style.alignItems = "center";
    link.style.display = "flex";
    link.style.height = "100%";
    link.style.justifyContent = "center";
    link.style.pointerEvents = "auto";
    link.style.userSelect = "auto";
    link.style.width = "100%";

    link.classList.add("game-over-review-button-label");
    link.textContent = "Lichess Review";
    link.rel = "noopener noreferrer";
    link.target = "_blank";

    return link;
  };

  const loop = async () => {
    const gameOver = document.querySelector(
      ".game-over-review-button-component",
    );
    if (gameOver) {
      globalThis.clearInterval(timer);

      const element = gameOver.cloneNode(true);

      const oldButton = gameOver.querySelector(".cc-button-primary");
      if (oldButton) {
        oldButton.classList.remove("cc-button-primary");
        oldButton.classList.add("cc-button-secondary");
      }

      const link = getElement();

      link.addEventListener("click", addLink);

      element.replaceChild(
        link,
        element.querySelector(".game-over-review-button-label"),
      );

      gameOver.before(element);
    }
  };

  timer = globalThis.setInterval(loop, 500);
})();