rework login and make register

src/frontend/package-lock.json

@@ -14269,9 +14269,9 @@
       "integrity": "sha512-ZYzRkETgBrdEGzL5JSKimvjI2CX7ioyZCkX2BpcfyjqI+079W0wHAyj5W4rIZMcDSOHgLZtgz1IdDi/vU77KEQ=="
     },
     "rpclibrary": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/rpclibrary/-/rpclibrary-1.4.2.tgz",
-      "integrity": "sha512-IFigD+65a9MM+1AgEH5nurUzCyMg9hawqtnOA67/PtTGP5GsnWxaFESKl03k8L/PQ8ptZkWcub/63bfxkrwyMw==",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/rpclibrary/-/rpclibrary-1.5.1.tgz",
+      "integrity": "sha512-EN6wlifkFmEQrHhtbalS0i90ZBNbLNFcrQ8hTrcJLBuNMFab49R8i5fruoDLDJM88iPcx6eWccI6zLHK7Qkl2A==",
       "requires": {
         "bsock": "^0.1.9",
         "http": "0.0.0",
@@ -14279,9 +14279,9 @@
       },
       "dependencies": {
         "uuid": {
-          "version": "3.3.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.3.3.tgz",
-          "integrity": "sha512-pW0No1RGHgzlpHJO1nsVrHKpOEIxkGg1xB+v0ZmdNH5OAeAwzAVrCnI2/6Mtx+Uys6iaylxa+D3g4j63IKKjSQ=="
+          "version": "3.4.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz",
+          "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A=="
         }
       }
     },

src/frontend/package.json

@@ -69,7 +69,7 @@
     "normalize.css": "6.0.0",
     "pace-js": "1.0.2",
     "roboto-fontface": "0.8.0",
-    "rpclibrary": "^1.4.2",
+    "rpclibrary": "^1.5.1",
     "rxjs": "6.5.2",
     "rxjs-compat": "6.3.0",
     "socicon": "3.0.5",

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

@@ -4,9 +4,9 @@ import { Component } from '@angular/core';
   selector: 'ngx-footer',
   styleUrls: ['./footer.component.scss'],
   template: `
-    <span class="created-by">Created with <i class="fa fa-gamepad"></i> by <b><a href="https://frontcraft.me" target="_blank">FrontCraft</a></b></span>
+    <span class="created-by">Created with <i class="fa fa-gamepad"></i> by <b><a href="https://gitea.nitowa.xyz/explore/repos" target="_blank">nitowa.xyz</a></b></span>
     <div class="socials">
-      <a href="http://www.versioncontrol.me/" target="_blank" class="ion ion-social-github"></a>
+      <a href="https://gitea.nitowa.xyz/" target="_blank" class="ion ion-social-github"></a>
     </div>
   `,
 })

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

@@ -10,10 +10,7 @@
 <div class="header-container">
   <nb-actions size="small">
 
-    <nb-action class="control-item">
-      <nb-search type="rotate-layout"></nb-search>
-    </nb-action>
-    <nb-action class="control-item" icon="email-outline"></nb-action>
+    <nb-action class="control-item" icon="message-square-outline"></nb-action>
     <nb-action class="control-item" icon="bell-outline"></nb-action>
 
     <nb-action class="user-action">

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

@@ -1,5 +1,5 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
-import { NbMediaBreakpointsService, NbMenuService, NbSidebarService, NbThemeService } from '@nebular/theme';
+import { NbMediaBreakpointsService, NbMenuService, NbSidebarService, NbThemeService, NbContextMenuComponent, NbMenuItem } from '@nebular/theme';
 
 import { LayoutService } from '../../../@core/utils';
 import { map, takeUntil } from 'rxjs/operators';
