AtCoder Submission Status

AtCoderで提出した解答がいくつのテストケースでACか, WAか...が一目でわかるように表示する

2019-05-30 يوللانغان نەشرى. ئەڭ يېڭى نەشرىنى كۆرۈش.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

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

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

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

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

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

  1. // ==UserScript==
  2. // @name AtCoder Submission Status
  3. // @name:en AtCoder Submission Status
  4. // @namespace https://github.com/9sako6/atcoder-userscripts
  5. // @version 1.0
  6. // @description AtCoderで提出した解答がいくつのテストケースでACか, WAか...が一目でわかるように表示する
  7. // @description:en This script shows submission's statuses clearly!
  8. // @author 9sako6
  9. // @match https://atcoder.jp/contests/*/submissions/*
  10. // @exclude https://atcoder.jp/contests/*/submissions/me
  11. // @require http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js
  12. // @license MIT
  13. // @supportURL https://github.com/9sako6/atcoder-userscripts/issues
  14. // ==/UserScript==
  15.  
  16. function makeTable() {
  17. 'use strict';
  18. /**
  19. * count each status
  20. */
  21. const statusPanel = document.getElementsByClassName('panel-default')[2];
  22. const cases = $(statusPanel).find('tr');
  23. const statusCodes = [];
  24. let countAll = -1;
  25. let counter = {};
  26. // initialize counter
  27. statusCodes.forEach((val) => {
  28. counter[val] = 0;
  29. });
  30. cases.each((_, elem)=>{
  31. let texts = $(elem).find('td');
  32. texts.each((i, tdElem)=>{
  33. if (i == 1) { // if tdElem is status code
  34. const statusCode = $($(tdElem).find('span')[0]).text();
  35. if (!statusCodes.includes(statusCode)){
  36. statusCodes.push(statusCode);
  37. }
  38. (counter[statusCode] === undefined ? counter[statusCode] = 1 : counter[statusCode] += 1);
  39. }
  40. });
  41. countAll += 1;
  42. });
  43. statusCodes.sort();
  44.  
  45. /**
  46. * make result table
  47. */
  48. // a wrapper element of table
  49. let wrapElem = document.createElement('div');
  50. wrapElem.id = 'added-result-panel';
  51. wrapElem.classList.add('panel', 'panel-default');
  52. var newContent = document.createTextNode('');
  53. wrapElem.appendChild(newContent);
  54. statusPanel.parentNode.insertBefore(wrapElem, statusPanel);
  55.  
  56. // make fake table
  57. // to
  58. let trElem = '<div style="width: 100%; display: flex;">';
  59. const codeNum = statusCodes.length;
  60. statusCodes.forEach((status, i) => {
  61. const ACflag = (status === 'AC' ? true : false);
  62. trElem += `
  63. <div
  64. style="
  65. width: ${100/codeNum}%;
  66. text-align: center;
  67. border: 0.1px solid #ddd;
  68. border-top: 0;
  69. border-bottom: 0;
  70. border-right: 0;
  71. ${i == 0 ? "border-left: 0;" : ""}">
  72. <div style="
  73. line-height: 2em;
  74. border: 0.1px solid #ddd;
  75. border-top: 0;
  76. border-right: 0;
  77. border-left: 0;
  78. border-bottom: 1;">
  79. <span
  80. class="label label-${ACflag ? 'success' : 'warning'}"
  81. aria-hidden="true"
  82. data-toggle="tooltip"
  83. data-placement="top"
  84. style="text-align: center; line-height: 2em;"
  85. >${status}</span>
  86. </div>
  87. <div style="line-height: 1.8em;">${counter[status]}/${countAll}</div>
  88. </div>`;
  89. });
  90. trElem += '</div>';
  91.  
  92. const resultTable = `<div class="table table-bordered table-striped th-center">
  93. ${trElem}
  94. </div>`;
  95. $('#added-result-panel').append(resultTable);
  96. }
  97.  
  98. (function() {
  99. try {
  100. makeTable();
  101. }catch(e){
  102. console.error();
  103. }
  104. })();