diff --git a/webssh/static/js/main.js b/webssh/static/js/main.js index f0680ab..2608e25 100644 --- a/webssh/static/js/main.js +++ b/webssh/static/js/main.js @@ -1,43 +1,14 @@ +var jQuery; +var wssh = {}; + + jQuery(function($){ + /*jslint browser:true */ var status = $('#status'), btn = $('.btn-primary'), style = {}; - $('form#connect').submit(function(event) { - event.preventDefault(); - - var form = $(this), - url = form.attr('action'), - type = form.attr('type'), - data = new FormData(this); - - if (!data.get('hostname') || !data.get('port') || !data.get('username')) { - status.text('Hostname, port and username are required.'); - return; - } - - var pk = data.get('privatekey'); - if (pk && pk.size > 16384) { - status.text('Key size exceeds maximum value.'); - return; - } - - status.text(''); - btn.prop('disabled', true); - - $.ajax({ - url: url, - type: type, - data: data, - success: callback, - cache: false, - contentType: false, - processData: false - }); - - }); - function parse_xterm_style() { var text = $('.xterm-helpers style').text(); @@ -52,22 +23,24 @@ jQuery(function($){ if (!style.width || !style.height) { parse_xterm_style(); } - cols = parseInt(window.innerWidth / style.width) - 1; - rows = parseInt(window.innerHeight / style.height); + + var cols = parseInt(window.innerWidth / style.width, 10) - 1; + var rows = parseInt(window.innerHeight / style.height, 10); return {'cols': cols, 'rows': rows}; } - function resize_term(term, socket) { + function resize_term(term, sock) { var geometry = current_geometry(), cols = geometry.cols, rows = geometry.rows; // console.log([cols, rows]); // console.log(term.geometry); - if (cols != term.geometry[0] || rows != term.geometry[1]) { + + if (cols !== term.geometry[0] || rows !== term.geometry[1]) { console.log('resizing term'); term.resize(cols, rows); - socket.send(JSON.stringify({'resize': [cols, rows]})); + sock.send(JSON.stringify({'resize': [cols, rows]})); } } @@ -83,50 +56,55 @@ jQuery(function($){ } var ws_url = window.location.href.replace('http', 'ws'), - join = (ws_url[ws_url.length-1] == '/' ? '' : '/'), + join = (ws_url[ws_url.length-1] === '/' ? '' : '/'), url = ws_url + join + 'ws?id=' + msg.id, - terminal = document.getElementById('#terminal'); - socket = new WebSocket(url); - term = new Terminal({ + sock = new window.WebSocket(url), + terminal = document.getElementById('#terminal'), + term = new window.Terminal({ cursorBlink: true, }); console.log(url); + wssh.sock = sock; + wssh.term = term; + term.on('data', function(data) { // console.log(data); - socket.send(JSON.stringify({'data': data})); + sock.send(JSON.stringify({'data': data})); }); - socket.onopen = function(e) { + sock.onopen = function() { $('.container').hide(); term.open(terminal, true); term.toggleFullscreen(true); }; - socket.onmessage = function(msg) { - var reader = new FileReader(); - reader.onloadend = function(event){ - var decoder = new TextDecoder(); + sock.onmessage = function(msg) { + var reader = new window.FileReader(); + + reader.onloadend = function(){ + var decoder = new window.TextDecoder(); var text = decoder.decode(reader.result); // console.log(text); term.write(text); if (!term.resized) { - resize_term(term, socket); + resize_term(term, sock); term.resized = true; } }; + reader.readAsArrayBuffer(msg.data); }; - socket.onerror = function(e) { + sock.onerror = function(e) { console.log(e); }; - socket.onclose = function(e) { + sock.onclose = function(e) { console.log(e); term.destroy(); - term = undefined; - socket = undefined; + wssh.term = undefined; + wssh.sock = undefined; $('.container').show(); status.text(e.reason); btn.prop('disabled', false); @@ -134,9 +112,44 @@ jQuery(function($){ } + $('form#connect').submit(function(event) { + event.preventDefault(); + + var form = $(this), + url = form.attr('action'), + type = form.attr('type'), + data = new FormData(this); + + if (!data.get('hostname') || !data.get('port') || !data.get('username')) { + status.text('Hostname, port and username are required.'); + return; + } + + var pk = data.get('privatekey'); + if (pk && pk.size > 16384) { + status.text('Key size exceeds maximum value.'); + return; + } + + status.text(''); + btn.prop('disabled', true); + + $.ajax({ + url: url, + type: type, + data: data, + success: callback, + cache: false, + contentType: false, + processData: false + }); + + }); + + $(window).resize(function(){ - if (typeof term != 'undefined' && typeof socket != 'undefined') { - resize_term(term, socket); + if (wssh.term && wssh.sock) { + resize_term(wssh.term, wssh.sock); } });