var form = document.getElementById('form-msg');
var cmd = document.getElementById('cmd');
var listMsgs = document.getElementById('msgs');
var socketStatus = document.getElementById('status');
var btnClose = document.getElementById('btnClose');

var wsUrl = 'ws://' + window.location.hostname + ':81';
var socket = new WebSocket(wsUrl);
socket.onopen = function(event) {
  //socketStatus.innerHTML = 'Connected to: ' + event.currentTarget.URL;
  socketStatus.innerHTML = 'Connected';
  socketStatus.className = 'open';
};

socket.onerror = function(error) {
  console.log('WebSocket error: ' + error);
};

socket.onmessage = function(event) {
  var msg = event.data;
  listMsgs.innerHTML += msg;
  listMsgs.scrollTop = listMsgs.scrollHeight;
};

socket.onclose = function(event) {
  socketStatus.innerHTML = 'Disconnected';
  socketStatus.className = 'closed';
};

function sendCmd() {
    socket.send(cmd.value);
    listMsgs.innerHTML += 'Sent: ' + cmd.value + '\n';
    cmd.value = '';
    return false;
}

function togConn() {
	if(socketStatus.className=='open') { socket.close(); btnClose.innerHTML='Reload'; }
	else location.reload();
}

document.getElementById("cmd")
    .addEventListener("keyup", function(event) {
    event.preventDefault();
    if (event.keyCode === 13) {
        document.getElementById("btnSend").click();
    }
});