[Libreoffice-commits] online.git: Branch 'libreoffice-5-3' - loleaflet/src

[Tomaž Vajngerl]

 loleaflet/src/map/Map.js                  |    5 ++-
 loleaflet/src/map/handler/Map.Keyboard.js |   47 ++++++++++++++++++++++++------
 2 files changed, 43 insertions(+), 9 deletions(-)

New commits:
commit bc1cd6bbce159a6707311a7e5404ad73dd892629
Author: Tomaž Vajngerl <tomaz.vajngerl at collabora.co.uk>
Date:   Sun Jan 15 23:53:00 2017 +0100

    fix Chrome Android and Firefox Android text input
    
    - Change from textarea to input (type="text") to prevent Firefox
    to auto-capitalize.
    
    - Clean the text input content after each word so that the soft
    keyboard spellcheck suggestions are correct and that backspace
    doesn't delete long IME suggestions before it has effect.
    
    - Workaround on Chrome Android 'space' and applying spell-check
    corrections.
    
    Change-Id: I635789bc8f3b47069b7ad8b8e88bc36feb90b2b1
    Reviewed-on: https://gerrit.libreoffice.org/35571
    Reviewed-by: Thorsten Behrens <Thorsten.Behrens at CIB.de>
    Tested-by: Thorsten Behrens <Thorsten.Behrens at CIB.de>

diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index cadd3d52..fb395694 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -594,7 +594,10 @@ L.Map = L.Evented.extend({
 		}
 
 		var textAreaContainer = L.DomUtil.create('div', 'clipboard-container', container.parentElement);
-		this._textArea = L.DomUtil.create('textarea', 'clipboard', textAreaContainer);
+		this._textArea = L.DomUtil.create('input', 'clipboard', textAreaContainer);
+		this._textArea.setAttribute('type', 'text');
+		this._textArea.setAttribute('autocorrect', 'off');
+		this._textArea.setAttribute('autocapitalize', 'off');
 		this._resizeDetector = L.DomUtil.create('iframe', 'resize-detector', container);
 		this._fileDownloader = L.DomUtil.create('iframe', '', container);
 		L.DomUtil.setStyle(this._fileDownloader, 'display', 'none');
diff --git a/loleaflet/src/map/handler/Map.Keyboard.js b/loleaflet/src/map/handler/Map.Keyboard.js
index 8aff7550..752e74b0 100644
--- a/loleaflet/src/map/handler/Map.Keyboard.js
+++ b/loleaflet/src/map/handler/Map.Keyboard.js
@@ -284,12 +284,28 @@ L.Map.Keyboard = L.Handler.extend({
 		var charCode = e.originalEvent.charCode;
 		var keyCode = e.originalEvent.keyCode;
 
+		if (e.type === 'compositionstart' || e.type === 'compositionupdate') {
+			this._isComposing = true; // we are starting composing with IME
+		}
+
 		if (e.type === 'compositionend') {
+			this._isComposing = false; // stop of composing with IME
+			// get the composited char codes
 			var compCharCodes = [];
 			for (var i = 0; i < e.originalEvent.data.length; i++) {
 				compCharCodes.push(e.originalEvent.data[i].charCodeAt());
 			}
+			// clear the input now - best to do this ASAP so the input
+			// is clear for the next word
+			this._map._textArea.value = '';
+		}
+
+		if (!this._isComposing && e.type === 'keyup') {
+			// not compositing and keyup, clear the input so it is ready
+			// for next word (or char only)
+			this._map._textArea.value = '';
 		}
+
 		var unoKeyCode = this._toUNOKeyCode(keyCode);
 
 		if (this.modifier) {
@@ -338,15 +354,30 @@ L.Map.Keyboard = L.Handler.extend({
 				this._bufferedTextInputEvent = e;
 			}
 			else if (e.type === 'keyup') {
-				// Hack for making space work in chrome when IME is enabled
-				// Chrome doesn't fire compositionend event or keypress when
-				// IME is enabled *and* user presses <space>.
-				// However, it sends 'textInput' event in such a case.
-				// Use the buffered textInput event if its the space key and has not been
-				// handled already by 'keypress' or 'compositionend' events above
-				if (!this._keyHandled && this._bufferedTextInputEvent && e.originalEvent.key === this._bufferedTextInputEvent.originalEvent.data) {
+				// Hack for making space and spell-check text insert work
+				// in Chrome (on Andorid) or Chrome with IME.
+				//
+				// Chrome (Android) IME triggers keyup/keydown input with
+				// code 229 when hitting space (as with all composiiton events)
+				// with addition to 'textinput' event, in which we only see that
+				// space was entered. Similar situation is also when inserting
+				// a soft-keyboard spell-check item - it is visible only with
+				// 'textinput' event (no composition event is fired).
+				// To make this work we need to insert textinput.data here..
+				//
+				// TODO: Maybe make sure this is only triggered when keydown has
+				// 229 code. Also we need to detect that composition was overriden
+				// (part or whole word deleted) with the spell-checked word. (for
+				// example: enter 'tar' and with spell-check correct that to 'rat')
+
+				if (!this._keyHandled && this._bufferedTextInputEvent) {
+					var textInputData = this._bufferedTextInputEvent.originalEvent.data;
 					charCode = e.originalEvent.keyCode;
-					docLayer._postKeyboardEvent('input', charCode, 0);
+					var compCharCodes = [];
+					for (var i = 0; i < textInputData.length; i++) {
+						compCharCodes.push(textInputData[i].charCodeAt());
+					}
+					docLayer._postKeyboardEvents('input', compCharCodes, Array.apply(null, Array(compCharCodes.length)).map(Number.prototype.valueOf, 0));
 				}
 				docLayer._postKeyboardEvent('up', charCode, unoKeyCode);