Add game-agnostic final score summary to audience display

This commit is contained in:
Ken Schenke
2020-04-06 19:28:20 -05:00
parent 5712321733
commit 53caa27208
3 changed files with 54 additions and 8 deletions

View File

@@ -209,8 +209,8 @@ html {
#finalScore {
position: fixed;
width: 1200px;
height: 300px;
top: 5px;
height: 450px;
top: 65px;
bottom: 0;
left: 0;
right: 0;
@@ -223,8 +223,8 @@ html {
.final-score {
float: left;
width: 50%;
height: 65%;
line-height: 200px;
height: 50%;
line-height: 225px;
border-bottom: 2px solid #333;
color: #fff;
font-family: "FuturaLTBold";
@@ -242,14 +242,13 @@ html {
.final-teams {
float: left;
width: 50%;
height: 18%;
height: 12%;
overflow: hidden;
line-height: 50px;
text-align: center;
color: #fff;
font-family: "FuturaLT";
font-size: 32px;
border-bottom: 2px solid #333;
}
.final-teams span {
margin: 0 10px;
@@ -272,10 +271,34 @@ html {
#rightFinalTeams {
padding-left: 5%;
}
.final-breakdown {
float: left;
width: 33%;
height: 28%;
padding: 0px 20px;
display: table;
text-align: center;
background-color: #fff;
color: #222;
font-family: "FuturaLT";
font-size: 24px;
}
#leftFinalBreakdown {
clear: left;
text-align: right;
}
#rightFinalBreakdown {
text-align: left;
}
#centerFinalBreakdown {
width: 34%;
border-left: 2px solid #333;
border-right: 2px solid #333;
}
#finalEventMatchInfo {
clear: both;
width: 100%;
height: 15%;
height: 9%;
line-height: 50px;
padding: 0px 25px;
font-family: "FuturaLT";

View File

@@ -96,6 +96,9 @@ var handleScorePosted = function(data) {
$("#" + redSide + "FinalTeam1Avatar").attr("src", getAvatarUrl(data.Match.Red1));
$("#" + redSide + "FinalTeam2Avatar").attr("src", getAvatarUrl(data.Match.Red2));
$("#" + redSide + "FinalTeam3Avatar").attr("src", getAvatarUrl(data.Match.Red3));
$("#" + redSide + "FinalAutoPoints").text(data.RedScoreSummary.AutoPoints);
$("#" + redSide + "FinalTeleopPoints").text(data.RedScoreSummary.TeleopPoints);
$("#" + redSide + "FinalEndgamePoints").text(data.RedScoreSummary.EndgamePoints);
$("#" + blueSide + "FinalScore").text(data.BlueScoreSummary.Score);
$("#" + blueSide + "FinalTeam1").html(data.Match.Blue1 + "" + getRankingText(data.Match.Blue1, data.Rankings));
$("#" + blueSide + "FinalTeam2").html(data.Match.Blue2 + "" + getRankingText(data.Match.Blue2, data.Rankings));
@@ -103,6 +106,9 @@ var handleScorePosted = function(data) {
$("#" + blueSide + "FinalTeam1Avatar").attr("src", getAvatarUrl(data.Match.Blue1));
$("#" + blueSide + "FinalTeam2Avatar").attr("src", getAvatarUrl(data.Match.Blue2));
$("#" + blueSide + "FinalTeam3Avatar").attr("src", getAvatarUrl(data.Match.Blue3));
$("#" + blueSide + "FinalAutoPoints").text(data.BlueScoreSummary.AutoPoints);
$("#" + blueSide + "FinalTeleopPoints").text(data.BlueScoreSummary.TeleopPoints);
$("#" + blueSide + "FinalEndgamePoints").text(data.BlueScoreSummary.EndgamePoints);
$("#finalSeriesStatus").text(data.SeriesStatus);
$("#finalSeriesStatus").attr("data-leader", data.SeriesLeader);
$("#finalMatchName").text(data.MatchType + " " + data.Match.DisplayName);
@@ -268,7 +274,7 @@ var transitionLogoToBlank = function(callback) {
};
var transitionLogoToScore = function(callback) {
$(".blindsCenter.full").transition({queue: false, top: "-350px"}, 625, "ease");
$(".blindsCenter.full").transition({queue: false, top: "-225px"}, 625, "ease");
$("#finalScore").show();
$("#finalScore").transition({queue: false, opacity: 1}, 1000, "ease", callback);
};

View File

@@ -77,6 +77,23 @@
<img class="final-avatar" id="rightFinalTeam2Avatar" src="" /><span id="rightFinalTeam2"></span>
<img class="final-avatar" id="rightFinalTeam3Avatar" src="" /><span id="rightFinalTeam3"></span>
</div>
<div class="final-breakdown" id="leftFinalBreakdown">
<span class="valign-cell">
<span id="leftFinalAutoPoints"></span><br />
<span id="leftFinalTeleopPoints"></span><br />
<span id="leftFinalEndgamePoints"></span><br />
</span>
</div>
<div class="final-breakdown" id="centerFinalBreakdown">
<span class="valign-cell">Auto<br />Teleop<br />Endgame</span>
</div>
<div class="final-breakdown" id="rightFinalBreakdown">
<span class="valign-cell">
<span id="rightFinalAutoPoints"></span><br />
<span id="rightFinalTeleopPoints"></span><br />
<span id="rightFinalEndgamePoints"></span><br />
</span>
</div>
<div id="finalEventMatchInfo">
<div class="final-footer">{{.EventSettings.Name}}</div>
<div class="final-footer" id="finalSeriesStatus">&nbsp;</div>