Skip to content

Commit 59fcb13

Browse files
alansemenovalansemenov
committed
LeagueLeaveDialogComponent & RegenerateRankingDialogComponent
1 parent 5b42fac commit 59fcb13

File tree

7 files changed

+105
-140
lines changed

7 files changed

+105
-140
lines changed

‎src/angular/app/leagues/league-leave-dialog/league-leave-dialog.component.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<h2 mat-dialog-title>Leave League</h2>
2+
<mat-dialog-content class="mat-typography">
3+
<p>You are about to leave this league (<strong>{{data.leagueName}}</strong>).</p>
4+
</mat-dialog-content>
5+
<mat-dialog-actions align="end">
6+
<button mat-button (click)="onCancelLeave()" class="cancel-button">Cancel</button>
7+
<button mat-button color="warn" (click)="onConfirmLeave()" class="leave-button">Leave</button>
8+
</mat-dialog-actions>
9+
10+

‎src/angular/app/leagues/league-leave-dialog/league-leave-dialog.component.ts‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Component, Inject } from '@angular/core';
2+
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
3+
4+
@Component({
5+
templateUrl: './league-leave-dialog.component.html'
6+
})
7+
export class LeagueLeaveDialogComponent {
8+
constructor(
9+
public dialogRef: MatDialogRef<LeagueLeaveDialogComponent>,
10+
@Inject(MAT_DIALOG_DATA) public data: { leagueName: string }
11+
) {}
12+
13+
onConfirmLeave(): void {
14+
this.dialogRef.close(true);
15+
}
16+
17+
onCancelLeave(): void {
18+
this.dialogRef.close(false);
19+
}
20+
}

‎src/angular/app/leagues/league-profile/league-profile.component.html‎

Lines changed: 4 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -40,15 +40,15 @@
4040
<i class="material-icons">more_vert</i>
4141
</a>
4242
<ul>
43-
<li *ngIf="playerSystemAdmin"><a class="btn-floating purple" (click)="onRankingRefreshClicked()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">poll</i></a></li>
44-
<li><a class="btn-floating green" (click)="openAddPlayerModal()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">person_add</i></a></li>
43+
<li *ngIf="playerSystemAdmin"><a class="btn-floating purple" (click)="openRegenerateRankingDialog()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">poll</i></a></li>
44+
<li><a class="btn-floating green" (click)="openAddPlayerDialog()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">person_add</i></a></li>
4545
<li><a class="btn-floating blue" (click)="onEditClicked()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">mode_edit</i></a></li>
46-
<li *ngIf="playerInLeague || joinLeagueRequested"><a class="btn-floating red" (click)="onLeaveClicked()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">directions_run</i></a></li>
46+
<li *ngIf="playerInLeague || joinLeagueRequested"><a class="btn-floating red" (click)="openLeagueLeaveDialog()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">directions_run</i></a></li>
4747
<li><a class="btn-floating red" (click)="openLeagueDeleteDialog()" style="transform: scaleY(0.4) scaleX(0.4) translateY(40px) translateX(0px); opacity: 0;" [attr.disabled]="online?null:true"><i class="material-icons">delete</i></a></li>
4848
</ul>
4949
</div>
5050
<div *ngIf="!adminInLeague && (playerInLeague || joinLeagueRequested)" class="fixed-action-btn">
51-
<a (click)="onLeaveClicked()" class="btn-floating btn-large waves-effect waves-light red" [attr.disabled]="online?null:true"><i class="material-icons">directions_run</i></a>
51+
<a (click)="openLeagueLeaveDialog()" class="btn-floating btn-large waves-effect waves-light red" [attr.disabled]="online?null:true"><i class="material-icons">directions_run</i></a>
5252
</div>
5353

5454
<div class="row">
@@ -83,74 +83,5 @@
8383
[detailsPath]="['leagues', league.name.toLowerCase(), 'games']"></game-list>
8484
</div>
8585

