1import {Terminal} from 'xterm';
2import style from 'xterm/dist/xterm.css';
3import * as attach from 'xterm/lib/addons/attach/attach';
4import * as fit from 'xterm/lib/addons/fit/fit';
5var configJSON = require('../../../config.json');
6if (configJSON.keyType == 'VT100+') {
7  var vt100PlusKey = require('./vt100plus');
8}
9
10var customKeyHandlers = function(ev) {
11  if (configJSON.keyType == 'VT100+') {
12    return vt100PlusKey.customVT100PlusKey(ev, this);
13  }
14  return true;
15};
16
17function measureChar(term) {
18  var span = document.createElement('span');
19  var fontFamily = 'courier-new';
20  var fontSize = 15;
21  var rect;
22
23  span.textContent = 'W';
24  try {
25    fontFamily = term.getOption('fontFamily');
26    fontSize = term.getOption('fontSize');
27  } catch (err) {
28    console.log('get option failure');
29  }
30  span.style.fontFamily = fontFamily;
31  span.style.fontSize = fontSize + 'px';
32  document.body.appendChild(span);
33  rect = span.getBoundingClientRect();
34  document.body.removeChild(span);
35  return rect;
36}
37
38window.angular && (function(angular) {
39  'use strict';
40
41  angular.module('app.common.directives').directive('serialConsole', [
42    function() {
43      return {
44        'restrict': 'E',
45        'template': require('./serial-console.html'),
46        'scope': {'path': '=', 'showTabBtn': '=?'},
47        'controller': [
48          '$scope', '$window', 'dataService',
49          function($scope, $window, dataService) {
50            $scope.dataService = dataService;
51
52            // See https://github.com/xtermjs/xterm.js/ for available xterm
53            // options
54
55            Terminal.applyAddon(attach);  // Apply the `attach` addon
56            Terminal.applyAddon(fit);     // Apply the `fit` addon
57
58            var border = 10;
59            var term = new Terminal();
60            var terminal = document.getElementById('terminal');
61            var customConsole;
62            var charSize;
63            var termContainer;
64
65            term.open(terminal);
66            customConsole = configJSON.customConsoleDisplaySize;
67
68            if (customConsole != null) {
69              charSize = measureChar(term);
70              termContainer = document.getElementById('term-container');
71              if (termContainer != null) {
72                if (customConsole.width) {
73                  termContainer.style.width =
74                      (charSize.width * customConsole.width + border) + 'px';
75                }
76                if (customConsole.height) {
77                  terminal.style.height =
78                      (charSize.height * customConsole.height + border) + 'px';
79                }
80              }
81            }
82            term.fit();
83            if (configJSON.customKeyEnable == true) {
84              term.attachCustomKeyEventHandler(customKeyHandlers);
85            }
86            var SOL_THEME = {
87              background: '#19273c',
88              cursor: 'rgba(83, 146, 255, .5)',
89              scrollbar: 'rgba(83, 146, 255, .5)'
90            };
91            term.setOption('theme', SOL_THEME);
92            var hostname = dataService.getHost().replace('https://', '');
93            var host = 'wss://' + hostname + '/console0';
94            var ws = new WebSocket(host);
95            term.attach(ws);
96            ws.onopen = function() {
97              console.log('websocket opened');
98            };
99            ws.onclose = function(event) {
100              console.log(
101                  'websocket closed. code: ' + event.code +
102                  ' reason: ' + event.reason);
103            };
104            $scope.openTerminalWindow = function() {
105              $window.open(
106                  '#/server-control/remote-console-window',
107                  'Remote Console Window',
108                  'directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=600,height=550');
109            };
110          }
111        ]
112      };
113    }
114  ]);
115})(window.angular);
116