@@ -39,14 +39,14 @@ export class HeaderComponent implements OnInit, OnDestroy {
 
   currentTheme = 'dark';
 
-  userMenu = [ { title: 'Profile' }, { title: 'Log out' } ];
+  userMenu : NbMenuItem[] = [ { title: 'Profile' }, { title: 'Log out', url: '/auth/logout' } ];
 
   constructor(private sidebarService: NbSidebarService,
               private menuService: NbMenuService,
               private themeService: NbThemeService,
               private layoutService: LayoutService,
               private breakpointService: NbMediaBreakpointsService,
-              private loginService: LoginApiService
+              private loginService: LoginApiService,
              ) {}
 
   ngOnInit() {
@@ -92,6 +92,10 @@ export class HeaderComponent implements OnInit, OnDestroy {
     return false;
   }
 
+  logout() {
+    this.loginService.logout()
+  }
+
   navigateHome() {
     this.menuService.navigateHome();
     return false;

src/frontend/src/app/@theme/layouts/index.ts

@@ -1,3 +1,4 @@
 export * from './one-column/one-column.layout';
 export * from './two-columns/two-columns.layout';
 export * from './three-columns/three-columns.layout';
+export * from './one-column-no-sidebar/one-column.layout';

src/frontend/src/app/@theme/layouts/one-column-no-sidebar/one-column.layout.scss

@@ -0,0 +1,9 @@
+@import '../../styles/themes';
+@import '~bootstrap/scss/mixins/breakpoints';
+@import '~@nebular/theme/styles/global/breakpoints';
+
+@include nb-install-component() {
+  .menu-sidebar ::ng-deep .scrollable {
+    padding-top: nb-theme(layout-padding-top);
+  }
+}

src/frontend/src/app/@theme/layouts/one-column-no-sidebar/one-column.layout.ts

@@ -0,0 +1,19 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'ngx-one-column-no-sidebar-layout',
+  styleUrls: ['./one-column.layout.scss'],
+  template: `
+    <nb-layout windowMode>
+ 
+      <nb-layout-column>
+        <ng-content select="router-outlet"></ng-content>
+      </nb-layout-column>
+
+      <nb-layout-footer fixed>
+        <ngx-footer></ngx-footer>
+      </nb-layout-footer>
+    </nb-layout>
+  `,
+})
+export class OneColumnNoSidebarLayoutComponent {}

src/frontend/src/app/@theme/theme.module.ts

@@ -33,6 +33,7 @@ import {
   OneColumnLayoutComponent,
   ThreeColumnsLayoutComponent,
   TwoColumnsLayoutComponent,
+  OneColumnNoSidebarLayoutComponent,
 } from './layouts';
 import { DEFAULT_THEME } from './styles/theme.default';
 import { COSMIC_THEME } from './styles/theme.cosmic';
@@ -61,6 +62,7 @@ const COMPONENTS = [
   OneColumnLayoutComponent,
   ThreeColumnsLayoutComponent,
   TwoColumnsLayoutComponent,
+  OneColumnNoSidebarLayoutComponent
 ];
 const PIPES = [
   CapitalizePipe,

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

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

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

@@ -20,6 +20,7 @@ import {
   NbToastrModule,
   NbWindowModule,
 } from '@nebular/theme';
+import { LoginApiService } from './frontcraft/services/login-api';
 
 @NgModule({
   declarations: [AppComponent],
@@ -28,9 +29,7 @@ import {
     BrowserAnimationsModule,
     HttpClientModule,
     AppRoutingModule,
-
     ThemeModule.forRoot(),
-
     NbSidebarModule.forRoot(),
     NbMenuModule.forRoot(),
     NbDatepickerModule.forRoot(),
@@ -43,6 +42,9 @@ import {
     CoreModule.forRoot(),
   ],
   bootstrap: [AppComponent],
+  providers: [
+    
+  ]
 })
 export class AppModule {
 }

src/frontend/src/app/demo_pages/pages-menu.ts

@@ -1,4 +1,3 @@
 import { NbMenuItem } from '@nebular/theme';
 
-export const MENU_ITEMS: NbMenuItem[] = [
-];
+export const MENU_ITEMS: NbMenuItem[] = [];

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

@@ -3,6 +3,7 @@ import { NgModule } from '@angular/core';
 
 import { PagesComponent } from './pages.component';
 import { NotFoundComponent } from './miscellaneous/not-found/not-found.component';
+import { AuthComponent } from '../frontcraft/auth/auth-layout.component';
 
 const routes: Routes = [{
   path: '',

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

@@ -1,13 +1,22 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { LoginApiService } from '../services/login-api';
+import { Router } from '@angular/router';
 
 @Component({
   selector: 'auth-layout',
   template: `
-    <ngx-one-column-layout>
-        <router-outlet></router-outlet>
-    </ngx-one-column-layout>
+    <ngx-one-column-no-sidebar-layout>
+      <router-outlet></router-outlet>
+    </ngx-one-column-no-sidebar-layout>
   `,
 })
-export class AuthComponent {
-    
+
+export class AuthComponent implements OnInit{
+  constructor(
+    private loginSvc : LoginApiService,
+    private router: Router  
+  ){}
+
+  ngOnInit(){
+  }
 }

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

@@ -2,12 +2,22 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { MyLoginComponent } from './login/login.component';
 import { AuthComponent } from './auth-layout.component';
+import { LogoutComponent } from './logout/logout.component';
+import { RegisterComponent } from './register/register.component';
 
 export const routes: Routes = [
     {
         path: '',
         component: AuthComponent,
         children: [
+            {
+                path: 'register',
+                component: RegisterComponent
+            },
+            {
+                path: 'logout',
+                component: LogoutComponent,
+            },
             {
                 path: '**',
                 component: MyLoginComponent,

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

@@ -8,7 +8,9 @@ import {
   NbButtonModule,
   NbCheckboxModule,
   NbInputModule,
-  NbMenuModule
+  NbMenuModule,
+  NbCardModule,
+  NbSelectModule
 } from '@nebular/theme';
 import { MyAuthRoutingModule } from './auth-routing.module';
 import { MyLoginComponent } from './login/login.component';
@@ -17,6 +19,8 @@ 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 { LogoutComponent } from './logout/logout.component';
+import { RegisterComponent } from './register/register.component';
 
 
 @NgModule({
@@ -34,9 +38,12 @@ import { MiscellaneousModule } from '../../demo_pages/miscellaneous/miscellaneou
     DashboardModule,
     ECommerceModule,
     MiscellaneousModule,
-
+    NbCardModule,
+    NbSelectModule
   ],
   declarations: [
+    RegisterComponent,
+    LogoutComponent,
     AuthComponent,
     MyLoginComponent
   ],

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

@@ -1,19 +1,4 @@
 <h1 id="title" class="title">Login</h1>
-<p class="sub-title">Hello! Log in with your email.</p>
-
-<nb-alert *ngIf="showMessages.error && errors?.length && !submitted" outline="danger" role="alert">
-  <p class="alert-title"><b>Oh snap!</b></p>
-  <ul class="alert-message-list">
-    <li *ngFor="let error of errors" class="alert-message">{{ error }}</li>
-  </ul>
-</nb-alert>
-
-<nb-alert *ngIf="showMessages.success && messages?.length && !submitted" outline="success" role="alert">
-  <p class="alert-title"><b>Hooray!</b></p>
-  <ul class="alert-message-list">
-    <li *ngFor="let message of messages" class="alert-message">{{ message }}</li>
-  </ul>
-</nb-alert>
 
 <form (ngSubmit)="login()" #form="ngForm" aria-labelledby="title">
 
@@ -21,25 +6,16 @@
     <label class="label" for="input-email">Email address:</label>
     <input nbInput
            fullWidth
-           [(ngModel)]="user.email"
+           [(ngModel)]="user.name"
            #email="ngModel"
-           name="email"
+           name="name"
            id="input-email"
-           pattern=".+@.+\..+"
-           placeholder="Email address"
+           pattern=".+"
+           placeholder="Username"
            fieldSize="giant"
            autofocus
-           [status]="email.dirty ? (email.invalid  ? 'danger' : 'success') : ''"
-           [required]="true"
-           [attr.aria-invalid]="email.invalid && email.touched ? true : null">
-    <ng-container *ngIf="email.invalid && email.touched">
-      <p class="error-message" *ngIf="email.errors?.required">
-        Email is required!
-      </p>
-      <p class="error-message" *ngIf="email.errors?.pattern">
-        Email should be the real one!
-      </p>
-    </ng-container>
+           [required]="true">
+
   </div>
 
   <div class="form-control-group">
@@ -55,20 +31,9 @@
            fieldSize="giant"
            [status]="password.dirty ? (password.invalid  ? 'danger' : 'success') : ''"
            [required]="true"
-           [minlength]="6"
+           [minlength]="1"
            [maxlength]="15"
            [attr.aria-invalid]="password.invalid && password.touched ? true : null">
-    <ng-container *ngIf="password.invalid && password.touched ">
-      <p class="error-message" *ngIf="password.errors?.required">
-        Password is required!
-      </p>
-      <p class="error-message" *ngIf="password.errors?.minlength || password.errors?.maxlength">
-        Password should contains
-        from {{ 6 }}
-        to {{ 15 }}
-        characters
-      </p>
-    </ng-container>
   </div>
 
   <div class="form-control-group accept-group">
@@ -88,5 +53,5 @@
 
 
 <section class="another-action" aria-label="Register">
-  Don't have an account? <a class="text-link" routerLink="../register">Register</a>
-</section>
+  Don't have an account? <a class="text-link" routerLink="/auth/register">Register</a>
+</section>

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

@@ -25,7 +25,14 @@ export class MyLoginComponent implements OnInit{
   ){}
 
   ngOnInit(){
-      console.log(this.router)
+    this.loginApi.checkLogin().then(loggedin => {
+      if(loggedin){
+        this.router.navigateByUrl("/")
+      }
+    });
   }
 
+  login(){
+    this.loginApi.login(this.user.name, this.user.password)
+  }
 }

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

@@ -0,0 +1 @@
+You will be redirected shortly. If not click here <a href="/auth/login">click</a>

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

@@ -0,0 +1,19 @@
+import { Component, OnInit } from '@angular/core';
+import { LoginApiService } from '../../services/login-api';
+import { Router } from '@angular/router';
+
+@Component({
+  selector: 'mylogout',
+  templateUrl: './logout.component.html',
+})
+export class LogoutComponent implements OnInit{
+
+  constructor(
+    private loginApi : LoginApiService
+  ){}
+
+  ngOnInit(){
+    this.loginApi.logout()
+  }
+
+}

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

@@ -0,0 +1,89 @@
+<h1 id="title" class="title">Account application</h1>
+
+<form (ngSubmit)="register()" #form="ngForm" aria-labelledby="title">
+
+  <div class="form-control-group">
+    <label class="label" for="input-email">Email address:</label>
+    <input nbInput
+           fullWidth
+           [(ngModel)]="user.email"
+           #email="ngModel"
+           name="name"
+           id="input-email"
+           pattern=".+"
+           placeholder="Email Address"
+           fieldSize="giant"
+           autofocus
+           [required]="true">
+  </div>
+
+  <div class="form-control-group">
+    <label class="label" for="input-username">Username:</label>
+    <input nbInput
+           fullWidth
+           [(ngModel)]="user.name"
+           #email="ngModel"
+           name="name"
+           id="input-username"
+           pattern=".+"
+           placeholder="Username"
+           fieldSize="giant"
+           autofocus
+           [required]="true">
+  </div>
+
+  <div class="form-control-group">
+    <label class="label" for="input-password">Password:</label>
+    <input nbInput
+           fullWidth
+           [(ngModel)]="user.password"
+           #password="ngModel"
+           name="password"
+           type="password"
+           id="input-password"
+           placeholder="Password"
+           fieldSize="giant"
+           [status]="password.dirty ? (password.invalid  ? 'danger' : 'success') : ''"
+           [required]="true"
+           [minlength]="1"
+           [maxlength]="15"
+           [attr.aria-invalid]="password.invalid && password.touched ? true : null">
+  </div>
+
+  <div class="form-control-group accept-group">
+    <nb-checkbox name="rememberMe" [(ngModel)]="user.rememberMe" *ngIf="rememberMe">Remember me</nb-checkbox>
+  </div>
+
+  <nb-card>
+    <nb-card-body>
+      <nb-checkbox [(ngModel)]="showApplication" name="amMember" #checkbox>I am already a member</nb-checkbox>
+      <br />
+      <span *ngIf="showApplication">
+        And my main is &nbsp; <input name="preMember" nbInput> with rank <nb-select placeholder="Rank">
+          <nb-option *ngFor="let rank of ranks" [value]=rank >{{rank}}</nb-option>
+          
+        </nb-select>
+      </span>
+      <span *ngIf="!showApplication">Hello my name is &nbsp; <input name="charName" nbInput>
+        I am playing a level 60  <input name="charName" placeholder="Spec + Class" nbInput> and I would like to join tranquil because
+        <textarea nbInput fullWidth placeholder="reason" style="min-height: 400px"></textarea>
+
+      </span>
+
+    </nb-card-body>
+  </nb-card>
+
+  <button nbButton
+          fullWidth
+          status="primary"
+          size="giant"
+          [disabled]="submitted || !form.valid"
+          [class.btn-pulse]="submitted">
+    Log In
+  </button>
+</form>
+
+
+<section class="another-action" aria-label="Register">
+  Back to <a class="text-link" routerLink="auth/login">Login</a>
+</section>

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

@@ -0,0 +1,32 @@
+import { Component, OnInit } from '@angular/core';
+import { LoginApiService } from '../../services/login-api';
+import { Router } from '@angular/router';
+import { _Rank } from '../../../../../../backend/Types/Types'
+
+@Component({
+  selector: 'register',
+  templateUrl: './register.component.html',
+})
+export class RegisterComponent implements OnInit{
+
+  user: any = {};
+  showApplication = false
+  ranks = _Rank
+
+  constructor(
+    private router : Router,  
+    private loginApi : LoginApiService
+  ){}
+
+  ngOnInit(){
+    this.loginApi.checkLogin().then(loggedin => {
+      if(loggedin){
+        this.router.navigateByUrl("/")
+      }
+    });
+  }
+
+  login(){
+    this.loginApi.login(this.user.name, this.user.password)
+  }
+}

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

@@ -1,8 +1,10 @@
-import { Component } from '@angular/core';
+import { Component, AfterContentChecked, OnInit } from '@angular/core';
 import { NbMenuItem } from '@nebular/theme';
+import { LoginApiService } from '../services/login-api';
+import { Router } from '@angular/router';
 
 @Component({
-  selector: 'auth-layout',
+  selector: 'page-layout',
   template: `
 
     <ngx-one-column-layout>
@@ -12,12 +14,25 @@ import { NbMenuItem } from '@nebular/theme';
     </ngx-one-column-layout>
   `,
 })
-export class PagesLayoutComponent {
-    menu:NbMenuItem[] = [{
-      icon: 'cube-outline',
-      title: 'test'
-    },{
-      icon: 'globe-2-outline',
-      title: 'test2'
-    }]
+export class PagesLayoutComponent implements OnInit{
+  menu:NbMenuItem[] = [{
+    icon: 'people-outline',
+    title: 'People'
+  },{
+    icon: 'clock-outline',
+    title: 'Raids'
+  }]
+  
+  constructor(
+    private loginSvc : LoginApiService,
+    private router : Router
+  ){}
+
+  ngOnInit() : void {
+    this.loginSvc.checkLogin().then(loggedin => {
+      if(!loggedin){
+        this.router.navigateByUrl("/auth")
+      }
+    });
+  }
 }

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

@@ -8,7 +8,8 @@ import {
   NbButtonModule,
   NbCheckboxModule,
   NbInputModule,
-  NbMenuModule
+  NbMenuModule,
+  NbCardModule
 } from '@nebular/theme';
 import { MyAuthRoutingModule } from './pages-routing.module';
 import { FrontcraftDashboardComponent } from './dashboard/dashboard.component';
@@ -34,7 +35,8 @@ import { MiscellaneousModule } from '../../demo_pages/miscellaneous/miscellaneou
     DashboardModule,
     ECommerceModule,
     MiscellaneousModule,
-
+    NbCardModule,
+    
   ],
   declarations: [
     PagesLayoutComponent,

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

@@ -1,8 +1,9 @@
-import { Injectable } from "@angular/core";
+import { Injectable, Injector, NgZone } from "@angular/core";
 import {RPCSocket} from 'rpclibrary/js/src/Frontend'
 
 import { Token, Auth, User, _Class, FrontcraftFeatureIfc, SomeOf, FrontcraftIfc, } from '../../../../../backend/Types/Types'
 import { CookieService } from 'ngx-cookie-service';
+import { Router } from '@angular/router';
 
 @Injectable()
 export class LoginApiService{
@@ -11,93 +12,112 @@ export class LoginApiService{
     private privSocket: RPCSocket & SomeOf<FrontcraftFeatureIfc>
 
     constructor(
-        private cookieSvc : CookieService
+        private injector: Injector,
+        private cookieSvc : CookieService,
+        private ngZone : NgZone
     ){}
 
     getUnprivilegedSocket = () : RPCSocket & FrontcraftIfc => this.socket
 
     private getPrivilegedSocket = async (auth:Auth) : Promise<RPCSocket & SomeOf<FrontcraftFeatureIfc>> => {
         if(this.privSocket) return this.privSocket
-        if(auth.user.rank === 'Guest'){
-            return await RPCSocket.makeSocket<SomeOf<FrontcraftFeatureIfc>>(
-                20001,
+        if(auth == null) throw new Error("Bad Auth")
+
+        try{
+            const sock = new RPCSocket(
+                auth.port, 
                 window.location.hostname
             )
-        }
-        try{
-            const sock = await RPCSocket.makeSocket<SomeOf<FrontcraftFeatureIfc>>(
-                auth.port, 
-                window.location.hostname, 
-                auth.token.value
-            )
+           
+            const authSock = await sock.connect<RPCSocket & SomeOf<FrontcraftFeatureIfc>>(auth.token.value)
+
+            sock.hook('kick', () => this.logout())
+            sock.hook('getUserData', () => auth)
+            sock.hook('navigate', (where:string) => {
+                this.ngZone.run(() => {
+                    this.injector.get(Router).navigateByUrl(where);
+                })
+            })
+            sock.on('error', (e) => {
+                console.log('Socket error',  e)
+                this.logout()
+            })
 
-            //login success
             this.auth = auth
-            this.privSocket = sock
-            this.setCookie(auth.token)
-            return sock
+            this.privSocket = authSock
+            this.cookieSvc.set('token', JSON.stringify(auth))
+            return authSock
         }catch(e){ 
             //login failed
-            throw new Error('login failed')
+            throw new Error(e)
         }
     }
 
     getFeature = async <K extends keyof FrontcraftFeatureIfc>(feature : K) : Promise<void | FrontcraftFeatureIfc[K]> => {
-        const sock = await this.getPrivilegedSocket(this.auth)
-        if(sock[feature]) return <FrontcraftFeatureIfc[K]> sock[feature]
+        try{
+            const sock = await this.getPrivilegedSocket(this.auth)
+            if(sock[feature]) return <FrontcraftFeatureIfc[K]> sock[feature]
+        }catch(e){
+            return
+        }
     }
 
-    getCurrentUser = () : User => this.auth 
-                                ? this.auth.user 
-                                : { 
-                                    name: 'Guest', 
-                                    specid: 1, 
-                                    pwhash: '',
-                                    rank: 'Guest'
-                                }
+    getCurrentUser = () : User | undefined => this.auth?this.auth.user:undefined
 
-    authenticate = async (token : Token | string) : Promise<RPCSocket & SomeOf<FrontcraftFeatureIfc>> => {
-        const auth = await this.socket.Authenticator.authenticate(token)
-        return await this.getPrivilegedSocket(auth)
-    }
-
-    login = async (username: string, password: string) => {
+    login = async (username: string, password: string) : Promise<RPCSocket & SomeOf<FrontcraftFeatureIfc>> => {
         const buf = str2arraybuf(password)
         const pwHash = await crypto.subtle.digest('SHA-256', buf);
-        const token = await this.socket.Authenticator.login(username, buf2hex(pwHash))
-        return await this.authenticate(token)
+
+        const auth = await this.socket.Authenticator.login(username, buf2hex(pwHash))
+
+
+        if(!auth){ 
+            await this.logout()
+            throw new Error("Login failed")
+        }
+        const sock = await this.getPrivilegedSocket(auth)
+        return sock
     }
 
-    logout = () => {
-        this.cookieSvc.deleteAll()
-        this.auth  = null
+    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.privSocket) this.privSocket.destroy()
         this.privSocket = null
+        this.auth  = null
+        this.ngZone.run(() => {
+            this.injector.get(Router).navigate(['/auth']);
+        })
     }
 
-    private setCookie = (token: string | Token) => {
-        token = 'string' === typeof token? token : token.value 
-        this.cookieSvc.set('token', token)
-    }
 
-    private getCookie = () : string | Token | undefined => {
-        return this.cookieSvc.get('token')
-    }
-
-    initialize = async () : Promise<RPCSocket> => {
+    initialize = async () : Promise<any> => {
         const sock = await RPCSocket.makeSocket<FrontcraftIfc>(20000, window.location.hostname)
         this.socket = sock
-
-        const cookie = this.getCookie()
-        if(cookie) {
-            try{
-                return await this.authenticate(cookie)
-            }catch(e){
-                this.logout()
+        try{
+            const cookie = JSON.parse(this.cookieSvc.get('token'))
+            if(cookie != null) {
+                try{
+                    const auth = await sock.Authenticator.getAuth(cookie.token.value)
+                    if(!auth) return sock
+                    return await this.getPrivilegedSocket(auth)
+                }catch(e){
+                    await this.logout()
+                    return
+                }
             }
+        }catch(e){
         }
+    }
 
-        return sock
+    getAuth = () => this.auth
+
+    async checkLogin() : Promise<boolean>{
+        if(!this.auth) return false
+        const valid = await this.socket.Authenticator.checkToken(this.auth.token.value, this.auth.user.rank)
+        if(valid) return true
+        await this.logout()
+        return false
     }
 }