[Libreoffice-commits] online.git: loleaflet/css loleaflet/images loleaflet/src

[Marco Cecchetti (via logerrit)]

 loleaflet/css/toolbar.css                        |    1 +
 loleaflet/images/lc_charfontname.svg             |    1 +
 loleaflet/images/lc_fontheight.svg               |    1 +
 loleaflet/src/control/Control.JSDialogBuilder.js |   22 ++++++++++++++++------
 4 files changed, 19 insertions(+), 6 deletions(-)

New commits:
commit e7f79f4f1c13236512333098024f6bd783b98649
Author:     Marco Cecchetti <marco.cecchetti at collabora.com>
AuthorDate: Wed Oct 9 18:13:05 2019 +0200
Commit:     Marco Cecchetti <marco.cecchetti at collabora.com>
CommitDate: Wed Oct 9 19:04:44 2019 +0200

    loleaflet: icons for expandable entries
    
    Change-Id: I1698b540226e8342a59300b640c7113e48f6f1b3

diff --git a/loleaflet/css/toolbar.css b/loleaflet/css/toolbar.css
index 390dea08e..fb7475ce0 100644
--- a/loleaflet/css/toolbar.css
+++ b/loleaflet/css/toolbar.css
@@ -1065,6 +1065,7 @@ tr.useritem > td > img {
 .menu-entry-icon {
 	width: 32px;
 	height: 32px;
+	vertical-align: middle;
 	background: transparent;
 }
 
diff --git a/loleaflet/images/lc_charfontname.svg b/loleaflet/images/lc_charfontname.svg
new file mode 100644
index 000000000..78a1c82e9
--- /dev/null
+++ b/loleaflet/images/lc_charfontname.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m10.048828 2-7.048828 20h2.9863281c.3203884 0 .5871891-.090762.8007813-.271484.2233009-.190763.3735019-.396304.4511718-.617188l1.2089844-3.916016h7.1210934l1.222657 3.931641c.097088.251004.247289.462129.451172.632813.203883.160642.4766.240234.816406.240234h2.941406l-7.048828-20zm1.9375 3.6445312c.126214.4919681.250739.9494071.376953 1.3710938.126214.4116466.24873.7727394.365235 1.0839844l1.964843 6.3242186h-5.3867184l1.9648434-6.3085936c.106797-.311245.223396-.6779227.34961-1.0996094.126213-.4216867.248729-.8791258.365234-1.3710938z" fill="#696969"/></svg>
diff --git a/loleaflet/images/lc_fontheight.svg b/loleaflet/images/lc_fontheight.svg
new file mode 100644
index 000000000..cccd0cd97
--- /dev/null
+++ b/loleaflet/images/lc_fontheight.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><text fill="#696969" font-family="sans-serif" font-size="23.924654" letter-spacing="0" transform="scale(.96960275 1.0313502)" word-spacing="0" x="2.015973" y="21.331261"><tspan fill="#696969" font-family="Carlito" font-weight="bold" x="2.015973" y="21.331261">A</tspan></text><g fill="none" stroke="#4d82b8" stroke-linecap="round" stroke-linejoin="round"><g transform="matrix(0 1 -1 0 24 -4.007121)"><path d="m8.507121 1.494946-2.9999998 2.9949499 2.9999998 3.0050501"/><path d="m5.5071212 4.4898959h7.9999998"/></g><g transform="matrix(0 -1 -1 0 24 28)"><path d="m8.507121 1.494946-2.9999998 2.9949499 2.9999998 3.0050501"/><path d="m5.5071212 4.4898959h7.9928788"/></g></g></svg>
diff --git a/loleaflet/src/control/Control.JSDialogBuilder.js b/loleaflet/src/control/Control.JSDialogBuilder.js
index e3852b256..c094f8afb 100644
--- a/loleaflet/src/control/Control.JSDialogBuilder.js
+++ b/loleaflet/src/control/Control.JSDialogBuilder.js
@@ -141,9 +141,17 @@ L.Control.JSDialogBuilder = L.Control.extend({
 		return null;
 	},
 
-	_explorableEntry: function(parentContainer, title, contentNode, builder) {
+	_explorableEntry: function(parentContainer, title, contentNode, builder, iconPath) {
 		var sectionTitle = L.DomUtil.create('div', 'ui-header level-' + builder._currentDepth + ' mobile-wizard ui-widget', parentContainer);
-		sectionTitle.innerHTML = title;
+		if (iconPath) {
+			var div = L.DomUtil.create('div', '', sectionTitle);
+			var icon = L.DomUtil.create('img', 'menu-entry-icon', div);
+			icon.src = iconPath;
+			var titleSpan = L.DomUtil.create('span', 'menu-entry-with-icon', div);
+			titleSpan.innerHTML = title;
+		} else {
+			sectionTitle.innerHTML = title;
+		}
 
 		$(sectionTitle).css('justify-content', 'space-between');
 
@@ -399,7 +407,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 		return false;
 	},
 
-	_comboboxControl: function(parentContainer, data, builder) {
+	_comboboxControl: function(parentContainer, data, builder, iconPath) {
 		// TODO: event listener in the next level...
 
 		if (!data.entries || data.entries.length == 0)
@@ -418,7 +426,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 
 		var contentNode = {type: 'container', children: entries};
 
-		builder._explorableEntry(parentContainer, title, contentNode, builder);
+		builder._explorableEntry(parentContainer, title, contentNode, builder, iconPath);
 
 		return false;
 	},
@@ -575,13 +583,15 @@ L.Control.JSDialogBuilder = L.Control.extend({
 	},
 
 	_fontNameControl: function(parentContainer, data, builder) {
+		var iconPath = 'images/lc_charfontname.svg';
 		data.entries = [ 'Liberation Sans' ];
-		builder._comboboxControl(parentContainer, data, builder);
+		builder._comboboxControl(parentContainer, data, builder, iconPath);
 	},
 
 	_fontHeightControl: function(parentContainer, data, builder) {
+		var iconPath = 'images/lc_fontheight.svg';
 		data.entries = [ '8', '10', '11', '12', '14', '16', '24', '32', '48' ];
-		builder._comboboxControl(parentContainer, data, builder);
+		builder._comboboxControl(parentContainer, data, builder, iconPath);
 	},
 
 	build: function(parent, data) {