[feature] Add "Place ball" button to UI and backend API

Author: g3force

internal/app/controller/engine.go

@@ -280,6 +280,7 @@ func (e *Engine) processEvent(event Event) error {
 }
 
 func (e *Engine) processCommand(c *EventCommand) error {
+	e.State.PlacementPos = c.Location
 	switch c.Type {
 	case CommandDirect, CommandIndirect, CommandKickoff, CommandPenalty, CommandTimeout, CommandBallPlacement:
 		if c.ForTeam == nil {

internal/app/controller/events.go

@@ -75,15 +75,19 @@ type EventCard struct {
 
 // EventCommand is an event that can be applied
 type EventCommand struct {
-	ForTeam *Team      `json:"forTeam"`
-	Type    RefCommand `json:"commandType"`
+	ForTeam  *Team      `json:"forTeam"`
+	Type     RefCommand `json:"commandType"`
+	Location *Location  `json:"location"`
 }
 
 func (c EventCommand) String() string {
 	if c.ForTeam == nil {
 		return string(c.Type)
 	}
-	return fmt.Sprintf("%v for %v", c.Type, *c.ForTeam)
+	if c.Location == nil {
+		return fmt.Sprintf("%v for %v", c.Type, *c.ForTeam)
+	}
+	return fmt.Sprintf("%v for %v at %v", c.Type, *c.ForTeam, *c.Location)
 }
 
 // EventModifyCardTime holds the duration for a certain yellow card duration

internal/app/controller/publisher.go

@@ -269,7 +269,7 @@ func mapLocation(location *Location) *refproto.Referee_Point {
 	if location == nil {
 		return nil
 	}
-	x := float32(location.X)
-	y := float32(location.Y)
+	x := float32(location.X) * 1000.0
+	y := float32(location.Y) * 1000.0
 	return &refproto.Referee_Point{X: &x, Y: &y}
 }

internal/app/controller/state.go

@@ -2,6 +2,7 @@ package controller
 
 import (
 	"encoding/json"
+	"fmt"
 	"github.com/RoboCup-SSL/ssl-game-controller/internal/app/config"
 	"github.com/RoboCup-SSL/ssl-game-controller/pkg/refproto"
 	"github.com/pkg/errors"
@@ -449,8 +450,8 @@ func (s *State) TeamByName(teamName string) Team {
 
 // Location is a two-dimensional coordinate
 type Location struct {
-	X float64
-	Y float64
+	X float64 `json:"x"`
+	Y float64 `json:"y"`
 }
 
 func (l Location) toProto() (p *refproto.Location) {
@@ -461,3 +462,7 @@ func (l Location) toProto() (p *refproto.Location) {
 	*p.Y = float32(l.Y)
 	return
 }
+
+func (l Location) String() string {
+	return fmt.Sprintf("%.3fm | %.3fm", l.X, l.Y)
+}

internal/app/controller/uiProtocol.go

@@ -63,12 +63,17 @@ func (e *Engine) LogIgnoredGameEvent(event GameEvent) {
 
 // LogCommand adds a command to the protocol
 func (e *Engine) LogCommand() {
+	description := ""
+	if e.State.PlacementPos != nil {
+		description = e.State.PlacementPos.String()
+	}
 	entry := UiProtocolEntry{
-		Timestamp: e.TimeProvider().UnixNano(),
-		StageTime: e.State.StageTimeElapsed,
-		Type:      UiProtocolCommand,
-		Name:      string(e.State.Command),
-		Team:      e.State.CommandFor,
+		Timestamp:   e.TimeProvider().UnixNano(),
+		StageTime:   e.State.StageTimeElapsed,
+		Type:        UiProtocolCommand,
+		Name:        string(e.State.Command),
+		Team:        e.State.CommandFor,
+		Description: description,
 	}
 	e.UiProtocol = append(e.UiProtocol, entry)
 }

src/components/events/Events.vue

@@ -20,6 +20,16 @@
                 </div>
             </b-modal>
 
+            <b-btn v-b-modal.place-ball-modal size="sm" variant="primary">Place ball</b-btn>
+            <b-modal id="place-ball-modal"
+                     title="Place ball"
+                     :lazy="true">
+                <PlaceBall/>
+                <div slot="modal-footer">
+                    <!-- hide modal buttons -->
+                </div>
+            </b-modal>
+
             <b-btn v-b-modal.event-behavior-modal size="sm" variant="primary">Configure Behaviors</b-btn>
             <b-modal id="event-behavior-modal"
                      title="Game Event Behaviors"
@@ -37,10 +47,11 @@
     import EventTable from "./EventTable";
     import NewEvent from "./NewEvent";
     import EventBehavior from "./EventBehavior";
+    import PlaceBall from "./PlaceBall";
 
     export default {
         name: "Events",
-        components: {EventBehavior, EventTable, NewEvent},
+        components: {PlaceBall, EventBehavior, EventTable, NewEvent},
         data() {
             return {
                 currentPage: 1,

src/components/events/PlaceBall.vue

@@ -0,0 +1,55 @@
+<template>
+    <div>
+        <TeamSelection :model="model" label="For: " :allow-unknown-team="false"/>
+        <LocationSelection :model="model.location" label="Location [mm]: "/>
+        <b-button variant="primary"
+                  @click="sendEvent()"
+                  :disabled="model.team === null || !ballLocationSet">
+            Add
+        </b-button>
+    </div>
+</template>
+
+<script>
+    import EventAccordion from "./EventAccordion";
+    import LocationSelection from "../common/LocationSelection";
+    import TeamSelection from "../common/TeamSelection";
+    import {convertStringLocation} from "../../refereeState";
+    import {isNumeric} from "../../main";
+
+    export default {
+        name: "PlaceBall",
+        components: {EventAccordion,TeamSelection,LocationSelection},
+        data() {
+            return {
+                model: {
+                    team: null,
+                    id: null,
+                    location: {x: 0.0, y: 0.0}
+                }
+            }
+        },
+        computed: {
+            ballLocationSet() {
+                return isNumeric(this.model.location.x)
+                    && isNumeric(this.model.location.y)
+            }
+        },
+        methods: {
+            sendEvent: function () {
+                this.$socket.sendObj({
+                    command: {
+                        forTeam: this.model.team,
+                        commandType: 'ballPlacement',
+                        location: convertStringLocation(this.model.location)
+                    }
+                });
+                this.$root.$emit('bv::hide::modal', 'place-ball-modal');
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>

src/main.js

@@ -39,6 +39,11 @@ library.add(faSignal);
 library.add(faCheckCircle);
 Vue.component('font-awesome-icon', FontAwesomeIcon);
 
+
+export let isNumeric = function (n) {
+    return !isNaN(parseFloat(n)) && isFinite(n);
+};
+
 let wsAddress;
 if (process.env.NODE_ENV === 'development') {
     // use the default backend port