diff --git a/angular.json b/angular.json index ebfb2147d1461149b2b6a3d8a952a406b2855f7c..0563f949cb2fc171f943d5e06b75a22c951365c8 100644 --- a/angular.json +++ b/angular.json @@ -1,5 +1,8 @@ { "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "cli": { + "analytics": false + }, "version": 1, "newProjectRoot": "projects", "projects": { diff --git a/package.json b/package.json index be8a3bb6ee0b327a6202b6fa49998c6be22f691f..41488513e786ce654d2392c0da7322cdc4fe53d7 100644 --- a/package.json +++ b/package.json @@ -5,8 +5,23 @@ "ng": "ng", "start": "ng serve", "build": "ng build", - "watch": "ng build --watch --configuration development", - "test": "ng test" + "test": "ng test", + "lint": "ng lint && npm run prettier-check", + "prettier-check": "prettier --check \"projects/**/*.ts\"", + "prettier-fix": "prettier --write \"./projects/**/*.ts\"", + "ci-test": "ng test --browsers ChromeHeadless --watch=false", + "build-example-app": "ng build kypo-player-selection-example-app --configuration production", + "build-library": "ng build kypo-player-selection --configuration production", + "create-package": "cd dist/kypo-player-selection && npm pack", + "build-and-pack": "npm install && npm run build-library && npm run create-package", + "ci-update-version": "cd ./projects/kypo-player-selection/ && npm version $TAG_VERSION", + "ci-build-and-pack": "npm ci --cache .npm --prefer-offline && npm run build-library && npm run create-package", + "ci-publish-package": "cd dist/kypo-player-selection && npm publish" + }, + "husky": { + "hooks": { + "pre-commit": "npm run prettier-check" + } }, "private": true, "dependencies": { diff --git a/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.html b/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.html index 690523101d37b02d5e3b710cbf204b36534f736b..05d7fc1634b891ec689597b004a34f6854304e70 100644 --- a/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.html +++ b/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.html @@ -1,3 +1,7 @@ <mat-card> - <kypo-player-selection [playerData]="mock" (playerDataChange)="onPlayerDataChange($event)"></kypo-player-selection> -</mat-card> \ No newline at end of file + <kypo-player-selection + [playerData]="mock" + (playerSelectionChange)="onPlayerSelectionChange($event)" + (hoveredPlayerChange)="onPlayerHoverChange($event)" + ></kypo-player-selection> +</mat-card> diff --git a/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.ts b/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.ts index ced4aead5c6801747e7fd134ef07993cd28fd052..c28f20e43f865aeaae83666c4061a4445631784c 100644 --- a/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.ts +++ b/projects/kypo-player-selection-example-app/src/app/player-selection/player-selection.component.ts @@ -12,12 +12,12 @@ export class PlayerSelectionComponent implements OnInit { ngOnInit(): void {} - onPlayerDataChange(playerSelections: PlayerData[]) { - console.log(playerSelections); + onPlayerSelectionChange(selectedPlayersIds: number[]) { + console.log(selectedPlayersIds); } - onPlayerHoverChange(playerData: PlayerData) { - console.log(playerData); + onPlayerHoverChange(playerId: number) { + console.log(playerId); } players = [ diff --git a/projects/kypo-player-selection/src/components/kypo-player-selection.component.html b/projects/kypo-player-selection/src/components/kypo-player-selection.component.html index c12305a379ad7fd3f3dd65a764889f292cbbc567..aba629bbad5fe3235d502e8ba0cb645625194430 100644 --- a/projects/kypo-player-selection/src/components/kypo-player-selection.component.html +++ b/projects/kypo-player-selection/src/components/kypo-player-selection.component.html @@ -3,12 +3,12 @@ <span>{{ playerSelections.length }} trainees</span> displayed <span> - <button class="trainee-selector" mat-button (click)="showAllPlayers()">Show all</button> + <button class="trainee-selector" mat-button color="primary" (click)="showAllPlayers()">Show all</button> </span> <span> - <button class="trainee-selector" mat-button (click)="hideAllPlayers()">Hide all</button> + <button class="trainee-selector" mat-button color="primary" (click)="hideAllPlayers()">Hide all</button> </span> -</div> +</div> <div class="container"> <ng-container *ngFor="let playerSelection of playerSelections"> diff --git a/projects/kypo-player-selection/src/components/kypo-player-selection.component.scss b/projects/kypo-player-selection/src/components/kypo-player-selection.component.scss index e30bb8b77569ab401a58e3c9b4268084b95c431f..bbc756fd55fb64b2fd82f1c5aaabf95df95795af 100644 --- a/projects/kypo-player-selection/src/components/kypo-player-selection.component.scss +++ b/projects/kypo-player-selection/src/components/kypo-player-selection.component.scss @@ -4,4 +4,8 @@ justify-content: center; flex-wrap: wrap; gap: 2%; +} + +.displayed-indicator { + text-align: center; } \ No newline at end of file diff --git a/projects/kypo-player-selection/src/components/kypo-player-selection.component.ts b/projects/kypo-player-selection/src/components/kypo-player-selection.component.ts index 7c8fc061beec41ab14a1625b6f3bc343b11e0aac..0b516278bfde4ef527fa6eda58b3122ef91760de 100644 --- a/projects/kypo-player-selection/src/components/kypo-player-selection.component.ts +++ b/projects/kypo-player-selection/src/components/kypo-player-selection.component.ts @@ -1,7 +1,7 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; -import { View } from 'src/model/enums/view'; -import { PlayerData } from 'src/model/player-data'; -import { PlayerSelection } from 'src/model/player-selection'; +import { View } from '../model/enums/view'; +import { PlayerData } from '../model/player-data'; +import { PlayerSelection } from '../model/player-selection'; @Component({ selector: 'kypo-player-selection', @@ -13,8 +13,8 @@ export class KypoPlayerSelectionComponent implements OnInit { @Input() playerData!: PlayerData[]; @Input() view: View = View.BOTH; - @Output() playerDataChange: EventEmitter<PlayerData[]> = new EventEmitter(); - @Output() hoveredPlayer: EventEmitter<PlayerData> = new EventEmitter(); + @Output() playerSelectionChange: EventEmitter<number[]> = new EventEmitter(); + @Output() hoveredPlayerChange: EventEmitter<number> = new EventEmitter(); playerSelections!: PlayerSelection[]; @@ -28,17 +28,19 @@ export class KypoPlayerSelectionComponent implements OnInit { onPlayerSelectionChange(playerSelection: PlayerSelection): void { this.playerSelections.find((ps) => ps.id === playerSelection.id)!.isSelected = playerSelection.isSelected; - this.playerDataChange.emit( + this.emitSelected(); + } + + private emitSelected(): void { + this.playerSelectionChange.emit( this.playerSelections .filter((playerSelection) => playerSelection.isSelected) - .map( - (playerSelection) => new PlayerData(playerSelection.id, playerSelection.player, playerSelection.alertMessage) - ) + .map((playerSelection) => playerSelection.id) ); } onPlayerTabHover(playerSelection: PlayerSelection) { - this.hoveredPlayer.emit(new PlayerData(playerSelection.id, playerSelection.player, playerSelection.alertMessage)); + this.hoveredPlayerChange.emit(playerSelection?.id); } getSelectedPlayersCount(): number { diff --git a/projects/kypo-player-selection/src/components/kypo-player-selection.module.ts b/projects/kypo-player-selection/src/components/kypo-player-selection.module.ts index 1488f77b4c9c1deca92b0860bdd099091b75a968..af2cd4a3ec1e17d36abfbebc208993dba3880f07 100644 --- a/projects/kypo-player-selection/src/components/kypo-player-selection.module.ts +++ b/projects/kypo-player-selection/src/components/kypo-player-selection.module.ts @@ -4,19 +4,9 @@ import { KypoPlayerSelectionmaterialModule } from './kypo-player-selection-mater import { KypoPlayerSelectionComponent } from './kypo-player-selection.component'; import { PlayerTabComponent } from './player-tab/player-tab.component'; - - @NgModule({ - declarations: [ - KypoPlayerSelectionComponent, - PlayerTabComponent - ], - imports: [ - CommonModule, - KypoPlayerSelectionmaterialModule - ], - exports: [ - KypoPlayerSelectionComponent - ] + declarations: [KypoPlayerSelectionComponent, PlayerTabComponent], + imports: [CommonModule, KypoPlayerSelectionmaterialModule], + exports: [KypoPlayerSelectionComponent], }) -export class KypoPlayerSelectionModule { } +export class KypoPlayerSelectionModule {} diff --git a/projects/kypo-player-selection/src/components/player-tab/player-tab.component.ts b/projects/kypo-player-selection/src/components/player-tab/player-tab.component.ts index b033ad08360060310e627561f2d948c1902fc0dd..a79680925d16731cbe3a44ffdc49885eada96611 100644 --- a/projects/kypo-player-selection/src/components/player-tab/player-tab.component.ts +++ b/projects/kypo-player-selection/src/components/player-tab/player-tab.component.ts @@ -1,6 +1,6 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; -import { View } from 'src/model/enums/view'; -import { PlayerSelection } from 'src/model/player-selection'; +import { View } from '../../model/enums/view'; +import { PlayerSelection } from '../../model/player-selection'; @Component({ selector: 'kypo-player-tab', diff --git a/projects/kypo-player-selection/src/model/player-data.ts b/projects/kypo-player-selection/src/model/player-data.ts index 765884021ff1c882923c2b606af3f4723621af9f..9cf36e7b0f208c56263c9b35acb55c17449a580a 100644 --- a/projects/kypo-player-selection/src/model/player-data.ts +++ b/projects/kypo-player-selection/src/model/player-data.ts @@ -1,11 +1,11 @@ import { Player } from "./player"; export class PlayerData { - id!: number | string; + id!: number; player!: Player; alertMessage!: string; - constructor(id: number | string, player: Player, alertMessage: string) { + constructor(id: number, player: Player, alertMessage: string) { this.id = id; this.player = player; this.alertMessage = alertMessage; diff --git a/projects/kypo-player-selection/src/public-api.ts b/projects/kypo-player-selection/src/public-api.ts index 9b25e951372e30c72241c7f5122b28ef2f5d123b..12d1fd518738124d21f161f5de5f5ffc097c6a88 100644 --- a/projects/kypo-player-selection/src/public-api.ts +++ b/projects/kypo-player-selection/src/public-api.ts @@ -4,3 +4,9 @@ export * from './components/kypo-player-selection.component'; export * from './components/kypo-player-selection.module'; + + +export * from './model/player'; +export * from './model/player-data'; +export * from './model/player-selection'; +export * from './model/enums/view'; \ No newline at end of file