Class BracketsViewer

constructor

• new BracketsViewer(): BracketsViewer

• Returns BracketsViewer

Readonly participantRefs

onMatchClicked

• set onMatchClicked(callback): void

• Parameters

  • callback: MatchClickCallback

    A callback to be called when a match is clicked.

  Returns void

  Deprecated

  Use onMatchClick in the config parameter of viewer.render().

render

• render(data, config?): Promise<void>

• Renders data generated with brackets-manager.js. If multiple stages are given, they will all be displayed.

  Stages won't be discriminated visually based on the tournament they belong to.

  Parameters

  • data: ViewerData

    The data to display.

  • Optional config: Partial<Config>

    An optional configuration for the viewer.

  Returns Promise<void>

updateMatch

• updateMatch(match): void

• Updates the results of an existing match.

  Parameters

  • match: Match

    The match to update.

  Returns void

setParticipantImages

• setParticipantImages(images): void

• Sets the images which will be rendered for every participant.

  Parameters

  • images: ParticipantImage[]

    The participant images.

  Returns void

addLocale

• addLocale(name, locale): Promise<void>

• Adds a locale to the available i18n bundles.

  Parameters

  • name: string

    Name of the locale.

  • locale: {
        origin-hint: {
            seed: string;
            winner-bracket: string;
            winner-bracket-semi-final: string;
            winner-bracket-final: string;
            consolation-final: string;
            grand-final: string;
            double-elimination-consolation-final-opponent-1: string;
            double-elimination-consolation-final-opponent-2: string;
        };
        match-label: {
            default: string;
            winner-bracket: string;
            loser-bracket: string;
            standard-bracket: string;
            standard-bracket-semi-final: string;
            standard-bracket-final: string;
            double-elimination: string;
            double-elimination-semi-final: string;
            double-elimination-final: string;
            consolation-final: string;
            grand-final-single: string;
            grand-final: string;
            match-game: string;
        };
        match-status: {
            locked: string;
            waiting: string;
            ready: string;
            running: string;
            completed: string;
            archived: string;
        };
        abbreviations: {
            win: string;
            loss: string;
            forfeit: string;
            position: string;
            seed: string;
            winner-bracket: string;
            loser-bracket: string;
            match: string;
            grand-final: string;
        };
        ranking: {
            rank: {
                text: string;
                tooltip: string;
            };
            id: {
                text: string;
                tooltip: string;
            };
            played: {
                text: string;
                tooltip: string;
            };
            wins: {
                text: string;
                tooltip: string;
            };
            draws: {
                text: string;
                tooltip: string;
            };
            losses: {
                text: string;
                tooltip: string;
            };
            forfeits: {
                text: string;
                tooltip: string;
            };
            scoreFor: {
                text: string;
                tooltip: string;
            };
            scoreAgainst: {
                text: string;
                tooltip: string;
            };
            scoreDifference: {
                text: string;
                tooltip: string;
            };
            points: {
                text: string;
                tooltip: string;
            };
        };
        common: {
            bye: string;
            best-of-x: string;
            consolation: string;
            group-name: string;
            group-name-winner-bracket: string;
            group-name-loser-bracket: string;
            round-name: string;
            round-name-final: string;
            round-name-winner-bracket: string;
            round-name-winner-bracket-final: string;
            round-name-loser-bracket: string;
            round-name-loser-bracket-final: string;
        };
        form-creator: {
            stage-name-label: string;
            stage-name-placeholder: string;
            stage-selector-label: string;
            team-label: string;
            team-label-placeholder: string;
            team-count: string;
            team-count-placeholder: string;
            group-label: string;
            group-placeholder: string;
            seed-order-label: string;
            double-elimination-seed-order-placeholder: string;
            round-robin-mode-label: string;
            consolation-final-label: string;
            skip-first-round-label: string;
            grand-final-type-label: string;
            submit: string;
        };
    }

    Contents of the locale.

    • origin-hint: {
          seed: string;
          winner-bracket: string;
          winner-bracket-semi-final: string;
          winner-bracket-final: string;
          consolation-final: string;
          grand-final: string;
          double-elimination-consolation-final-opponent-1: string;
          double-elimination-consolation-final-opponent-2: string;
      }

      • seed: string

      • winner-bracket: string

      • winner-bracket-semi-final: string

      • winner-bracket-final: string

      • consolation-final: string

      • grand-final: string

      • double-elimination-consolation-final-opponent-1: string

      • double-elimination-consolation-final-opponent-2: string

    • match-label: {
          default: string;
          winner-bracket: string;
          loser-bracket: string;
          standard-bracket: string;
          standard-bracket-semi-final: string;
          standard-bracket-final: string;
          double-elimination: string;
          double-elimination-semi-final: string;
          double-elimination-final: string;
          consolation-final: string;
          grand-final-single: string;
          grand-final: string;
          match-game: string;
      }

      • default: string

      • winner-bracket: string

      • loser-bracket: string

      • standard-bracket: string

      • standard-bracket-semi-final: string

      • standard-bracket-final: string

      • double-elimination: string

      • double-elimination-semi-final: string

      • double-elimination-final: string

      • consolation-final: string

      • grand-final-single: string

      • grand-final: string

      • match-game: string

    • match-status: {
          locked: string;
          waiting: string;
          ready: string;
          running: string;
          completed: string;
          archived: string;
      }

      • locked: string

      • waiting: string

      • ready: string

      • running: string

      • completed: string

      • archived: string

    • abbreviations: {
          win: string;
          loss: string;
          forfeit: string;
          position: string;
          seed: string;
          winner-bracket: string;
          loser-bracket: string;
          match: string;
          grand-final: string;
      }

      • win: string

      • loss: string

      • forfeit: string

      • position: string

      • seed: string

      • winner-bracket: string

      • loser-bracket: string

      • match: string

      • grand-final: string

    • ranking: {
          rank: {
              text: string;
              tooltip: string;
          };
          id: {
              text: string;
              tooltip: string;
          };
          played: {
              text: string;
              tooltip: string;
          };
          wins: {
              text: string;
              tooltip: string;
          };
          draws: {
              text: string;
              tooltip: string;
          };
          losses: {
              text: string;
              tooltip: string;
          };
          forfeits: {
              text: string;
              tooltip: string;
          };
          scoreFor: {
              text: string;
              tooltip: string;
          };
          scoreAgainst: {
              text: string;
              tooltip: string;
          };
          scoreDifference: {
              text: string;
              tooltip: string;
          };
          points: {
              text: string;
              tooltip: string;
          };
      }

      • rank: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • id: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • played: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • wins: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • draws: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • losses: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • forfeits: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • scoreFor: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • scoreAgainst: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • scoreDifference: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

      • points: {
            text: string;
            tooltip: string;
        }

        • text: string

        • tooltip: string

    • common: {
          bye: string;
          best-of-x: string;
          consolation: string;
          group-name: string;
          group-name-winner-bracket: string;
          group-name-loser-bracket: string;
          round-name: string;
          round-name-final: string;
          round-name-winner-bracket: string;
          round-name-winner-bracket-final: string;
          round-name-loser-bracket: string;
          round-name-loser-bracket-final: string;
      }

      • bye: string

      • best-of-x: string

      • consolation: string

      • group-name: string

      • group-name-winner-bracket: string

      • group-name-loser-bracket: string

      • round-name: string

      • round-name-final: string

      • round-name-winner-bracket: string

      • round-name-winner-bracket-final: string

      • round-name-loser-bracket: string

      • round-name-loser-bracket-final: string

    • form-creator: {
          stage-name-label: string;
          stage-name-placeholder: string;
          stage-selector-label: string;
          team-label: string;
          team-label-placeholder: string;
          team-count: string;
          team-count-placeholder: string;
          group-label: string;
          group-placeholder: string;
          seed-order-label: string;
          double-elimination-seed-order-placeholder: string;
          round-robin-mode-label: string;
          consolation-final-label: string;
          skip-first-round-label: string;
          grand-final-type-label: string;
          submit: string;
      }

      • stage-name-label: string

      • stage-name-placeholder: string

      • stage-selector-label: string

      • team-label: string

      • team-label-placeholder: string

      • team-count: string

      • team-count-placeholder: string

      • group-label: string

      • group-placeholder: string

      • seed-order-label: string

      • double-elimination-seed-order-placeholder: string

      • round-robin-mode-label: string

      • consolation-final-label: string

      • skip-first-round-label: string

      • grand-final-type-label: string

      • submit: string

  Returns Promise<void>