summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--app/common/directives/serial-console.html2
-rw-r--r--app/common/directives/serial-console.js48
-rw-r--r--app/server-control/controllers/remote-console-controller.html6
-rw-r--r--app/server-control/controllers/remote-console-window-controller.html4
-rw-r--r--app/server-control/styles/remote-console.scss22
-rw-r--r--package-lock.json5
-rw-r--r--package.json3
7 files changed, 47 insertions, 43 deletions
diff --git a/app/common/directives/serial-console.html b/app/common/directives/serial-console.html
index 30ba673..7238f54 100644
--- a/app/common/directives/serial-console.html
+++ b/app/common/directives/serial-console.html
@@ -1,5 +1,5 @@
<div class="serial-lan__wrapper">
- <div id="terminal" class="serial-lan__terminal"></div>
+ <div id="terminal"></div>
<div class="serial-lan__actions">
<button class="inline btn-pop-out" ng-click="openTerminalWindow()" ng-show="showTabBtn === true">Open in new tab</button>
</div>
diff --git a/app/common/directives/serial-console.js b/app/common/directives/serial-console.js
index b320bdc..71340df 100644
--- a/app/common/directives/serial-console.js
+++ b/app/common/directives/serial-console.js
@@ -1,4 +1,8 @@
-import {hterm, lib} from 'hterm-umdjs';
+import {Terminal} from 'xterm';
+import style from 'xterm/dist/xterm.css';
+import * as attach from 'xterm/lib/addons/attach/attach';
+import * as fit from 'xterm/lib/addons/fit/fit';
+
window.angular && (function(angular) {
'use strict';
@@ -14,39 +18,25 @@ window.angular && (function(angular) {
function($scope, $window, dataService) {
$scope.dataService = dataService;
- // See https://github.com/macton/hterm for available hterm options
+ // See https://github.com/xtermjs/xterm.js/ for available xterm
+ // options
- hterm.defaultStorage = new lib.Storage.Local();
- var term = new hterm.Terminal('host-console');
- term.decorate(document.querySelector('#terminal'));
- // Set cursor color
- term.prefs_.set('cursor-color', 'rgba(83, 146, 255, .5)');
- // Set background color
- term.prefs_.set('background-color', '#19273c');
- // Allows keyboard input
- term.installKeyboard();
+ Terminal.applyAddon(attach); // Apply the `attach` addon
+ Terminal.applyAddon(fit); // Apply the `fit` addon
- // The BMC exposes a websocket at /console0. This can be read
- // or written to access the host serial console.
+ var term = new Terminal();
+ term.open(document.getElementById('terminal'));
+ term.fit();
+ var SOL_THEME = {
+ background: '#19273c',
+ cursor: 'rgba(83, 146, 255, .5)',
+ scrollbar: 'rgba(83, 146, 255, .5)'
+ };
+ term.setOption('theme', SOL_THEME);
var hostname = dataService.getHost().replace('https://', '');
var host = 'wss://' + hostname + '/console0';
var ws = new WebSocket(host);
- ws.onmessage = function(evt) {
- // websocket -> terminal
- term.io.print(evt.data);
- };
-
- // terminal -> websocket
- term.onTerminalReady = function() {
- var io = term.io.push();
- io.onVTKeystroke = function(str) {
- ws.send(str);
- };
- io.sendString = function(str) {
- ws.send(str);
- };
- };
-
+ term.attach(ws);
ws.onopen = function() {
console.log('websocket opened');
};
diff --git a/app/server-control/controllers/remote-console-controller.html b/app/server-control/controllers/remote-console-controller.html
index d26ebbe..3011eb0 100644
--- a/app/server-control/controllers/remote-console-controller.html
+++ b/app/server-control/controllers/remote-console-controller.html
@@ -9,7 +9,11 @@
</section>
<section class="row column">
<p class="serial-lan__copy">The Serial over LAN (SoL) console redirects the output of the server’s serial port to a browser window on your workstation.</p>
- <serial-console show-tab-btn="true"></serial-console>
+ </section>
+ <section class="row column">
+ <div class="terminal-container">
+ <serial-console show-tab-btn="true"></serial-console>
+ </div>
</section>
</div>
diff --git a/app/server-control/controllers/remote-console-window-controller.html b/app/server-control/controllers/remote-console-window-controller.html
index eca7bec..bde520d 100644
--- a/app/server-control/controllers/remote-console-window-controller.html
+++ b/app/server-control/controllers/remote-console-window-controller.html
@@ -1,5 +1,7 @@
<div class="serial-lan__header">
<a class="bold" ng-click="close()"><i class="icon icon__return"></i> Return to OpenBmc</a>
</div>
-<serial-console show-tab-btn="false"></serial-console>
+<div class="window-terminal-container">
+ <serial-console show-tab-btn="false"></serial-console>
+</div>
diff --git a/app/server-control/styles/remote-console.scss b/app/server-control/styles/remote-console.scss
index c4dd9ac..41b144d 100644
--- a/app/server-control/styles/remote-console.scss
+++ b/app/server-control/styles/remote-console.scss
@@ -8,16 +8,6 @@
.serial-lan__copy {
padding: 1em 0;
}
-.serial-lan__terminal {
- position: relative;
- width: 101%; //extra 1% to fix redraw issue with terminal window
- height: 400px;
- border: 1em solid #19273c;
- //TODO: Need to move from hterm to xterm as iframe used is adding the extra
- //scroll bar. Also need to rework on the height setting along with $window
- //directive.
- overflow-x: hidden;
-}
.serial-lan__actions {
float: right;
@@ -40,3 +30,15 @@
line-height: 0;
a {color: $black;}
}
+
+.terminal-container {
+ position: relative;
+ height: 25em;
+ width: 100%;
+}
+
+.window-terminal-container {
+ position: relative;
+ height: 25em;
+ max-width: 70em;
+}
diff --git a/package-lock.json b/package-lock.json
index d71da1e..76522a8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9894,6 +9894,11 @@
"integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
"dev": true
},
+ "xterm": {
+ "version": "3.7.0",
+ "resolved": "https://registry.npmjs.org/xterm/-/xterm-3.7.0.tgz",
+ "integrity": "sha512-EnWWiVjyN2JMeFYqBAEM3Xe2z61otmArAzKxZMH33IctNGgKL/pbnjZBBWShCroH9KkXAWsHAePzrAURmNu8OQ=="
+ },
"y18n": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
diff --git a/package.json b/package.json
index aaff56c..51ccef6 100644
--- a/package.json
+++ b/package.json
@@ -39,7 +39,8 @@
"angular-websocket": "^2.0.1",
"angularUtils": "git+https://github.com/michaelbromley/angularUtils.git#75dd112ff7b71b32f08743c2d0f29434f12dfa5c",
"bootstrap": "^3.3.7",
- "hterm-umdjs": "^1.4.1"
+ "hterm-umdjs": "^1.4.1",
+ "xterm": "^3.7.0"
},
"peerDependencies": {},
"devDependencies": {
OpenPOWER on IntegriCloud