loleaflet/build/deps.js                          |    5 +
 loleaflet/src/layer/marker/ClipboardContainer.js |   84 +++++++++++++++++++++++
 loleaflet/src/layer/tile/TileLayer.js            |   23 ++----
 loleaflet/src/map/Map.js                         |   22 ++----
 loleaflet/src/map/handler/Map.Keyboard.js        |    8 +-
 loleaflet/src/map/handler/Map.Mouse.js           |    2 
 6 files changed, 111 insertions(+), 33 deletions(-)

New commits:
commit fc12e995c71b15d324baa32b0cde63c5282dd868
Author: Pranav Kant <pran...@collabora.co.uk>
Date:   Fri Mar 23 19:40:53 2018 +0530

    New home for hidden input field
    
    Change-Id: I534b8d3dc9ac9ec4f37aa0ec929a9cd6a98558b4
    Reviewed-on: https://gerrit.libreoffice.org/52132
    Reviewed-by: Jan Holesovsky <ke...@collabora.com>
    Tested-by: Jan Holesovsky <ke...@collabora.com>

diff --git a/loleaflet/build/deps.js b/loleaflet/build/deps.js
index 36ac9607f..bac393583 100644
--- a/loleaflet/build/deps.js
+++ b/loleaflet/build/deps.js
@@ -80,6 +80,11 @@ var deps = {
                desc: 'Used to display a progress image over rectangular are of 
the map.'
        },
 
+       ClipboardContainer: {
+               src: ['layer/marker/ClipboardContainer.js'],
+               desc: 'Container for hidden input field.'
+       },
+
        Marker: {
                src: ['layer/marker/Icon.js',
                      'layer/marker/Icon.Default.js',
diff --git a/loleaflet/src/layer/marker/ClipboardContainer.js 
b/loleaflet/src/layer/marker/ClipboardContainer.js
new file mode 100644
index 000000000..4dc7792a7
--- /dev/null
+++ b/loleaflet/src/layer/marker/ClipboardContainer.js
@@ -0,0 +1,84 @@
+/*
+ * L.ClipboardContainer is used to overlay the hidden clipbaord container on 
the map
+ */
+
+L.ClipboardContainer = L.Layer.extend({
+
+       initialize: function () {
+               this._initLayout();
+       },
+
+       onAdd: function () {
+               if (this._container) {
+                       this.getPane().appendChild(this._container);
+                       this.update();
+               }
+
+               L.DomEvent.on(this._textArea, 'copy cut paste ' +
+                             'keydown keypress keyup ' +
+                             'compositionstart compositionupdate 
compositionend textInput',
+                             this._map._handleDOMEvent, this._map);
+       },
+
+       onRemove: function () {
+               if (this._container) {
+                       this.getPane().removeChild(this._container);
+               }
+
+               L.DomEvent.off(this._textArea, 'copy cut paste ' +
+                              'keydown keypress keyup ' +
+                              'compositionstart compositionupdate 
compositionend textInput',
+                              this._map._handleDOMEvent, this._map);
+       },
+
+       focus: function(focus) {
+               if (focus) {
+                       this._textArea.focus();
+               } else {
+                       this._textArea.blur();
+               }
+       },
+
+       select: function() {
+               this._textArea.select();
+       },
+
+       getValue: function() {
+               return this._textArea.value;
+       },
+
+       setValue: function(val) {
+               this._textArea.value = val;
+       },
+
+       setLatLng: function (latlng) {
+               this._latlng = L.latLng(latlng);
+               this.update();
+       },
+
+       update: function () {
+               if (this._container && this._map && this._latlng) {
+                       var position = 
this._map.latLngToLayerPoint(this._latlng).round();
+                       this._setPos(position);
+               }
+       },
+
+       _initLayout: function () {
+               this._container = L.DomUtil.create('div', 
'clipboard-container');
+               this._container.id = 'doc-clipboard-container';
+               this._textArea = L.DomUtil.create('input', 'clipboard', 
this._container);
+               this._textArea.setAttribute('type', 'text');
+               this._textArea.setAttribute('autocorrect', 'off');
+               this._textArea.setAttribute('autocapitalize', 'off');
+               this._textArea.setAttribute('autocomplete', 'off');
+               this._textArea.setAttribute('spellcheck', 'false');
+       },
+
+       _setPos: function (pos) {
+               L.DomUtil.setPosition(this._container, pos);
+       }
+});
+
+L.clipboardContainer = function () {
+       return new L.ClipboardContainer();
+};
diff --git a/loleaflet/src/layer/tile/TileLayer.js 
b/loleaflet/src/layer/tile/TileLayer.js
index de9351666..4fdee2095 100644
--- a/loleaflet/src/layer/tile/TileLayer.js
+++ b/loleaflet/src/layer/tile/TileLayer.js
@@ -286,8 +286,7 @@ L.TileLayer = L.GridLayer.extend({
                for (var key in this._selectionHandles) {
                        this._selectionHandles[key].on('drag dragend', 
this._onSelectionHandleDrag, this);
                }
-               this._textArea = map._textArea;
-               this._textArea.focus();
+               this._map._clipboardContainer.focus(true);
 
                map.setPermission(this.options.permission);
 
@@ -1454,11 +1453,7 @@ L.TileLayer = L.GridLayer.extend({
                                this._cursorMarker.setLatLng(cursorPos, 
pixBounds.getSize().multiplyBy(this._map.getZoomScale(this._map.getZoom())));
                        }
                        this._map.addLayer(this._cursorMarker);
-
-                       // move the hidden input field with the cursor
-                       var clipContainer = 
L.DomUtil.get('doc-clipboard-container');
-                       var pos = 
this._map.latLngToContainerPoint(L.latLng(this._visibleCursor.getCenter())).round();
-                       L.DomUtil.setPosition(clipContainer, pos);
+                       
this._map._clipboardContainer.setLatLng(this._visibleCursor.getNorthWest());
                }
                else if (this._cursorMarker) {
                        this._map.removeLayer(this._cursorMarker);
@@ -1642,7 +1637,7 @@ L.TileLayer = L.GridLayer.extend({
                }
                if (e.type === 'dragend') {
                        e.target.isDragged = false;
-                       this._textArea.focus();
+                       this._map._clipboardContainer.focus(true);
                        this._map.fire('scrollvelocity', {vx: 0, vy: 0});
                }
 
@@ -1881,9 +1876,9 @@ L.TileLayer = L.GridLayer.extend({
        _onCopy: function (e) {
                e = e.originalEvent;
                e.preventDefault();
-               if (this._map._docLayer._textArea.value !== '') {
-                       L.Compatibility.clipboardSet(e, 
this._map._docLayer._textArea.value);
-                       this._map._docLayer._textArea.value = '';
+               if (this._map._clipboardContainer.getValue() !== '') {
+                       L.Compatibility.clipboardSet(e, 
this._map._clipboardContainer.getValue());
+                       this._map._clipboardContainer.setValue('');
                } else if (this._selectionTextContent) {
                        L.Compatibility.clipboardSet(e, 
this._selectionTextContent);
 
@@ -1897,9 +1892,9 @@ L.TileLayer = L.GridLayer.extend({
        _onCut: function (e) {
                e = e.originalEvent;
                e.preventDefault();
-               if (this._map._docLayer._textArea.value !== '') {
-                       L.Compatibility.clipboardSet(e, 
this._map._docLayer._textArea.value);
-                       this._map._docLayer._textArea.value = '';
+               if (this._map._clipboardContainer.getValue() !== '') {
+                       L.Compatibility.clipboardSet(e, 
this._map._clipboardContainer.getValue());
+                       this._map._clipboardContainer.setValue('');
                } else if (this._selectionTextContent) {
                        L.Compatibility.clipboardSet(e, 
this._selectionTextContent);
 
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 7cbca20a4..242d2c91a 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -86,6 +86,9 @@ L.Map = L.Evented.extend({
                this._socket = L.socket(this);
                this._progressBar = L.progressOverlay(this.getCenter(), 
L.point(150, 25));
 
+               this._clipboardContainer = L.clipboardContainer();
+               this.addLayer(this._clipboardContainer);
+
                // Inhibit the context menu - the browser thinks that the 
document
                // is just a bunch of images, hence the context menu is useless 
(tdf#94599)
                this.on('contextmenu', function() {});
@@ -662,9 +665,9 @@ L.Map = L.Evented.extend({
 
        focus: function () {
                console.debug('focus:');
-               if (this._docLayer && document.activeElement !== 
this._docLayer._textArea) {
+               if (this._docLayer) {
                        console.debug('focus: focussing');
-                       this._docLayer._textArea.focus();
+                       this._clipboardContainer.focus(true);
                }
        },
 
@@ -692,14 +695,6 @@ L.Map = L.Evented.extend({
                        throw new Error('Map container is already 
initialized.');
                }
 
-               var textAreaContainer = L.DomUtil.create('div', 
'clipboard-container', container.parentElement);
-               textAreaContainer.id = 'doc-clipboard-container';
-               this._textArea = L.DomUtil.create('input', 'clipboard', 
textAreaContainer);
-               this._textArea.setAttribute('type', 'text');
-               this._textArea.setAttribute('autocorrect', 'off');
-               this._textArea.setAttribute('autocapitalize', 'off');
-               this._textArea.setAttribute('autocomplete', 'off');
-               this._textArea.setAttribute('spellcheck', 'false');
                this._resizeDetector = L.DomUtil.create('iframe', 
'resize-detector', container);
                this._fileDownloader = L.DomUtil.create('iframe', '', 
container);
                L.DomUtil.setStyle(this._fileDownloader, 'display', 'none');
@@ -829,8 +824,7 @@ L.Map = L.Evented.extend({
 
                L.DomEvent[onOff](this._container, 'click dblclick mousedown 
mouseup ' +
                        'mouseover mouseout mousemove contextmenu dragover drop 
' +
-                       'keydown keypress keyup trplclick qdrplclick', 
this._handleDOMEvent, this);
-               L.DomEvent[onOff](this._textArea, 'copy cut paste keydown 
keypress keyup compositionstart compositionupdate compositionend textInput', 
this._handleDOMEvent, this);
+                       'trplclick qdrplclick', this._handleDOMEvent, this);
 
                if (this.options.trackResize && 
this._resizeDetector.contentWindow) {
                        L.DomEvent[onOff](this._resizeDetector.contentWindow, 
'resize', this._onResize, this);
@@ -1072,8 +1066,8 @@ L.Map = L.Evented.extend({
                // Calling from some other place with no real 'click' event 
doesn't work
                if (type === 'click') {
                        if (this._permission === 'edit') {
-                               this._textArea.blur();
-                               this._textArea.focus();
+                               this._clipboardContainer.focus(false);
+                               this._clipboardContainer.focus(true);
                        }
 
                        // unselect if anything is selected already
diff --git a/loleaflet/src/map/handler/Map.Keyboard.js 
b/loleaflet/src/map/handler/Map.Keyboard.js
index cb0d42f40..4011898a9 100644
--- a/loleaflet/src/map/handler/Map.Keyboard.js
+++ b/loleaflet/src/map/handler/Map.Keyboard.js
@@ -250,7 +250,7 @@ L.Map.Keyboard = L.Handler.extend({
                        compEventFn = L.bind(docLayer._postCompositionEvent, 
docLayer, 0 /* winid */);
                }
                if (!inputEle) {
-                       inputEle = this._map._textArea;
+                       inputEle = this._map._clipboardContainer._textArea;
                }
                this.modifier = 0;
                var shift = e.originalEvent.shiftKey ? this.keyModifier.shift : 
0;
@@ -521,9 +521,9 @@ L.Map.Keyboard = L.Handler.extend({
                case 91: // Left Cmd (Safari)
                case 93: // Right Cmd (Safari)
                        // we prepare for a copy or cut event
-                       this._map._docLayer._textArea.value = 
window.getSelection().toString();
-                       this._map._docLayer._textArea.focus();
-                       this._map._docLayer._textArea.select();
+                       
this._map._clipboardContainer.setValue(window.getSelection().toString());
+                       this._map._clipboardContainer.focus(true);
+                       this._map._clipboardContainer.select();
                        return true;
                case 80: // p
                        this._map.print();
diff --git a/loleaflet/src/map/handler/Map.Mouse.js 
b/loleaflet/src/map/handler/Map.Mouse.js
index f196adbef..d5b280a0c 100644
--- a/loleaflet/src/map/handler/Map.Mouse.js
+++ b/loleaflet/src/map/handler/Map.Mouse.js
@@ -150,7 +150,7 @@ L.Map.Mouse = L.Handler.extend({
                                        var docLayer = this._map._docLayer;
                                        this._mouseEventsQueue = [];
                                        docLayer._postMouseEvent('buttonup', 
mousePos.x, mousePos.y, 1, buttons, modifier);
-                                       docLayer._textArea.focus();
+                                       
this._map._clipboardContainer.focus(true);
                                }, this));
                                this._holdMouseEvent = 
setTimeout(L.bind(this._executeMouseEvents, this), timeOut);
 
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits

Reply via email to