<body>
<br><br>
- Canvas:<br>
+ Canvas:
+ <span id="button-selection" style="display: none;">
+ <input id="button1" type="button" value="L"><input id="button2" type="button" value="M"><input id="button4" type="button" value="R">
+ </span>
+ <br>
<canvas id="canvas" width="640" height="20"
style="border-style: dotted; border-width: 1px;">
Canvas not supported.
</body>
<!--
- <script type='text/javascript'
+ <script type='text/javascript'
src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
-->
- <script src="../include/util.js"></script>
- <script src="../include/webutil.js"></script>
- <script src="../include/base64.js"></script>
- <script src="../include/canvas.js"></script>
+ <script src="../core/util.js"></script>
+ <script src="../app/webutil.js"></script>
+ <script src="../core/base64.js"></script>
+ <script src="../core/input/keysym.js"></script>
+ <script src="../core/input/keysymdef.js"></script>
+ <script src="../core/input/xtscancodes.js"></script>
+ <script src="../core/input/vkeys.js"></script>
+ <script src="../core/input/util.js"></script>
+ <script src="../core/input/devices.js"></script>
+ <script src="../core/display.js"></script>
<script>
- var msg_cnt = 0;
- var width = 400, height = 200;
- var iterations;
+ var msg_cnt = 0, iterations,
+ width = 400, height = 200,
+ canvas, keyboard, mouse;
+
+ var newline = "\n";
function message(str) {
console.log(str);
- cell = $D('messages');
- cell.innerHTML += msg_cnt + ": " + str + "\n";
+ cell = document.getElementById('messages');
+ cell.textContent += msg_cnt + ": " + str + newline;
cell.scrollTop = cell.scrollHeight;
+ msg_cnt++;
}
function mouseButton(x, y, down, bmask) {
msg = 'mouse x,y: ' + x + ',' + y + ' down: ' + down;
msg += ' bmask: ' + bmask;
- console.log(msg);
message(msg);
}
//console.log(msg);
}
- function keyPress(keysym, down) {
- msg = "keyPress keysym: " + keysym + " down: " + down;
- console.log(msg);
+ function rfbKeyEvent(keysym, code, down) {
+ var d = down ? "down" : " up ";
+ var msg = "RFB key event " + d + " keysym: " + keysym + " code: " + code;
+ message(msg);
+ }
+ function rawKey(e) {
+ msg = "raw key event " + e.type +
+ " (key: " + e.keyCode + ", char: " + e.charCode +
+ ", which: " + e.which +")";
message(msg);
}
+ function selectButton(num) {
+ var b, blist = [1,2,4];
+
+ if (typeof num === 'undefined') {
+ // Show the default
+ num = mouse.get_touchButton();
+ } else if (num === mouse.get_touchButton()) {
+ // Set all buttons off (no clicks)
+ mouse.set_touchButton(0);
+ num = 0;
+ } else {
+ // Turn on one button
+ mouse.set_touchButton(num);
+ }
+
+ for (b = 0; b < blist.length; b++) {
+ if (blist[b] === num) {
+ document.getElementById('button' + blist[b]).style.backgroundColor = "black";
+ document.getElementById('button' + blist[b]).style.color = "lightgray";
+ } else {
+ document.getElementById('button' + blist[b]).style.backgroundColor = "";
+ document.getElementById('button' + blist[b]).style.color = "";
+ }
+ }
+ }
+
window.onload = function() {
- var canvas = new Canvas({'target' : $D('canvas')});
+ canvas = new Display({'target' : document.getElementById('canvas')});
+ keyboard = new Keyboard({'target': document,
+ 'onKeyEvent': rfbKeyEvent});
+ document.addEventListener('keypress', rawKey);
+ document.addEventListener('keydown', rawKey);
+ document.addEventListener('keyup', rawKey);
+ mouse = new Mouse({'target': document.getElementById('canvas'),
+ 'onMouseButton': mouseButton,
+ 'onMouseMove': mouseMove});
+
canvas.resize(width, height, true);
- canvas.start(keyPress, mouseButton, mouseMove);
- message("Canvas initialized");
+ keyboard.grab();
+ mouse.grab();
+ message("Display initialized");
+
+ if (Util.isTouchDevice) {
+ message("Touch device detected");
+ document.getElementById('button-selection').style.display = "inline";
+ document.getElementById('button1').onclick = function(){ selectButton(1) };
+ document.getElementById('button2').onclick = function(){ selectButton(2) };
+ document.getElementById('button4').onclick = function(){ selectButton(4) };
+ selectButton();
+ }
+
}
</script>
</html>