[Update] 更新replay

src/app/elements/ssh-term/ssh-term.component.html

-<elements-term [term]="term"></elements-term>
+<elements-term (winSizeChangeTrigger)="changeWinSize($event)" [term]="term"></elements-term>

src/app/elements/ssh-term/ssh-term.component.ts

@@ -38,6 +38,10 @@ export class ElementSshTermComponent implements OnInit, AfterViewInit {
     this.joinRoom();
   }
 
+  changeWinSize(size: Array<number>) {
+    ws.emit('resize', {'cols': size[0], 'rows': size[1]});
+  }
+
   joinRoom() {
     NavList.List[this.index].Term = this.term;
     if (this.host) {

src/app/elements/term/term.component.ts

-import {AfterViewInit, Component, Input, OnInit, ViewChild} from '@angular/core';
+import {AfterViewInit, Component, Input, Output, OnInit, ViewChild, EventEmitter} from '@angular/core';
 import {ElementRef} from '@angular/core';
 import * as Terminal from 'xterm/dist/xterm';
 // import { Terminal } from 'xterm';
@@ -16,6 +16,7 @@ import 'rxjs/add/operator/distinctUntilChanged';
 export class ElementTermComponent implements OnInit, AfterViewInit {
   @ViewChild('term') el: ElementRef;
   @Input() term: Terminal;
+  @Output() winSizeChangeTrigger = new EventEmitter<Array<number>>();
   col = 80;
   row = 24;
   winSizeChange$: Observable<any>;
@@ -34,7 +35,7 @@ export class ElementTermComponent implements OnInit, AfterViewInit {
 
   ngAfterViewInit() {
     this.term.open(this.el.nativeElement, true);
-    $(window).resize();
+    this.resizeTerm();
   }
 
   resizeTerm() {
@@ -51,6 +52,7 @@ export class ElementTermComponent implements OnInit, AfterViewInit {
     console.log('Mark size: ', markerElement.width(), '*', markerElement.height());
     console.log('Resize term size: ', this.col, this.row);
     this.term.resize(this.col, this.row);
+    this.winSizeChangeTrigger.emit([this.col, this.row]);
   }
 
   active() {

src/app/pages/replay/json/json.component.html

@@ -33,5 +33,5 @@
   {{time | utcDate | date:"HH:mm:ss"}}
 </div>
 
-<elements-term></elements-term>
+<elements-term [term]="term"></elements-term>
 <!--<asciinema-player></asciinema-player>-->

src/app/pages/replay/json/json.component.ts

 import {Component, Input, OnInit} from '@angular/core';
-import {term} from '../../../globals';
+import * as Terminal from 'xterm/dist/xterm';
 import {HttpService, LogService} from '../../../app.service';
 import {Replay} from '../replay.model';
 
@@ -18,14 +18,14 @@ export class JsonComponent implements OnInit {
   timer: any;
   pos = 0;
   scrubber: number;
+  term: Terminal;
 
   @Input() replay: Replay;
 
-  constructor(private _http: HttpService,
-              private _logger: LogService) {
-  }
+  constructor(private _http: HttpService) {}
 
   ngOnInit() {
+    this.term = new Terminal();
     if (this.replay.src !== 'READY') {
       console.log('SRC', this.replay.src);
       this._http.get_replay_data(this.replay.src)
@@ -40,7 +40,7 @@ export class JsonComponent implements OnInit {
           },
           err => {
             alert('无法下载');
-            this._logger.error(err);
+            console.log(err);
           }
         );
     }
@@ -67,7 +67,7 @@ export class JsonComponent implements OnInit {
 
   restart() {
     clearInterval(this.timer);
-    term.term.reset();
+    this.term.reset();
     this.time = 1;
     this.pos = 0;
     this.toggle = true;
@@ -93,7 +93,7 @@ export class JsonComponent implements OnInit {
     // document.getElementById('beforeScrubberText').innerHTML = this.buildTimeString(this.time);
     for (; that.pos < this.replay.timelist.length; that.pos++) {
       if (this.replay.timelist[that.pos] * 1000 <= that.time) {
-        term.term.write(this.replay.json[this.replay.timelist[that.pos].toString()]);
+        this.term.write(this.replay.json[this.replay.timelist[that.pos].toString()]);
       } else {
         break;
       }
@@ -118,11 +118,11 @@ export class JsonComponent implements OnInit {
 
   rununil() {
     this.pos = 0;
-    term.term.reset();
+    this.term.reset();
     this.toggle = false;
     for (; this.pos < this.replay.timelist.length; this.pos++) {
       if (this.replay.timelist[this.pos] * 1000 <= this.setPercent / 100 * this.replay.totalTime) {
-        term.term.write(this.replay.json[this.replay.timelist[this.pos].toString()]);
+        this.term.term.write(this.replay.json[this.replay.timelist[this.pos].toString()]);
       } else {
         break;
       }