Skip to content

Commit 1d03b8a

Browse files
meisterTnickygerritsen
authored andcommitted
Ugly code for a mobile-friendly view, only for demonstration purposes.
1 parent 9bb6a1e commit 1d03b8a

File tree

3 files changed

+228
-3
lines changed

3 files changed

+228
-3
lines changed

webapp/public/style_domjudge.css

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -699,3 +699,24 @@ blockquote {
699699
padding: 3px;
700700
border-radius: 5px;
701701
}
702+
703+
.strike-diagonal {
704+
position: relative;
705+
text-align: center;
706+
}
707+
708+
.strike-diagonal:before {
709+
position: absolute;
710+
content: "";
711+
left: 0;
712+
top: 50%;
713+
right: 0;
714+
border-top: 2px solid;
715+
border-color: firebrick;
716+
717+
-webkit-transform:rotate(-35deg);
718+
-moz-transform:rotate(-35deg);
719+
-ms-transform:rotate(-35deg);
720+
-o-transform:rotate(-35deg);
721+
transform:rotate(-35deg);
722+
}

webapp/src/Twig/TwigExtension.php

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
use App\Service\DOMJudgeService;
2424
use App\Service\EventLogService;
2525
use App\Service\SubmissionService;
26+
use App\Utils\Scoreboard\ScoreboardMatrixItem;
2627
use App\Utils\Utils;
2728
use Doctrine\Common\Collections\Collection;
2829
use Doctrine\ORM\EntityManagerInterface;
@@ -110,6 +111,7 @@ public function getFilters(): array
110111
new TwigFilter('fileTypeIcon', $this->fileTypeIcon(...)),
111112
new TwigFilter('problemBadge', $this->problemBadge(...), ['is_safe' => ['html']]),
112113
new TwigFilter('problemBadgeForContest', $this->problemBadgeForContest(...), ['is_safe' => ['html']]),
114+
new TwigFilter('problemBadgeMaybe', $this->problemBadgeMaybe(...), ['is_safe' => ['html']]),
113115
new TwigFilter('printMetadata', $this->printMetadata(...), ['is_safe' => ['html']]),
114116
new TwigFilter('printWarningContent', $this->printWarningContent(...), ['is_safe' => ['html']]),
115117
new TwigFilter('entityIdBadge', $this->entityIdBadge(...), ['is_safe' => ['html']]),
@@ -1091,6 +1093,41 @@ public function problemBadge(ContestProblem $problem, bool $grayedOut = false):
10911093
);
10921094
}
10931095

