NCGEARS/cheesy-arena-lite
1
0
Fork 0
mirror of https://github.com/Team254/cheesy-arena-lite.git synced 2026-03-09 05:36:45 -04:00
Code Issues Actions Packages Projects Releases 1 Wiki Activity

Show playoff alliance numbers on audience display.

Browse Source
This commit is contained in:
Patrick Fairbank
2022-07-29 16:31:06 -07:00
parent 71369a298b
commit a7e4e49f88
3 changed files with 75 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
static/css/audience_display.css
View File

@@ -18,6 +18,9 @@ html {
flex-direction: column;
align-items: center;
}
#matchOverlayContainer {
display: flex;
}
#matchOverlay {
display: flex;
flex-direction: column;
@@ -29,6 +32,35 @@ html {
height: 100px;
display: flex;
}
.elim-alliance {
position: relative;
top: 31px;
width: 40px;
height: 40px;
padding: 0 5px;
z-index: -1;
display: flex;
align-items: center;
background-color: #fc0;
color: #222;
border: 1px solid #222;
font-size: 15px;
font-weight: 200;
}
#leftElimAlliance {
left: 23px;
justify-content: start;
border-top-left-radius: 50%;
border-bottom-left-radius: 50%;
border-right: none;
}
#rightElimAlliance {
right: 23px;
justify-content: end;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
border-left: none;
}
.teams {
width: 55px;
height: 100%;

11
static/js/audience_display.js
View File

@@ -69,6 +69,17 @@ var handleMatchLoad = function(data) {
$("#" + blueSide + "Team2Avatar").attr("src", getAvatarUrl(currentMatch.Blue2));
$("#" + blueSide + "Team3Avatar").attr("src", getAvatarUrl(currentMatch.Blue3));
// Show alliance numbers if this is an elimination match.
if (currentMatch.Type === "elimination") {
$("#" + redSide + "ElimAlliance").text(currentMatch.ElimRedAlliance);
$("#" + blueSide + "ElimAlliance").text(currentMatch.ElimBlueAlliance);
$(".elim-alliance").show();
} else {
$("#" + redSide + "ElimAlliance").text("");
$("#" + blueSide + "ElimAlliance").text("");
$(".elim-alliance").hide();
}
if (data.Match.Type === "test") {
$("#matchName").text(currentMatch.DisplayName);
} else {

60
templates/audience_display.html
View File

@@ -15,39 +15,43 @@
</head>
<body>
<div id="overlayCentering">
<div id="matchOverlay">
<div id="matchOverlayTop">
<div class="teams" id="leftTeams">
<div id="leftTeam1"></div>
<div id="leftTeam2"></div>
<div id="leftTeam3"></div>
</div>
<div class="score reversible-left">
<div class="avatars">
<img class="avatar" id="leftTeam1Avatar" src="" />
<img class="avatar" id="leftTeam2Avatar" src="" />
<img class="avatar" id="leftTeam3Avatar" src="" />
<div id="matchOverlayContainer">
<div class="elim-alliance" id="leftElimAlliance"></div>
<div id="matchOverlay">
<div id="matchOverlayTop">
<div class="teams" id="leftTeams">
<div id="leftTeam1"></div>
<div id="leftTeam2"></div>
<div id="leftTeam3"></div>
</div>
<div class="score-number" id="leftScoreNumber"></div>
</div>
<div class="score score-right reversible-right">
<div class="score-number" id="rightScoreNumber"></div>
<div class="avatars">
<img class="avatar" id="rightTeam1Avatar" src="" />
<img class="avatar" id="rightTeam2Avatar" src="" />
<img class="avatar" id="rightTeam3Avatar" src="" />
<div class="score reversible-left">
<div class="avatars">
<img class="avatar" id="leftTeam1Avatar" src="" />
<img class="avatar" id="leftTeam2Avatar" src="" />
<img class="avatar" id="leftTeam3Avatar" src="" />
</div>
<div class="score-number" id="leftScoreNumber"></div>
</div>
<div class="score score-right reversible-right">
<div class="score-number" id="rightScoreNumber"></div>
<div class="avatars">
<img class="avatar" id="rightTeam1Avatar" src="" />
<img class="avatar" id="rightTeam2Avatar" src="" />
<img class="avatar" id="rightTeam3Avatar" src="" />
</div>
</div>
<div class="teams" id="rightTeams">
<div id="rightTeam1"></div>
<div id="rightTeam2"></div>
<div id="rightTeam3"></div>
</div>
</div>
<div class="teams" id="rightTeams">
<div id="rightTeam1"></div>
<div id="rightTeam2"></div>
<div id="rightTeam3"></div>
<div id="eventMatchInfo">
<span>{{.EventSettings.Name}}</span>
<span id="matchName"></span>
</div>
</div>
<div id="eventMatchInfo">
<span>{{.EventSettings.Name}}</span>
<span id="matchName"></span>
</div>
<div class="elim-alliance" id="rightElimAlliance"></div>
</div>
<div class="text-center" id="matchCircle">
<img id="logo" src="/static/img/lower-third-logo.png" alt="logo" />