use ability keys instead of indices

public/client.js

@@ -282,7 +282,7 @@ function connectWebSocket() {
 
         if (e.id == playerId) {
           const rangeMaterial = teamMaterials['range']
-          const rangeSize = state.abilities.find((it) => it.id == e.abilities.at(0))?.range ?? 0
+          const rangeSize = state.abilities.find((it) => it.id == e.abilities?.a)?.range ?? 0
           const rangeMarker = new THREE.Mesh(new THREE.CylinderGeometry((rangeSize) / 100, (rangeSize) / 100, 1), rangeMaterial)
           const rangeMarkerSize = 4000
           rangeMarker.scale.y = e.height / rangeMarkerSize
@@ -377,8 +377,9 @@ function connectWebSocket() {
       const player = state.entities.find((e) => e.id == playerId)
       if (player != null) {
         for (let abilityIndex = 0; abilityIndex < 4; abilityIndex++) {
-          if (player.abilities[abilityIndex] != null) {
+          const abilityKey = ['a', 'q', 'w', 'e'][abilityIndex]
-            const abilityId = player.abilities[abilityIndex]
+          if (player.abilities[abilityKey] != null) {
+            const abilityId = player.abilities[abilityKey]
             const ability = state.abilities.find((it) => it.id == abilityId)
             const lastCast = player.cooldowns[ability.id] ?? -Infinity
             const cooldownDuration = (ability.cooldown * state.tickRate) ?? 0
@@ -463,7 +464,7 @@ window.addEventListener('load', () => {
         websocket.send(JSON.stringify({ action: 'attack', id: playerId, x, y }))
       }
       if (event.code == 'KeyX') {
-        websocket.send(JSON.stringify({ action: 'cast', slot: 0, id: playerId, x, y }))
+        websocket.send(JSON.stringify({ action: 'cast', slot: 'a', id: playerId, x, y }))
       }
 
       if (event.code == 'KeyS') {
@@ -474,13 +475,13 @@ window.addEventListener('load', () => {
       }
 
       if (event.code == 'KeyQ') {
-        websocket.send(JSON.stringify({ action: 'cast', slot: 1, id: playerId, x, y }))
+        websocket.send(JSON.stringify({ action: 'cast', slot: 'q', id: playerId, x, y }))
       }
       if (event.code == 'KeyW') {
-        websocket.send(JSON.stringify({ action: 'cast', slot: 2, id: playerId, x, y }))
+        websocket.send(JSON.stringify({ action: 'cast', slot: 'w', id: playerId, x, y }))
       }
       if (event.code == 'KeyE') {
-        websocket.send(JSON.stringify({ action: 'cast', slot: 3, id: playerId, x, y }))
+        websocket.send(JSON.stringify({ action: 'cast', slot: 'e', id: playerId, x, y }))
       }
     }
   })

src/entity.js

@@ -6,7 +6,7 @@ import Team from './team.js'
 
 export default class Entity {
   id = crypto.randomUUID()
-  abilities = [null, null, null, null] // TODO: do something about this being an array...
+  abilities = {}
   casting = null
   cooldowns = {}
   dead = false
@@ -266,7 +266,7 @@ export default class Entity {
 
     if (this.#attacking) {
       const cursor = this.#dest ?? this.position
-      const basicAttack = this.ability(0)
+      const basicAttack = this.ability('a')
       if (basicAttack != null) {
         const target = this.closestTargetTo(cursor, 500)
         if (target != null && this.distanceTo(target.position) < basicAttack.range + this.radius + target.radius) {
@@ -275,7 +275,7 @@ export default class Entity {
           const timestamp = this.game?.currentTick ?? 0
           if (lastCast != null && lastCast + cooldown > timestamp) { return false }
 
-          this.castAction(0, cursor, false)
+          this.castAction('a', cursor, false)
           return true
         }
       }

src/template.js

@@ -5,7 +5,7 @@ import Team from './team.js'
 export default class Template {
   static minion(team, options = {}) {
     return {
-      abilities: [options.ranged ? Ability.rangedAttack.id : Ability.meleeAttack.id, null, null, null],
+      abilities: { a: options.ranged ? Ability.rangedAttack.id : Ability.meleeAttack.id },
       height: options.ranged ? 40 : 38,
       logic: this.#minionLogic(options.route),
       maxHealth: options.ranged ? 300 : 450,
@@ -19,12 +19,12 @@ export default class Template {
 
   static player(overrides) {
     return {
-      abilities: [
+      abilities: {
-        Ability.rangedAttack.id,
+        a: Ability.rangedAttack.id,
-        Ability.straightShot.id,
+        q: Ability.straightShot.id,
-        Ability.shieldThrow.id,
+        w: Ability.shieldThrow.id,
-        Ability.blink.id,
+        e: Ability.blink.id,
-      ],
+      },
       height: 80,
       logic: this.#playerLogic,
       maxHealth: 600,