[Libreoffice-commits] online.git: Branch 'distro/collabora/co-4-2-3' - 2 commits - kit/ChildSession.cpp loleaflet/css loleaflet/Makefile.am loleaflet/src

Tamás Zolnai (via logerrit) logerrit at kemper.freedesktop.org
Sun May 10 15:16:31 UTC 2020


 kit/ChildSession.cpp                        |    3 +
 loleaflet/Makefile.am                       |    1 
 loleaflet/css/loleaflet.css                 |   23 ++++++++
 loleaflet/src/layer/FormFieldButtonLayer.js |   75 ++++++++++++++++++++++++++++
 loleaflet/src/layer/tile/TileLayer.js       |   22 ++++++++
 loleaflet/src/map/Map.js                    |    1 
 6 files changed, 125 insertions(+)

New commits:
commit 33dbdffcaf176594b6b965712376a1d59da4925b
Author:     Tamás Zolnai <tamas.zolnai at collabora.com>
AuthorDate: Thu Apr 30 14:34:09 2020 +0200
Commit:     Andras Timar <andras.timar at collabora.com>
CommitDate: Sun May 10 17:16:23 2020 +0200

    MSForms: styling form field button.
    
    Change-Id: I4bbcc16aa8afb0fa7e8e84d34e1f18086f0b8615
    (cherry picked from commit 87b862a4e2fafe2c420f672af835929d588757a2)
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/93883
    Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
    Reviewed-by: Andras Timar <andras.timar at collabora.com>

diff --git a/loleaflet/css/loleaflet.css b/loleaflet/css/loleaflet.css
index 834579ade..7f874c222 100644
--- a/loleaflet/css/loleaflet.css
+++ b/loleaflet/css/loleaflet.css
@@ -528,7 +528,25 @@ body {
 		-o-user-select: none;
 }
 
