fixed leaderboard issues

5 months ago · 56211d97de
parent 83614faff1
commit 56211d97de
7 changed files with 112 additions and 9 deletions
--- a/CTF/CTF-Frontend/src/app/add-flag/add-flag.component.html
+++ b/CTF/CTF-Frontend/src/app/add-flag/add-flag.component.html
@ -51,7 +51,9 @@
            <!-- image of the flag to create container -->
            <label> Image: </label>
            <select id="Images">
-                <option> ubuntu </option>
+                <option *ngFor="let image of images">
+                    {{ image.Name }}
+                </option>
            </select>
            <br><br>

--- a/CTF/CTF-Frontend/src/app/add-flag/add-flag.component.ts
+++ b/CTF/CTF-Frontend/src/app/add-flag/add-flag.component.ts
@ -1,15 +1,27 @@
 import { Component } from '@angular/core';
 import { gotoPage } from '../Helper/Helpers';
 import { Router } from '@angular/router';
+import { ModifyContestService } from '../modify-contest/modify-contest.service';
+import { Image } from '../models/image.model';
+import { getEmail } from '../Helper/Helpers';
+import { NgFor, CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
@Component({
  selector: 'app-add-flag',
-  imports: [],
+  imports: [NgFor, CommonModule, FormsModule],
  templateUrl: './add-flag.component.html',
  styleUrl: './add-flag.component.css'
 })
 export class AddFlagComponent {

-  constructor(private router: Router){}
+  images: Image[] = [];
+
+  constructor(private router: Router, private modifyContestService: ModifyContestService){}
+
+  async ngOnInit() {
+    this.images = await this.modifyContestService.getImages(getEmail());
+  }

  // add a flag to a contest
  async AddFlag(){
--- a/CTF/CTF-Frontend/src/app/admin-profile/admin-profile.component.html
+++ b/CTF/CTF-Frontend/src/app/admin-profile/admin-profile.component.html
@ -119,7 +119,7 @@
 					<option *ngFor="let contest of contests" [value] ="contest.Name">{{ contest.Name }}</option>
 				</select>
 				<button class="FlagButts" (click)="populateFlagsTable()">Get Flags</button>
-				<button class="FlagButts" (click)="openLeaderboardPopup(getEmail())">Leaderboard</button>
+				<button class="FlagButts" (click)="openLeaderboardPopup()">Leaderboard</button>
 			
 				<div class="tooltip">
 					?
--- a/CTF/CTF-Frontend/src/app/admin-profile/admin-profile.component.ts
+++ b/CTF/CTF-Frontend/src/app/admin-profile/admin-profile.component.ts
@ -89,8 +89,15 @@ export class AdminProfileComponent implements OnInit{
    Popup('/add-student');
  }

-  openLeaderboardPopup(email: string){
-    Popup('Leaderboard.html');
+  openLeaderboardPopup(){
+    const contestElement = document.getElementById('DropDown') as HTMLSelectElement;
+    const contest = contestElement.value;
+    sessionStorage.setItem('ContestString', contest);
+    if (!contest) {
+      alert('Must select a contest');
+      return;
+    }
+    else Popup('/leaderboard');
  }

  async getContests(){
--- a/CTF/CTF-Frontend/src/app/admin-profile/admin-profile.service.ts
+++ b/CTF/CTF-Frontend/src/app/admin-profile/admin-profile.service.ts
@ -68,7 +68,7 @@ export class AdminProfileService {
    }
  }

-  async getContestFlagsSubs(email: string, contest: string): Promise<any> {
+  async getContestFlagsSubs(email: string, contest: string | null): Promise<any> {
    try {
      const response = await fetch('api/getContestFlagsSubs', {
        method: 'POST',
--- a/CTF/CTF-Frontend/src/app/leaderboard/leaderboard.component.html
+++ b/CTF/CTF-Frontend/src/app/leaderboard/leaderboard.component.html
@ -5,7 +5,9 @@
    <body id="Leaderboard">
        
        <div id="Header">
-            <h1> Leaderboard For </h1>
+            <h1> Leaderboard For</h1>
+            <br>
+            <h1> {{ contest }} Contest</h1>
            <h2 id="ContestName"> </h2>
        </div>
        
@ -20,6 +22,11 @@
                    </tr>
                </thead>
                <tbody id="LeaderTBody">
+                    <tr *ngFor="let user of users">
+                        <td>{{ getRank() - 50 }}</td>
+                        <td>{{ user.Name }}</td>
+                        <td>{{ user.Flags }}</td>
+                    </tr>
                </tbody>
            </table>
        </div>
--- a/CTF/CTF-Frontend/src/app/leaderboard/leaderboard.component.ts
+++ b/CTF/CTF-Frontend/src/app/leaderboard/leaderboard.component.ts
@ -1,11 +1,86 @@
+/*
+  Alex Miller
+  Jordan Latimer
+
+  Leaderboard Component 
+*/
+
 import { Component } from '@angular/core';
+import { User } from '../models/user.model';
+import { Contest } from '../models/contest.model';
+import { Flag } from '../models/flag.model';
+import { getEmail } from '../Helper/Helpers';
+import { AdminProfileService } from '../admin-profile/admin-profile.service';
+import { CommonModule } from '@angular/common';
+import { NgFor } from '@angular/common';
+import { Submission } from '../models/submission.model';

@Component({
  selector: 'app-leaderboard',
-  imports: [],
+  imports: [NgFor, CommonModule],
  templateUrl: './leaderboard.component.html',
  styleUrl: './leaderboard.component.css'
 })
 export class LeaderboardComponent {
+  users: User[] = []; // array of all usrs
+  rank: number = 0; // rank number for indexing table
+  contest: string | null = ""; // contest name
+  contestObj : Contest | null = null;
+  contestID : number | undefined = 0; // contest ID
+  subs: Submission[] = []; // all submissions
+  flags: Flag[] = []; // all flags
+  flagIds : number[] = []; // all flags FlagIDs
+
+  constructor(private adminProfileService: AdminProfileService){}
+
+  // on initialize
+  ngOnInit() {
+    this.rank = 0;
+    this.PopulateTable();
+    this.contest = sessionStorage.getItem('ContestString');
+  }
+
+  // get the user data and sort it for table
+  async PopulateTable() {
+
+    // get all the users, flags, and submissions
+    this.users = await this.adminProfileService.getAllUsers(getEmail());
+    let result = await this.adminProfileService.getContestFlagsSubs(getEmail(), this.contest);
+    this.subs = result.subs;
+    this.flags = result.flags;
+
+    // get the contest and contestID
+    result = await this.adminProfileService.getContests(getEmail());
+    this.contestObj = result.filter((item : Contest) => item.Name === this.contest)[0];
+    this.contestID = this.contestObj?.ContestID;
+
+    // get all the flags of the same contest ID that the Admin selected
+    this.flags = this.flags.filter((flag : Flag) => flag.ContestID === this.contestID);
+    for (let i=0; i < this.flags.length; i++) {
+      this.flagIds.push(this.flags[i].FlagID);
+    }
+    
+    // change the subs to just be submissions for the flags of this contest
+    this.subs = this.subs.filter((sub) => this.flagIds.includes(sub.FlagID));
+
+    // loop thorugh the users and submissions to get the correct amount of flags for this contest
+    for (let i=0; i < this.users.length; i++) {
+      let user = this.users[i];
+      this.users[i].Flags = 0;
+      for (let j=0; j < this.subs.length; j++) {
+        let sub = this.subs[i];
+        if (user.UserID == sub.UserID && sub.IsCorrect == true) {
+          this.users[i].Flags++;
+        }
+      }
+    }
+    this.users = this.users.sort((a,b) => a.Flags + b.Flags);
+  }
+

+  // increment rank and insert into table
+  getRank(): number {
+    this.rank++;
+    return this.rank;
+  }
 }