core&ui: fix contest with more than 26 problems have wrong alphabetic id (#1008)

Co-authored-by: undefined <i@undefined.moe>

packages/hydrooj/src/handler/contest.ts

@@ -5,7 +5,7 @@ import { escapeRegExp, pick } from 'lodash';
 import moment from 'moment-timezone';
 import { ObjectId } from 'mongodb';
 import {
-    Counter, diffArray, randomstring, sortFiles, Time, yaml,
+    Counter, diffArray, getAlphabeticId, randomstring, sortFiles, Time, yaml,
 } from '@hydrooj/utils/lib/utils';
 import { Context, Service } from '../context';
 import {
@@ -132,7 +132,7 @@ export class ContestDetailBaseHandler extends Handler {
             },
             {
                 name: 'problem_detail',
-                displayName: `${String.fromCharCode(65 + this.tdoc.pids.indexOf(pdoc.docId))}. ${pdoc.title}`,
+                displayName: `${getAlphabeticId(this.tdoc.pids.indexOf(pdoc.docId))}. ${pdoc.title}`,
                 args: { query: { tid }, pid: pdoc.docId, prefix: 'contest_detail_problem' },
                 checker: () => 'pdoc' in this,
             },
@@ -791,7 +791,7 @@ export async function apply(ctx: Context) {
                 const teamIds: Record<number, number> = {};
                 for (let i = 1; i <= teams.length; i++) teamIds[teams[i - 1].uid] = i;
                 const time = (t: ObjectId) => Math.floor((t.getTimestamp().getTime() - tdoc.beginAt.getTime()) / Time.second);
-                const pid = (i: number) => String.fromCharCode(65 + i);
+                const pid = (i: number) => getAlphabeticId(i);
                 const escape = (i: string) => i.replace(/[",]/g, '');
                 const unknownSchool = this.translate('Unknown School');
                 const statusMap = {

packages/hydrooj/src/model/contest.ts

@@ -1,6 +1,8 @@
 import { sumBy } from 'lodash';
 import { Filter, ObjectId } from 'mongodb';
-import { Counter, formatSeconds, Time } from '@hydrooj/utils/lib/utils';
+import {
+    Counter, formatSeconds, getAlphabeticId, Time,
+} from '@hydrooj/utils/lib/utils';
 import {
     ContestAlreadyAttendedError, ContestNotFoundError,
     ContestScoreboardHiddenError, ValidationError,
@@ -158,7 +160,7 @@ const acm = buildContestRule({
             } else {
                 columns.push({
                     type: 'problem',
-                    value: String.fromCharCode(65 + i - 1),
+                    value: getAlphabeticId(i - 1),
                     raw: pid,
                 });
             }
@@ -324,7 +326,7 @@ const oi = buildContestRule({
             } else {
                 columns.push({
                     type: 'problem',
-                    value: String.fromCharCode(65 + i - 1),
+                    value: getAlphabeticId(i - 1),
                     raw: tdoc.pids[i - 1],
                 });
             }
@@ -699,7 +701,7 @@ const homework = buildContestRule({
             } else {
                 columns.push({
                     type: 'problem',
-                    value: String.fromCharCode(65 + i - 1),
+                    value: getAlphabeticId(i - 1),
                     raw: pid,
                 });
             }

packages/ui-default/backendlib/template.ts

@@ -1,6 +1,6 @@
 import path from 'path';
 import * as status from '@hydrooj/common/status';
-import { findFileSync } from '@hydrooj/utils/lib/utils';
+import { findFileSync, getAlphabeticId } from '@hydrooj/utils/lib/utils';
 import {
   avatar, Context, difficultyAlgorithm, fs, PERM, PRIV, Service, STATUS, yaml,
 } from 'hydrooj';
@@ -130,7 +130,7 @@ class Nunjucks extends nunjucks.Environment {
     this.addGlobal('instanceof', (a, b) => a instanceof b);
     this.addGlobal('paginate', misc.paginate);
     this.addGlobal('size', misc.size);
-    this.addGlobal('utils', { status });
+    this.addGlobal('utils', { status, getAlphabeticId });
     this.addGlobal('avatarUrl', avatar);
     this.addGlobal('formatSeconds', misc.formatSeconds);
     this.addGlobal('model', global.Hydro.model);

packages/ui-default/pages/contest_balloon.page.tsx

@@ -1,4 +1,5 @@
 /* eslint-disable react-refresh/only-export-components */
+import { getAlphabeticId } from '@hydrooj/utils/lib/common';
 import yaml from 'js-yaml';
 import React from 'react';
 import { HexColorInput, HexColorPicker } from 'react-colorful';
@@ -31,8 +32,8 @@ function Balloon({ tdoc, val }) {
                 <tr key={pid}>
                   <td>
                     {now === pid
-                      ? (<b>{String.fromCharCode(65 + tdoc.pids.indexOf(+pid))}</b>)
-                      : (<span>{String.fromCharCode(65 + tdoc.pids.indexOf(+pid))}</span>)}
+                      ? (<b>{getAlphabeticId(tdoc.pids.indexOf(+pid))}</b>)
+                      : (<span>{getAlphabeticId(tdoc.pids.indexOf(+pid))}</span>)}
                   </td>
                   <td>
                     <HexColorInput

packages/ui-default/templates/components/contest.html

@@ -8,5 +8,5 @@
 {% endmacro %}
 
 {% macro render_clarification_subject(tdoc, pdict, subject) %}
-{% if subject == 0 %}{{ _('General Issue') }}{% elif subject == -1 %}{{ _('Technical Issue') }}{% else %}{{ String.fromCharCode(65 + tdoc.pids.indexOf(subject)) + 1 }}. {{ pdict[subject].title }}{% endif %}
+{% if subject == 0 %}{{ _('General Issue') }}{% elif subject == -1 %}{{ _('Technical Issue') }}{% else %}{{ utils.getAlphabeticId(tdoc.pids.indexOf(subject)) }}. {{ pdict[subject].title }}{% endif %}
 {% endmacro %}

packages/ui-default/templates/components/problem.html

@@ -5,7 +5,7 @@
   <a href="{{ url('problem_detail', _linkArgs) }}"{% if small %} data-tooltip="{{ pdoc.title }}"{% endif %}>
 {%- endif -%}
 {% if show_pid %}
-<b>{%- if tdoc and alphabetic -%}{{ String.fromCharCode(65+tdoc.pids.indexOf(pdoc.docId)) }}
+<b>{%- if tdoc and alphabetic -%}{{ utils.getAlphabeticId(tdoc.pids.indexOf(pdoc.docId)) }}
 {%- elif pdoc.pid and pdoc.pid.includes('-') -%}{{ pdoc.pid.split('-').join('#') }}
 {%- else -%}{{ pdoc.pid|default(pdoc.docId) }}{%- endif -%}</b>
 {% endif %}

packages/ui-default/templates/contest_manage.html

@@ -127,7 +127,7 @@
                         <option value="0">{{ _('General Issue') }}</option>
                         <option value="-1">{{ _('Technical Issue') }}</option>
                         {% for pid in tdoc.pids %}
-                        <option value="{{ pid }}">{{ String.fromCharCode(65+loop.index0) }}. {{ pdict[pid].title }}</option>
+                        <option value="{{ pid }}">{{ utils.getAlphabeticId(loop.index0) }}. {{ pdict[pid].title }}</option>
                         {% endfor %}
                       </select>
                     </label>

packages/ui-default/templates/contest_problemlist.html

@@ -185,7 +185,7 @@
                   <option value="0">{{ _('General Issue') }}</option>
                   <option value="-1">{{ _('Technical Issue') }}</option>
                   {% for pid in tdoc.pids %}
-                  <option value="{{ pid }}">{{ String.fromCharCode(65+loop.index0) }}. {{ pdict[pid].title }}</option>
+                  <option value="{{ pid }}">{{ utils.getAlphabeticId(loop.index0) }}. {{ pdict[pid].title }}</option>
                   {% endfor %}
                 </select>
               </label>

packages/ui-default/templates/partials/contest_balloon.html

@@ -25,7 +25,7 @@
           </button> 
         </form>
       {% endif %}
-      <b>{{ String.fromCharCode(65+tdoc.pids.indexOf(bdoc.pid)) }}</b>&nbsp;&nbsp;({{ tdoc.balloon[bdoc.pid].name }})
+      <b>{{ utils.getAlphabeticId(tdoc.pids.indexOf(bdoc.pid)) }}</b>&nbsp;&nbsp;({{ tdoc.balloon[bdoc.pid].name }})
     </td>
     <td class="col--submit-by" data-tooltip="{{ bdoc._id.getTimestamp().format() }}">{{ user.render_inline(udict[bdoc.uid], badge=false) }}</td>
     <td class="col--send-by"{% if bdoc.sent %} data-tooltip="{{ bdoc.sentAt.format() }}"{% endif %}>

packages/ui-default/templates/problem_detail.html

@@ -64,7 +64,7 @@
             </form>
           {% endif %}
           {%- if tdoc -%}
-            {{ String.fromCharCode(65+tdoc.pids.indexOf(pdoc.docId)) }}
+            {{ utils.getAlphabeticId(tdoc.pids.indexOf(pdoc.docId)) }}
           {%- elif pdoc.pid and pdoc.pid.includes('-') -%}
             {{ pdoc.pid.split('-').join('#') }}
           {%- else -%}
@@ -80,7 +80,7 @@
               <a href="{{ url('problem_detail', pid=pid, query={tid:tdoc.docId}) }}"
                  class="{% if pass %}pass{% elif fail %}fail{% endif %}
                         {% if pid==pdoc.docId %} active{% endif %}">
-                <span class="id">{{ String.fromCharCode(65+loop.index0) }}</span>
+                <span class="id">{{ utils.getAlphabeticId(loop.index0) }}</span>
                 {% if status %}<span class="icon icon-{% if pass %}check{% else %}close{% endif %}"></span>{% endif %}
               </a>
             {%- endfor %}

packages/utils/lib/common.ts

@@ -236,3 +236,12 @@ export function sortFiles(files: Record<string, any>[] | string[], key = '_id')
         });
     return result.map((x) => (isString ? x.name : (delete x._weights && x)));
 }
+
+export const getAlphabeticId = (() => {
+    // A...Z, AA...AZ, BA...BZ, ...
+    const f = (a: number) => (a < 0 ? '' : f(a / 26 - 1) + String.fromCharCode((a % 26) + 65)) as string;
+    const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+    const cache = alphabet.split('');
+    for (const ch of alphabet) cache.push(...alphabet.split('').map((c) => ch + c));
+    return (i: number) => cache[i] || (i < 0 ? '?' : f(i));
+})();