Merge pull request #39 from arongida/development

show only whole numbers client side
arongida · Jun 28, 2024 · 3d7104a · 3d7104a
2 parents 1b006ca + 86c85fb
commit 3d7104a
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 9 deletions.
diff --git a/src/app/draft/components/character-sheet/character-sheet.component.html b/src/app/draft/components/character-sheet/character-sheet.component.html
@@ -27,7 +27,7 @@ <h3 class="text-white text-lg mb-4">Stats</h3>
           matTooltipPosition="right"
         >
           <div>Health:</div>
-          <div class="text-pink-500">{{ player.hp }} ❤️</div>
+          <div class="text-pink-500">{{ player.hp | number: '1.0-0'  }} ❤️</div>
         </div>
 
         @if (combat) {
@@ -46,20 +46,20 @@ <h3 class="text-white text-lg mb-4">Stats</h3>
           matTooltipPosition="right"
         >
           <div>Attack:</div>
-          <div class="text-red-500">{{ player.attack }} ⚔️</div>
+          <div class="text-red-500">{{ player.attack | number: '1.0-0' }} ⚔️</div>
         </div>
         <mat-divider></mat-divider>
 
         <div
           class="flex flex-row justify-between p-1 hover:bg-slate-700 rounded-sm"
           #tooltip="matTooltip"
           matTooltip="Decreases incoming damage from attacks by {{
-            100 * (1 - 100 / (100 + player.defense)) | number: '1.2-2'
+            100 * (1 - 100 / (100 + player.defense)) | number: '1.0-0'
           }}%."
           matTooltipPosition="right"
         >
           <div>Defense:</div>
-          <div class="text-green-500">{{ player.defense }}🛡️</div>
+          <div class="text-green-500">{{ player.defense | number: '1.0'  }}🛡️</div>
         </div>
         <mat-divider></mat-divider>
 

diff --git a/src/app/fight/components/fight-room/fight-room.component.ts b/src/app/fight/components/fight-room/fight-room.component.ts
@@ -66,7 +66,14 @@ export class FightRoomComponent {
         });
 
         room.onMessage('combat_log', (message: string) => {
-          this.combatLog += message + '\n';
+          // Regular expression to match and replace decimal numbers
+          const formattedMessage = message.replace(/(\d*\.\d+)/g, (match) => {
+            console.log('match', match);
+            // Use Number.toFixed(2) to format each matched number to 2 decimal places
+            return Math.round(parseFloat(match)).toString();
+          });
+
+          this.combatLog += formattedMessage + '\n';
         });
 
         room.onMessage('attack', (message: number) => {
@@ -77,15 +84,15 @@ export class FightRoomComponent {
 
         room.onMessage('damage', (message: DamageMessage) => {
           if (this.player && this.enemy) {
-            console.log('message', message);
-            console.log('damage', message.damage, message.playerId);
-            this.triggerShowDamageNumber(message.damage, message.playerId);
+            const roundedDamage = Math.round(message.damage);
+            this.triggerShowDamageNumber(roundedDamage, message.playerId);
           }
         });
 
         room.onMessage('healing', (message: HealingMessage) => {
           if (this.player && this.enemy) {
-            this.triggerShowHealingNumber(message.healing, message.playerId);
+            const roundedHealing = Math.round(message.healing);
+            this.triggerShowHealingNumber(roundedHealing, message.playerId);
           }
         });
       }