Skip to content

Commit

Permalink
Update match review page for Bootstrap 5.
Browse files Browse the repository at this point in the history
  • Loading branch information
@patfair
patfair committed May 10, 2024
1 parent 92993db commit d19c7b0
Show file tree
Hide file tree
Showing 7 changed files with 137 additions and 121 deletions.
23 changes: 16 additions & 7 deletions static/css/cheesy-arena.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,11 +27,23 @@
.blue-text {
color: #00f;
}
.card-red {
background-color: #422;
.bg-red {
background-color: #422 !important;
}
.card-blue {
background-color: #192945;
.bg-dark-red {
background-color: #311 !important;
}
.bg-blue {
background-color: #192945 !important;
}
.bg-dark-blue {
background-color: #113 !important;
}
.bg-yellow {
background-color: #442 !important;
}
.bg-green {
background-color: #132 !important;
}
.col-no-padding {
padding-left: 0;
Expand Down Expand Up @@ -117,9 +129,6 @@ input[data-changed="true"], select[data-changed="true"] {
height: 610px;
overflow-y: auto;
}
.match-list table {
border-collapse: separate;
}
.match-list th {
position: sticky;
top: 0;
Expand Down
166 changes: 83 additions & 83 deletions templates/edit_match_result.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,58 +7,54 @@
{{define "title"}}Edit Match Results{{end}}
{{define "body"}}
<div class="row">
<div class="well">
<form class="form-horizontal" method="POST">
<div class="card card-body bg-body-tertiary">
<form method="POST">
<fieldset>
<legend>Edit {{.Match.LongName}} Results</legend>
<div id="redScore"></div>
<div id="blueScore"></div>
<div class="row form-group">
<div class="row">
<div class="text-center col-lg-12">
<a href="/match_review"><button type="button" class="btn btn-default">Cancel</button></a>
<button type="submit" class="btn btn-info">Save</button>
<a href="/match_review"><button type="button" class="btn btn-secondary">Cancel</button></a>
<button type="submit" class="btn btn-primary">Save</button>
</div>
</div>
</fieldset>
</form>
</div>
</div>
<div id="scoreTemplate" style="display: none;">
<div class="well well-{{"{{alliance}}"}}">
<div class="card card-body bg-{{"{{alliance}}"}} mb-3">
<fieldset>
<legend>Autonomous</legend>
<b>Mobility</b>
<div class="form-group">
<div class="row">
{{range $i := seq 3}}
<div class="col-lg-2">
<label class="col-lg-8 control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<input type="checkbox" class="input-sm" name="{{"{{alliance}}"}}MobilityStatuses{{$i}}">
</div>
{{end}}
</div>
</div>
<b>Charge Station Docking</b>
<div class="form-group">
<div class="row">
{{range $i := seq 3}}
<div class="row mb-3">
{{range $i := seq 3}}
<div class="col-lg-2">
<label class="col-lg-8 control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<input type="checkbox" class="input-sm" name="{{"{{alliance}}"}}AutoDockStatuses{{$i}}">
<label class="control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<input type="checkbox" class="ms-3" name="{{"{{alliance}}"}}MobilityStatuses{{$i}}">
</div>
{{end}}
{{end}}
</div>
<b>Charge Station Docking</b>
<div class="row mb-3">
{{range $i := seq 3}}
<div class="col-lg-2">
<label class="control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<input type="checkbox" class="ms-3" name="{{"{{alliance}}"}}AutoDockStatuses{{$i}}">
</div>
<div class="row">
<div class="col-lg-4 col-lg-offset-1">
<label class="col-lg-8 control-label">Charge Station Is Level?</label>
<input type="checkbox" class="input-sm" name="{{"{{alliance}}"}}AutoChargeStationLevel">
</div>
{{end}}
</div>
<div class="row mb-3">
<div class="col-lg-4 col-lg-offset-1">
<label class="control-label">Charge Station Is Level?</label>
<input type="checkbox" class="ms-3" name="{{"{{alliance}}"}}AutoChargeStationLevel">
</div>
</div>
</fieldset>
<fieldset>
<legend>Grid</legend>
<div class="row">
<div class="row text-center">
<div class="col-lg-1"></div>
{{range $i := seq 9}}
<label class="col-lg-1 control-label">{{$i}}</label>
Expand All @@ -71,24 +67,25 @@
</fieldset>
<fieldset>
<legend>Endgame</legend>
<div class="form-group">
<div class="mb-3">
{{range $i := seq 3}}
<div class="row">
<label class="col-lg-1 col-lg-offset-1 control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<div class="radio col-lg-1">
<input type="radio" name="{{"{{alliance}}"}}EndgameStatuses{{$i}}" value="0">None
<div class="row mb-2">
<div class="col-lg-1"></div>
<label class="col-lg-1 control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<div class="col-lg-1">
<input type="radio" name="{{"{{alliance}}"}}EndgameStatuses{{$i}}" value="0"> None
</div>
<div class="radio col-lg-1">
<input type="radio" name="{{"{{alliance}}"}}EndgameStatuses{{$i}}" value="1">Parked
<div class="col-lg-1">
<input type="radio" name="{{"{{alliance}}"}}EndgameStatuses{{$i}}" value="1"> Parked
</div>
<div class="radio col-lg-1">
<input type="radio" name="{{"{{alliance}}"}}EndgameStatuses{{$i}}" value="2">Docked
<div class="col-lg-1">
<input type="radio" name="{{"{{alliance}}"}}EndgameStatuses{{$i}}" value="2"> Docked
</div>
</div>
{{end}}
<div class="col-lg-4 col-lg-offset-1">
<label class="col-lg-8 control-label">Charge Station Is Level?</label>
<input type="checkbox" class="input-sm" name="{{"{{alliance}}"}}EndgameChargeStationLevel">
<div class="mt-3">
<label class="control-label">Charge Station Is Level?</label>
<input type="checkbox" class="ms-3" name="{{"{{alliance}}"}}EndgameChargeStationLevel">
</div>
</div>
</fieldset>
Expand All @@ -97,41 +94,42 @@
{{"{{#each score.Fouls}}"}}
<input type="hidden" class="input-sm" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Index"
value="{{"{{@index}}"}}">
<div class="well well-sm well-dark{{"{{../alliance}}"}}">
<button type="button" class="close" onclick="deleteFoul('{{"{{../alliance}}"}}', {{"{{@index}}"}});">
×
<div class="card card-body bg-dark-{{"{{../alliance}}"}} mb-2">
<button type="button" class="btn-close" onclick="deleteFoul('{{"{{../alliance}}"}}', {{"{{@index}}"}});">
</button>
<br />
<div class="form-group">
<div class="row mb-3">
<label class="col-lg-2 control-label">Is Technical?</label>
<div class="col-lg-3">
<input type="checkbox" class="input-sm" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}IsTechnical">
</div>
</div>
<div class="form-group">
<div class="row mb-3">
<label class="col-lg-2 control-label">Team</label>
<div class="col-lg-8">
<div class="radio col-lg-2">
<label>
<input type="radio" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Team" value="{{"{{../team1}}"}}">
{{"{{../team1}}"}}
</label>
</div>
<div class="radio col-lg-2">
<label>
<input type="radio" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Team" value="{{"{{../team2}}"}}">
{{"{{../team2}}"}}
</label>
</div>
<div class="radio col-lg-2">
<label>
<input type="radio" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Team" value="{{"{{../team3}}"}}">
{{"{{../team3}}"}}
</label>
<div class="row">
<div class="col-lg-2">
<label>
<input type="radio" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Team" value="{{"{{../team1}}"}}">
Team {{"{{../team1}}"}}
</label>
</div>
<div class="col-lg-2">
<label>
<input type="radio" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Team" value="{{"{{../team2}}"}}">
Team {{"{{../team2}}"}}
</label>
</div>
<div class="col-lg-2">
<label>
<input type="radio" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}Team" value="{{"{{../team3}}"}}">
Team {{"{{../team3}}"}}
</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="row mb-3">
<label class="col-lg-2 control-label">Rule</label>
<div class="col-lg-9">
<select class="form-control" name="{{"{{../alliance}}"}}Foul{{"{{@index}}"}}RuleId">
Expand All @@ -146,34 +144,36 @@
</div>
</div>
{{"{{/each}}"}}
<button type="button" class="btn btn-default btn-sm" onclick="addFoul('{{"{{alliance}}"}}');">
<button type="button" class="btn btn-secondary btn-sm" onclick="addFoul('{{"{{alliance}}"}}');">
Add Foul
</button>
<br /><br />
</fieldset>
<fieldset>
<legend>Cards</legend>
{{range $i := seq 3}}
<div class="form-group">
<div class="row mb-3">
<label class="col-lg-2 control-label">Team {{"{{team"}}{{$i}}{{"}}"}}</label>
<div class="col-lg-8">
<div class="radio col-lg-2">
<label>
<input type="radio" name="{{"{{alliance}}"}}Team{{"{{team"}}{{$i}}{{"}}"}}Card" value="" checked>
None
</label>
</div>
<div class="radio col-lg-2">
<label>
<input type="radio" name="{{"{{alliance}}"}}Team{{"{{team"}}{{$i}}{{"}}"}}Card" value="yellow">
Yellow
</label>
</div>
<div class="radio col-lg-2">
<label>
<input type="radio" name="{{"{{alliance}}"}}Team{{"{{team"}}{{$i}}{{"}}"}}Card" value="red">
Red
</label>
<div class="row">
<div class="col-lg-2">
<label>
<input type="radio" name="{{"{{alliance}}"}}Team{{"{{team"}}{{$i}}{{"}}"}}Card" value="" checked>
None
</label>
</div>
<div class="col-lg-2">
<label>
<input type="radio" name="{{"{{alliance}}"}}Team{{"{{team"}}{{$i}}{{"}}"}}Card" value="yellow">
Yellow
</label>
</div>
<div class="col-lg-2">
<label>
<input type="radio" name="{{"{{alliance}}"}}Team{{"{{team"}}{{$i}}{{"}}"}}Card" value="red">
Red
</label>
</div>
</div>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions templates/match_play.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@
style="text-transform: uppercase;">&nbsp;</div>
<div id="matchState" class="col-lg-3 card card-body bg-body-tertiary">&nbsp;</div>
<div id="matchTime" class="col-lg-2 card card-body bg-body-tertiary">&nbsp;</div>
<div id="redScore" class="col-lg-2 card card-body card-red">&nbsp;</div>
<div id="blueScore" class="col-lg-2 card card-body card-blue">&nbsp;</div>
<div id="redScore" class="col-lg-2 card card-body bg-red">&nbsp;</div>
<div id="blueScore" class="col-lg-2 card card-body bg-blue">&nbsp;</div>
</div>
<div class="row text-center">
<div class="col-lg-6 card card-body card-blue mb-2">
<div class="col-lg-6 card card-body bg-blue mb-2">
<div class="row mb-3">
<div class="col-lg-4">Blue Teams</div>
<div class="col-lg-2" data-bs-toggle="tooltip" title="Driver Station Status">DS</div>
Expand All @@ -31,7 +31,7 @@
{{template "matchPlayTeam" dict "color" "B" "position" 3}}
<div id="playoffBlueAllianceInfo"></div>
</div>
<div class="col-lg-6 card card-body card-red mb-2">
<div class="col-lg-6 card card-body bg-red mb-2">
<div class="row mb-3">
<div class="col-lg-4">Red Teams</div>
<div class="col-lg-2" data-bs-toggle="tooltip" title="Driver Station Status">DS</div>
Expand Down
8 changes: 4 additions & 4 deletions templates/match_play_match_load.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,10 +30,10 @@
</thead>
<tbody>
{{range $match := $matches}}
<tr class="{{$match.ColorClass}}">
<td>{{$match.ShortName}}</td>
<td>{{$match.Time}}</td>
<td class="nowrap">
<tr>
<td class="bg-{{$match.ColorClass}}">{{$match.ShortName}}</td>
<td class="bg-{{$match.ColorClass}}">{{$match.Time}}</td>
<td class="bg-{{$match.ColorClass}} nowrap">
<b class="btn btn-primary btn-sm" onclick="loadMatch({{$match.Id}});">Load</b>
{{if ne $match.Status matchScheduled}}
<b class="btn btn-primary btn-sm" onclick="showResult({{$match.Id}});">Show Result</b>
Expand Down
39 changes: 23 additions & 16 deletions templates/match_review.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,22 @@
{{define "title"}}Match Review{{end}}
{{define "body"}}
<div class="row">
<ul class="nav nav-tabs" style="margin-bottom: 15px;">
<li{{if eq .CurrentMatchType practiceMatch }} class="active"{{end}}>
<a href="#Practice" data-toggle="tab">Practice</a>
<ul class="nav nav-tabs">
<li>
<a href="#Practice" class="nav-link{{if eq .CurrentMatchType practiceMatch }} active{{end}}" data-bs-toggle="tab">
Practice
</a>
</li>
<li{{if eq .CurrentMatchType qualificationMatch }} class="active"{{end}}>
<a href="#Qualification" data-toggle="tab">Qualification</a>
<li>
<a href="#Qualification" class="nav-link{{if eq .CurrentMatchType qualificationMatch }} active{{end}}"
data-bs-toggle="tab">
Qualification
</a>
</li>
<li{{if eq .CurrentMatchType playoffMatch }} class="active"{{end}}>
<a href="#Playoff" data-toggle="tab">Playoff</a>
<li>
<a href="#Playoff" class="nav-link{{if eq .CurrentMatchType playoffMatch }} active{{end}}" data-bs-toggle="tab">
Playoff
</a>
</li>
</ul>
<div class="tab-content">
Expand All @@ -35,19 +42,19 @@
</thead>
<tbody>
{{range $match := $matches}}
<tr class="{{$match.ColorClass}}">
<td>{{$match.ShortName}}</td>
<td>{{$match.Time}}</td>
<td class="text-center red-text">
<tr>
<td class="bg-{{$match.ColorClass}}">{{$match.ShortName}}</td>
<td class="bg-{{$match.ColorClass}}">{{$match.Time}}</td>
<td class="bg-{{$match.ColorClass}} text-center red-text">
{{index $match.RedTeams 0}}, {{index $match.RedTeams 1}}, {{index $match.RedTeams 2}}
</td>
<td class="text-center blue-text">
<td class="bg-{{$match.ColorClass}} text-center blue-text">
{{index $match.BlueTeams 0}}, {{index $match.BlueTeams 1}}, {{index $match.BlueTeams 2}}
</td>
<td class="text-center red-text">{{if $match.IsComplete}}{{$match.RedScore}}{{end}}</td>
<td class="text-center blue-text">{{if $match.IsComplete}}{{$match.BlueScore}}{{end}}</td>
<td class="text-center nowrap">
<a href="/match_review/{{$match.Id}}/edit"><b class="btn btn-info btn-xs">Edit</b></a>
<td class="bg-{{$match.ColorClass}} text-center red-text">{{if $match.IsComplete}}{{$match.RedScore}}{{end}}</td>
<td class="bg-{{$match.ColorClass}} text-center blue-text">{{if $match.IsComplete}}{{$match.BlueScore}}{{end}}</td>
<td class="bg-{{$match.ColorClass}} text-center nowrap">
<a href="/match_review/{{$match.Id}}/edit"><b class="btn btn-primary btn-sm">Edit</b></a>
</td>
</tr>
{{end}}
Expand Down
Loading

0 comments on commit d19c7b0

Please sign in to comment.