Commit 8cf20615 authored by Joel Martin's avatar Joel Martin

Working VNC client! Add mouse movement support.

- Mouse movements are accumulated and sent about 5 times a second.
- Normal polling happens at about 1.5 seconds intervals.

This commit represents a very functional VNC client under Google
Chrome.

Remaining work:

    - Cut and paste support.

    - Framing bugs when using RRE encoding.

    - Better status and error feedback.

    - Get working in firefox using flash web-socket-js:
        http://github.com/gimite/web-socket-js

    - Version without mootools (but test cross-browser).
parent 48ebcdb1
...@@ -22,6 +22,14 @@ mouseUp: function (e) { ...@@ -22,6 +22,14 @@ mouseUp: function (e) {
(evt.clientX - Canvas.c_x) + "," + (evt.clientY - Canvas.c_y)); (evt.clientX - Canvas.c_x) + "," + (evt.clientY - Canvas.c_y));
}, },
mouseMove: function (e) {
var evt = e.event || window.event;
//e.stop();
console.log('mouse ' + evt.which + '/' + evt.button + ' up:' +
(evt.clientX - Canvas.c_x) + "," + (evt.clientY - Canvas.c_y));
},
keyDown: function (e) { keyDown: function (e) {
e.stop(); e.stop();
console.log("keydown: " + e.key + "(" + e.code + ")"); console.log("keydown: " + e.key + "(" + e.code + ")");
...@@ -43,7 +51,7 @@ ctxDisable: function (e) { ...@@ -43,7 +51,7 @@ ctxDisable: function (e) {
}, },
init: function (id, width, height, keyDown, keyUp, mouseDown, mouseUp) { init: function (id, width, height, keyDown, keyUp, mouseDown, mouseUp, mouseMove) {
console.log(">> init_canvas"); console.log(">> init_canvas");
Canvas.id = id; Canvas.id = id;
...@@ -52,12 +60,14 @@ init: function (id, width, height, keyDown, keyUp, mouseDown, mouseUp) { ...@@ -52,12 +60,14 @@ init: function (id, width, height, keyDown, keyUp, mouseDown, mouseUp) {
if (! keyUp) keyUp = Canvas.keyUp; if (! keyUp) keyUp = Canvas.keyUp;
if (! mouseDown) mouseDown = Canvas.mouseDown; if (! mouseDown) mouseDown = Canvas.mouseDown;
if (! mouseUp) mouseUp = Canvas.mouseUp; if (! mouseUp) mouseUp = Canvas.mouseUp;
if (! mouseMove) mouseMove = Canvas.mouseMove;
var c = $(Canvas.id); var c = $(Canvas.id);
document.addEvent('keydown', keyDown); document.addEvent('keydown', keyDown);
document.addEvent('keyup', keyUp); document.addEvent('keyup', keyUp);
c.addEvent('mousedown', mouseDown); c.addEvent('mousedown', mouseDown);
c.addEvent('mouseup', mouseUp); c.addEvent('mouseup', mouseUp);
c.addEvent('mousemove', mouseMove);
/* Work around right and middle click browser behaviors */ /* Work around right and middle click browser behaviors */
document.addEvent('click', Canvas.ctxDisable); document.addEvent('click', Canvas.ctxDisable);
......
...@@ -74,7 +74,9 @@ d : [], // Received data accumulator ...@@ -74,7 +74,9 @@ d : [], // Received data accumulator
version : "RFB 003.003\n", version : "RFB 003.003\n",
state : 'ProtocolVersion', state : 'ProtocolVersion',
shared : 1, shared : 1,
push_rate : 1413, check_rate : 217,
req_rate : 1413,
last_req : 0,
host : '', host : '',
port : 5900, port : 5900,
...@@ -206,7 +208,8 @@ init_msg: function () { ...@@ -206,7 +208,8 @@ init_msg: function () {
$('status').innerHTML = "Connected to: " + RFB.fb_name; $('status').innerHTML = "Connected to: " + RFB.fb_name;
Canvas.init('vnc', RFB.fb_width, RFB.fb_height, Canvas.init('vnc', RFB.fb_width, RFB.fb_height,
RFB.keyDown, RFB.keyUp, RFB.mouseDown, RFB.mouseUp); RFB.keyDown, RFB.keyUp,
RFB.mouseDown, RFB.mouseUp, RFB.mouseMove);
var init = []; var init = [];
init = init.concat(RFB.pixelFormat()); init = init.concat(RFB.pixelFormat());
...@@ -215,7 +218,7 @@ init_msg: function () { ...@@ -215,7 +218,7 @@ init_msg: function () {
RFB.send_array(init); RFB.send_array(init);
/* Start pushing/polling */ /* Start pushing/polling */
RFB.pusher.delay(RFB.push_rate); RFB.checkEvents.delay(RFB.check_rate);
RFB.state = 'normal'; RFB.state = 'normal';
break; break;
...@@ -620,7 +623,7 @@ send_string: function (str) { ...@@ -620,7 +623,7 @@ send_string: function (str) {
}, },
send_array: function (arr) { send_array: function (arr) {
//console.log(">> send_array: " + arr); console.log(">> send_array: " + arr);
//console.log(">> send_array: " + Base64.encode_array(arr)); //console.log(">> send_array: " + Base64.encode_array(arr));
RFB.ws.send(Base64.encode_array(arr)); RFB.ws.send(Base64.encode_array(arr));
}, },
...@@ -648,15 +651,22 @@ flushClient: function () { ...@@ -648,15 +651,22 @@ flushClient: function () {
if (Mouse.arr.length > 0) { if (Mouse.arr.length > 0) {
RFB.send_array(Mouse.arr.concat(RFB.fbUpdateRequest(1))); RFB.send_array(Mouse.arr.concat(RFB.fbUpdateRequest(1)));
Mouse.arr = []; Mouse.arr = [];
return true;
} else { } else {
RFB.send_array(RFB.fbUpdateRequest(1)); return false;
} }
}, },
pusher: function () { checkEvents: function () {
if (RFB.state == 'normal') { if (RFB.state == 'normal') {
RFB.flushClient(); if (! RFB.flushClient()) {
RFB.pusher.delay(RFB.push_rate); var now = new Date().getTime();
if (now > RFB.last_req + RFB.req_rate) {
RFB.last_req = now;
RFB.send_array(RFB.fbUpdateRequest(1));
}
}
RFB.checkEvents.delay(RFB.check_rate);
} }
}, },
...@@ -701,7 +711,12 @@ mouseUp: function(e) { ...@@ -701,7 +711,12 @@ mouseUp: function(e) {
}, },
mouseMove: function(e) { mouseMove: function(e) {
// TODO: accumulate in global array var evt = e.event || window.event;
var x, y;
x = (evt.clientX - Canvas.c_x);
y = (evt.clientY - Canvas.c_y);
console.log('>> mouseMove ' + x + "," + y);
Mouse.arr = Mouse.arr.concat( RFB.pointerEvent(x, y) );
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment