Merge pull request #841 from Laerdal/feature/copy-paste-html5

Implement HTML5 System clipboard support

lime/_backend/html5/HTML5Window.hx

@@ -10,11 +10,13 @@ import js.html.InputElement;
 import js.html.InputEvent;
 import js.html.MouseEvent;
 import js.html.TouchEvent;
+import js.html.ClipboardEvent;
 import js.Browser;
 import lime.app.Application;
 import lime.graphics.Image;
 import lime.system.Display;
 import lime.system.System;
+import lime.system.Clipboard;
 import lime.ui.Gamepad;
 import lime.ui.Joystick;
 import lime.ui.Touch;
@@ -277,12 +279,36 @@ class HTML5Window {
 	}
 	
 	
+	private function handleCutOrCopyEvent (event:ClipboardEvent):Void {
+		
+		event.clipboardData.setData('text/plain', Clipboard.text);
+		event.preventDefault(); // We want our data, not data from any selection, to be written to the clipboard
+		
+	}
+
+
+	private function handlePasteEvent (event:ClipboardEvent):Void {
+		
+		if(untyped event.clipboardData.types.indexOf('text/plain') > -1){
+			var text = Clipboard.text = event.clipboardData.getData('text/plain');
+			parent.onTextInput.dispatch (text);
+			
+			// We are already handling the data from the clipboard, we do not want it inserted into the hidden input
+			event.preventDefault();
+		}
+		
+	}
+
+
 	private function handleInputEvent (event:InputEvent):Void {
 		
-		if (textInput.value != "") {
+		// In order to ensure that the browser will fire clipboard events, we always need to have something selected.
+		// Therefore, `value` cannot be "".
+		
+		if (textInput.value != " ") {
 			
-			parent.onTextInput.dispatch (textInput.value);
-			textInput.value = "";
+			parent.onTextInput.dispatch (textInput.value.substr(1));
+			textInput.value = " ";
 			
 		}
 		
@@ -648,7 +674,7 @@ class HTML5Window {
 				textInput.style.position = 'absolute';
 				textInput.style.opacity = "0";
 				textInput.style.color = "transparent";
-				textInput.value = "";
+				textInput.value = " "; // See: handleInputEvent()
 				
 				untyped textInput.autocapitalize = "off";
 				untyped textInput.autocorrect = "off";
@@ -683,10 +709,14 @@ class HTML5Window {
 				
 				textInput.addEventListener ('input', handleInputEvent, true);
 				textInput.addEventListener ('blur', handleFocusEvent, true);
+				textInput.addEventListener ('cut', handleCutOrCopyEvent, true);
+				textInput.addEventListener ('copy', handleCutOrCopyEvent, true);
+				textInput.addEventListener ('paste', handlePasteEvent, true);
 				
 			}
 			
 			textInput.focus ();
+			textInput.select ();
 			
 		} else {
 			
@@ -694,6 +724,9 @@ class HTML5Window {
 				
 				textInput.removeEventListener ('input', handleInputEvent, true);
 				textInput.removeEventListener ('blur', handleFocusEvent, true);
+				textInput.removeEventListener ('cut', handleCutOrCopyEvent, true);
+				textInput.removeEventListener ('copy', handleCutOrCopyEvent, true);
+				textInput.removeEventListener ('paste', handlePasteEvent, true);
 				
 				textInput.blur ();
 				

lime/system/Clipboard.hx

@@ -3,6 +3,8 @@ package lime.system;
 
 #if flash
 import flash.desktop.Clipboard in FlashClipboard;
+#elseif js
+import js.Browser.document;
 #end
 
 #if !macro
@@ -14,6 +16,10 @@ class Clipboard {
 	
 	
 	public static var text (get, set):String;
+
+	#if js
+	private static var _text : String;
+	#end
 	
 	
 	
@@ -33,6 +39,8 @@ class Clipboard {
 			return FlashClipboard.generalClipboard.getData (TEXT_FORMAT);
 			
 		}
+		#elseif js
+		return _text;
 		#end
 		
 		return null;
@@ -45,8 +53,19 @@ class Clipboard {
 		#if (lime_cffi && !macro)
 		lime_clipboard_set_text (value);
 		return value;
+		
 		#elseif flash
 		FlashClipboard.generalClipboard.setData (TEXT_FORMAT, value);
+		return value;
+		
+		#elseif js
+		_text = value;
+		
+		#if html5
+		if (document.queryCommandEnabled("copy"))
+			document.execCommand("copy");
+		#end
+		
 		return value;
 		#end