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 38/* 39TextEncoder/TextDecoder does not support IE. 40Use text-encoding instead in IE 41More detail at https://caniuse.com/#feat=textencoder 42*/ 43import {TextDecoder} from 'text-encoding'; 44if (!window['TextDecoder']) { 45 window['TextDecoder'] = TextDecoder; 46} 47 48window.angular && (function(angular) { 49 'use strict'; 50 51 angular.module('app.common.directives').directive('serialConsole', [ 52 function() { 53 return { 54 'restrict': 'E', 55 'template': require('./serial-console.html'), 56 'scope': {'path': '=', 'showTabBtn': '=?'}, 57 'controller': [ 58 '$scope', '$window', 'dataService', 59 function($scope, $window, dataService) { 60 $scope.dataService = dataService; 61 62 // See https://github.com/xtermjs/xterm.js/ for available xterm 63 // options 64 65 Terminal.applyAddon(attach); // Apply the `attach` addon 66 Terminal.applyAddon(fit); // Apply the `fit` addon 67 68 var border = 10; 69 var term = new Terminal(); 70 var terminal = document.getElementById('terminal'); 71 var customConsole; 72 var charSize; 73 var termContainer; 74 75 term.open(terminal); 76 customConsole = configJSON.customConsoleDisplaySize; 77 78 if (customConsole != null) { 79 charSize = measureChar(term); 80 termContainer = document.getElementById('term-container'); 81 if (termContainer != null) { 82 if (customConsole.width) { 83 termContainer.style.width = 84 (charSize.width * customConsole.width + border) + 'px'; 85 } 86 if (customConsole.height) { 87 terminal.style.height = 88 (charSize.height * customConsole.height + border) + 'px'; 89 } 90 } 91 } 92 term.fit(); 93 if (configJSON.customKeyEnable == true) { 94 term.attachCustomKeyEventHandler(customKeyHandlers); 95 } 96 var SOL_THEME = { 97 background: '#19273c', 98 cursor: 'rgba(83, 146, 255, .5)', 99 scrollbar: 'rgba(83, 146, 255, .5)' 100 }; 101 term.setOption('theme', SOL_THEME); 102 var hostname = dataService.getHost().replace('https://', ''); 103 var host = 'wss://' + hostname + '/console0'; 104 try { 105 var ws = new WebSocket(host); 106 term.attach(ws); 107 ws.onopen = function() { 108 console.log('websocket opened'); 109 }; 110 ws.onclose = function(event) { 111 console.log( 112 'websocket closed. code: ' + event.code + 113 ' reason: ' + event.reason); 114 }; 115 } catch (error) { 116 console.log(JSON.stringify(error)); 117 } 118 $scope.openTerminalWindow = function() { 119 $window.open( 120 '#/server-control/remote-console-window', 121 'Remote Console Window', 122 'directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=600,height=550'); 123 }; 124 } 125 ] 126 }; 127 } 128 ]); 129})(window.angular); 130