#842 clipboard support

* off screen text input that is always in focus allows user to paste into the browser page
* send a token to server when we get this paste event and store text in clipboard buffer
* respond to a clipboard-request packet with the text in clipboard buffer

git-svn-id: https://xpra.org/svn/Xpra/trunk@9139 3bb7dfac-3a0b-4e04-842a-767bc560f471

src/html5/include/xpra_client.js

@@ -36,6 +36,8 @@ function XpraClient(container) {
 	// audio stuff
 	this.audio_enabled = false;
 	this.audio_ctx = null;
+	// the "clipboard"
+	this.clipboard_buffer = "";
 	// the container div is the "screen" on the HTML page where we
 	// are able to draw our windows in.
 	this.container = document.getElementById(container);
@@ -67,7 +69,8 @@ function XpraClient(container) {
 		'draw': this._process_draw,
 		'sound-data': this._process_sound_data,
 		'clipboard-token': this._process_clipboard_token,
-		'set-clipboard-enabled': this._process_set_clipboard_enabled
+		'set-clipboard-enabled': this._process_set_clipboard_enabled,
+		'clipboard-request': this._process_clipboard_request
 	};
 	// assign callback for window resize event
 	if (window.jQuery) {
@@ -219,6 +222,16 @@ XpraClient.prototype._screen_resized = function(event, ctx) {
 	}
 }
 
+XpraClient.prototype.handle_paste = function(text) {
+	// set our clipboard buffer
+	this.clipboard_buffer = text;
+	// send token
+	var packet = ["clipboard-token", "CLIPBOARD"];
+	this.protocol.send(packet);
+	// tell user to paste in remote application
+	alert("Paste acknowledged. Please paste in remote application.");
+}
+
 XpraClient.prototype._keyb_get_modifiers = function(event) {
 	/**
 	 * Returns the modifiers set for the current event.
@@ -802,4 +815,18 @@ XpraClient.prototype._process_clipboard_token = function(packet, ctx) {
 
 XpraClient.prototype._process_set_clipboard_enabled = function(packet, ctx) {
 	console.warn("server set clipboard state to "+packet[1]+" reason was: "+packet[2]);
+}
+
+XpraClient.prototype._process_clipboard_request = function(packet, ctx) {
+	var request_id = packet[1],
+		selection = packet[2],
+		target = packet[3];
+
+	if(this.clipboard_buffer == "") {
+		packet = ["clipboard-contents-none", request_id, selection];
+	} else {
+		var packet = ["clipboard-contents", request_id, selection, "UTF8_STRING", 8, "bytes", ctx.clipboard_buffer];
+	}
+
+	ctx.protocol.send(packet);
 }

src/html5/index.html

@@ -33,6 +33,11 @@
 				padding: 0;
 				margin: 0;
 			}
+			#pasteboard {
+				position: fixed;
+				top: -30px;
+				left: 1px;
+			}
 			.undecorated {
 				position: absolute;
 				padding: 0;
@@ -136,6 +141,8 @@
 		<div id="screen" style="width: 100%; height:100%;">
 		</div>
 
+		<input id="pasteboard" onblur="this.focus()" autofocus />
+
 		<script>
 
 			if (!window.location.getParameter ) {
@@ -210,6 +217,13 @@
 
 			    // and connect
 			    client.connect(server, port, false);
+
+			    // attach a callback for paste on the screen
+				$('#pasteboard').on('paste', function (e) {
+					e.preventDefault();
+					var text = (e.originalEvent || e).clipboardData.getData('text/plain');
+					client.handle_paste(text);
+				});
 			});
 		</script>
 	</body>