[styling] Show connected autoRefs directly without tooltip

Author: g3force

internal/app/controller/controller.go

@@ -8,6 +8,7 @@ import (
 	"github.com/RoboCup-SSL/ssl-game-controller/pkg/timer"
 	"github.com/RoboCup-SSL/ssl-go-tools/pkg/sslproto"
 	"log"
+	"sort"
 	"sync"
 	"time"
 )
@@ -181,6 +182,7 @@ func (c *GameController) updateOnlineStates() {
 	for _, autoRef := range c.AutoRefServer.Clients {
 		autoRefs = append(autoRefs, autoRef.Id)
 	}
+	sort.Strings(autoRefs)
 	c.Engine.GcState.AutoRefsConnected = autoRefs
 }
 

src/components/settings/AutonomousSettings.vue

@@ -1,8 +1,8 @@
 <template>
     <div class="game-controller-container">
-        <div class="auto-refs-connected" v-b-tooltip.hover :title="autoRefs">
+        <div class="auto-refs-connected" v-b-tooltip.hover>
             <p>
-                <b>{{autoRefsConnected}}</b> autoRefs connected.
+                <b>{{autoRefsConnected}}</b> autoRefs connected: {{autoRefs}}
             </p>
         </div>
 
@@ -29,7 +29,7 @@
             },
             autoRefs() {
                 if (this.autoRefsConnected) {
-                    let autoRefs = 'Connected AutoRefs: ';
+                    let autoRefs = '';
                     for (let i = 0; i < this.gcState.autoRefsConnected.length; i++) {
                         autoRefs += this.gcState.autoRefsConnected[i];
                         if (i !== (this.gcState.autoRefsConnected.length - 1)) {