Skip to content

Commit b93d0ad

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

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

0 commit comments

Comments
 (0)