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

Add animate.css and add rubberband animation to alliance display

Browse Source
This commit is contained in:
Sam Baumgarten
2015-03-04 14:36:56 -08:00
committed by Patrick Fairbank
parent df2d9892dd
commit c7db2951fb
3 changed files with 3172 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3158
static/css/animate.css vendored Normal file
View File

File diff suppressed because it is too large Load Diff

13
static/js/alliance_station_display.js
View File

@@ -6,6 +6,7 @@
var allianceStation = "";
var blinkInterval;
var currentScreen = "blank";
var animationName = "rubberBand"; // See https://github.com/daneden/animate.css for more
var websocket;
// Handles a websocket message to change which screen is displayed.
@@ -49,13 +50,23 @@ var handleSetMatch = function(data) {
$("#teamNumber").text("");
$("#teamName").attr("data-alliance-bg", allianceStation[0]).text("");
}
animateTeamNumber();
} else {
$("body").attr("data-mode", "displayId");
}
};
function animateTeamNumber() {
$("#teamNumber").addClass(animationName);
setTimeout(function() {
$("#teamNumber").removeClass(animationName);
}, 1500);
}
// Handles a websocket message to update the team connection status.
var handleStatus = function(data) {
console.log(data);
stationStatus = data.AllianceStations[allianceStation];
var blink = false;
if (stationStatus.Bypass) {
@@ -107,7 +118,7 @@ $(function() {
window.location = "/displays/alliance_station?displayId=" + displayId;
}
$("#displayId").text(displayId);
// Set up the websocket back to the server.
websocket = new CheesyWebsocket("/displays/alliance_station/websocket?displayId=" + displayId, {
setAllianceStationDisplay: function(event) { handleSetAllianceStationDisplay(event.data); },

3
templates/alliance_station_display.html
View File

@@ -11,13 +11,14 @@
<link rel="shortcut icon" href="/static/img/favicon32.png">
<link rel="stylesheet" href="/static/css/lib/bootstrap.min.css" />
<link rel="stylesheet" href="/static/css/cheesy-arena.css" />
<link rel="stylesheet" href="/static/css/animate.css" />
<link rel="stylesheet" href="/static/css/alliance_station_display.css" />
</head>
<body>
<div id="displayId" class="mode"></div>
<div id="match" class="mode">
<div id="preMatch">
<div id="teamNumber"></div>
<div id="teamNumber" class="animated"></div>
<div id="teamName" class='databar'></div>
<div id="disabled" class='databar'>DISABLED</div>
</div>