Skip to content

Commit e24ac34

Browse files
meisterTnickygerritsen
authored andcommitted
Ugly code for a mobile-friendly view, only for demonstration purposes.
1 parent 0121a2f commit e24ac34

File tree

3 files changed

+231
-3
lines changed

3 files changed

+231
-3
lines changed

webapp/public/style_domjudge.css

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -655,3 +655,24 @@ blockquote {
655655
color: DimGray;
656656
margin-left: auto;
657657
}
658+
659+
.strike-diagonal {
660+
position: relative;
661+
text-align: center;
662+
}
663+
664+
.strike-diagonal:before {
665+
position: absolute;
666+
content: "";
667+
left: 0;
668+
top: 50%;
669+
right: 0;
670+
border-top: 2px solid;
671+
border-color: firebrick;
672+
673+
-webkit-transform:rotate(-35deg);
674+
-moz-transform:rotate(-35deg);
675+
-ms-transform:rotate(-35deg);
676+
-o-transform:rotate(-35deg);
677+
transform:rotate(-35deg);
678+
}

webapp/src/Twig/TwigExtension.php

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
use App\Service\DOMJudgeService;
2323
use App\Service\EventLogService;
2424
use App\Service\SubmissionService;
25+
use App\Utils\Scoreboard\ScoreboardMatrixItem;
2526
use App\Utils\Utils;
2627
use Doctrine\Common\Collections\Collection;
2728
use Doctrine\ORM\EntityManagerInterface;
@@ -108,6 +109,7 @@ public function getFilters(): array
108109
new TwigFilter('tsvField', $this->toTsvField(...)),
109110
new TwigFilter('fileTypeIcon', $this->fileTypeIcon(...)),
110111
new TwigFilter('problemBadge', $this->problemBadge(...), ['is_safe' => ['html']]),
112+
new TwigFilter('problemBadgeMaybe', $this->problemBadgeMaybe(...), ['is_safe' => ['html']]),
111113
new TwigFilter('problemBadgeForProblemAndContest', $this->problemBadgeForProblemAndContest(...), ['is_safe' => ['html']]),
112114
new TwigFilter('printMetadata', $this->printMetadata(...), ['is_safe' => ['html']]),
113115
new TwigFilter('printWarningContent', $this->printWarningContent(...), ['is_safe' => ['html']]),
@@ -1082,6 +1084,41 @@ public function problemBadge(ContestProblem $problem): string
10821084
);
10831085
}
10841086

1087+
public function problemBadgeMaybe(ContestProblem $problem, ScoreboardMatrixItem $matrixItem): string
1088+
{
1089+
$rgb = Utils::convertToHex($problem->getColor() ?? '#ffffff');
1090+
if (!$matrixItem->isCorrect) {
1091+
$rgb = 'whitesmoke';
1092+
}
1093+
$background = Utils::parseHexColor($rgb);
1094+
1095+
// Pick a border that's a bit darker.
1096+
$darker = $background;
1097+
$darker[0] = max($darker[0] - 64, 0);
1098+
$darker[1] = max($darker[1] - 64, 0);
1099+
$darker[2] = max($darker[2] - 64, 0);
1100+
$border = Utils::rgbToHex($darker);
1101+
1102+
// Pick the foreground text color based on the background color.
1103+
$foreground = ($background[0] + $background[1] + $background[2] > 450) ? '#000000' : '#ffffff';
1104+
if (!$matrixItem->isCorrect) {
1105+
$foreground = 'silver';
1106+
$border = 'linen';
1107+
}
1108+
1109+
$ret = sprintf(
1110+
'<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>',
1111+
$rgb,
1112+
$border,
1113+
$foreground,
1114+
$problem->getShortname()
1115+
);
1116+
if (!$matrixItem->isCorrect && $matrixItem->numSubmissions > 0) {
1117+
$ret = '<span><span class="strike-diagonal">' . $ret . '</span></span>';
1118+
}
1119+
return $ret;
1120+
}
1121+
10851122
public function problemBadgeForProblemAndContest(Problem $problem, ?Contest $contest): string
10861123
{
10871124
foreach ($problem->getContestProblems() as $contestProblem) {

webapp/templates/partials/scoreboard_table.html.twig

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

0 commit comments

Comments
 (0)