This commit is contained in:
Łukasz Góreczny 2021-01-09 14:06:47 +01:00
commit 0a932a00d7
14 changed files with 276 additions and 53 deletions

View File

@ -26,6 +26,7 @@
"styles": [ "styles": [
"./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
"node_modules/bootstrap/dist/css/bootstrap.min.css", "node_modules/bootstrap/dist/css/bootstrap.min.css",
"node_modules/rpg-awesome/css/rpg-awesome.min.css",
"src/styles.css" "src/styles.css"
], ],
"scripts": [] "scripts": []

View File

@ -10513,6 +10513,11 @@
"inherits": "^2.0.1" "inherits": "^2.0.1"
} }
}, },
"rpg-awesome": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/rpg-awesome/-/rpg-awesome-0.2.0.tgz",
"integrity": "sha512-+jTuYWHOs8iZV5+XKvI/7Ojr0k4pLX/dRpa2LHXReGMQI6h0cGvNxIh/AQY1zhAC7LPcNXnPTliD1/ugB/DbRA=="
},
"run-async": { "run-async": {
"version": "2.4.1", "version": "2.4.1",
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz", "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
@ -12046,12 +12051,6 @@
} }
} }
}, },
"tslint-config-prettier": {
"version": "1.18.0",
"resolved": "https://registry.npmjs.org/tslint-config-prettier/-/tslint-config-prettier-1.18.0.tgz",
"integrity": "sha512-xPw9PgNPLG3iKRxmK7DWr+Ea/SzrvfHtjFt5LBl61gk2UBG/DB9kCXRjv+xyIU1rUtnayLeMUVJBcMX8Z17nDg==",
"dev": true
},
"tsutils": { "tsutils": {
"version": "2.29.0", "version": "2.29.0",
"resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.29.0.tgz", "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.29.0.tgz",

View File

@ -34,6 +34,7 @@
"jquery": "3.4.1", "jquery": "3.4.1",
"oidc-client": "^1.9.1", "oidc-client": "^1.9.1",
"popper.js": "^1.16.0", "popper.js": "^1.16.0",
"rpg-awesome": "^0.2.0",
"rxjs": "^6.5.3", "rxjs": "^6.5.3",
"zone.js": "0.9.1" "zone.js": "0.9.1"
}, },

View File

@ -8,8 +8,8 @@ import { appRoutingModule } from '../app.routing';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { SignInComponent } from './components/sign-in/sign-in.component'; import { SignInComponent } from './components/sign-in/sign-in.component';
import { RegistrationComponent } from './components/registration/registration.component'; import { RegistrationComponent } from './components/registration/registration.component';
import { GameMasterDashboardComponent} from './components/game-master-dashboard/game-master-dashboard.component'; import { GameMasterDashboardComponent } from './components/game-master-dashboard/game-master-dashboard.component';
import {PlayerDashboardComponent} from './components/player-dashboard/player-dashboard.component'; import { PlayerDashboardComponent } from './components/player-dashboard/player-dashboard.component';
import { SelectCharacterComponent } from './components/select-character/select-character.component'; import { SelectCharacterComponent } from './components/select-character/select-character.component';
import { import {
MatCardModule, MatCardModule,
@ -18,15 +18,22 @@ import {
MatInputModule, MatInputModule,
MatButtonModule, MatButtonModule,
MatCheckboxModule, MatCheckboxModule,
MatIconModule, MatSidenavModule, MatToolbarModule, MatListModule MatIconModule,
MatSidenavModule,
MatToolbarModule,
MatListModule,
MatPaginatorModule,
MatTableModule,
MatSortModule,
} from '@angular/material'; } from '@angular/material';
import {UserService} from '../services/user.service'; import { UserService } from '../services/user.service';
import { StoreModule } from '@ngrx/store'; import { StoreModule } from '@ngrx/store';
import { StoreDevtoolsModule } from '@ngrx/store-devtools'; import { StoreDevtoolsModule } from '@ngrx/store-devtools';
import {environment} from '../environments/environment'; import { environment } from '../environments/environment';
import {reducers} from './store/models/app-state.model'; import { reducers } from './store/models/app-state.model';
import {CharacterService} from '../services/character.service'; import { CharacterService } from '../services/character.service';
import { AbilityCardComponent } from './components/ability-card/ability-card.component'; import { AbilityCardComponent } from './components/ability-card/ability-card.component';
import { GameMasterSpellsTableComponent } from './components/game-master-spells-table/game-master-spells-table.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -38,9 +45,10 @@ import { AbilityCardComponent } from './components/ability-card/ability-card.com
PlayerDashboardComponent, PlayerDashboardComponent,
SelectCharacterComponent, SelectCharacterComponent,
AbilityCardComponent, AbilityCardComponent,
GameMasterSpellsTableComponent,
], ],
imports: [ imports: [
BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }), BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
HttpClientModule, HttpClientModule,
FormsModule, FormsModule,
ReactiveFormsModule, ReactiveFormsModule,
@ -56,15 +64,16 @@ BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
MatSidenavModule, MatSidenavModule,
MatToolbarModule, MatToolbarModule,
MatListModule, MatListModule,
MatPaginatorModule,
StoreModule.forRoot(reducers), StoreModule.forRoot(reducers),
StoreDevtoolsModule.instrument({ StoreDevtoolsModule.instrument({
logOnly: environment.production logOnly: environment.production,
}) }),
MatTableModule,
MatSortModule,
], ],
providers: [ providers: [UserService, CharacterService],
UserService, bootstrap: [AppComponent],
CharacterService entryComponents: [GameMasterSpellsTableComponent],
],
bootstrap: [AppComponent]
}) })
export class AppModule { } export class AppModule {}

View File

@ -10,6 +10,16 @@
right: 0; right: 0;
} }
.no-wrap {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.left-nav-item *{
padding-right: 0px !important;
}
.leftnav{ .leftnav{
background-color: #3D4751; background-color: #3D4751;
border-right:none; border-right:none;

View File

@ -17,36 +17,41 @@
</div> </div>
<mat-divider></mat-divider> <mat-divider></mat-divider>
<mat-nav-list> <mat-nav-list>
<mat-list-item> <div *ngFor="let item of leftSidenavItems">
<mat-icon mat-list-icon>folder</mat-icon> <mat-list-item class="left-nav-item" (click)="(item.children && item.children.length) ? false :ChangeMiddleComponent(item.componentToDisplay)">
<span <mat-icon mat-list-icon ><i class="{{item.iconName}}"></i></mat-icon>
[@animateText]="leftSidenavTextExpanded ? 'show' : 'hide'" <span [@animateText]="leftSidenavTextExpanded ? 'show' : 'hide'" class="mat-list-text" style="color: white">
style="color: white" {{item.displayName}}
>Link 1</span <a *ngIf="item.children && item.children.length" mat-icon-button style="right: -35px;" (click)="item.expanded = !item.expanded">
> <mat-icon *ngIf="!item.expanded" class="mat-24">expand_more</mat-icon>
<mat-icon *ngIf="item.expanded" class="mat-24">expand_less</mat-icon>
</a>
</span>
</mat-list-item> </mat-list-item>
<mat-list-item> <mat-divider></mat-divider>
<mat-icon mat-list-icon>folder</mat-icon> <div *ngIf="item.expanded" >
<span <div *ngFor="let child of item.children" style="background-color: #4a5867">
[@animateText]="leftSidenavTextExpanded ? 'show' : 'hide'" <mat-list-item style="padding-left: 10px" (click)="ChangeMiddleComponent(child.componentToDisplay)">
style="color: white" <mat-icon mat-list-icon ><i class="{{child.iconName}}"></i></mat-icon>
>Link 2</span <span [@animateText]="leftSidenavTextExpanded ? 'show' : 'hide'" class="mat-list-text" style="color: white">
> {{child.displayName}}
</mat-list-item> </span>
<mat-list-item>
<mat-icon mat-list-icon>folder</mat-icon>
<span
[@animateText]="leftSidenavTextExpanded ? 'show' : 'hide'"
style="color: white"
>Link 3</span
>
</mat-list-item> </mat-list-item>
<mat-divider></mat-divider>
</div>
</div>
</div>
</mat-nav-list> </mat-nav-list>
</mat-sidenav> </mat-sidenav>
<mat-sidenav-content> <mat-sidenav-content>
<mat-toolbar color="primary" class="gm-toolbar"> <mat-toolbar color="primary" class="gm-toolbar">
<span>SessionCompanion</span> <span>SessionCompanion</span>
</mat-toolbar> </mat-toolbar>
<div style="padding: 20px">
<ng-container *ngComponentOutlet="middleComponentName">
</ng-container>
</div>
</mat-sidenav-content> </mat-sidenav-content>
<mat-sidenav <mat-sidenav
class="rightnav" class="rightnav"

View File

@ -10,6 +10,8 @@ import { ErrorResponse } from '../../../types/ErrorResponse';
import { HttpErrorResponse } from '@angular/common/http'; import { HttpErrorResponse } from '@angular/common/http';
import { LoggedCharactersViewModel } from '../../../types/viewmodels/character-viewmodels/LoggedCharactersViewModel'; import { LoggedCharactersViewModel } from '../../../types/viewmodels/character-viewmodels/LoggedCharactersViewModel';
import { first } from 'rxjs/operators'; import { first } from 'rxjs/operators';
import { LeftNavItem } from '../../../types/LeftNavItem';
import { GameMasterSpellsTableComponent } from '../game-master-spells-table/game-master-spells-table.component';
@Component({ @Component({
selector: 'app-game-master-dashboard', selector: 'app-game-master-dashboard',
@ -18,9 +20,18 @@ import { first } from 'rxjs/operators';
animations: [onSideNavChange, animateText], animations: [onSideNavChange, animateText],
}) })
export class GameMasterDashboardComponent implements OnInit, OnDestroy { export class GameMasterDashboardComponent implements OnInit, OnDestroy {
middleComponentName;
allSubscriptions = new Subscription(); allSubscriptions = new Subscription();
leftSidenavExpanded = false; leftSidenavExpanded = false;
leftSidenavTextExpanded = false; leftSidenavTextExpanded = false;
leftSidenavItems: LeftNavItem[] = [
{
displayName: 'Spells',
iconName: 'ra ra-aura',
componentToDisplay: 'GameMasterSpellsTableComponent',
expanded: false,
},
];
rightSidenavExpanded = false; rightSidenavExpanded = false;
rightSidenavTextExpanded = false; rightSidenavTextExpanded = false;
@ -71,6 +82,14 @@ export class GameMasterDashboardComponent implements OnInit, OnDestroy {
); );
} }
ChangeMiddleComponent(componentName: string): void {
switch (componentName) {
case 'GameMasterSpellsTableComponent':
this.middleComponentName = GameMasterSpellsTableComponent;
break;
}
}
private SubscribeToEvents(): void { private SubscribeToEvents(): void {
this.signalRService.message.subscribe((message: string) => { this.signalRService.message.subscribe((message: string) => {
if ( if (

View File

@ -0,0 +1,38 @@
table {
width: 100%;
background-color: initial;
}
mat-paginator{
background-color: initial;
color: white;
}
th{
color: whitesmoke;
}
td{
color: whitesmoke;
}
::ng-deep .mat-select-arrow{
color: whitesmoke;
}
::ng-deep .mat-select-value {
color: white
}
.mat-sort-header-container{
color: whitesmoke !important;
}
.mat-form-field {
font-size: 14px;
width: 100%;
}
td, th {
width: 25%;
}

View File

@ -0,0 +1,43 @@
<mat-form-field>
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Mia" #input>
</mat-form-field>
<div class="mat-elevation-z8">
<table mat-table [dataSource]="dataSource" matSort>
<!-- ID Column -->
<ng-container matColumnDef="Name">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
<td mat-cell *matCellDef="let row"> {{row.name}} </td>
</ng-container>
<!-- Progress Column -->
<ng-container matColumnDef="Range">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Range </th>
<td mat-cell *matCellDef="let row"> {{row.range}}% </td>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="Level">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Level </th>
<td mat-cell *matCellDef="let row"> {{row.level}} </td>
</ng-container>
<!-- Color Column -->
<ng-container matColumnDef="School">
<th mat-header-cell *matHeaderCellDef mat-sort-header> School </th>
<td mat-cell *matCellDef="let row"> {{row.school}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<!-- Row shown when there is no matching data. -->
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4">No data matching the filter "{{input.value}}"</td>
</tr>
</table>
<mat-paginator [pageSizeOptions]="[5, 10, 25, 100]"></mat-paginator>
</div>

View File

@ -0,0 +1,48 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
export interface SpellData {
name: string;
range: string;
level: number;
school: string;
}
@Component({
selector: 'app-game-master-spells-table',
templateUrl: './game-master-spells-table.component.html',
styleUrls: ['./game-master-spells-table.component.css'],
})
export class GameMasterSpellsTableComponent implements OnInit {
displayedColumns: string[] = ['Name', 'Range', 'Level', 'School'];
dataSource: MatTableDataSource<SpellData>;
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@ViewChild(MatSort, { static: true }) sort: MatSort;
constructor() {
const users = Array.from({ length: 100 }, (_, k) => this.createSepll());
this.dataSource = new MatTableDataSource(users);
}
createSepll(): SpellData {
return { name: 'test', range: 'asd', level: 2, school: 'UAM!!!!' };
}
ngOnInit() {
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
}
applyFilter(event: Event) {
const filterValue = (event.target as HTMLInputElement).value;
this.dataSource.filter = filterValue.trim().toLowerCase();
if (this.dataSource.paginator) {
this.dataSource.paginator.firstPage();
}
}
}

View File

@ -0,0 +1,7 @@
export interface LeftNavItem {
displayName: string;
iconName: string;
componentToDisplay?: string;
expanded: boolean;
children?: LeftNavItem[];
}

View File

@ -1,6 +1,7 @@
{ {
"compileOnSave": false, "compileOnSave": false,
"compilerOptions": { "compilerOptions": {
"skipLibCheck": true,
"baseUrl": "./", "baseUrl": "./",
"module": "esnext", "module": "esnext",
"outDir": "./dist/out-tsc", "outDir": "./dist/out-tsc",

View File

@ -0,0 +1,42 @@
using Microsoft.AspNetCore.Mvc;
using SessionCompanion.Extensions.EitherType;
using SessionCompanion.Services.Interfaces;
using SessionCompanion.ViewModels.ApiResponses;
using SessionCompanion.ViewModels.OtherEquipmentViewModels;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace SessionCompanion.Controllers
{
[Route("api/otherEquipment")]
[ApiController]
public class OtherEquipmentController : Controller
{
private readonly IOtherEquipmentService _service;
public OtherEquipmentController(IOtherEquipmentService service) => _service = service;
/// <summary>
/// Metoda zwraca wszystkie dostępne inne przedmioty
/// </summary>
/// <returns>Lista wszystkich innych przedmiotów w bazie danych</returns>
[HttpGet("getAllOtherEquipment")]
public async Task<Either<List<OtherEquipmentViewModel>, ErrorResponse>> GetOtherEquipment()
{
try
{
var otherEq = _service.Get().ToList();
return otherEq;
}
catch (Exception e)
{
return new ErrorResponse()
{
StatusCode = 204,
Message = e.Message
};
}
}
}
}

View File

@ -31,6 +31,12 @@
<param name="characterId"> Id postaci </param> <param name="characterId"> Id postaci </param>
<returns> Listę wszystkich statystyk </returns> <returns> Listę wszystkich statystyk </returns>
</member> </member>
<member name="M:SessionCompanion.Controllers.OtherEquipmentController.GetOtherEquipment">
<summary>
Metoda zwraca wszystkie dostępne inne przedmioty
</summary>
<returns>Lista wszystkich innych przedmiotów w bazie danych</returns>
</member>
<member name="M:SessionCompanion.Controllers.CharacterController.GetCharacterBasicInfo(System.Int32)"> <member name="M:SessionCompanion.Controllers.CharacterController.GetCharacterBasicInfo(System.Int32)">
<summary> <summary>
Metoda zwraca podstawowe informacje dla danej postaci Metoda zwraca podstawowe informacje dla danej postaci
@ -59,12 +65,6 @@
</summary> </summary>
<returns>true jesli ktoś jest już zalogowany i false jeśli nie</returns> <returns>true jesli ktoś jest już zalogowany i false jeśli nie</returns>
</member> </member>
<member name="M:SessionCompanion.Controllers.WeaponController.GetWeapons">
<summary>
Metoda zwraca wszystkie dostępnasdasde bronie
</summary>
<returns>Lista wszystkich broni w bazie danych</returns>
</member>
<member name="F:SessionCompanion.Hubs.SessionHub.sessionHubData"> <member name="F:SessionCompanion.Hubs.SessionHub.sessionHubData">
<summary> <summary>
Klasa zawierająca wszystkie dane potrzebne w SignalR odnośnie aktualnej sesji Klasa zawierająca wszystkie dane potrzebne w SignalR odnośnie aktualnej sesji