diff --git a/field/display.go b/field/display.go index ca390ec..b197410 100644 --- a/field/display.go +++ b/field/display.go @@ -51,7 +51,7 @@ var displayTypePaths = map[DisplayType]string{ AllianceStationDisplay: "/displays/alliance_station", AnnouncerDisplay: "/displays/announcer", AudienceDisplay: "/displays/audience", - FieldMonitorDisplay: "/displays/fta", + FieldMonitorDisplay: "/displays/field_monitor", PitDisplay: "/displays/pit", QueueingDisplay: "/displays/queueing", TwitchStreamDisplay: "/displays/twitch", diff --git a/field/display_test.go b/field/display_test.go index 6eaa8df..bf25879 100644 --- a/field/display_test.go +++ b/field/display_test.go @@ -31,7 +31,7 @@ func TestDisplayFromUrl(t *testing.T) { assert.Equal(t, AnnouncerDisplay, display.Type) display, _ = DisplayFromUrl("/displays/audience/websocket", query) assert.Equal(t, AudienceDisplay, display.Type) - display, _ = DisplayFromUrl("/displays/fta/websocket", query) + display, _ = DisplayFromUrl("/displays/field_monitor/websocket", query) assert.Equal(t, FieldMonitorDisplay, display.Type) display, _ = DisplayFromUrl("/displays/pit/websocket", query) assert.Equal(t, PitDisplay, display.Type) diff --git a/static/css/cheesy-arena.css b/static/css/cheesy-arena.css index e5f6dbf..2c5f237 100644 --- a/static/css/cheesy-arena.css +++ b/static/css/cheesy-arena.css @@ -46,7 +46,7 @@ .modal-large { width: 60%; } -.ds-status, .radio-status, .robot-status, .battery-status, .bypass-status, .bypass-status-fta, .trip-time, .packet-loss { +.ds-status, .radio-status, .robot-status, .battery-status, .bypass-status, .trip-time, .packet-loss { background-color: #aaa; color: #000; border: 1px solid #999; diff --git a/static/css/field_monitor_display.css b/static/css/field_monitor_display.css new file mode 100644 index 0000000..65994e9 --- /dev/null +++ b/static/css/field_monitor_display.css @@ -0,0 +1,52 @@ +/* + Copyright 2018 Team 254. All Rights Reserved. + Author: pat@patfairbank.com (Patrick Fairbank) +*/ + +html { + height: 100%; + cursor: none; + -webkit-user-select: none; + -moz-user-select: none; + overflow: hidden; +} +body { + height: 100%; + font-family: FuturaLTBold; + color: #fff; +} +.center { + display: flex; + align-items: center; + justify-content: center; +} +.position-row { + height: 33.3%; +} +.left-position, .right-position { + width: 8%; + height: 100%; + font-size: 6vw; +} +.left-position[data-reversed=false], .right-position[data-reversed=true] { + background-color: #ff4444; +} +.left-position[data-reversed=true], .right-position[data-reversed=false] { + background-color: #2080ff; +} +.team { + width: 42%; + height: 100%; + background-color: #333; + font-size: 13vw; +} +.team[data-status=no-link] { + background-color: #963; +} +.team[data-status=ds-linked] { + background-color: #ff0; + color: #333; +} +.team[data-status=robot-linked] { + background-color: #0a3; +} diff --git a/static/js/field_monitor_display.js b/static/js/field_monitor_display.js new file mode 100644 index 0000000..85040c2 --- /dev/null +++ b/static/js/field_monitor_display.js @@ -0,0 +1,61 @@ +// Copyright 2018 Team 254. All Rights Reserved. +// Author: pat@patfairbank.com (Patrick Fairbank) +// +// Client-side logic for the field monitor display. + +var websocket; +var redSide; +var blueSide; + +// Handles a websocket message to update the team connection status. +var handleArenaStatus = function(data) { + $.each(data.AllianceStations, function(station, stationStatus) { + // Select the DOM element corresponding to the team station. + var teamElement; + if (station[0] === "R") { + teamElement = $("#" + redSide + "Team" + station[1]); + } else { + teamElement = $("#" + blueSide + "Team" + station[1]); + } + + if (stationStatus.Team) { + // Set the team number and status. + teamElement.text(stationStatus.Team.Id); + var status = "no-link"; + if (stationStatus.Bypass) { + status = ""; + } else if (stationStatus.DsConn) { + if (stationStatus.DsConn.RobotLinked) { + status = "robot-linked"; + } else if (stationStatus.DsConn.DsLinked) { + status = "ds-linked"; + } + } + teamElement.attr("data-status", status); + } else { + // No team is present in this position for this match; blank out the status. + teamElement.text(""); + teamElement.attr("data-status", ""); + } + }); +}; + +$(function() { + // Read the configuration for this display from the URL query string. + var urlParams = new URLSearchParams(window.location.search); + var reversed = urlParams.get("reversed"); + if (reversed === "true") { + redSide = "right"; + blueSide = "left"; + } else { + redSide = "left"; + blueSide = "right"; + } + $(".reversible-left").attr("data-reversed", reversed); + $(".reversible-right").attr("data-reversed", reversed); + + // Set up the websocket back to the server. + websocket = new CheesyWebsocket("/displays/field_monitor/websocket", { + arenaStatus: function(event) { handleArenaStatus(event.data); } + }); +}); diff --git a/static/js/fta_display.js b/static/js/fta_display.js deleted file mode 100644 index 96441d8..0000000 --- a/static/js/fta_display.js +++ /dev/null @@ -1,77 +0,0 @@ -// Copyright 2014 Team 254. All Rights Reserved. -// Author: austin.linux@gmail.com (Austin Schuh) -// Author: pat@patfairbank.com (Patrick Fairbank) -// -// Client-side logic for the FTA diagnostic display. - -var websocket; - -// Handles a websocket message to update the team connection status. -var handleArenaStatus = function(data) { - // Update the team status view. - $.each(data.AllianceStations, function(station, stationStatus) { - if (stationStatus.Team) { - $("#status" + station + " .team").text(stationStatus.Team.Id); - } else { - $("#status" + station + " .team").text(""); - } - - if (stationStatus.DsConn) { - var dsConn = stationStatus.DsConn; - $("#status" + station + " .ds-status").attr("data-status-ok", dsConn.DsLinked); - $("#status" + station + " .radio-status").attr("data-status-ok", dsConn.RadioLinked); - $("#status" + station + " .robot-status").attr("data-status-ok", dsConn.RobotLinked); - if (stationStatus.DsConn.SecondsSinceLastRobotLink > 1 && stationStatus.DsConn.SecondsSinceLastRobotLink < 1000) { - $("#status" + station + " .robot-status").text(stationStatus.DsConn.SecondsSinceLastRobotLink.toFixed()); - } else { - $("#status" + station + " .robot-status").text(""); - } - var lowBatteryThreshold = 6; - if (matchStates[data.MatchState] === "PRE_MATCH" || matchStates[data.MatchState] === "TIMEOUT_ACTIVE" || - matchStates[data.MatchState] === "POST_TIMEOUT") { - lowBatteryThreshold = 12; - } - $("#status" + station + " .battery-status").attr("data-status-ok", - dsConn.BatteryVoltage > lowBatteryThreshold && dsConn.RobotLinked); - $("#status" + station + " .battery-status").text(dsConn.BatteryVoltage.toFixed(1) + "V"); - $("#status" + station + " .trip-time").attr("data-status-ok", true); - $("#status" + station + " .trip-time").text(dsConn.DsRobotTripTimeMs.toFixed(1) + "ms"); - $("#status" + station + " .packet-loss").attr("data-status-ok", true); - $("#status" + station + " .packet-loss").text(dsConn.MissedPacketCount); - } else { - $("#status" + station + " .ds-status").attr("data-status-ok", ""); - $("#status" + station + " .ds-status").text(""); - $("#status" + station + " .radio-status").attr("data-status-ok", ""); - $("#status" + station + " .radio-status").text(""); - $("#status" + station + " .robot-status").attr("data-status-ok", ""); - $("#status" + station + " .robot-status").text(""); - $("#status" + station + " .battery-status").attr("data-status-ok", ""); - $("#status" + station + " .battery-status").text(""); - $("#status" + station + " .trip-time").attr("data-status-ok", ""); - $("#status" + station + " .trip-time").text(""); - $("#status" + station + " .packet-loss").attr("data-status-ok", ""); - $("#status" + station + " .packet-loss").text(""); - } - - if (stationStatus.Estop) { - $("#status" + station + " .bypass-status-fta").attr("data-status-ok", false); - $("#status" + station + " .bypass-status-fta").text("ES"); - } else if (stationStatus.Bypass) { - $("#status" + station + " .bypass-status-fta").attr("data-status-ok", false); - $("#status" + station + " .bypass-status-fta").text("B"); - } else { - $("#status" + station + " .bypass-status-fta").attr("data-status-ok", true); - $("#status" + station + " .bypass-status-fta").text(""); - } - }); -}; - -$(function() { - // Activate tooltips above the status headers. - $("[data-toggle=tooltip]").tooltip({"placement": "top"}); - - // Set up the websocket back to the server. - websocket = new CheesyWebsocket("/displays/fta/websocket", { - arenaStatus: function(event) { handleArenaStatus(event.data); } - }); -}); diff --git a/templates/base.html b/templates/base.html index ce3237d..4ef3ff6 100644 --- a/templates/base.html +++ b/templates/base.html @@ -84,7 +84,7 @@
  • Placeholder
  • Announcer
  • Audience
    • -
  • Field Monitor
    • +
  • Field Monitor
  • Pit
  • Queueing
  • diff --git a/templates/field_monitor_display.html b/templates/field_monitor_display.html new file mode 100644 index 0000000..c277f94 --- /dev/null +++ b/templates/field_monitor_display.html @@ -0,0 +1,41 @@ +{{/* + Copyright 2018 Team 254. All Rights Reserved. + Author: pat@patfairbank.com (Patrick Fairbank) + + Display showing robot connection status. +*/}} + + + + Field Monitor - {{.EventSettings.Name}} - Cheesy Arena + + + + + + + {{template "row" dict "leftPosition" "1" "rightPosition" "3"}} + {{template "row" dict "leftPosition" "2" "rightPosition" "2"}} + {{template "row" dict "leftPosition" "3" "rightPosition" "1"}} + + + + + + + + + + +{{define "row"}} +
    +
    {{.leftPosition}}
    + {{template "team" dict "side" "left" "position" .leftPosition}} + {{template "team" dict "side" "right" "position" .rightPosition}} +
    {{.rightPosition}}
    +
    +{{end}} + +{{define "team"}} +
    +{{end}} diff --git a/templates/fta_display.html b/templates/fta_display.html deleted file mode 100644 index b8990be..0000000 --- a/templates/fta_display.html +++ /dev/null @@ -1,64 +0,0 @@ -{{/* - Copyright 2014 Team 254. All Rights Reserved. - Author: pat@patfairbank.com (Patrick Fairbank) - - Display showing team diagnostics for FTA/FTAA use. -*/}} -{{define "title"}}Field Monitor{{end}} -{{define "body"}} -
    -
    -
    -
    -
    -
    -
    Red Teams
    -
    DS
    -
    Rad
    -
    Rio
    -
    Bat
    -
    Byp
    -
    Trip Time
    -
    Lost Pack
    -
    - {{template "ftaTeam" dict "color" "R" "position" 1 "data" .}} - {{template "ftaTeam" dict "color" "R" "position" 2 "data" .}} - {{template "ftaTeam" dict "color" "R" "position" 3 "data" .}} -
    -
    - - {{template "ftaTeam" dict "color" "B" "position" 1 "data" .}} - {{template "ftaTeam" dict "color" "B" "position" 2 "data" .}} - {{template "ftaTeam" dict "color" "B" "position" 3 "data" .}} -
    -
    -
    -
    -
    -{{end}} -{{define "script"}} - - -{{end}} -{{define "ftaTeam"}} -
    -
    {{.position}}
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -{{end}} diff --git a/web/fta_display.go b/web/field_monitor_display.go similarity index 59% rename from web/fta_display.go rename to web/field_monitor_display.go index a826061..2b2b0f6 100644 --- a/web/fta_display.go +++ b/web/field_monitor_display.go @@ -1,7 +1,7 @@ -// Copyright 2014 Team 254. All Rights Reserved. +// Copyright 2018 Team 254. All Rights Reserved. // Author: pat@patfairbank.com (Patrick Fairbank) // -// Web handlers for the FTA diagnostic display. +// Web handlers for the field monitor display showing robot connection status. package web @@ -11,17 +11,17 @@ import ( "net/http" ) -// Renders the FTA diagnostic display. -func (web *Web) ftaDisplayHandler(w http.ResponseWriter, r *http.Request) { +// Renders the field monitor display. +func (web *Web) fieldMonitorDisplayHandler(w http.ResponseWriter, r *http.Request) { if !web.userIsReader(w, r) { return } - if !web.enforceDisplayConfiguration(w, r, nil) { + if !web.enforceDisplayConfiguration(w, r, map[string]string{"reversed": "false"}) { return } - template, err := web.parseFiles("templates/fta_display.html", "templates/base.html") + template, err := web.parseFiles("templates/field_monitor_display.html") if err != nil { handleWebErr(w, err) return @@ -29,15 +29,15 @@ func (web *Web) ftaDisplayHandler(w http.ResponseWriter, r *http.Request) { data := struct { *model.EventSettings }{web.arena.EventSettings} - err = template.ExecuteTemplate(w, "base_no_navbar", data) + err = template.ExecuteTemplate(w, "field_monitor_display.html", data) if err != nil { handleWebErr(w, err) return } } -// The websocket endpoint for the FTA display client to receive status updates. -func (web *Web) ftaDisplayWebsocketHandler(w http.ResponseWriter, r *http.Request) { +// The websocket endpoint for the field monitor display client to receive status updates. +func (web *Web) fieldMonitorDisplayWebsocketHandler(w http.ResponseWriter, r *http.Request) { if !web.userIsReader(w, r) { return } diff --git a/web/field_monitor_display_test.go b/web/field_monitor_display_test.go new file mode 100644 index 0000000..c565ec2 --- /dev/null +++ b/web/field_monitor_display_test.go @@ -0,0 +1,34 @@ +// Copyright 2018 Team 254. All Rights Reserved. +// Author: pat@patfairbank.com (Patrick Fairbank) + +package web + +import ( + "github.com/Team254/cheesy-arena/websocket" + gorillawebsocket "github.com/gorilla/websocket" + "github.com/stretchr/testify/assert" + "testing" +) + +func TestFieldMonitorDisplay(t *testing.T) { + web := setupTestWeb(t) + + recorder := web.getHttpResponse("/displays/field_monitor?displayId=1&reversed=false") + assert.Equal(t, 200, recorder.Code) + assert.Contains(t, recorder.Body.String(), "Field Monitor - Untitled Event - Cheesy Arena") +} + +func TestFieldMonitorDisplayWebsocket(t *testing.T) { + web := setupTestWeb(t) + + server, wsUrl := web.startTestServer() + defer server.Close() + conn, _, err := gorillawebsocket.DefaultDialer.Dial(wsUrl+"/displays/field_monitor/websocket?displayId=1", nil) + assert.Nil(t, err) + defer conn.Close() + ws := websocket.NewTestWebsocket(conn) + + // Should get a few status updates right after connection. + readWebsocketType(t, ws, "arenaStatus") + readWebsocketType(t, ws, "displayConfiguration") +} diff --git a/web/fta_display_test.go b/web/fta_display_test.go deleted file mode 100644 index 4331597..0000000 --- a/web/fta_display_test.go +++ /dev/null @@ -1,17 +0,0 @@ -// Copyright 2014 Team 254. All Rights Reserved. -// Author: pat@patfairbank.com (Patrick Fairbank) - -package web - -import ( - "github.com/stretchr/testify/assert" - "testing" -) - -func TestFtaDisplay(t *testing.T) { - web := setupTestWeb(t) - - recorder := web.getHttpResponse("/displays/fta?displayId=1") - assert.Equal(t, 200, recorder.Code) - assert.Contains(t, recorder.Body.String(), "Field Monitor - Untitled Event - Cheesy Arena") -} diff --git a/web/web.go b/web/web.go index 631c2b2..3bae20b 100644 --- a/web/web.go +++ b/web/web.go @@ -142,8 +142,8 @@ func (web *Web) newHandler() http.Handler { router.HandleFunc("/displays/announcer/websocket", web.announcerDisplayWebsocketHandler).Methods("GET") router.HandleFunc("/displays/audience", web.audienceDisplayHandler).Methods("GET") router.HandleFunc("/displays/audience/websocket", web.audienceDisplayWebsocketHandler).Methods("GET") - router.HandleFunc("/displays/fta", web.ftaDisplayHandler).Methods("GET") - router.HandleFunc("/displays/fta/websocket", web.ftaDisplayWebsocketHandler).Methods("GET") + router.HandleFunc("/displays/field_monitor", web.fieldMonitorDisplayHandler).Methods("GET") + router.HandleFunc("/displays/field_monitor/websocket", web.fieldMonitorDisplayWebsocketHandler).Methods("GET") router.HandleFunc("/displays/pit", web.pitDisplayHandler).Methods("GET") router.HandleFunc("/displays/pit/websocket", web.pitDisplayWebsocketHandler).Methods("GET") router.HandleFunc("/displays/queueing", web.queueingDisplayHandler).Methods("GET")