Show currently selected folder and enable resign button in desktop cl…

…ient
daveajlee · Sep 18, 2023 · d39b0fa · d39b0fa
1 parent 04ae1b9
commit d39b0fa
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 9 deletions.
diff --git a/desktop/src/app/management/management.component.html b/desktop/src/app/management/management.component.html
@@ -27,7 +27,7 @@ <h5 class="card-title text-center">Messages</h5>
                     <!-- Show start button -->
                     <div class="col text-center">
                         <button class="btn btn-primary btn-lg button-margin" type="submit" (click)="onViewMessages()">Messages</button>
-                        <button class="btn btn-primary btn-lg button-margin" type="submit">Resign</button>
+                        <button class="btn btn-primary btn-lg button-margin" type="submit" (click)="onResign()">Resign</button>
                     </div>
                 </div>
             </div>

diff --git a/desktop/src/app/management/management.component.ts b/desktop/src/app/management/management.component.ts
@@ -44,4 +44,13 @@ export class ManagementComponent implements OnInit {
     this.router.navigate(['messages']);
   }
 
+  onResign(): void {
+    if(confirm("Are you sure you want to resign from " + this.gameService.getGame().companyName + "? This will end " +
+        "your game and any changes you have made will not be saved.")) {
+      // Currently it is enough to redirect to the homepage since we do not save data in local storage yet.
+      this.router.navigate([''])
+    }
+  }
+
+
 }
diff --git a/desktop/src/app/messages/messages.component.css b/desktop/src/app/messages/messages.component.css
@@ -1,3 +1,4 @@
 .nav-background-color {
     background-color: whitesmoke;
-}
+}
+
diff --git a/desktop/src/app/messages/messages.component.html b/desktop/src/app/messages/messages.component.html
@@ -7,21 +7,25 @@ <h1 class="display-4 text-center">Messages</h1>
 </div>
 
 <div class="row">
-    <div class="col-2 nav-background-color">
-        <div class="m-5">
-            <span (click)="onInboxSelect()"><fa-icon [icon]="faInbox"></fa-icon> INBOX</span>
+    <div class="col-3 nav-background-color">
+        <div class="m-5" >
+            <h3 *ngIf="selectedFolder==='INBOX'" (click)="onInboxSelect()" ><fa-icon [icon]="faInbox"></fa-icon> INBOX</h3>
+            <h5 *ngIf="selectedFolder!='INBOX'" (click)="onInboxSelect()" ><fa-icon [icon]="faInbox"></fa-icon> INBOX</h5>
         </div>
         <div class="m-5">
-            <span (click)="onOutboxSelect()"><fa-icon [icon]="faSnareFromSquare"></fa-icon> OUTBOX</span>
+            <h3 *ngIf="selectedFolder==='OUTBOX'" (click)="onOutboxSelect()"><fa-icon [icon]="faSnareFromSquare"></fa-icon> OUTBOX</h3>
+            <h5 *ngIf="selectedFolder!='OUTBOX'" (click)="onOutboxSelect()"><fa-icon [icon]="faSnareFromSquare"></fa-icon> OUTBOX</h5>
         </div>
         <div class="m-5">
-            <span (click)="onSentSelect()"><fa-icon [icon]="faEnvelopeCircleCheck"></fa-icon> SENT ITEMS</span>
+            <h3 *ngIf="selectedFolder==='SENT ITEMS'" (click)="onSentSelect()"><fa-icon [icon]="faEnvelopeCircleCheck"></fa-icon> SENT ITEMS</h3>
+            <h5 *ngIf="selectedFolder!='SENT ITEMS'" (click)="onSentSelect()"><fa-icon [icon]="faEnvelopeCircleCheck"></fa-icon> SENT ITEMS</h5>
         </div>
         <div class="m-5">
-            <span (click)="onTrashSelect()"><fa-icon [icon]="faTrash"></fa-icon> TRASH</span>
+            <h3 *ngIf="selectedFolder==='TRASH'" (click)="onTrashSelect()"><fa-icon [icon]="faTrash"></fa-icon> TRASH</h3>
+            <h5 *ngIf="selectedFolder!='TRASH'" (click)="onTrashSelect()"><fa-icon [icon]="faTrash"></fa-icon> TRASH</h5>
         </div>
     </div>
-    <div class="col-10">
+    <div class="col-9">
         <div *ngIf="displayMessages.length === 0">
             <h1>There are no messages in this folder.</h1>
         </div>

diff --git a/desktop/src/app/messages/messages.component.ts b/desktop/src/app/messages/messages.component.ts
@@ -20,21 +20,27 @@ export class MessagesComponent {
   displayMessages: Message[];
   gameService: GameService;
 
+  selectedFolder: string;
+
   constructor(private gameService2: GameService, public router: Router) {
     this.displayMessages = [];
     this.gameService = gameService2;
     this.onInboxSelect();
+    this.selectedFolder = "INBOX";
+    console.log(this.selectedFolder);
   }
 
   onInboxSelect(): void {
     this.displayMessages = this.gameService.getGame().messages.filter(this.checkForInbox);
+    this.selectedFolder = "INBOX";
   }
 
   checkForInbox(message) {
     return message.folder.valueOf() === "INBOX";
   }
 
   onOutboxSelect(): void {
+    this.selectedFolder = "OUTBOX";
     this.displayMessages = this.gameService.getGame().messages.filter(this.checkForOutbox);
   }
 
@@ -43,6 +49,7 @@ export class MessagesComponent {
   }
 
   onSentSelect(): void {
+    this.selectedFolder = "SENT ITEMS";
     this.displayMessages = this.gameService.getGame().messages.filter(this.checkForSentItems);
   }
 
@@ -51,6 +58,7 @@ export class MessagesComponent {
   }
 
   onTrashSelect(): void {
+    this.selectedFolder = "TRASH";
     this.displayMessages = this.gameService.getGame().messages.filter(this.checkForTrash);
   }