86-
<!-- <div class="modal center" materialize="modal" [materializeParams]="[{dismissible: true, inDuration: 100, outDuration: 100}]"
87-
[materializeActions]="materializeActionsRemove">
88-
<div class="modal-content">
89-
<h5 class="center">Remove player</h5>
90-
<p>You are about to remove player '<strong>{{removePlayer?.name}}</strong>' from this league (<strong>{{league.name}}</strong>).</p>
91-
</div>
92-
<div class="modal-footer">
93-
<a class="modal-action modal-close waves-effect btn-flat grey lighten-1 left">Cancel</a>
94-
<a (click)="onConfirmRemoveClicked()" class="modal-action modal-close waves-effect btn-flat red white-text">Remove</a>
95-
</div>
96-
</div>
97-
98-
<div class="modal center" materialize="modal" [materializeParams]="[{dismissible: true, inDuration: 100, outDuration: 100}]"
99-
[materializeActions]="materializeActionsApprove">
100-
<div class="modal-content">
101-
<h5 class="center">Join League Request</h5>
102-
<p>Player '<strong>{{approvePlayer?.name}}</strong>' has requested to join this league (<strong>{{league.name}}</strong>).</p>
103-
</div>
104-
<div class="modal-footer">
105-
<a (click)="onConfirmPlayerJoin(true)" class="modal-action waves-effect btn-flat green white-text left">Allow</a>
106-
<a (click)="onConfirmPlayerJoin(false)" class="modal-action waves-effect btn-flat red white-text">Deny</a>
107-
</div>
108-
</div>
109-
110-
<div class="modal center" materialize="modal" [materializeParams]="[{dismissible: true, inDuration: 100, outDuration: 100}]"
111-
[materializeActions]="materializeActionsPending">
112-
<div class="modal-content">
113-
<h5 class="center">Join League Requested</h5>
114-
<p>A request for joining this league has been sent to the league administrators.
115-
You will be notified by email as soon as the petition is resolved.</p>
116-
</div>
117-
<div class="modal-footer">
118-
<a class="modal-action modal-close waves-effect waves-green btn-flat green white-text">Ok</a>
119-
</div>
120-
</div>
121-
<div class="modal center" materialize="modal" [materializeParams]="[{dismissible: true, inDuration: 100, outDuration: 100}]"
122-
[materializeActions]="materializeActionsDelete">
123-
<div class="modal-content">
124-
<h5 class="center">Delete league</h5>
125-
<p>You are about to delete this league (<strong>{{league.name}}</strong>). <strong>This operation cannot be undone.</strong></p>
126-
</div>
127-
<div class="modal-footer">
128-
<a class="modal-action modal-close waves-effect btn-flat grey lighten-1 left">Cancel</a>
129-
<a (click)="onConfirmDeleteClicked()" class="modal-action modal-close waves-effect btn-flat red white-text">Delete</a>
130-
</div>
131-
</div>-->
132-
<div class="modal center" materialize="modal" [materializeParams]="[{dismissible: true, inDuration: 100, outDuration: 100}]"
133-
[materializeActions]="materializeActionsLeave">
134-
<div class="modal-content">
135-
<h5 class="center">Leave league</h5>
136-
<p>You are about to leave this league (<strong>{{league.name}}</strong>).</p>
137-
</div>
138-
<div class="modal-footer">
139-
<a class="modal-action modal-close waves-effect btn-flat grey lighten-1 left">Cancel</a>
140-
<a (click)="onConfirmLeaveClicked()" class="modal-action modal-close waves-effect btn-flat red white-text">Leave</a>
141-
</div>
142-
</div>
143-
<div class="modal center" materialize="modal" [materializeParams]="[{dismissible: true, inDuration: 100, outDuration: 100}]"
144-
[materializeActions]="materializeActionsRegenerateRanking">
145-
<div class="modal-content">
146-
<h5 class="center">Regenerate league ranking</h5>
147-
<p>Are you sure you want to regenerate '<strong>{{league.name}}</strong>' league's ranking?</p>
148-
</div>
149-
<div class="modal-footer">
150-
<a class="modal-action modal-close waves-effect btn-flat grey lighten-1 left">No</a>
151-
<a (click)="onConfirmRegenerateClicked()" class="modal-action modal-close waves-effect btn-flat red white-text">Yes</a>
152-
</div>
153-
</div>
154-
15586
</ng-template>
15687

‎src/angular/app/leagues/league-profile/league-profile.component.ts‎

