@adonsio/adn-tournament
Version:
This packages allows you to generate Tournament Brackets in **Angular v12.2.4**. It's currently **work in progress** so use it at your own risk.
112 lines (103 loc) • 6.69 kB
JavaScript
import { Component, Input, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
class DoubleEliminationTreeComponent {
constructor() {
}
ngOnChanges(changes) {
this.losersBracket = this.tournament.rounds.filter(round => {
return round.type === 'Loserbracket';
});
this.winnersBracket = this.tournament.rounds.filter(round => {
return round.type === 'Winnerbracket';
});
//@ts-ignore
this.final = this.tournament.rounds.filter(round => {
return round.type === 'Final';
}).shift();
}
}
DoubleEliminationTreeComponent.decorators = [
{ type: Component, args: [{
selector: 'adn-double-elimination-tree',
template: "<div class=\"ngtt-de__container\">\r\n <div class=\"ngtt-de__winners-bracket-wrapper\">\r\n <ng-container *ngFor=\"let winnersround of winnersBracket\">\r\n <!-- {{winnersround.round}}-->\r\n <div class=\"ngtt-de__winners-round-wrapper\">\r\n <ng-container *ngFor=\"let match of winnersround.matches\">\r\n <div class=\"ngtt-de__winners-match-wrapper\">\r\n <div class=\"ngtt-de__match-component-container\">\r\n <ng-container *ngTemplateOutlet=\"matchTemplate; context:{$implicit: match}\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"ngtt-de__winners-round-wrapper\">\r\n <div class=\"ngtt-de__finale-match-wrapper\">\r\n <div class=\"ngtt-de__match-component-container\">\r\n <ng-container *ngTemplateOutlet=\"matchTemplate; context:{$implicit: final.matches[0]}\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"ngtt-de__losers-bracket-wrapper\">\r\n <ng-container *ngFor=\"let losersround of losersBracket\">\r\n <!-- {{losersround.round}}<br>-->\r\n <div class=\"ngtt-de__losers-round-wrapper\">\r\n <ng-container *ngFor=\"let match of losersround.matches\">\r\n <div class=\"ngtt-de__losers-match-wrapper\">\r\n <div class=\"ngtt-de__match-component-container\">\r\n <ng-container *ngTemplateOutlet=\"matchTemplate; context:{$implicit: match}\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n ",
styles: [""]
},] }
];
DoubleEliminationTreeComponent.ctorParameters = () => [];
DoubleEliminationTreeComponent.propDecorators = {
matchTemplate: [{ type: Input }],
tournament: [{ type: Input }]
};
const components$1 = [DoubleEliminationTreeComponent];
class AdnDoubleEliminationTreeModule {
}
AdnDoubleEliminationTreeModule.decorators = [
{ type: NgModule, args: [{
declarations: components$1,
imports: [
CommonModule
],
exports: components$1
},] }
];
class SingleEliminationTreeComponent {
constructor() {
}
ngOnInit() {
}
ngOnChanges(changes) {
if (changes.hasOwnProperty('tournament') && changes.tournament.currentValue) {
this.winnersBracket = this.tournament.rounds.filter(round => {
return round.type === 'Winnerbracket';
});
}
console.log(this.winnersBracket);
//@ts-ignore
this.final = this.tournament.rounds.filter(round => {
return round.type === 'Final';
}).shift();
console.log(this.final);
}
}
SingleEliminationTreeComponent.decorators = [
{ type: Component, args: [{
selector: 'adn-single-elimination-tree',
template: "<div class=\"ngtt-se__container\">\r\n <div class=\"ngtt-se__bracket-wrapper\">\r\n <ng-container *ngFor=\"let winnersround of winnersBracket; let i = index\">\r\n <div class=\"ngtt-se__round-wrapper\">\r\n <ng-container *ngFor=\"let match of winnersround.matches\">\r\n <div class=\"ngtt-se__match-wrapper\">\r\n <div class=\"ngtt-se__match-component-container\">\r\n <ng-container *ngTemplateOutlet=\"matchTemplate; context:{$implicit: match}\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container>\r\n <div class=\"ngtt-se__round-wrapper\">\r\n <div class=\"ngtt-se__match-wrapper\">\r\n <div class=\"ngtt-se__finale-match-wrapper\">\r\n <div class=\"ngtt-se__finale-component-container\">\r\n <ng-container\r\n *ngTemplateOutlet=\"matchTemplate; context:{$implicit: final.matches[0]}\"></ng-container>\r\n </div>\r\n <div class=\"ngtt-se__match-component-container\" *ngIf=\"final.matches.length > 1\">\r\n <ng-container *ngTemplateOutlet=\"matchTemplate; context:{$implicit: final.matches[1]}\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n ",
styles: [""]
},] }
];
SingleEliminationTreeComponent.ctorParameters = () => [];
SingleEliminationTreeComponent.propDecorators = {
matchTemplate: [{ type: Input }],
tournament: [{ type: Input }]
};
const components = [SingleEliminationTreeComponent];
class AdnSingleEliminationTreeModule {
}
AdnSingleEliminationTreeModule.decorators = [
{ type: NgModule, args: [{
declarations: components,
imports: [
CommonModule
],
exports: components
},] }
];
const modules = [AdnSingleEliminationTreeModule, AdnDoubleEliminationTreeModule];
class AdnTournamentTreeModule {
}
AdnTournamentTreeModule.decorators = [
{ type: NgModule, args: [{
declarations: [],
imports: modules,
exports: [AdnSingleEliminationTreeModule, AdnDoubleEliminationTreeModule]
},] }
];
/*
* Public API Surface of adn-tournament
*/
/**
* Generated bundle index. Do not edit.
*/
export { AdnDoubleEliminationTreeModule, AdnSingleEliminationTreeModule, AdnTournamentTreeModule, SingleEliminationTreeComponent as ɵa, DoubleEliminationTreeComponent as ɵb };
//# sourceMappingURL=adonsio-adn-tournament.js.map