summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/terminal
diff options
context:
space:
mode:
authorNick Thomas <nick@gitlab.com>2016-11-24 13:01:25 +0000
committerNick Thomas <nick@gitlab.com>2016-12-19 19:53:03 +0000
commit7c2e16d05319fa79d0b84472130c4a9300e08808 (patch)
tree4f16848cbd9be12532d66a723d590082bf898f6b /app/assets/javascripts/terminal
parentdcddd0f374f9daa321bb8bfa354dc7032d02f5a0 (diff)
downloadgitlab-ce-7c2e16d05319fa79d0b84472130c4a9300e08808.tar.gz
Add xterm.js 2.1.0 and a wrapper class to the asset pipeline
Diffstat (limited to 'app/assets/javascripts/terminal')
-rw-r--r--app/assets/javascripts/terminal/terminal.js.es662
-rw-r--r--app/assets/javascripts/terminal/terminal_bundle.js.es65
2 files changed, 67 insertions, 0 deletions
diff --git a/app/assets/javascripts/terminal/terminal.js.es6 b/app/assets/javascripts/terminal/terminal.js.es6
new file mode 100644
index 00000000000..6b9422b1816
--- /dev/null
+++ b/app/assets/javascripts/terminal/terminal.js.es6
@@ -0,0 +1,62 @@
+/* global Terminal */
+
+(() => {
+ class GLTerminal {
+
+ constructor(options) {
+ this.options = options || {};
+
+ this.options.cursorBlink = options.cursorBlink || true;
+ this.options.screenKeys = options.screenKeys || true;
+ this.container = document.querySelector(options.selector);
+
+ this.setSocketUrl();
+ this.createTerminal();
+ $(window).off('resize.terminal').on('resize.terminal', () => {
+ this.terminal.fit();
+ });
+ }
+
+ setSocketUrl() {
+ const { protocol, hostname, port } = window.location;
+ const wsProtocol = protocol === 'https:' ? 'wss://' : 'ws://';
+ const path = this.container.dataset.projectPath;
+
+ this.socketUrl = `${wsProtocol}${hostname}:${port}${path}`;
+ }
+
+ createTerminal() {
+ this.terminal = new Terminal(this.options);
+ this.socket = new WebSocket(this.socketUrl, ['terminal.gitlab.com']);
+ this.socket.binaryType = 'arraybuffer';
+
+ this.terminal.open(this.container);
+ this.socket.onopen = () => { this.runTerminal(); };
+ this.socket.onerror = () => { this.handleSocketFailure(); };
+ }
+
+ runTerminal() {
+ const decoder = new TextDecoder('utf-8');
+ const encoder = new TextEncoder('utf-8');
+
+ this.terminal.on('data', (data) => {
+ this.socket.send(encoder.encode(data));
+ });
+
+ this.socket.addEventListener('message', (ev) => {
+ this.terminal.write(decoder.decode(ev.data));
+ });
+
+ this.isTerminalInitialized = true;
+ this.terminal.fit();
+ }
+
+ handleSocketFailure() {
+ this.terminal.write('\r\nConnection failure');
+ }
+
+ }
+
+ window.gl = window.gl || {};
+ gl.Terminal = GLTerminal;
+})();
diff --git a/app/assets/javascripts/terminal/terminal_bundle.js.es6 b/app/assets/javascripts/terminal/terminal_bundle.js.es6
new file mode 100644
index 00000000000..ded7ee6e9fe
--- /dev/null
+++ b/app/assets/javascripts/terminal/terminal_bundle.js.es6
@@ -0,0 +1,5 @@
+//= require xterm/xterm.js
+//= require xterm/fit.js
+//= require ./terminal.js
+
+$(() => new gl.Terminal({ selector: '#terminal' }));