Lines changed: 35 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ import { MatDialog } from '@angular/material/dialog';
1717
import {JoinLeagueRequestDialogComponent} from '../join-league-request-dialog/join-league-request-dialog.component';
1818
import {PendingRequestDialogComponent} from '../pending-request-dialog/pending-request-dialog.component';
1919
import {LeagueDeleteDialogComponent} from '../league-delete-dialog/league-delete-dialog.component';
20+
import {LeagueLeaveDialogComponent} from '../league-leave-dialog/league-leave-dialog.component';
21+
import {RegenerateRankingDialogComponent} from '../regenerate-ranking-dialog/regenerate-ranking-dialog.component';
2022

2123
declare var XPCONFIG: Config;
2224

@@ -39,13 +41,7 @@ export class LeagueProfileComponent
3941
activeGames: Game[] = [];
4042
nonMembersPlayerNames: string[] = [];
4143
playerNamesToAdd: string[] = [];
42-
approvePlayer: Player;
4344
approvePollingTimerId: any;
44-
materializeActionsApprove = new EventEmitter<any>();
45-
materializeActionsPending = new EventEmitter<any>();
46-
materializeActionsDelete = new EventEmitter<any>();
47-
materializeActionsLeave = new EventEmitter<any>();
48-
materializeActionsRegenerateRanking = new EventEmitter<any>();
4945
online: boolean;
5046
onlineStateCallback = () => this.online = navigator.onLine;
5147
private wsMan: WebSocketManager;
@@ -84,22 +80,7 @@ export class LeagueProfileComponent
8480
this.onlineStatusService.addOnlineStateEventListener(this.onlineStateCallback);
8581
this.online = navigator.onLine;
8682
}
87-
/*
88-
ngAfterViewInit(): void {
89-
// Poll until loaded
90-
const buttonPollId = setInterval(() => {
91-
if (this.league) {
92-
this.initFloatingButtons();
93-
clearInterval(buttonPollId);
94-
}
95-
}, 500);
96-
}
9783

98-
initFloatingButtons(): void {
99-
const buttons = document.querySelectorAll('.fixed-action-btn');
100-
M.FloatingActionButton.init(buttons);
101-
}
102-
*/
10384
ngOnDestroy() {
10485
clearTimeout(this.approvePollingTimerId);
10586
this.approvePollingTimerId = undefined;
@@ -203,18 +184,6 @@ export class LeagueProfileComponent
203184
onEditClicked() {
204185
this.router.navigate(['leagues', this.league.name.toLowerCase(), 'edit']);
205186
}
206-
/*
207-
onAddPlayerClicked() {
208-
this.showModal();
209-
}
210-
211-
onDeleteClicked() {
212-
this.showModalDelete();
213-
}
214-
*/
215-
onLeaveClicked() {
216-
this.showModalLeave();
217-
}
218187

219188
onJoinClicked() {
220189
if (this.authService.isAuthenticated() && !this.playerInLeague) {
@@ -281,28 +250,18 @@ export class LeagueProfileComponent
281250
).then( () => this.router.navigate(['leagues']));
282251
}
283252

284-
onConfirmLeaveClicked() {
285-
this.graphQLService.post(LeagueProfileComponent.leavePlayerLeagueQuery,
286-
{playerId: this.authService.getUser().playerId, leagueId: this.league.id}).then(
287-
data => {
288-
this.hideModalLeave();
289-
this.refreshData(this.league.name);
290-
});
253+
leaveLeague() {
254+
this.graphQLService.post(
255+
LeagueProfileComponent.leavePlayerLeagueQuery,
256+
{ playerId: this.authService.getUser().playerId, leagueId: this.league.id }
257+
).then(() => this.refreshData(this.league.name) );
291258
}
292259

293-
onRankingRefreshClicked() {
294-
this.showModalRanking();
260+
regenerateRanking() {
261+
this.graphQLService.post(LeagueProfileComponent.regenerateLeagueRanking, {leagueId: this.league.id});
295262
}
296263

297-
onConfirmRegenerateClicked() {
298-
this.graphQLService.post(LeagueProfileComponent.regenerateLeagueRanking,
299-
{leagueId: this.league.id}).then(
300-
data => {
301-
this.hideModalRanking();
302-
});
303-
}
304-
305-
openAddPlayerModal(): void {
264+
openAddPlayerDialog(): void {
306265
const dialogRef = this.dialog.open(AddPlayersDialogComponent, {
307266
width: '250px',
308267
data: {
@@ -363,25 +322,35 @@ export class LeagueProfileComponent
363322
}
364323
});
365324
}
366-
/*
367-
public hideModalDelete(): void {
368-
this.materializeActionsDelete.emit({action: "modal", params: ['close']});
369-
}
370-
*/
371-
public showModalLeave(): void {
372-
this.materializeActionsLeave.emit({action: "modal", params: ['open']});
373-
}
374325

375-
public hideModalLeave(): void {
376-
this.materializeActionsLeave.emit({action: "modal", params: ['close']});
377-
}
326+
public openLeagueLeaveDialog(): void {
327+
const dialogRef = this.dialog.open(LeagueLeaveDialogComponent, {
328+
width: '250px',
329+
data: {
330+
leagueName: this.league.name
331+
} // pass data as needed
332+
});
378333

379-
public showModalRanking(): void {
380-
this.materializeActionsRegenerateRanking.emit({action: "modal", params: ['open']});
334+
dialogRef.afterClosed().subscribe(result => {
335+
if (result === true) {
336+
this.leaveLeague();
337+
}
338+
});
381339
}
382340

383-
public hideModalRanking(): void {
384-
this.materializeActionsRegenerateRanking.emit({action: "modal", params: ['close']});
341+
public openRegenerateRankingDialog(): void {
342+
const dialogRef = this.dialog.open(RegenerateRankingDialogComponent, {
343+
width: '250px',
344+
data: {
345+
leagueName: this.league.name
346+
} // pass data as needed
347+
});
348+
349+
dialogRef.afterClosed().subscribe(result => {
350+
if (result === true) {
351+
this.regenerateRanking();
352+
}
353+
});
385354
}
386355

387356
onWsMessage(event: RemoteEvent) {

‎src/angular/app/leagues/league.module.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,8 @@ import { ChipsComponent } from '../common/chips/chips.component';
2929
import { JoinLeagueRequestDialogComponent } from './join-league-request-dialog/join-league-request-dialog.component';
3030
import { PendingRequestDialogComponent } from './pending-request-dialog/pending-request-dialog.component';
3131
import { LeagueDeleteDialogComponent } from './league-delete-dialog/league-delete-dialog.component';
32+
import {LeagueLeaveDialogComponent} from './league-leave-dialog/league-leave-dialog.component';
33+
import {RegenerateRankingDialogComponent} from './regenerate-ranking-dialog/regenerate-ranking-dialog.component';
3234

3335
const leagueRoutes: Routes = [
3436
{path: 'leagues', component: LeagueBrowserComponent, canActivate: [PlayerRouteGuard,]},
@@ -59,7 +61,9 @@ const leagueRoutes: Routes = [
5961
RemovePlayerDialogComponent,
6062
JoinLeagueRequestDialogComponent,
6163
PendingRequestDialogComponent,
62-
LeagueDeleteDialogComponent
64+
LeagueDeleteDialogComponent,
65+
LeagueLeaveDialogComponent,
66+
RegenerateRankingDialogComponent
6367
],
6468
imports: [
6569
//MaterializeModule,

‎src/angular/app/leagues/regenerate-ranking-dialog/regenerate-ranking-dialog.component.html‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<h2 mat-dialog-title>Regenerate League Ranking</h2>
2+
<mat-dialog-content class="mat-typography">
3+
<p>Are you sure you want to regenerate '<strong>{{data.leagueName}}</strong>' league's ranking?</p>
4+
</mat-dialog-content>
5+
<mat-dialog-actions align="end">
6+
<button mat-button (click)="onCancelRegenerate()">No</button>
7+
<button mat-button color="warn" (click)="onConfirmRegenerate()">Yes</button>
8+
</mat-dialog-actions>
9+
10+
11+

‎src/angular/app/leagues/regenerate-ranking-dialog/regenerate-ranking-dialog.component.ts‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Component, Inject } from '@angular/core';
2+
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
3+
4+
@Component({
5+
templateUrl: './regenerate-ranking-dialog.component.html'
6+
})
7+
export class RegenerateRankingDialogComponent {
8+
constructor(
9+
public dialogRef: MatDialogRef<RegenerateRankingDialogComponent>,
10+
@Inject(MAT_DIALOG_DATA) public data: { leagueName: string }
11+
) {}
12+
13+
onConfirmRegenerate(): void {
14+
this.dialogRef.close(true);
15+
}
16+
17+
onCancelRegenerate(): void {
18+
this.dialogRef.close(false);
19+
}
20+
}

0 commit comments

Comments
 (0)