feat: clean the dependence

package.json

@@ -12,30 +12,29 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^4.2.4",
-    "@angular/cdk": "^2.0.0-beta.12",
-    "@angular/common": "^4.4.6",
-    "@angular/compiler": "^4.2.4",
-    "@angular/core": "^4.3.6",
-    "@angular/forms": "^4.2.4",
-    "@angular/http": "^4.2.4",
-    "@angular/platform-browser": "^4.2.4",
-    "@angular/platform-browser-dynamic": "^4.2.4",
-    "@angular/router": "^4.2.4",
-    "angular2-layer": "^2.0.7",
-    "angular2-logger": "^0.6.0",
+    "@angular/animations": "5.2.0",
+    "@angular/cdk": "^5.1.0",
+    "@angular/common": "5.2.0",
+    "@angular/compiler": "5.2.0",
+    "@angular/core": "5.2.0",
+    "@angular/forms": "5.2.0",
+    "@angular/http": "5.2.0",
+    "@angular/platform-browser": "5.2.0",
+    "@angular/platform-browser-dynamic": "5.2.0",
+    "@angular/router": "5.2.0",
     "animate.css": "^3.5.2",
     "body-parser": "^1.18.2",
     "bootstrap": "^4.0.0-beta.3",
     "clipboard": "^1.7.1",
     "compass-mixins": "^0.12.10",
-    "core-js": "^2.4.1",
+    "core-js": "2.5.3",
     "directory-encoder": "^0.9.2",
     "filetree-css": "^1.0.0",
-    "font-awesome": "^4.7.0",
+    "font-awesome": "4.7.0",
     "handlebars": "^4.0.11",
     "inconsolata": "0.0.2",
-    "jquery": "^3.1.0",
+    "intl": "1.2.5",
+    "jquery": "3.2.1",
     "jquery-slimscroll": "^1.3.8",
     "jquery-sparkline": "^2.4.0",
     "jvectormap": "1.2.2",
@@ -48,14 +47,15 @@
     "ngx-bootstrap": "^1.6.6",
     "ngx-layer": "0.0.3",
     "ngx-logger": "^1.1.2",
+    "ngx-perfect-scrollbar": "5.2.0",
     "ngx-progressbar": "^2.1.1",
     "node": "^9.3.0",
     "npm": "^5.6.0",
     "npm-font-open-sans": "^1.1.0",
     "peity": "^3.2.1",
-    "popper.js": "^1.12.9",
+    "popper.js": "1.12.9",
     "roboto-fontface": "^0.8.0",
-    "rxjs": "^5.4.2",
+    "rxjs": "5.5.6",
     "sass-math": "^1.0.0",
     "socket.io": "^2.0.3",
     "socket.io-client": "^2.0.4",
@@ -64,28 +64,31 @@
     "tether": "^1.4.0",
     "uuid-js": "^0.7.5",
     "xterm": "^2.9.2",
-    "zone.js": "^0.8.14"
+    "zone.js": "0.8.20"
   },
   "devDependencies": {
+    "@angular-devkit/core": "0.0.28",
+    "@angular-devkit/schematics": "0.0.42",
     "@angular/cli": "^1.6.5",
-    "@angular/compiler-cli": "^4.2.4",
-    "@angular/language-service": "^4.2.4",
-    "@types/jasmine": "~2.5.53",
     "@types/jasminewd2": "~2.0.2",
-    "@types/node": "~6.0.60",
-    "codelyzer": "^4.0.1",
-    "jasmine-core": "~2.6.2",
-    "jasmine-spec-reporter": "~4.1.0",
-    "karma": "~1.7.0",
-    "karma-chrome-launcher": "~2.1.1",
-    "karma-cli": "~1.0.1",
-    "karma-coverage-istanbul-reporter": "^1.2.1",
-    "karma-jasmine": "~1.1.0",
-    "karma-jasmine-html-reporter": "^0.2.2",
     "node-sass": "^4.7.2",
-    "protractor": "~5.1.2",
-    "ts-node": "~3.2.0",
-    "tslint": "~5.3.2",
-    "typescript": "~2.3.3"
+    "@angular/compiler-cli": "5.2.0",
+    "@angular/language-service": "5.2.0",
+    "@types/jasmine": "2.8.4",
+    "@types/node": "9.3.0",
+    "codelyzer": "4.0.2",
+    "jasmine-core": "2.8.0",
+    "jasmine-spec-reporter": "4.2.1",
+    "karma": "2.0.0",
+    "karma-chrome-launcher": "2.2.0",
+    "karma-cli": "1.0.1",
+    "karma-coverage-istanbul-reporter": "1.3.3",
+    "karma-jasmine": "1.1.1",
+    "karma-jasmine-html-reporter": "0.2.2",
+    "protractor": "5.2.2",
+    "ts-node": "3.3.0",
+    "tslib": "1.8.1",
+    "tslint": "5.9.1",
+    "typescript": "2.4.2"
   }
 }

src/app/BasicPage/login/login.component.ts