-.drop-down-button {
-	background: #FF0000;
+.form-field-frame {
+	border: 1px solid;
 	position: absolute;
+	height: 100%;
+}
+
+.form-field-button {
+	background: #FFFFFF;
+	position: absolute;
+	border: 1px solid;
+	height: 100%;
+	box-sizing: content-box;
+	padding: 0px;
+}
+
+.form-field-button:hover, .form-field-button:focus {
+  background: #DDDDDD;
+}
+
+.form-field-button-image {
+	margin: 3px;
 }
diff --git a/loleaflet/src/layer/FormFieldButtonLayer.js b/loleaflet/src/layer/FormFieldButtonLayer.js
index bbbb0d721..169f030e0 100644
--- a/loleaflet/src/layer/FormFieldButtonLayer.js
+++ b/loleaflet/src/layer/FormFieldButtonLayer.js
@@ -20,11 +20,14 @@ L.FormFieldButton = L.Layer.extend({
 	},
 
 	onAdd: function (map) {
-		if (this._button) {
-			L.DomUtil.remove(this._button);
-		}
+		this._clearButton();
 
-		this._button = L.DomUtil.create('div', 'drop-down-button', this.getPane('formfieldPane'));
+		this._buildFormButton(map);
+	},
+
+	_buildFormButton: function(map) {
+		// Create a frame around the text area
+		this._frame = L.DomUtil.create('div', 'form-field-frame', this.getPane('formfieldPane'));
 		var buttonAreaLatLng = new L.LatLngBounds(
 				map._docLayer._twipsToLatLng(this._buttonAreaTwips[0], this._map.getZoom()),
 				map._docLayer._twipsToLatLng(this._buttonAreaTwips[1], this._map.getZoom()));
@@ -33,17 +36,40 @@ L.FormFieldButton = L.Layer.extend({
 				this._map.latLngToLayerPoint(buttonAreaLatLng.getNorthWest()),
 				this._map.latLngToLayerPoint(buttonAreaLatLng.getSouthEast()));
 
+		// Use a small padding between the text and the frame
+		var extraPadding = 2;
 		var size = buttonAreaLayer.getSize();
-		this._button.style.width  = size.x + 'px';
-		this._button.style.height = size.y + 'px';
+		this._frame.style.width = (size.x + 1.5 * extraPadding) + 'px';
+
+		this.getPane('formfieldPane').style.height = (size.y + 1.5 * extraPadding) + 'px';
+
+		var framePos = new L.Point(buttonAreaLayer.min.x - extraPadding, buttonAreaLayer.min.y - extraPadding);
+		L.DomUtil.setPosition(this._frame, framePos);
 
-		var pos = buttonAreaLayer.min;
-		L.DomUtil.setPosition(this._button, pos);
+		// Add a drop down button to open the list
+		this._button = L.DomUtil.create('button', 'form-field-button', this.getPane('formfieldPane'));
+		var buttonPos = new L.Point(buttonAreaLayer.max.x + extraPadding, buttonAreaLayer.min.y - extraPadding);
+		L.DomUtil.setPosition(this._button, buttonPos);
+		this._button.style.width = this.getPane('formfieldPane').style.height;
+
+		var image = L.DomUtil.create('img', 'form-field-button-image', this._button);
+		image.src = 'images/unfold.svg';
 	},
 
 	onRemove: function () {
-		L.DomUtil.remove(this._button);
-		this._button = undefined;
+		this._clearButton();
 	},
 
+	_clearButton: function() {
+		this.getPane('formfieldPane').innerHTML = '';
+		if (this._frame) {
+			L.DomUtil.remove(this._frame);
+			this._frame = undefined;
+		}
+		if (this._button) {
+			L.DomUtil.remove(this._button);
+			this._button = undefined;
+		}
+	}
+
 });
commit 0a2c082dc8959105d1bd95eb0499ef6f4fda5089
Author:     Tamás Zolnai <tamas.zolnai at collabora.com>
AuthorDate: Wed Apr 29 13:36:05 2020 +0200
Commit:     Andras Timar <andras.timar at collabora.com>
CommitDate: Sun May 10 17:16:13 2020 +0200

    MSForms: handle formfieldbutton message.
    
    (cherry picked from commit d2629961e0ca99bdebcfa0e3711abe6d5cc8cbcb)
    
    Change-Id: I17243823d9bc0074b7fd015bca23de9399e0e26c
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/93854
    Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
    Reviewed-by: Andras Timar <andras.timar at collabora.com>

diff --git a/kit/ChildSession.cpp b/kit/ChildSession.cpp
index b02e7a17a..e70cfde2e 100644
--- a/kit/ChildSession.cpp
+++ b/kit/ChildSession.cpp
@@ -2568,6 +2568,9 @@ void ChildSession::loKitCallback(const int type, const std::string& payload)
     case LOK_CALLBACK_TAB_STOP_LIST:
         sendTextFrame("tabstoplistupdate: " + payload);
         break;
+    case LOK_CALLBACK_FORM_FIELD_BUTTON:
+        sendTextFrame("formfieldbutton: " + payload);
+        break;
 
 #if !ENABLE_DEBUG
     // we want a compilation-time failure in the debug builds; but ERR in the
diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am
index 4bb2b1c84..bfebbbf45 100644
--- a/loleaflet/Makefile.am
+++ b/loleaflet/Makefile.am
@@ -229,6 +229,7 @@ LOLEAFLET_JS =\
 	src/layer/vector/Path.Transform.SVG.VML.js \
 	src/layer/vector/Canvas.js \
 	src/layer/vector/Path.Transform.Canvas.js \
+	src/layer/FormFieldButtonLayer.js \
 	src/dom/DomEvent.js \
 	src/dom/Draggable.js \
 	src/map/handler/Map.Drag.js \
diff --git a/loleaflet/css/loleaflet.css b/loleaflet/css/loleaflet.css
index 40b782d95..834579ade 100644
--- a/loleaflet/css/loleaflet.css
+++ b/loleaflet/css/loleaflet.css
@@ -527,3 +527,8 @@ body {
 		-webkit-user-select: none;
 		-o-user-select: none;
 }
+
+.drop-down-button {
+	background: #FF0000;
+	position: absolute;
+}
diff --git a/loleaflet/src/layer/FormFieldButtonLayer.js b/loleaflet/src/layer/FormFieldButtonLayer.js
new file mode 100644
index 000000000..bbbb0d721
--- /dev/null
+++ b/loleaflet/src/layer/FormFieldButtonLayer.js
@@ -0,0 +1,49 @@
+/* -*- js-indent-level: 8 -*- */
+/*
+ * L.FormFieldButton is used to interact with text based form fields.
+ */
+
+L.FormFieldButton = L.Layer.extend({
+
+	options: {
+		pane: 'formfieldPane'
+	},
+
+	initialize: function (data) {
+		if (data.type === 'drop-down') {
+			var strTwips = data.textArea.match(/\d+/g);
+			var topLeftTwips = new L.Point(parseInt(strTwips[0]), parseInt(strTwips[1]));
+			var offset = new L.Point(parseInt(strTwips[2]), parseInt(strTwips[3]));
+			var bottomRightTwips = topLeftTwips.add(offset);
+			this._buttonAreaTwips = [topLeftTwips, bottomRightTwips];
+		}
+	},
+
+	onAdd: function (map) {
+		if (this._button) {
+			L.DomUtil.remove(this._button);
+		}
+
+		this._button = L.DomUtil.create('div', 'drop-down-button', this.getPane('formfieldPane'));
+		var buttonAreaLatLng = new L.LatLngBounds(
+				map._docLayer._twipsToLatLng(this._buttonAreaTwips[0], this._map.getZoom()),
+				map._docLayer._twipsToLatLng(this._buttonAreaTwips[1], this._map.getZoom()));
+
+		var buttonAreaLayer = new L.Bounds(
+				this._map.latLngToLayerPoint(buttonAreaLatLng.getNorthWest()),
+				this._map.latLngToLayerPoint(buttonAreaLatLng.getSouthEast()));
+
+		var size = buttonAreaLayer.getSize();
+		this._button.style.width  = size.x + 'px';
+		this._button.style.height = size.y + 'px';
+
+		var pos = buttonAreaLayer.min;
+		L.DomUtil.setPosition(this._button, pos);
+	},
+
+	onRemove: function () {
+		L.DomUtil.remove(this._button);
+		this._button = undefined;
+	},
+
+});
diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js
index 1b413f9d7..6deb6808f 100644
--- a/loleaflet/src/layer/tile/TileLayer.js
+++ b/loleaflet/src/layer/tile/TileLayer.js
@@ -719,6 +719,17 @@ L.TileLayer = L.GridLayer.extend({
 		else if (textMsg.startsWith('tabstoplistupdate:')) {
 			this._onTabStopListUpdate(textMsg);
 		}
+		else if (textMsg.startsWith('context:')) {
+			var message = textMsg.substring('context:'.length + 1);
+			message = message.split(' ');
+			if (message.length > 1) {
+				this._map.fire('contextchange', {context: message[1]});
+			}
+		}
+		else if (textMsg.startsWith('formfieldbutton:')) {
+			this._onFormFieldButtonMsg(textMsg);
+			console.error(textMsg);
+		}
 	},
 
 	_onTabStopListUpdate: function (textMsg) {
@@ -3346,6 +3357,17 @@ L.TileLayer = L.GridLayer.extend({
 		this._previewInvalidations = [];
 	},
 
+	_onFormFieldButtonMsg: function (textMsg) {
+		textMsg = textMsg.substring('formfieldbutton:'.length + 1);
+		var json = JSON.parse(textMsg);
+		if (json.action === 'show') {
+			this._formFieldButton = new L.FormFieldButton(json);
+			this._map.addLayer(this._formFieldButton);
+		} else {
+			this._map.removeLayer(this._formFieldButton);
+		}
+	},
+
 	_debugGetTimeArray: function() {
 		return {count: 0, ms: 0, best: Number.MAX_SAFE_INTEGER, worst: 0, date: 0};
 	},
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 982cde654..18b168a1e 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -1045,6 +1045,7 @@ L.Map = L.Evented.extend({
 		this.createPane('overlayPane');
 		this.createPane('markerPane');
 		this.createPane('popupPane');
+		this.createPane('formfieldPane');
 
 		if (!this.options.markerZoomAnimation) {
 			L.DomUtil.addClass(panes.markerPane, 'leaflet-zoom-hide');


More information about the Libreoffice-commits mailing list