client/html/client.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<title>WebRDP</title>
<!-- Bootstrap core CSS -->
<link href="/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="/css/webrdp.css" rel="stylesheet">
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
<script type="text/javascript" src="/js/mstsc.js"></script>
<script type="text/javascript" src="/js/keyboard.js"></script>
<script type="text/javascript" src="/js/rle.js"></script>
<script type="text/javascript" src="/js/client.js"></script>
<script type="text/javascript" src="/js/canvas.js"></script>
</head>
<body onload='load("myCanvas")'>
<div id="header">PLACEHOLDER</div>
<div id="main" class="container">
</div> <!-- /container -->
<canvas id="myCanvas" style="display:none">
</body>
<script>
var client = null;
function load (canvas) {
client = Mstsc.client.create(Mstsc.$(canvas));
}
function connect () {
Mstsc.$("main").style.display = 'none';
var canvas = Mstsc.$("myCanvas");
canvas.style.display = 'inline';
var headerOffset = document.getElementById("header");
var yoffset = headerOffset.scrollHeight;
canvas.width = window.innerWidth;
canvas.height = window.innerHeight - (yoffset + 5);
client.connect( function (err) {
Mstsc.$("myCanvas").style.display = 'none';
Mstsc.$("main").style.display = 'inline';
});
}
var socket = io.connect();
socket.on('connect', function(data) {
socket.emit('ready', 'Client connected...[client-side]');
connect();
});
</script>
</html>