Replace the "team" word by "participant"

Author: Drarig29

src/dom.ts

@@ -84,25 +84,25 @@ export function createMatchLabel(label: string, status: string): HTMLElement {
 }
 
 /**
- * Creates a container which contains the teams of a match.
+ * Creates a container which contains the opponents of a match.
  */
-export function createTeamsContainer(): HTMLElement {
-    const teams = document.createElement('div');
-    teams.classList.add('teams');
-    return teams;
+export function createOpponentsContainer(): HTMLElement {
+    const opponents = document.createElement('div');
+    opponents.classList.add('opponents');
+    return opponents;
 }
 
 /**
- * Creates a container which contains a team.
+ * Creates a container which contains a participant.
  */
-export function createTeamContainer(): HTMLElement {
+export function createParticipantContainer(): HTMLElement {
     const teamDOM = document.createElement('div');
-    teamDOM.classList.add('team');
+    teamDOM.classList.add('participant');
     return teamDOM;
 }
 
 /**
- * Creates a container which contains the name of a team.
+ * Creates a container which contains the name of a participant.
  */
 export function createNameContainer(): HTMLElement {
     const nameDOM = document.createElement('div');
@@ -111,7 +111,7 @@ export function createNameContainer(): HTMLElement {
 }
 
 /**
- * Creates a container which contains the result of a match for a team.
+ * Creates a container which contains the result of a match for a participant.
  */
 export function createResultContainer(): HTMLElement {
     const resultDOM = document.createElement('div');
@@ -176,45 +176,45 @@ export function setupHint(nameContainer: HTMLElement, hint: string): void {
 }
 
 /**
- * Sets a win for a team.
+ * Sets a win for a participant.
  *
- * @param teamContainer The team container.
+ * @param participantContainer The participant container.
  * @param resultContainer The result container.
- * @param team The team result.
+ * @param participant The participant result.
  */
-export function setupWin(teamContainer: HTMLElement, resultContainer: HTMLElement, team: ParticipantResult): void {
-    if (team.result && team.result === 'win') {
-        teamContainer.classList.add('win');
+export function setupWin(participantContainer: HTMLElement, resultContainer: HTMLElement, participant: ParticipantResult): void {
+    if (participant.result && participant.result === 'win') {
+        participantContainer.classList.add('win');
 
-        if (team.score === undefined)
+        if (participant.score === undefined)
             resultContainer.innerText = 'W';
     }
 }
 
 /**
- * Sets a loss for a team.
+ * Sets a loss for a participant.
  *
- * @param teamContainer The team container.
+ * @param participantContainer The participant container.
  * @param resultContainer The result container.
- * @param team The team result.
+ * @param participant The participant result.
  */
-export function setupLoss(teamContainer: HTMLElement, resultContainer: HTMLElement, team: ParticipantResult): void {
-    if (team.result && team.result === 'loss' || team.forfeit) {
-        teamContainer.classList.add('loss');
+export function setupLoss(participantContainer: HTMLElement, resultContainer: HTMLElement, participant: ParticipantResult): void {
+    if (participant.result && participant.result === 'loss' || participant.forfeit) {
+        participantContainer.classList.add('loss');
 
-        if (team.forfeit)
+        if (participant.forfeit)
             resultContainer.innerText = 'F'; // Forfeit.
-        else if (team.score === undefined)
+        else if (participant.score === undefined)
             resultContainer.innerText = 'L';
     }
 }
 
 /**
- * Adds the team origin to a name 
+ * Adds the participant origin to a name 
  *
  * @param nameContainer The name container.
  * @param text The text to set (origin).
- * @param placement The placement of the team origin.
+ * @param placement The placement of the participant origin.
  */
 export function addTeamOrigin(nameContainer: HTMLElement, text: string, placement: Placement): void {
     const span = document.createElement('span');
@@ -267,7 +267,7 @@ export function getFinalConnection(finalType: FinalType, roundNumber: number, ma
 /**
  * Sets the connection a match containers.
  *
- * @param teamsContainer The teams container.
+ * @param teamsContainer The opponents container.
  * @param matchContainer The match container.
  * @param connection The connection to set.
  */

src/main.ts

@@ -208,7 +208,7 @@ export class BracketsViewer {
             const data: number | string = item[prop];
 
             if (prop === 'id') {
-                const participant = this.participants.find(team => team.id === data);
+                const participant = this.participants.find(participant => participant.id === data);
 
                 if (participant !== undefined) {
                     const cell = dom.createCell(participant.name);
@@ -269,108 +269,106 @@ export class BracketsViewer {
         inLowerBracket = inLowerBracket || false;
 
         const match = dom.createMatchContainer();
-        const teams = dom.createTeamsContainer();
+        const opponents = dom.createOpponentsContainer();
 
         const team1 = this.createTeam(results.opponent1, hint, inLowerBracket);
         const team2 = this.createTeam(results.opponent2, hint, inLowerBracket);
 
         if (label)
-            teams.append(dom.createMatchLabel(label, lang.getMatchStatus(results.status)));
+            opponents.append(dom.createMatchLabel(label, lang.getMatchStatus(results.status)));
 
-        teams.append(team1, team2);
-        match.append(teams);
+        opponents.append(team1, team2);
+        match.append(opponents);
 
         if (!connection)
             return match;
 
-        dom.setupConnection(teams, match, connection);
+        dom.setupConnection(opponents, match, connection);
 
         return match;
     }
 
-    // TODO: get rid of the word "team"
-
     /**
-     * Creates a team for a match.
+     * Creates a participant for a match.
      *
-     * @param team Information about the team.
+     * @param participant Information about the participant.
      * @param hint Hint of the match.
      * @param inLowerBracket Whether the match is in lower bracket.
      */
-    private createTeam(team: ParticipantResult | null, hint: MatchHint, inLowerBracket: boolean): HTMLElement {
-        const teamContainer = dom.createTeamContainer();
+    private createTeam(participant: ParticipantResult | null, hint: MatchHint, inLowerBracket: boolean): HTMLElement {
+        const participantContainer = dom.createParticipantContainer();
         const nameContainer = dom.createNameContainer();
         const resultContainer = dom.createResultContainer();
 
-        if (team === null)
+        if (participant === null)
             nameContainer.innerText = 'BYE';
         else
-            this.renderParticipant(teamContainer, nameContainer, resultContainer, team, hint, inLowerBracket);
+            this.renderParticipant(participantContainer, nameContainer, resultContainer, participant, hint, inLowerBracket);
 
-        teamContainer.append(nameContainer, resultContainer);
+        participantContainer.append(nameContainer, resultContainer);
 
-        if (team && team.id !== null)
-            this.setupMouseHover(team.id, teamContainer);
+        if (participant && participant.id !== null)
+            this.setupMouseHover(participant.id, participantContainer);
 
-        return teamContainer;
+        return participantContainer;
     }
 
     /**
      * Renders a participant.
      *
-     * @param teamContainer The team container.
+     * @param participantContainer The participant container.
      * @param nameContainer The name container.
      * @param resultContainer The result container.
-     * @param team The participant result.
+     * @param participant The participant result.
      * @param hint Hint for the participant.
      * @param inLowerBracket Whether the match is in lower bracket.
      */
-    private renderParticipant(teamContainer: HTMLElement, nameContainer: HTMLElement, resultContainer: HTMLElement, team: ParticipantResult, hint: MatchHint, inLowerBracket: boolean): void {
-        const participant = this.participants.find(item => item.id === team.id);
+    private renderParticipant(participantContainer: HTMLElement, nameContainer: HTMLElement, resultContainer: HTMLElement, participant: ParticipantResult, hint: MatchHint, inLowerBracket: boolean): void {
+        const found = this.participants.find(item => item.id === participant.id);
 
-        if (participant) {
-            nameContainer.innerText = participant.name;
-            this.renderTeamOrigin(nameContainer, team, inLowerBracket);
+        if (found) {
+            nameContainer.innerText = found.name;
+            this.renderTeamOrigin(nameContainer, participant, inLowerBracket);
         } else
-            this.renderHint(nameContainer, team, hint, inLowerBracket);
+            this.renderHint(nameContainer, participant, hint, inLowerBracket);
 
-        resultContainer.innerText = `${team.score || '-'}`;
+        resultContainer.innerText = `${participant.score || '-'}`;
 
-        dom.setupWin(teamContainer, resultContainer, team);
-        dom.setupLoss(teamContainer, resultContainer, team);
+        dom.setupWin(participantContainer, resultContainer, participant);
+        dom.setupLoss(participantContainer, resultContainer, participant);
     }
 
     /**
      * Renders a hint for a participant.
      *
      * @param nameContainer The name container.
-     * @param team The participant result.
+     * @param participant The participant result.
      * @param hint Hint for the participant.
      * @param inLowerBracket Whether the match is in lower bracket.
      */
-    private renderHint(nameContainer: HTMLElement, team: ParticipantResult, hint: MatchHint, inLowerBracket: boolean): void {
-        if (hint === undefined || team.position === undefined) return;
+    private renderHint(nameContainer: HTMLElement, participant: ParticipantResult, hint: MatchHint, inLowerBracket: boolean): void {
+        if (hint === undefined || participant.position === undefined) return;
         if (!this.config.showSlotsOrigin) return;
         if (!this.config.showLowerBracketSlotsOrigin && inLowerBracket) return;
 
-        dom.setupHint(nameContainer, hint(team.position));
+        dom.setupHint(nameContainer, hint(participant.position));
     }
 
     /**
      * Renders a participant's origin.
      *
      * @param nameContainer The name container.
-     * @param team The participant result.
+     * @param participant The participant result.
      * @param inLowerBracket Whether the match is in lower bracket.
      */
-    private renderTeamOrigin(nameContainer: HTMLElement, team: ParticipantResult, inLowerBracket: boolean): void {
-        if (team.position === undefined) return;
+    private renderTeamOrigin(nameContainer: HTMLElement, participant: ParticipantResult, inLowerBracket: boolean): void {
+        if (participant.position === undefined) return;
         if (this.config.participantOriginPlacement === 'none') return;
         if (!this.config.showSlotsOrigin) return;
         if (!this.config.showLowerBracketSlotsOrigin && inLowerBracket) return;
 
         // 'P' for position (where the participant comes from) and '#' for actual seeding.
-        const origin = inLowerBracket ? `P${team.position}` : `#${team.position}`;
+        const origin = inLowerBracket ? `P${participant.position}` : `#${participant.position}`;
 
         dom.addTeamOrigin(nameContainer, origin, this.config.participantOriginPlacement);
     }

src/style.scss

@@ -178,7 +178,7 @@ h3 {
   }
 }
 
-.teams {
+.opponents {
   width: 100%;
   position: relative;
 
@@ -235,7 +235,7 @@ h3 {
   }
 }
 
-.team {
+.participant {
   display: flex;
   justify-content: space-between;
   padding: 2px 8px;

src/types.d.ts

@@ -36,8 +36,8 @@ export interface Config {
     /**
      * Where the position of a participant is placed relative to its name.
      * - If `none`, the position is not added.
-     * - If `before`, the position is prepended before the team name. "#1 Team"
-     * - If `after`, the position is appended after the team name, in parentheses. "Team (#1)"
+     * - If `before`, the position is prepended before the participant name. "#1 Team"
+     * - If `after`, the position is appended after the participant name, in parentheses. "Team (#1)"
      */
     participantOriginPlacement: Placement,