[Libreoffice-commits] online.git: loleaflet/css loleaflet/src
Szymon KÅos (via logerrit)
logerrit at kemper.freedesktop.org
Fri May 1 13:28:06 UTC 2020
loleaflet/css/notebookbar.css | 32 +++++-
loleaflet/src/control/Control.JSDialogBuilder.js | 2
loleaflet/src/control/Control.Notebookbar.js | 3
loleaflet/src/control/Control.NotebookbarBuilder.js | 106 +++++++++++++++-----
loleaflet/src/control/Control.UIManager.js | 8 -
5 files changed, 123 insertions(+), 28 deletions(-)
New commits:
commit 83b1ce546028c094e74cdba29efd449b214b6aa1
Author: Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Thu Apr 23 10:09:23 2020 +0200
Commit: Szymon Kłos <szymon.klos at collabora.com>
CommitDate: Fri May 1 15:27:46 2020 +0200
notebookbar: reduce size
- changed icon size to 24x24
- table structure is flatter
- uno buttons without label
Change-Id: I63a68aac4f91633b10bfa93f5882b46b8a0fea12
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/93263
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Szymon Kłos <szymon.klos at collabora.com>
diff --git a/loleaflet/css/notebookbar.css b/loleaflet/css/notebookbar.css
index 0b6e16791..b951e8815 100644
--- a/loleaflet/css/notebookbar.css
+++ b/loleaflet/css/notebookbar.css
@@ -1,4 +1,6 @@
+/* tabs */
+
.ui-tabs.notebookbar {
display: inline-block;
}
@@ -7,4 +9,32 @@
float: left;
margin-right: 10px;
font-size: 12pt;
-}
\ No newline at end of file
+}
+
+/* root container */
+
+.root-container.notebookbar {
+ position: fixed;
+ top: 20px;
+}
+
+/* unobuttons */
+
+#SendToBack.notebookbar, #ObjectBackOne.notebookbar, #ObjectForwardOne.notebookbar, #BringToFront.notebookbar, #SetObjectToBackground.notebookbar, #SetObjectToForeground.notebookbar, #FlipVertical.notebookbar, #FlipHorizontal.notebookbar, #Bold.notebookbar, #Italic.notebookbar, #Underline.notebookbar, #Strikeout.notebookbar, #StyleApply.notebookbar, #StyleUpdateByExample.notebookbar, #StyleNewByExample.notebookbar, #Shadowed.notebookbar, #Grow.notebookbar, #Shrink.notebookbar, #Spacing.notebookbar, #SuperScript.notebookbar, #SubScript.notebookbar,#AlignLeft.notebookbar, #AlignRight.notebookbar, #AlignHorizontalCenter.notebookbar, #AlignBlock.notebookbar, #ParaRightToLeft.notebookbar, #ParaLeftToRight.notebookbar, #AlignTop.notebookbar, #AlignVCenter.notebookbar, #AlignBottom.notebookbar, #IncrementIndent.notebookbar, #DecrementIndent.notebookbar, #LeftPara.notebookbar, #RightPara.notebookbar, #CenterPara.notebookbar, #JustifyPara.notebookbar, #DefaultBullet.notebookbar, #DefaultNumb
ering.notebookbar, #ParaspaceIncrease.notebookbar, #ParaspaceDecrease.notebookbar, #LineSpacing.notebookbar, #HangingIndent.notebookbar, #CellVertTop.notebookbar, #CellVertCenter.notebookbar, #CellVertBottom.notebookbar, #ParaspaceIncrease.notebookbar, #ParaspaceDecrease.notebookbar, #DeleteTable.notebookbar, #MergeCells.notebookbar{
+ padding: 0px !important;
+ margin: 0px !important;
+}
+
+#buttonbefore.notebookbar, #buttonafter.notebookbar, #buttonoptimal.notebookbar, #buttonparallel.notebookbar, #buttonnone.notebookbar, #buttonthrough.notebookbar, #bottom.notebookbar, #top.notebookbar, #standard.notebookbar, #Bold.notebookbar, #Italic.notebookbar, #Underline.notebookbar, #Strikeout.notebookbar{
+ margin: 0px !important;
+ padding: 0px !important;
+}
+
+.unotoolbutton.notebookbar .unobutton {
+ width: 24px !important;
+ height: 24px !important;
+}
+
+.ui-content.notebookbar .unobutton.selected {
+ box-shadow: 0 0 0px 4px #e6e6e640 !important;
+}
diff --git a/loleaflet/src/control/Control.JSDialogBuilder.js b/loleaflet/src/control/Control.JSDialogBuilder.js
index 60cfd41de..ce7e24da7 100644
--- a/loleaflet/src/control/Control.JSDialogBuilder.js
+++ b/loleaflet/src/control/Control.JSDialogBuilder.js
@@ -1505,7 +1505,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
_unoToolButton: function(parentContainer, data, builder) {
var button = null;
- var div = this._createIdentifiable('div', 'ui-content unospan', parentContainer, data);
+ var div = this._createIdentifiable('div', 'unotoolbutton ' + builder.cssClass + ' ui-content unospan', parentContainer, data);
if (data.command) {
var id = data.command.substr('.uno:'.length);
diff --git a/loleaflet/src/control/Control.Notebookbar.js b/loleaflet/src/control/Control.Notebookbar.js
index ea04ff973..cdab92abe 100644
--- a/loleaflet/src/control/Control.Notebookbar.js
+++ b/loleaflet/src/control/Control.Notebookbar.js
@@ -21,6 +21,9 @@ L.Control.Notebookbar = L.Control.extend({
$('nav').prepend(tabs);
},
+ // required, called by builder, not needed in this container
+ setCurrentScrollPosition: function() {},
+
getHomeTab: function() {
return '';
}
diff --git a/loleaflet/src/control/Control.NotebookbarBuilder.js b/loleaflet/src/control/Control.NotebookbarBuilder.js
index bb2d968e2..2a0b7b8cf 100644
--- a/loleaflet/src/control/Control.NotebookbarBuilder.js
+++ b/loleaflet/src/control/Control.NotebookbarBuilder.js
@@ -11,24 +11,77 @@ L.Control.NotebookbarBuilder = L.Control.JSDialogBuilder.extend({
},
_overrideHandlers: function() {
- this._controlHandlers['combobox'] = undefined;
- this._controlHandlers['listbox'] = undefined;
-
- this._toolitemHandlers['.uno:XLineColor'] = undefined;
- this._toolitemHandlers['.uno:SelectWidth'] = undefined;
- this._toolitemHandlers['.uno:FontColor'] = undefined;
- this._toolitemHandlers['.uno:BackColor'] = undefined;
- this._toolitemHandlers['.uno:CharBackColor'] = undefined;
- this._toolitemHandlers['.uno:BackgroundColor'] = undefined;
- this._toolitemHandlers['.uno:FrameLineColor'] = undefined;
- this._toolitemHandlers['.uno:Color'] = undefined;
- this._toolitemHandlers['.uno:FillColor'] = undefined;
- this._toolitemHandlers['.uno:ResetAttributes'] = undefined;
+ this._controlHandlers['combobox'] = function() {return false;};
+ this._controlHandlers['listbox'] = function() {return false;};
+
+ this._toolitemHandlers['.uno:XLineColor'] = function() {};
+ this._toolitemHandlers['.uno:SelectWidth'] = function() {};
+ this._toolitemHandlers['.uno:FontColor'] = function() {};
+ this._toolitemHandlers['.uno:BackColor'] = function() {};
+ this._toolitemHandlers['.uno:CharBackColor'] = function() {};
+ this._toolitemHandlers['.uno:BackgroundColor'] = function() {};
+ this._toolitemHandlers['.uno:FrameLineColor'] = function() {};
+ this._toolitemHandlers['.uno:Color'] = function() {};
+ this._toolitemHandlers['.uno:FillColor'] = function() {};
+ this._toolitemHandlers['.uno:ResetAttributes'] = function() {};
},
- build: function(parent, data, hasVerticalParent) {
+ _unoToolButton: function(parentContainer, data, builder) {
+ var button = null;
+
+ var div = this._createIdentifiable('div', 'unotoolbutton ' + builder.options.cssClass + ' ui-content unospan', parentContainer, data);
+
+ if (data.command) {
+ var id = data.command.substr('.uno:'.length);
+ div.id = id;
+
+ var icon = builder._createIconPath(data.command);
+ var buttonId = id + 'img';
+
+ button = L.DomUtil.create('img', 'ui-content unobutton', div);
+ button.src = icon;
+ button.id = buttonId;
+
+ var updateFunction = function() {
+ var items = builder.map['stateChangeHandler'];
+ var state = items.getItemValue(data.command);
+
+ if (state && state === 'true')
+ $(button).addClass('selected');
+ else
+ $(button).removeClass('selected');
+ };
+
+ updateFunction();
+
+ builder.map.on('commandstatechanged', function(e) {
+ if (e.commandName === data.command)
+ updateFunction();
+ }, this);
+
+ } else {
+ button = L.DomUtil.create('label', 'ui-content unolabel', div);
+ button.innerHTML = builder._cleanText(data.text);
+ }
+
+ $(div).click(function () {
+ builder.callback('toolbutton', 'click', button, data.command, builder);
+ });
+
+ if (data.enabled == 'false')
+ $(button).attr('disabled', 'disabled');
+
+ return false;
+ },
+
+ build: function(parent, data, hasVerticalParent, parentHasManyChildren) {
this._amendJSDialogData(data);
+ if (hasVerticalParent === undefined) {
+ parent = L.DomUtil.create('table', 'root-container ' + this.options.cssClass, parent);
+ parent = L.DomUtil.create('tr', '', parent);
+ }
+
var containerToInsert = parent;
for (var childIndex in data) {
@@ -36,11 +89,15 @@ L.Control.NotebookbarBuilder = L.Control.JSDialogBuilder.extend({
if (!childData)
continue;
- if (!hasVerticalParent)
- var td = L.DomUtil.create('td', '', containerToInsert);
- else {
- containerToInsert = L.DomUtil.create('tr', '', parent);
- td = L.DomUtil.create('td', '', containerToInsert);
+ if (parentHasManyChildren) {
+ if (!hasVerticalParent)
+ var td = L.DomUtil.create('td', '', containerToInsert);
+ else {
+ containerToInsert = L.DomUtil.create('tr', '', parent);
+ td = L.DomUtil.create('td', '', containerToInsert);
+ }
+ } else {
+ td = containerToInsert;
}
var isVertical = childData.vertical === 'true' ? true : false;
@@ -54,8 +111,13 @@ L.Control.NotebookbarBuilder = L.Control.JSDialogBuilder.extend({
continue;
}
- var table = L.DomUtil.create('table', '', td);
- var childObject = L.DomUtil.create('tr', '', table);
+ var hasManyChildren = childData.children && childData.children.length > 1;
+ if (hasManyChildren) {
+ var table = L.DomUtil.create('table', '', td);
+ var childObject = L.DomUtil.create('tr', '', table);
+ } else {
+ childObject = td;
+ }
var handler = this._controlHandlers[childType];
var twoPanelsAsChildren =
@@ -73,7 +135,7 @@ L.Control.NotebookbarBuilder = L.Control.JSDialogBuilder.extend({
console.warn('Unsupported control type: \"' + childType + '\"');
if (processChildren && childData.children != undefined)
- this.build(childObject, childData.children, isVertical);
+ this.build(childObject, childData.children, isVertical, hasManyChildren);
else if (childData.visible && (childData.visible === false || childData.visible === 'false')) {
$('#' + childData.id).addClass('hidden-from-event');
}
diff --git a/loleaflet/src/control/Control.UIManager.js b/loleaflet/src/control/Control.UIManager.js
index f9dd3d7c9..417fc0fc9 100644
--- a/loleaflet/src/control/Control.UIManager.js
+++ b/loleaflet/src/control/Control.UIManager.js
@@ -68,10 +68,10 @@ L.Control.UIManager = L.Control.extend({
} else if (window.enableNotebookbar) {
this.map.addControl(L.control.notebookbar({docType: docType}));
- this.moveObjectVertically($('#spreadsheet-row-column-frame'), 36);
- this.moveObjectVertically($('#document-container'), 77);
- this.moveObjectVertically($('#presentation-controls-wrapper'), 36);
- this.moveObjectVertically($('#sidebar-dock-wrapper'), 36);
+ this.moveObjectVertically($('#spreadsheet-row-column-frame'), 40);
+ this.moveObjectVertically($('#document-container'), 81);
+ this.moveObjectVertically($('#presentation-controls-wrapper'), 40);
+ this.moveObjectVertically($('#sidebar-dock-wrapper'), 40);
}
if (docType === 'spreadsheet') {
More information about the Libreoffice-commits
mailing list