@@ -6,7 +6,7 @@
  * @author   liuzheng <liuzheng712@gmail.com>
  */
 import {Component, OnInit} from '@angular/core';
-import {Logger} from 'angular2-logger/core';
+import {NGXLogger} from 'ngx-logger';
 import {AppService, HttpService} from '../../app.service';
 import {NgForm} from '@angular/forms';
 import {Router} from '@angular/router';
@@ -27,7 +27,7 @@ export class LoginComponent implements OnInit {
   constructor(private _appService: AppService,
               private _http: HttpService,
               private _router: Router,
-              private _logger: Logger) {
+              private _logger: NGXLogger) {
     this._logger.log('login.ts:LoginComponent');
     DataStore.NavShow = false;
   }

src/app/ControlPage/cleftbar/cleftbar.component.ts

@@ -8,7 +8,7 @@
  */
 
 import {Component, OnInit} from '@angular/core';
-import {Logger} from 'angular2-logger/core';
+import {NGXLogger} from 'ngx-logger';
 import {AppService, HttpService} from '../../app.service';
 import {SearchComponent} from '../search/search.component';
 import {DataStore} from '../../globals';
@@ -83,7 +83,7 @@ export class CleftbarComponent implements OnInit {
   constructor(private _appService: AppService,
               private _http: HttpService,
               private _search: SearchComponent,
-              private _logger: Logger,
+              private _logger: NGXLogger,
               private _menu: ElementServerMenuComponent) {
     this._logger.log('nav.ts:NavComponent');
     // this._appService.getnav()

src/app/ControlPage/search/search.component.ts

@@ -7,9 +7,8 @@
  */
 import {Component, OnChanges, Input, Pipe, PipeTransform} from '@angular/core';
 
-import {Logger} from 'angular2-logger/core';
-
 import {AppService, HttpService} from '../../app.service';
+import {NGXLogger} from 'ngx-logger';
 
 export let Q = '';
 
@@ -25,7 +24,7 @@ export class SearchComponent implements OnChanges {
 
   constructor(private _appService: AppService,
               private _http: HttpService,
-              private _logger: Logger) {
+              private _logger: NGXLogger) {
     this._logger.log('LeftbarComponent.ts:SearchBar');
   }
 

src/app/IndexPage/ileftbar/ileftbar.component.ts

@@ -6,9 +6,8 @@
  * @author   liuzheng <liuzheng712@gmail.com>
  */
 import {Component, OnInit} from '@angular/core';
-import {Logger} from 'angular2-logger/core';
-
 import {AppService} from '../../app.service';
+import {NGXLogger} from 'ngx-logger';
 
 @Component({
   selector: 'app-ileftbar',
@@ -18,7 +17,7 @@ import {AppService} from '../../app.service';
 export class IleftbarComponent implements OnInit {
 
   constructor(private _appService: AppService,
-              private _logger: Logger) {
+              private _logger:NGXLogger) {
     this._logger.log('nav.ts:NavComponent');
     // this._appService.getnav()
   }

src/app/app-routing.module.ts

@@ -24,7 +24,7 @@ const appRoutes: Routes = [
   {path: 'term/:token', component: TermPageComponent},
   {path: 'replay/:token', component: ReplayPageComponent},
   {path: 'monitor/:token', component: MonitorPageComponent},
-  {path: 'test', component: ElementServerMenuComponent},
+  {path: 'test', component: TermPageComponent},
   {path: '', component: ControlPageComponent},
   {path: '**', component: NotFoundComponent}
 ];

src/app/app.module.ts

@@ -12,7 +12,7 @@
 import {BrowserModule} from '@angular/platform-browser';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms'; // <-- NgModel lives here
-import {Logger, Options, Level as LoggerLevel} from 'angular2-logger/core';
+import {NGXLogger, LoggerConfig, NgxLoggerLevel as LoggerLevel} from 'ngx-logger';
 import {HttpModule} from '@angular/http';
 
 import {AppRoutingModule} from './app-routing.module';
@@ -55,6 +55,7 @@ import {NgProgressModule, NgProgressBrowserXhr} from 'ngx-progressbar';
 
 
 import {NgxLayerModule} from 'ngx-layer';
+import {TestPageComponent} from './test-page/test-page.component';
 
 @NgModule({
   imports: [
@@ -94,15 +95,16 @@ import {NgxLayerModule} from 'ngx-layer';
     MonitorPageComponent,
     LinuxComponent,
     WindowsComponent,
+    TestPageComponent,
   ],
   bootstrap: [AppComponent],
   providers: [
-    {provide: Options, useValue: {store: false, level: LoggerLevel.WARN}},
+    {provide: LoggerConfig, useValue: {level: LoggerLevel.WARN}},
     {provide: BrowserXhr, useClass: NgProgressBrowserXhr},
     AppService,
     HttpService,
     LayerService,
-    Logger,
+    NGXLogger,
   ]
 })
 export class AppModule {

src/app/app.service.ts

@@ -8,12 +8,11 @@
 import {Injectable, OnInit} from '@angular/core';
 import {Http, RequestOptionsArgs, Headers} from '@angular/http';
 import {Router} from '@angular/router';
-import {Cookie} from 'ng2-cookies/ng2-cookies';
-import {Logger} from 'angular2-logger/core';
+// import {Cookie} from 'ng2-cookies/ng2-cookies';
+import {NGXLogger} from 'ngx-logger';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/catch';
 import {DataStore, User, Browser} from './globals';
-import {NgLayer} from 'angular2-layer';
 declare function unescape(s: string): string;
 
 @Injectable()
@@ -95,25 +94,25 @@ export class AppService implements OnInit {
 
   constructor(private _http: HttpService,
               private _router: Router,
-              private _logger: Logger) {
-    if (Cookie.get('loglevel')) {
-      // 0.- Level.OFF
-      // 1.- Level.ERROR
-      // 2.- Level.WARN
-      // 3.- Level.INFO
-      // 4.- Level.DEBUG
-      // 5.- Level.LOG
-      this._logger.level = parseInt(Cookie.get('loglevel'), 10);
-      // this._logger.debug('Your debug stuff');
-      // this._logger.info('An info');
-      // this._logger.warn('Take care ');
-      // this._logger.error('Too late !');
-      // this._logger.log('log !');
-    } else {
-      Cookie.set('loglevel', '0', 99, '/', document.domain);
-      // this._logger.level = parseInt(Cookie.getCookie('loglevel'));
-      this._logger.level = 0;
-    }
+              private _logger: NGXLogger) {
+    // if (Cookie.get('loglevel')) {
+    //   // 0.- Level.OFF
+    //   // 1.- Level.ERROR
+    //   // 2.- Level.WARN
+    //   // 3.- Level.INFO
+    //   // 4.- Level.DEBUG
+    //   // 5.- Level.LOG
+    //   this._logger.level = parseInt(Cookie.get('loglevel'), 10);
+    //   // this._logger.debug('Your debug stuff');
+    //   // this._logger.info('An info');
+    //   // this._logger.warn('Take care ');
+    //   // this._logger.error('Too late !');
+    //   // this._logger.log('log !');
+    // } else {
+    //   Cookie.set('loglevel', '0', 99, '/', document.domain);
+    //   // this._logger.level = parseInt(Cookie.getCookie('loglevel'));
+    //   this._logger.level = 0;
+    // }
 
     // this.checklogin();
   }

src/app/elements/footer/footer.component.ts

@@ -7,7 +7,7 @@
  */
 import {Component, OnInit} from '@angular/core';
 import {AppService} from '../../app.service';
-import {Logger} from 'angular2-logger/core';
+import {NGXLogger} from 'ngx-logger';
 import {DataStore, User} from '../../globals';
 import {version} from '../../../environments/environment';
 
@@ -22,7 +22,7 @@ export class ElementFooterComponent implements OnInit {
   version = version;
 
   constructor(private _appService: AppService,
-              private _logger: Logger) {
+              private _logger: NGXLogger) {
     this._logger.log('nav.ts:NavComponent');
     // this._appService.getnav()
   }

src/app/elements/nav/nav.component.ts

@@ -6,7 +6,7 @@
  * @author   liuzheng <liuzheng712@gmail.com>
  */
 import {Component, OnInit} from '@angular/core';
-import {Logger} from 'angular2-logger/core';
+import {NGXLogger} from 'ngx-logger';
 
 import {AppService, HttpService} from '../../app.service';
 import {CleftbarComponent} from '../../ControlPage/cleftbar/cleftbar.component';
@@ -30,7 +30,7 @@ export class ElementNavComponent implements OnInit {
 
   constructor(private _appService: AppService,
               private _http: HttpService,
-              private _logger: Logger) {
+              private _logger: NGXLogger) {
     this._logger.log('nav.ts:NavComponent');
     this.getnav();
   }

src/app/replay-page/replay-page.component.ts

 import {Component, OnInit} from '@angular/core';
 import {ActivatedRoute, Params} from '@angular/router';
-import {Logger} from 'angular2-logger/core';
+import {NGXLogger} from 'ngx-logger';
 import {HttpService} from '../app.service';
 import {Video, DataStore} from '../globals';
 
@@ -14,7 +14,7 @@ export class ReplayPageComponent implements OnInit {
 
   constructor(private activatedRoute: ActivatedRoute,
               private _http: HttpService,
-              private _logger: Logger) {
+              private _logger: NGXLogger) {
     // this.video = {'type': 'none'};
     DataStore.NavShow = false;
 

src/app/test-page/test-page.component.html

+<p>
+  test-page works!
+</p>

src/app/test-page/test-page.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TestPageComponent } from './test-page.component';
+
+describe('TestPageComponent', () => {
+  let component: TestPageComponent;
+  let fixture: ComponentFixture<TestPageComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TestPageComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TestPageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/test-page/test-page.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-test-page',
+  templateUrl: './test-page.component.html',
+  styleUrls: ['./test-page.component.scss']
+})
+export class TestPageComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}