1096+
public function problemBadgeMaybe(ContestProblem $problem, ScoreboardMatrixItem $matrixItem): string
1097+
{
1098+
$rgb = Utils::convertToHex($problem->getColor() ?? '#ffffff');
1099+
if (!$matrixItem->isCorrect) {
1100+
$rgb = 'whitesmoke';
1101+
}
1102+
$background = Utils::parseHexColor($rgb);
1103+
1104+
// Pick a border that's a bit darker.
1105+
$darker = $background;
1106+
$darker[0] = max($darker[0] - 64, 0);
1107+
$darker[1] = max($darker[1] - 64, 0);
1108+
$darker[2] = max($darker[2] - 64, 0);
1109+
$border = Utils::rgbToHex($darker);
1110+
1111+
// Pick the foreground text color based on the background color.
1112+
$foreground = ($background[0] + $background[1] + $background[2] > 450) ? '#000000' : '#ffffff';
1113+
if (!$matrixItem->isCorrect) {
1114+
$foreground = 'silver';
1115+
$border = 'linen';
1116+
}
1117+
1118+
$ret = sprintf(
1119+
'<span class="badge problem-badge" style="font-size: x-small; background-color: %s; min-width: 18px; border: 1px solid %s;"><span style="color: %s;">%s</span></span>',
1120+
$rgb,
1121+
$border,
1122+
$foreground,
1123+
$problem->getShortname()
1124+
);
1125+
if (!$matrixItem->isCorrect && $matrixItem->numSubmissions > 0) {
1126+
$ret = '<span><span class="strike-diagonal">' . $ret . '</span></span>';
1127+
}
1128+
return $ret;
1129+
}
1130+
10941131
public function problemBadgeForContest(Problem $problem, ?Contest $contest = null): string
10951132
{
10961133
$contest ??= $this->dj->getCurrentContest();

webapp/templates/partials/scoreboard_table.html.twig

Lines changed: 170 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
</style>
2929
{% endif %}
3030
31-
<table class="scoreboard center {% if jury %}scoreboard_jury{% endif %}">
31+
<table class="d-none d-md-block scoreboard center {% if jury %}scoreboard_jury{% endif %}">
3232
3333
{# output table column groups (for the styles) #}
3434
<colgroup>
@@ -318,6 +318,173 @@
318318
</tbody>
319319
</table>
320320
321+
<table class="d-md-none scoreboard center {% if jury %}scoreboard_jury{% endif %}">
322+
<thead>
323+
{# output table column groups (for the styles) #}
324+
<colgroup>
325+
<col id="scorerank"/>
326+
{% if showFlags %}
327+
<col id="scoreflags"/>
328+
{% else %}
329+
<col/>
330+
{% endif %}
331+
{% if showAffiliationLogos %}
332+
<col id="scorelogos"/>
333+
{% endif %}
334+
<col id="scoreteamname"/>
335+
</colgroup>
336+
<colgroup>
337+
<col id="scoresolv"/>
338+
</colgroup>
339+
340+
{% set teamColspan = 2 %}
341+
{% if showAffiliationLogos %}
342+
{% set teamColspan = teamColspan + 1 %}
343+
{% endif %}
344+
345+
<tr class="scoreheader" data-static="{{ static }}" style="font-size: 75%;">
346+
<th title="rank" scope="col">rank</th>
347+
<th title="team name" scope="col" colspan="{{ teamColspan }}">team</th>
348+
<th title="# solved / penalty time" colspan="1" scope="col">score</th>
349+
</tr>
350+
</thead>
351+
<tbody>
352+
{% set previousSortOrder = -1 %}
353+
{% set previousTeam = null %}
354+
{% set backgroundColors = {"#FFFFFF": 1} %}
355+
{% set medalCount = 0 %}
356+
{% for score in scores %}
357+
{% set classes = [] %}
358+
{% if score.team.category.sortorder != previousSortOrder %}
359+
{% if previousSortOrder != -1 %}
360+
{# Output summary of previous sort order #}
361+
{% include 'partials/scoreboard_summary.html.twig' with {sortOrder: previousSortOrder} %}
362+
{% endif %}
363+
{% set classes = classes | merge(['sortorderswitch']) %}
364+
{% set previousSortOrder = score.team.category.sortorder %}
365+
{% set previousTeam = null %}
366+
{% endif %}
367+
368+
{# process medal color #}
369+
{% set medalColor = '' %}
370+
{% if showLegends %}
371+
{% set medalColor = score.team | medalType(contest, scoreboard) %}
372+
{% endif %}
373+
374+
{# check whether this is us, otherwise use category colour #}
375+
{% if myTeamId is defined and myTeamId == score.team.teamid %}
376+
{% set classes = classes | merge(['scorethisisme']) %}
377+
{% set color = '#FFFF99' %}
378+
{% else %}
379+
{% set color = score.team.category.color %}
380+
{% endif %}
381+
<tr class="{{ classes | join(' ') }}" id="team:{{ score.team.teamid }}" style="border-bottom-width: 0; height: 28px;">
382+
<td class="scorepl {{medalColor}}" rowspan="2">
383+
{# Only print rank when score is different from the previous team #}
384+
{% if not displayRank %}
385+
?
386+
{% elseif previousTeam is null or scoreboard.scores[previousTeam.teamid].rank != score.rank %}
387+
{{ score.rank }}
388+
{% else %}
389+
{% endif %}
390+
{% set previousTeam = score.team %}
391+
</td>
392+
<td class="scoreaf">
393+
{% if showFlags %}
394+
{% if score.team.affiliation %}
395+
{% set link = null %}
396+
{% if jury %}
397+
{% set link = path('jury_team_affiliation', {'affilId': score.team.affiliation.affilid}) %}
398+
{% endif %}
399+
<a {% if link %}href="{{ link }}"{% endif %}>
400+
{{ score.team.affiliation.country|countryFlag }}
401+
</a>
402+
{% endif %}
403+
{% endif %}
404+
</td>
405+
{% if showAffiliationLogos %}
406+
<td class="scoreaf">
407+
{% if score.team.affiliation %}
408+
{% set link = null %}
409+
{% if jury %}
410+
{% set link = path('jury_team_affiliation', {'affilId': score.team.affiliation.affilid}) %}
411+
{% endif %}
412+
<a {% if link %}href="{{ link }}"{% endif %}>
413+
{% set affiliationId = score.team.affiliation.externalid %}
414+
{% set affiliationImage = affiliationId | assetPath('affiliation') %}
415+
{% if affiliationImage %}
416+
<img loading="lazy" width="16px" height="16px"
417+
src="{{ asset(affiliationImage) }}" alt="{{ score.team.affiliation.name }}"
418+
title="{{ score.team.affiliation.name }}">
419+
{% else %}
420+
{{ affiliationId }}
421+
{% endif %}
422+
</a>
423+
{% endif %}
424+
</td>
425+
{% endif %}
426+
{% if color is null %}
427+
{% set color = "#FFFFFF" %}
428+
{% set colorClass = "_FFFFFF" %}
429+
{% else %}
430+
{% set colorClass = color | replace({"#": "_"}) %}
431+
{% set backgroundColors = backgroundColors | merge({(color): 1}) %}
432+
{% endif %}
433+
<td class="scoretn cl{{ colorClass }}" title="{{ score.team.effectiveName }}">
434+
{% set link = null %}
435+
{% set extra = null %}
436+
{% if static %}
437+
{% set link = '#' %}
438+
{% set extra = 'data-bs-toggle="modal" data-bs-target="#team-modal-' ~ score.team.teamid ~ '"' %}
439+
{% else %}
440+
{% if jury %}
441+
{% set link = path('jury_team', {teamId: score.team.teamid}) %}
442+
{% elseif public %}
443+
{% set link = path('public_team', {teamId: score.team.teamid}) %}
444+
{% set extra = 'data-ajax-modal' %}
445+
{% else %}
446+
{% set link = path('team_team', {teamId: score.team.teamid}) %}
447+
{% set extra = 'data-ajax-modal' %}
448+
{% endif %}
449+
{% endif %}
450+
<a {% if extra is not null %}{{ extra | raw }}{% endif %} {% if link is not null %}href="{{ link }}"{% endif %}>
451+
<span class="forceWidth">
452+
{% if false and usedCategories | length > 1 and scoreboard.bestInCategory(score.team, limitToTeamIds) %}
453+
<span class="badge text-bg-warning category-best">
454+
{{ score.team.category.name }}
455+
</span>
456+
{% endif %}
457+
{{ score.team.effectiveName }}
458+
</span>
459+
{% if showAffiliations %}
460+
<span class="univ forceWidth">
461+
{% if score.team.affiliation %}
462+
{{ score.team.affiliation.name }}
463+
{% endif %}
464+
</span>
465+
{% endif %}
466+
</a>
467+
</td>
468+
{% set totalTime = score.totalTime %}
469+
{% if scoreInSeconds %}
470+
{% set totalTime = totalTime | printTimeRelative %}
471+
{% endif %}
472+
{% set totalPoints = score.numPoints %}
473+
<td class="scorenc" rowspan="2">{{ totalPoints }}<br/><span class="scorett" style="font-weight: normal;">{{ totalTime }}</span></td>
474+
</tr>
475+
<tr style="height: 32px;">
476+
<td/>
477+
<td colspan="2">
478+
{% for problem in problems %}
479+
{% set matrixItem = scoreboard.matrix[score.team.teamid][problem.probid] %}
480+
{{ problem | problemBadgeMaybe(matrixItem) }}
481+
{% endfor %}
482+
</td>
483+
</tr>
484+
{% endfor %}
485+
</tbody>
486+
</table>
487+
321488
{% if static %}
322489
{% for score in scores %}
323490
{% embed 'partials/modal.html.twig' with {'modalId': 'team-modal-' ~ score.team.teamid} %}
@@ -368,7 +535,7 @@
368535
{% else %}
369536
{% set cellColors = {first: 'Solved first', correct: 'Solved', incorrect: 'Tried, incorrect', pending: 'Tried, pending', neutral: 'Untried'} %}
370537
{% endif %}
371-
<table id="cell_legend" class="scoreboard scorelegend {% if jury %}scoreboard_jury{% endif %}">
538+
<table id="cell_legend" class="d-none d-md-block scoreboard scorelegend {% if jury %}scoreboard_jury{% endif %}">
372539
<thead>
373540
<tr>
374541
<th scope="col">Cell colours</th>
@@ -387,7 +554,7 @@
387554
{% endif %}
388555
389556
{% if medalsEnabled %}
390-
<table class="scoreboard scorelegend {% if jury %}scoreboard_jury{% endif %}">
557+
<table class="d-none d-md-block scoreboard scorelegend {% if jury %}scoreboard_jury{% endif %}">
391558
<thead>
392559
<tr>
393560
<th scope="col">Medals {% if not scoreboard.freezeData.showFinal %}(tentative){% endif %}</th>

0 commit comments

Comments
 (0)