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.k...@collabora.com> AuthorDate: Thu Apr 23 10:09:23 2020 +0200 Commit: Szymon Kłos <szymon.k...@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 <jenkinscollaboraoff...@gmail.com> Reviewed-by: Szymon Kłos <szymon.k...@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') { _______________________________________________ Libreoffice-commits mailing list libreoffice-comm...@lists.freedesktop.org https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits