safety commit before system upgrade

src/frontend/package-lock.json

@@ -17366,9 +17366,9 @@
       }
     },
     "tslib": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.0.tgz",
-      "integrity": "sha512-f/qGG2tUkrISBlQZEjEqoZ3B2+npJjIf04H1wuAv9iA8i04Icp+61KRXxFdha22670NJopsZCIjhC3SnjPRKrQ=="
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz",
+      "integrity": "sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ=="
     },
     "tslint": {
       "version": "5.7.0",

src/frontend/package.json

@@ -74,7 +74,7 @@
     "rxjs-compat": "6.3.0",
     "socicon": "3.0.5",
     "tinymce": "4.5.7",
-    "tslib": "^1.9.0",
+    "tslib": "^1.10.0",
     "typeface-exo": "0.0.22",
     "web-animations-js": "github:angular/web-animations-js#release_pr208",
     "zone.js": "~0.9.1"

src/frontend/src/app/@theme/components/header/header.component.html

@@ -16,7 +16,7 @@
     <nb-action class="user-action">
       <nb-user [nbContextMenu]="userMenu"
                [onlyPicture]="false"
-               [name]="user?.name"
+               [name]="user?.username"
                [picture]="user?.picture">
       </nb-user>
     </nb-action>

src/frontend/src/app/@theme/components/header/header.component.ts

@@ -39,7 +39,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
 
   currentTheme = 'dark';
 
-  userMenu : NbMenuItem[] = [ { title: 'Profile' }, { title: 'Log out', url: '/auth/logout' } ];
+  userMenu : NbMenuItem[] = [ { title: 'Log out', link: '/auth/logout' } ];
 
   constructor(private sidebarService: NbSidebarService,
               private menuService: NbMenuService,
@@ -53,6 +53,8 @@ export class HeaderComponent implements OnInit, OnDestroy {
     this.currentTheme = this.themeService.currentTheme;
 
     this.user = this.loginService.getCurrentUser()
+    if(this.user)
+      this.userMenu.unshift({ title: 'Profile', link: '/frontcraft/user/'+this.user.username });
 
     /*
     this.userService.getUsers()

src/frontend/src/app/app-routing.module.ts

@@ -2,6 +2,7 @@ import { ExtraOptions, RouterModule, Routes } from '@angular/router';
 import { NgModule } from '@angular/core';
 
 const routes: Routes = [
+
   {
     path: 'auth',
     loadChildren: () => import('./frontcraft/auth/auth.module')

src/frontend/src/app/app.module.ts

@@ -20,7 +20,6 @@ import {
   NbToastrModule,
   NbWindowModule,
 } from '@nebular/theme';
-import { LoginApiService } from './frontcraft/services/login-api';
 
 @NgModule({
   declarations: [AppComponent],

src/frontend/src/app/frontcraft/auth/register/register.component.html

@@ -21,7 +21,7 @@
     <label class="label" for="input-username">Username:</label>
     <input nbInput
            fullWidth
-           [(ngModel)]="user.name"
+           [(ngModel)]="user.username"
            #email="ngModel"
            name="name"
            id="input-username"

src/frontend/src/app/frontcraft/auth/register/register.component.ts

@@ -52,6 +52,7 @@ export class RegisterComponent implements OnInit{
   }
 
   async onSubmit(){
+    const pw = this.user.pwhash
     this.user.pwhash = await hash(this.user.pwhash)
     const user = this.user
     this.user = {} as User
@@ -60,9 +61,25 @@ export class RegisterComponent implements OnInit{
 
     try{
       const usr = await this.loginApi.getUnprivilegedSocket().Authenticator.createUser(user)
-      
     }catch(e){
       alert("Error creating user"+e)
+      return
+    }
+
+    try{
+      await this.loginApi.login(user.username, pw)
+      await this.loginApi.getFeature('createCharacter').then(async feature => {
+        if(!feature) return
+        const specid = await this.loginApi.getUnprivilegedSocket().CharacterManager.getSpecId(char['class'], char['spec'])
+        await feature.createCharacter(this.loginApi.getAuth().token.value, {
+          charactername: char.name,
+          specid: specid,
+          userid: this.loginApi.getAuth().user.id!
+        })
+      })
+    }catch(e){
+      alert("Error creating character"+e)
+      return
     }
   }
 

src/frontend/src/app/frontcraft/pages/character/character.component.html

@@ -0,0 +1,10 @@
+<nb-card 
+status="control">
+    <nb-card-header [ngStyle]="{'color': color}" style="text-transform: capitalize;">
+        {{char.charactername}}
+    </nb-card-header>
+    <nb-card-body>
+        {{char.specname}} {{char.class}}<br />
+        Owned by <a [routerLink]="'/frontcraft/user/'+char.username"> {{char.username}} ({{char.rank}})</a>
+    </nb-card-body>
+</nb-card>

src/frontend/src/app/frontcraft/pages/character/character.component.ts

@@ -0,0 +1,34 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { LoginApiService } from '../../services/login-api';
+import { Spec, User, Character } from '../../../../../../backend/Types/Types';
+import { getClassColor } from '../../../../../../backend/Types/PlayerSpecs';
+
+@Component({
+  selector: 'character',
+  templateUrl: './character.component.html',
+})
+export class FrontcraftCharacterComponent implements OnInit{
+
+    char : (Character & User & Spec) = {} as any
+    color : string
+
+    constructor(
+      private login: LoginApiService,
+      private route: ActivatedRoute,
+      private router: Router,
+    ){}
+
+    async ngOnInit(){
+      const param = this.route.snapshot.paramMap.get('name');
+      this.login.getUnprivilegedSocket()      
+      .CharacterManager
+      .getCharacterByName(param)
+      .then((char) => {
+        if(char){
+          this.color = getClassColor(char.class)
+          this.char = char
+        }
+      })
+    }
+}

src/frontend/src/app/frontcraft/pages/dashboard/dashboard.component.html

@@ -1 +1,35 @@
-<strong> Dashboard </strong>
+<nb-card>
+    <nb-card-body>
+
+        <label class="search-label" for="search">Search:</label>
+        <input nbInput [nbFilterInput]="dataSource" id="search" class="search-input">
+
+        <table [nbTreeGrid]="dataSource" [nbSort]="dataSource" (sort)="updateSort($event)">
+
+            <tr nbTreeGridHeaderRow *nbTreeGridHeaderRowDef="allColumns"></tr>
+            <tr nbTreeGridRow *nbTreeGridRowDef="let row; columns: allColumns"></tr>
+
+            <ng-container [nbTreeGridColumnDef]="customColumn">
+                <th nbTreeGridHeaderCell [nbSortHeader]="getSortDirection(customColumn)" *nbTreeGridHeaderCellDef>
+                {{customColumn}}
+                </th>
+                <td nbTreeGridCell *nbTreeGridCellDef="let row">
+                    <nb-tree-grid-row-toggle
+                        *ngIf="row.children && row.children.length">
+                    </nb-tree-grid-row-toggle>
+                    
+                    {{row.data[customColumn]}}
+                </td>
+            </ng-container>
+
+            <ng-container *ngFor="let column of defaultColumns; let index = index"
+                            [nbTreeGridColumnDef]="column"
+                            [showOn]="getShowOn(index)">
+                <th nbTreeGridHeaderCell [nbSortHeader]="getSortDirection(column)" *nbTreeGridHeaderCellDef>
+                {{column}}
+                </th>
+                <td nbTreeGridCell *nbTreeGridCellDef="let row">{{row.data[column] || '-'}}</td>
+            </ng-container>
+        </table>
+    </nb-card-body>
+</nb-card>

src/frontend/src/app/frontcraft/pages/dashboard/dashboard.component.scss

@@ -0,0 +1,42 @@
+button[nbTreeGridRowToggle] {
+    background: transparent;
+    border: none;
+    padding: 0;
+  }
+  
+  .search-label {
+    display: block;
+  }
+  .search-input {
+    margin-bottom: 1rem;
+  }
+  
+  .nb-column-name {
+    width: 100%;
+  }
+  
+  @media screen and (min-width: 400px) {
+    .nb-column-name,
+    .nb-column-size {
+      width: 50%;
+    }
+  }
+  
+  @media screen and (min-width: 500px) {
+    .nb-column-name,
+    .nb-column-size,
+    .nb-column-kind {
+      width: 33.333%;
+    }
+  }
+  
+  @media screen and (min-width: 600px) {
+    .nb-column-name {
+      width: 31%;
+    }
+    .nb-column-size,
+    .nb-column-kind,
+    .nb-column-items {
+      width: 23%;
+    }
+  }

src/frontend/src/app/frontcraft/pages/dashboard/dashboard.component.ts

@@ -1,16 +1,63 @@
-import { Component, OnInit } from '@angular/core';
-import { LoginApiService } from '../../services/login-api';
+import { Component } from '@angular/core';
+import { NbSortDirection, NbSortRequest, NbTreeGridDataSourceBuilder, NbTreeGridDataSource } from '@nebular/theme';
+
+interface TreeNode<T> {
+  data: T;
+  children?: TreeNode<T>[];
+  expanded?: boolean;
+}
+
+interface Row {
+  name: string,
+  character: any,
+  SRC: any,
+}
+
+type TreeType = TreeNode<Row>
 
 @Component({
   selector: 'dashboard',
   templateUrl: './dashboard.component.html',
+  styleUrls: ['./tree-grid-shared.scss', './dashboard.component.scss'],
 })
-export class FrontcraftDashboardComponent implements OnInit{
+export class FrontcraftDashboardComponent{
+  customColumn = 'name';
+  defaultColumns = [ 'character', 'SRC'/*, 'Profile'*/ ];
+  allColumns = [ this.customColumn, ...this.defaultColumns ];
 
-    constructor(private loginApi : LoginApiService){}
+  dataSource: NbTreeGridDataSource<TreeType>;
 
-    ngOnInit(){
-        console.log(this.loginApi)
+  sortColumn: string;
+  sortDirection: NbSortDirection = NbSortDirection.NONE;
+
+  constructor(private dataSourceBuilder: NbTreeGridDataSourceBuilder<TreeType>) {
+    this.dataSource = this.dataSourceBuilder.create(this.data);
+  }
+
+  updateSort(sortRequest: NbSortRequest): void {
+    this.sortColumn = sortRequest.column;
+    this.sortDirection = sortRequest.direction;
+  }
+
+  getSortDirection(column: string): NbSortDirection {
+    if (this.sortColumn === column) {
+      return this.sortDirection;
     }
+    return NbSortDirection.NONE;
+  }
 
-}
+  private data: TreeType[] = [
+   {
+     data: {name: 'a', character: 2, SRC: 0},
+     children: [
+       {data: {name: 'a', character: 'Warrior', SRC: 'Arms'}}
+     ]
+   }
+  ];
+
+  getShowOn(index: number) {
+    const minWithForMultipleColumns = 400;
+    const nextColumnStep = 100;
+    return minWithForMultipleColumns + (nextColumnStep * index);
+  }
+}

src/frontend/src/app/frontcraft/pages/dashboard/tree-grid-shared.scss

@@ -0,0 +1,10 @@
+::ng-deep {
+    body {
+      min-height: 20rem;
+    }
+  
+    .nb-tree-grid-header-cell,
+    .nb-tree-grid-header-cell button {
+      text-transform: capitalize;
+    }
+  }

src/frontend/src/app/frontcraft/pages/pages-layout.component.ts

@@ -17,10 +17,19 @@ import { Router } from '@angular/router';
 export class PagesLayoutComponent implements OnInit{
   menu:NbMenuItem[] = [{
     icon: 'people-outline',
-    title: 'People'
+    title: 'People',
+    link: '/frontcraft/people'
   },{
     icon: 'clock-outline',
     title: 'Raids'
+  },{
+    icon: 'clock-outline',
+    title: 'character',
+    link: '/frontcraft/character/a'
+  },{
+    icon: 'clock-outline',
+    title: 'user',
+    link: '/frontcraft/user/a'
   }]
   
   constructor(

src/frontend/src/app/frontcraft/pages/pages-routing.module.ts

@@ -2,12 +2,27 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { FrontcraftDashboardComponent } from './dashboard/dashboard.component';
 import { PagesLayoutComponent } from './pages-layout.component';
+import { FrontcraftCharacterComponent } from './character/character.component';
+import { FrontcraftUserComponent } from './user/user.component';
+import { FrontcraftPeopleComponent } from './people/people.component';
 
 export const routes: Routes = [
     {
         path: '',
         component: PagesLayoutComponent,
         children: [
+            {
+                path: 'people',
+                component: FrontcraftPeopleComponent
+            },
+            {
+                path: 'user/:name',
+                component: FrontcraftUserComponent
+            },
+            {
+                path: 'character/:name',
+                component: FrontcraftCharacterComponent
+            },
             {
                 path: 'dashboard',
                 component: FrontcraftDashboardComponent,

src/frontend/src/app/frontcraft/pages/pages.module.ts

@@ -9,7 +9,8 @@ import {
   NbCheckboxModule,
   NbInputModule,
   NbMenuModule,
-  NbCardModule
+  NbCardModule,
+  NbTreeGridModule
 } from '@nebular/theme';
 import { MyAuthRoutingModule } from './pages-routing.module';
 import { FrontcraftDashboardComponent } from './dashboard/dashboard.component';
@@ -18,11 +19,15 @@ import { ThemeModule } from '../../@theme/theme.module';
 import { DashboardModule } from '../../demo_pages/dashboard/dashboard.module';
 import { ECommerceModule } from '../../demo_pages/e-commerce/e-commerce.module';
 import { MiscellaneousModule } from '../../demo_pages/miscellaneous/miscellaneous.module';
+import { FrontcraftCharacterComponent } from './character/character.component';
+import { FrontcraftUserComponent } from './user/user.component';
+import { FrontcraftPeopleComponent } from './people/people.component';
 
 
 @NgModule({
   imports: [
     MyAuthRoutingModule,
+    NbTreeGridModule,
     CommonModule,
     FormsModule,
     RouterModule,
@@ -39,6 +44,9 @@ import { MiscellaneousModule } from '../../demo_pages/miscellaneous/miscellaneou
     
   ],
   declarations: [
+    FrontcraftPeopleComponent,
+    FrontcraftUserComponent,
+    FrontcraftCharacterComponent,
     PagesLayoutComponent,
     FrontcraftDashboardComponent
   ],

src/frontend/src/app/frontcraft/pages/people/people.component.html

@@ -0,0 +1,36 @@
+<nb-card>
+    <nb-card-body>
+
+        <label class="search-label" for="search">Search:</label>
+        <input nbInput [nbFilterInput]="dataSource" id="search" class="search-input">
+
+        <table [nbTreeGrid]="dataSource" [nbSort]="dataSource" (sort)="updateSort($event)">
+
+            <tr nbTreeGridHeaderRow *nbTreeGridHeaderRowDef="allColumns"></tr>
+            <tr nbTreeGridRow *nbTreeGridRowDef="let row; columns: allColumns"></tr>
+
+            <ng-container [nbTreeGridColumnDef]="customColumn">
+                <th nbTreeGridHeaderCell [nbSortHeader]="getSortDirection(customColumn)" *nbTreeGridHeaderCellDef>
+                {{customColumn}}
+                </th>
+                <td nbTreeGridCell *nbTreeGridCellDef="let row">
+                    <nb-tree-grid-row-toggle
+                        *ngIf="row.children && row.children.length">
+                    </nb-tree-grid-row-toggle>
+                    <span style="text-transform: capitalize;">
+                        {{row.data[customColumn]}}
+                    </span>
+                </td>
+            </ng-container>
+
+            <ng-container *ngFor="let column of defaultColumns; let index = index"
+                            [nbTreeGridColumnDef]="column"
+                            [showOn]="getShowOn(index)">
+                <th nbTreeGridHeaderCell [nbSortHeader]="getSortDirection(column)" *nbTreeGridHeaderCellDef>
+                {{column}}
+                </th>
+                <td nbTreeGridCell *nbTreeGridCellDef="let row">{{row.data[column] || '-'}}</td>
+            </ng-container>
+        </table>
+    </nb-card-body>
+</nb-card>

src/frontend/src/app/frontcraft/pages/people/people.component.scss

@@ -0,0 +1,42 @@
+button[nbTreeGridRowToggle] {
+    background: transparent;
+    border: none;
+    padding: 0;
+  }
+  
+  .search-label {
+    display: block;
+  }
+  .search-input {
+    margin-bottom: 1rem;
+  }
+  
+  .nb-column-name {
+    width: 100%;
+  }
+  
+  @media screen and (min-width: 400px) {
+    .nb-column-name,
+    .nb-column-size {
+      width: 50%;
+    }
+  }
+  
+  @media screen and (min-width: 500px) {
+    .nb-column-name,
+    .nb-column-size,
+    .nb-column-kind {
+      width: 33.333%;
+    }
+  }
+  
+  @media screen and (min-width: 600px) {
+    .nb-column-name {
+      width: 31%;
+    }
+    .nb-column-size,
+    .nb-column-kind,
+    .nb-column-items {
+      width: 23%;
+    }
+  }

src/frontend/src/app/frontcraft/pages/people/people.component.ts

@@ -0,0 +1,64 @@
+import { Component } from '@angular/core';
+import { NbSortDirection, NbSortRequest, NbTreeGridDataSourceBuilder, NbTreeGridDataSource } from '@nebular/theme';
+
+interface TreeNode<T> {
+  data: T;
+  children?: TreeNode<T>[];
+  expanded?: boolean;
+}
+
+interface Row {
+  name: string,
+  character: any,
+  SRC: any,
+  kind: 'Character' | 'Account'
+}
+
+type TreeType = TreeNode<Row>
+
+@Component({
+  selector: 'people-component',
+  templateUrl: './people.component.html',
+  styleUrls: ['./tree-grid-shared.scss', './people.component.scss'],
+})
+export class FrontcraftPeopleComponent{
+  customColumn = 'name';
+  defaultColumns = [ 'character', 'SRC'/*, 'Profile'*/ ];
+  allColumns = [ this.customColumn, ...this.defaultColumns ];
+
+  dataSource: NbTreeGridDataSource<TreeType>;
+
+  sortColumn: string;
+  sortDirection: NbSortDirection = NbSortDirection.NONE;
+
+  constructor(private dataSourceBuilder: NbTreeGridDataSourceBuilder<TreeType>) {
+    this.dataSource = this.dataSourceBuilder.create(this.data);
+  }
+
+  updateSort(sortRequest: NbSortRequest): void {
+    this.sortColumn = sortRequest.column;
+    this.sortDirection = sortRequest.direction;
+  }
+
+  getSortDirection(column: string): NbSortDirection {
+    if (this.sortColumn === column) {
+      return this.sortDirection;
+    }
+    return NbSortDirection.NONE;
+  }
+
+  private data: TreeType[] = [
+   {
+     data: {name: 'a', character: 2, SRC: 0, kind: 'Account'},
+     children: [
+       {data: {name: 'a', character: 'Warrior', SRC: 'Arms', kind: 'Character'}}
+     ]
+   }
+  ];
+
+  getShowOn(index: number) {
+    const minWithForMultipleColumns = 400;
+    const nextColumnStep = 100;
+    return minWithForMultipleColumns + (nextColumnStep * index);
+  }
+}

src/frontend/src/app/frontcraft/pages/people/tree-grid-shared.scss

@@ -0,0 +1,10 @@
+::ng-deep {
+    body {
+      min-height: 20rem;
+    }
+  
+    .nb-tree-grid-header-cell,
+    .nb-tree-grid-header-cell button {
+      text-transform: capitalize;
+    }
+  }

src/frontend/src/app/frontcraft/pages/user/user.component.html

@@ -0,0 +1,24 @@
+
+
+<nb-card
+accent="info">
+    <nb-card-header>
+        <h2 style="text-transform: capitalize;">{{user.username}}</h2>
+    </nb-card-header>
+    <nb-card-body>
+      <nb-card
+      accent="control"
+      *ngFor="let char of characters">
+          <nb-card-header>
+              <h4>
+                  <a [ngStyle]="{'color': char.color}" style="text-transform: capitalize;" [routerLink]="'/frontcraft/character/'+char.charactername">
+                      {{char.charactername}}
+                  </a>
+              </h4>
+          </nb-card-header>
+          <nb-card-body>
+              {{char.specname}} {{char.class}}
+          </nb-card-body>
+      </nb-card>
+    </nb-card-body>
+</nb-card>

src/frontend/src/app/frontcraft/pages/user/user.component.ts

@@ -0,0 +1,38 @@
+import { Component, OnInit } from '@angular/core';
+import { LoginApiService } from '../../services/login-api';
+import { Router } from '@angular/router';
+import { User, Spec, Character } from '../../../../../../backend/Types/Types';
+import { getClassColor } from '../../../../../../backend/Types/PlayerSpecs';
+
+@Component({
+  selector: 'user-component',
+  templateUrl: './user.component.html',
+})
+export class FrontcraftUserComponent implements OnInit{
+
+  user:User = {} as any
+  characters : (Character & Spec)[] = []
+
+  constructor(
+    private router : Router,  
+    private loginApi : LoginApiService
+  ){}
+
+  ngOnInit(){
+    const auth = this.loginApi.getAuth()
+    if(!auth){
+      this.router.navigateByUrl('/auth/login')
+      return
+    }
+    this.user = auth.user
+    this.loginApi.getUnprivilegedSocket()
+    .CharacterManager
+    .getCharactersOfUser(this.user.username)
+    .then((characters) => {
+      characters.forEach(c => {
+        c['color'] = getClassColor(c.class)
+      })
+      this.characters = characters
+    })  
+  }
+}

src/frontend/src/app/frontcraft/services/login-api.ts

@@ -31,18 +31,20 @@ export class LoginApiService{
            
             const authSock = await sock.connect<RPCSocket & SomeOf<FrontcraftFeatureIfc>>(auth.token.value)
 
-            sock.hook('kick', () => this.logout())
+            sock.hook('kick', () => {
+                console.log("I got kicked");
+            })
             sock.hook('getUserData', () => auth)
             sock.hook('navigate', (where:string) => {
-                this.ngZone.run(() => {
-                    this.injector.get(Router).navigateByUrl(where);
+                this.ngZone.run( () => {
+                    this.injector.get(Router).navigateByUrl('/')
                 })
             })
             sock.on('error', (e) => {
-                console.log('Socket error',  e)
-                this.logout()
+                sock.destroy();
+                
             })
-
+            
             this.auth = auth
             this.privSocket = authSock
             this.cookieSvc.set('token', JSON.stringify(auth))
@@ -62,7 +64,9 @@ export class LoginApiService{
         }
     }
 
-    getCurrentUser = () : User | undefined => this.auth?this.auth.user:undefined
+    getCurrentUser = () : User | undefined => {
+        return this.auth?this.auth.user:undefined
+    }
 
     login = async (username: string, password: string) : Promise<RPCSocket & SomeOf<FrontcraftFeatureIfc>> => {
         const pwHash = await hash(password)
@@ -78,7 +82,7 @@ export class LoginApiService{
 
     logout = async () => {
         this.cookieSvc.set('token', undefined)
-        if(this.auth) await this.socket.Authenticator.logout(this.auth.user.name, this.auth.token.value)
+        if(this.auth) await this.socket.Authenticator.logout(this.auth.user.username, this.auth.token.value)
         if(this.privSocket) this.privSocket.destroy()
         this.privSocket = null
         this.auth  = null