☰

AtCoder Beautiful Code View

AtCoderの提出コードをMonaco Editorを使用した表示にします

As of 2022-05-01. See the latest version.

  1. // ==UserScript==
  2. // @name    AtCoder Beautiful Code View
  3. // @namespace    http://tampermonkey.net/
  4. // @version    0.1
  5. // @description    AtCoderの提出コードをMonaco Editorを使用した表示にします
  6. // @author     Chippppp
  7. // @license    MIT
  8. // @match    https://atcoder.jp/contests/*/submissions/*
  9. // @grant    none
  10. // ==/UserScript==
  11.  
  12. "use strict";
  13.  
  14. (function() {
  15.     // Monaco Editor in cdnjs
  16.     // Copyright (c) 2016 - present Microsoft Corporation
  17.     let script = document.createElement("script");
  18.     script.src = "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.33.0/min/vs/loader.min.js";
  19.     document.head.prepend(script);
  20.  
  21.     let header = document.createElement("script");
  22.     header.innerHTML = `
  23.         document.getElementsByClassName("linenums")[0].style.display = "none";
  24.         document.getElementsByClassName("btn-text toggle-btn-text source-code-expand-btn")[0].style.display = "none";
  25.         document.getElementsByClassName("btn-copy btn-pre")[0].style.zIndex = "1";
  26.         document.getElementsByClassName("btn-copy btn-pre")[0].style.borderRadius = "0";
  27.         document.getElementsByClassName("btn-copy btn-pre")[1].style.zIndex = "1";
  28.         document.getElementsByClassName("btn-copy btn-pre")[1].style.borderRadius = "0";
  29.     `
  30.     document.head.prepend(header);
  31.  
  32.     let div = document.createElement("div");
  33.     div.style.marginTop = "10px";
  34.     div.style.marginBottom = "30px";
  35.     document.getElementById("submission-code").after(div);
  36.  
  37.     let arr = new Array;
  38.     for (let i = 0; i < 10; ++i) {
  39.         arr.push(document.getElementsByClassName("L" + i.toString()));
  40.     }
  41.     let str = ""
  42.     let idx;
  43.     for (idx = 0; ; ++idx) {
  44.         if (Math.floor(idx / 10) < arr[idx % 10].length) {
  45.             str += arr[idx % 10][Math.floor(idx / 10)].innerText;
  46.             str += "\n";
  47.         } else break;
  48.     }
  49.     div.style.height = Math.min(510, (idx + 1) * 21 + 6).toString() + "px";
  50.     console.log(idx);
  51.  
  52.     let lang = document.getElementsByClassName("text-center")[3].innerText;
  53.     lang = lang.slice(0, lang.indexOf(" ")).toLocaleLowerCase().replace("#", "sharp");
  54.     if (lang.startsWith("pypy")) lang = "python";
  55.     else if (lang == "c++") lang = "cpp";
  56.  
  57.     script.onload = function() {
  58.         require.config({ paths: { "vs": "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.33.0/min/vs" } });
  59.  
  60.         require(["vs/editor/editor.main"], function() {
  61.             monaco.editor.create(div, {
  62.                 value: str,
  63.                 language: lang,
  64.                 theme: "vs-dark",
  65.                 readOnly: true,
  66.                 lineHeight: 21,
  67.             });
  68.             document.getElementsByClassName("monaco-editor")[0].style.paddingTop = "20px";
  69.         });
  70.     };
  71. })();