[Libreoffice-commits] online.git: 2 commits - loleaflet/Makefile.am loleaflet/src
Szymon KÅ‚os (via logerrit)
logerrit at kemper.freedesktop.org
Thu Apr 16 14:01:41 UTC 2020
loleaflet/Makefile.am | 4
loleaflet/src/control/Control.SigningBar.js | 64 +++
loleaflet/src/control/Control.Toolbar.js | 564 ----------------------------
loleaflet/src/control/Control.TopToolbar.js | 554 +++++++++++++++++++++++++++
4 files changed, 628 insertions(+), 558 deletions(-)
New commits:
commit b69000b366b1b60782dbb0140a137f7658171ac4
Author: Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Thu Apr 16 13:19:55 2020 +0200
Commit: Szymon Kłos <szymon.klos at collabora.com>
CommitDate: Thu Apr 16 16:01:30 2020 +0200
Move top toolbar to separate file
Change-Id: I0465b32af1fbb2534aa6db41342df3993b7837bf
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/92349
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Szymon Kłos <szymon.klos at collabora.com>
diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am
index 7017c6e72..6c10bc441 100644
--- a/loleaflet/Makefile.am
+++ b/loleaflet/Makefile.am
@@ -271,6 +271,7 @@ LOLEAFLET_JS =\
src/control/Control.SheetsBar.js \
src/control/Control.PresentationBar.js \
src/control/Control.SigningBar.js \
+ src/control/Control.TopToolbar.js \
src/control/Control.Layers.js \
src/control/Search.js \
src/control/Permission.js \
@@ -545,6 +546,7 @@ pot:
src/control/Control.StatusBar.js \
src/control/Control.Tabs.js \
src/control/Control.Toolbar.js \
+ src/control/Control.TopToolbar.js \
src/control/Control.UserList.js \
src/control/Ruler.js \
src/control/Signing.js \
diff --git a/loleaflet/src/control/Control.Toolbar.js b/loleaflet/src/control/Control.Toolbar.js
index 33fd4ac46..005fbd21c 100644
--- a/loleaflet/src/control/Control.Toolbar.js
+++ b/loleaflet/src/control/Control.Toolbar.js
@@ -3,42 +3,12 @@
* LibreOffice Online toolbar
*/
-/* global $ w2ui w2utils vex _ _UNO */
+/* global $ w2ui vex _ */
/*eslint indent: [error, "tab", { "outerIIFEBody": 0 }]*/
(function(global) {
var map;
-function _updateVisibilityForToolbar(toolbar) {
- if (!toolbar)
- return;
-
- var toShow = [];
- var toHide = [];
-
- toolbar.items.forEach(function(item) {
- if (window.ThisIsTheiOSApp && window.mode.isTablet() && item.iosapptablet === false) {
- toHide.push(item.id);
- }
- else if (((window.mode.isMobile() && item.mobile === false) || (window.mode.isTablet() && item.tablet === false) || (window.mode.isDesktop() && item.desktop === false) || (!window.ThisIsAMobileApp && item.mobilebrowser === false)) && !item.hidden) {
- toHide.push(item.id);
- }
- else if (((window.mode.isMobile() && item.mobile === true) || (window.mode.isTablet() && item.tablet === true) || (window.mode.isDesktop() && item.desktop === true) || (window.ThisIsAMobileApp && item.mobilebrowser === true)) && item.hidden) {
- toShow.push(item.id);
- }
- });
-
- console.log('explicitly hiding: ' + toHide);
- console.log('explicitly showing: ' + toShow);
-
- toHide.forEach(function(item) { toolbar.hide(item); });
- toShow.forEach(function(item) { toolbar.show(item); });
-}
-
-function _updateToolbarsVisibility() {
- _updateVisibilityForToolbar(w2ui['editbar']);
-}
-
function resizeToolbar() {
if ($(window).width() !== map.getSize().x) {
var toolbarUp = w2ui['editbar'];
@@ -620,9 +590,6 @@ function hideTooltip(toolbar, id) {
}
}
-var stylesSelectValue;
-var fontsSelectValue;
-
function createToolbar() {
if (window.mode.isMobile()) {
@@ -634,197 +601,8 @@ function createToolbar() {
}
}
-// mobile:false means hide it both for normal Online used from a mobile phone browser, and in a mobile app on a mobile phone
-// mobilebrowser:false means hide it for normal Online used from a mobile browser, but don't hide it in a mobile app
-// tablet:true means show it in normal Online from a tablet browser, and in a mobile app on a tablet
-// tablet:false means hide it in normal Online used from a tablet browser, and in a mobile app on a tablet
-
-function createMainToolbar() {
- var toolItems = [
- {type: 'button', id: 'closemobile', img: 'closemobile', desktop: false, mobile: false, tablet: true, hidden: true},
- {type: 'button', id: 'save', img: 'save', hint: _UNO('.uno:Save')},
- {type: 'button', id: 'print', img: 'print', hint: _UNO('.uno:Print', 'text'), mobile: false, tablet: false},
- {type: 'break', id: 'savebreak', mobile: false},
- {type: 'button', id: 'undo', img: 'undo', hint: _UNO('.uno:Undo'), uno: 'Undo', disabled: true, mobile: false},
- {type: 'button', id: 'redo', img: 'redo', hint: _UNO('.uno:Redo'), uno: 'Redo', disabled: true, mobile: false},
- {type: 'button', id: 'formatpaintbrush', img: 'copyformat', hint: _UNO('.uno:FormatPaintbrush'), uno: 'FormatPaintbrush', mobile: false},
- {type: 'button', id: 'reset', img: 'deleteformat', hint: _UNO('.uno:ResetAttributes', 'text'), uno: 'ResetAttributes', mobile: false},
- {type: 'break', mobile: false, tablet: false,},
- {type: 'html', id: 'styles',
- html: '<select class="styles-select"><option>' + _('Default Style') + '</option></select>',
- onRefresh: function (edata) {
- if (!edata.item.html) {
- edata.isCancelled = true;
- } else {
- $.extend(edata, { onComplete: function (e) {
- $('.styles-select').select2();
- e.item.html = undefined;
- }});
- }
- }, hidden: true, desktop: true, mobile: false, tablet: false},
- {type: 'html', id: 'fonts',
- html: '<select class="fonts-select"><option>Liberation Sans</option></select>',
- onRefresh: function (edata) {
- if (!edata.item.html) {
- edata.isCancelled = true;
- } else {
- $.extend(edata, { onComplete: function (e) {
- $('.fonts-select').select2();
- e.item.html = undefined;
- }});
- }
- }, mobile: false},
- {type: 'html', id: 'fontsizes',
- html: '<select class="fontsizes-select">',
- onRefresh: function (edata) {
- if (!edata.item.html) {
- edata.isCancelled = true;
- } else {
- $.extend(edata, { onComplete: function (e) {
- $('.fontsizes-select').select2({ dropdownAutoWidth: true, width: 'auto'});
- e.item.html = undefined;
- }});
- }
- }, mobile: false},
- {type: 'break', id: 'breakstyles', mobile: false, tablet: false },
- {type: 'button', id: 'languagecode', desktop: false, mobile: true, tablet: false},
- {type: 'button', id: 'bold', img: 'bold', hint: _UNO('.uno:Bold'), uno: 'Bold'},
- {type: 'button', id: 'italic', img: 'italic', hint: _UNO('.uno:Italic'), uno: 'Italic'},
- {type: 'button', id: 'underline', img: 'underline', hint: _UNO('.uno:Underline'), uno: 'Underline'},
- {type: 'button', id: 'strikeout', img: 'strikeout', hint: _UNO('.uno:Strikeout'), uno: 'Strikeout'},
- {type: 'break', id: 'breakformatting'},
- {type: 'text-color', id: 'fontcolor', img: 'textcolor', hint: _UNO('.uno:FontColor')},
- {type: 'color', id: 'backcolor', img: 'backcolor', hint: _UNO('.uno:BackColor', 'text'), hidden: true},
- {type: 'color', id: 'backgroundcolor', img: 'backgroundcolor', hint: _UNO('.uno:BackgroundColor'), hidden: true},
- {type: 'break' , id: 'breakcolor', mobile:false},
- {type: 'button', id: 'leftpara', img: 'alignleft', hint: _UNO('.uno:LeftPara', '', true),
- uno: {textCommand: 'LeftPara', objectCommand: 'ObjectAlignLeft'},
- hidden: true, unosheet: 'AlignLeft', disabled: true},
- {type: 'button', id: 'centerpara', img: 'alignhorizontal', hint: _UNO('.uno:CenterPara', '', true),
- uno: {textCommand: 'CenterPara', objectCommand: 'AlignCenter'},
- hidden: true, unosheet: 'AlignHorizontalCenter', disabled: true},
- {type: 'button', id: 'rightpara', img: 'alignright', hint: _UNO('.uno:RightPara', '', true),
- uno: {textCommand: 'RightPara', objectCommand: 'ObjectAlignRight'},
- hidden: true, unosheet: 'AlignRight', disabled: true},
- {type: 'button', id: 'justifypara', img: 'alignblock', hint: _UNO('.uno:JustifyPara', '', true), uno: 'JustifyPara', hidden: true, unosheet: '', disabled: true},
- {type: 'break', id: 'breakpara', hidden: true},
- {type: 'drop', id: 'setborderstyle', img: 'setborderstyle', hint: _('Borders'), hidden: true,
- html: '<table id="setborderstyle-grid"><tr><td class="w2ui-tb-image w2ui-icon frame01" onclick="setBorderStyle(1)"></td>' +
- '<td class="w2ui-tb-image w2ui-icon frame02" onclick="setBorderStyle(2)"></td><td class="w2ui-tb-image w2ui-icon frame03" onclick="setBorderStyle(3)"></td>' +
- '<td class="w2ui-tb-image w2ui-icon frame04" onclick="setBorderStyle(4)"></td></tr><tr><td class="w2ui-tb-image w2ui-icon frame05" onclick="setBorderStyle(5)"></td>' +
- '<td class="w2ui-tb-image w2ui-icon frame06" onclick="setBorderStyle(6)"></td><td class="w2ui-tb-image w2ui-icon frame07" onclick="setBorderStyle(7)"></td>' +
- '<td class="w2ui-tb-image w2ui-icon frame08" onclick="setBorderStyle(8)"></td></tr><tr><td class="w2ui-tb-image w2ui-icon frame09" onclick="setBorderStyle(9)"></td>' +
- '<td class="w2ui-tb-image w2ui-icon frame10" onclick="setBorderStyle(10)"></td><td class="w2ui-tb-image w2ui-icon frame11" onclick="setBorderStyle(11)"></td>' +
- '<td class="w2ui-tb-image w2ui-icon frame12" onclick="setBorderStyle(12)"></td></tr><tr>' +
- '<td colspan="4" class="w2ui-tb-image w2ui-icon frame13" onclick="setBorderStyle(0)"><div id="div-frame13">' + _('More...') + '</div></td></tr></table>'
- },
- {type: 'button', id: 'togglemergecells', img: 'togglemergecells', hint: _UNO('.uno:ToggleMergeCells', 'spreadsheet', true), hidden: true, uno: 'ToggleMergeCells', disabled: true},
- {type: 'break', id: 'breakmergecells', hidden: true},
- {type: 'menu', id: 'textalign', img: 'alignblock', hint: _UNO('.uno:TextAlign'), hidden: true,
- items: [
- {id: 'alignleft', text: _UNO('.uno:AlignLeft', 'spreadsheet', true), icon: 'alignleft', uno: 'AlignLeft'},
- {id: 'alignhorizontalcenter', text: _UNO('.uno:AlignHorizontalCenter', 'spreadsheet', true), icon: 'alignhorizontal', uno: 'AlignHorizontalCenter'},
- {id: 'alignright', text: _UNO('.uno:AlignRight', 'spreadsheet', true), icon: 'alignright', uno: 'AlignRight'},
- {id: 'alignblock', text: _UNO('.uno:AlignBlock', 'spreadsheet', true), icon: 'alignblock', uno: 'AlignBlock'},
- ]},
- {type: 'menu', id: 'linespacing', img: 'linespacing', hint: _UNO('.uno:FormatSpacingMenu'), hidden: true,
- items: [
- {id: 'spacepara1', text: _UNO('.uno:SpacePara1'), uno: 'SpacePara1'},
- {id: 'spacepara15', text: _UNO('.uno:SpacePara15'), uno: 'SpacePara15'},
- {id: 'spacepara2', text: _UNO('.uno:SpacePara2'), uno: 'SpacePara2'},
- {type: 'break'},
- {id: 'paraspaceincrease', text: _UNO('.uno:ParaspaceIncrease'), uno: 'ParaspaceIncrease'},
- {id: 'paraspacedecrease', text: _UNO('.uno:ParaspaceDecrease'), uno: 'ParaspaceDecrease'}
- ]},
- {type: 'button', id: 'wraptext', img: 'wraptext', hint: _UNO('.uno:WrapText', 'spreadsheet', true), hidden: true, uno: 'WrapText', disabled: true},
- {type: 'break', id: 'breakspacing', hidden: true},
- {type: 'button', id: 'defaultnumbering', img: 'numbering', hint: _UNO('.uno:DefaultNumbering', '', true), hidden: true, uno: 'DefaultNumbering', disabled: true},
- {type: 'button', id: 'defaultbullet', img: 'bullet', hint: _UNO('.uno:DefaultBullet', '', true), hidden: true, uno: 'DefaultBullet', disabled: true},
- {type: 'break', id: 'breakbullet', hidden: true},
- {type: 'button', id: 'incrementindent', img: 'incrementindent', hint: _UNO('.uno:IncrementIndent', '', true), uno: 'IncrementIndent', hidden: true, disabled: true},
- {type: 'button', id: 'decrementindent', img: 'decrementindent', hint: _UNO('.uno:DecrementIndent', '', true), uno: 'DecrementIndent', hidden: true, disabled: true},
- {type: 'break', id: 'breakindent', hidden: true},
- {type: 'button', id: 'sortascending', img: 'sortascending', hint: _UNO('.uno:SortAscending', 'spreadsheet', true), uno: 'SortAscending', disabled: true, hidden: true},
- {type: 'button', id: 'sortdescending', img: 'sortdescending', hint: _UNO('.uno:SortDescending', 'spreadsheet', true), uno: 'SortDescending', disabled: true, hidden: true},
- {type: 'break', id: 'breaksorting', hidden: true},
- {type: 'drop', id: 'conditionalformaticonset', img: 'conditionalformatdialog', hint: _UNO('.uno:ConditionalFormatMenu', 'spreadsheet', true), hidden: true,
- html: '<table id="conditionalformatmenu-grid"><tr>' +
- '<td class="w2ui-tb-image w2ui-icon iconset00" onclick="setConditionalFormatIconSet(0)"/><td class="w2ui-tb-image w2ui-icon iconset01" onclick="setConditionalFormatIconSet(1)"/><td class="w2ui-tb-image w2ui-icon iconset02" onclick="setConditionalFormatIconSet(2)"/></tr><tr>' +
- '<td class="w2ui-tb-image w2ui-icon iconset03" onclick="setConditionalFormatIconSet(3)"/><td class="w2ui-tb-image w2ui-icon iconset04" onclick="setConditionalFormatIconSet(4)"/><td class="w2ui-tb-image w2ui-icon iconset05" onclick="setConditionalFormatIconSet(5)"/></tr><tr>' +
- '<td class="w2ui-tb-image w2ui-icon iconset06" onclick="setConditionalFormatIconSet(6)"/><td class="w2ui-tb-image w2ui-icon iconset08" onclick="setConditionalFormatIconSet(8)"/><td class="w2ui-tb-image w2ui-icon iconset09" onclick="setConditionalFormatIconSet(9)"/></tr><tr>' + // iconset07 deliberately left out, see the .css for the reason
- '<td class="w2ui-tb-image w2ui-icon iconset10" onclick="setConditionalFormatIconSet(10)"/><td class="w2ui-tb-image w2ui-icon iconset11" onclick="setConditionalFormatIconSet(11)"/><td class="w2ui-tb-image w2ui-icon iconset12" onclick="setConditionalFormatIconSet(12)"/></tr><tr>' +
- '<td class="w2ui-tb-image w2ui-icon iconset13" onclick="setConditionalFormatIconSet(13)"/><td class="w2ui-tb-image w2ui-icon iconset14" onclick="setConditionalFormatIconSet(14)"/><td class="w2ui-tb-image w2ui-icon iconset15" onclick="setConditionalFormatIconSet(15)"/></tr><tr>' +
- '<td class="w2ui-tb-image w2ui-icon iconset16" onclick="setConditionalFormatIconSet(16)"/><td class="w2ui-tb-image w2ui-icon iconset17" onclick="setConditionalFormatIconSet(17)"/><td class="w2ui-tb-image w2ui-icon iconset18" onclick="setConditionalFormatIconSet(18)"/></tr><tr>' +
- '<td class="w2ui-tb-image w2ui-icon iconset19" onclick="setConditionalFormatIconSet(19)"/><td class="w2ui-tb-image w2ui-icon iconset20" onclick="setConditionalFormatIconSet(20)"/><td class="w2ui-tb-image w2ui-icon iconset21" onclick="setConditionalFormatIconSet(21)"/></tr></table>'
- },
- {type: 'button', id: 'numberformatcurrency', img: 'numberformatcurrency', hint: _UNO('.uno:NumberFormatCurrency', 'spreadsheet', true), hidden: true, uno: 'NumberFormatCurrency', disabled: true},
- {type: 'button', id: 'numberformatpercent', img: 'numberformatpercent', hint: _UNO('.uno:NumberFormatPercent', 'spreadsheet', true), hidden: true, uno: 'NumberFormatPercent', disabled: true},
- {type: 'button', id: 'numberformatdecdecimals', img: 'numberformatdecdecimals', hint: _UNO('.uno:NumberFormatDecDecimals', 'spreadsheet', true), hidden: true, uno: 'NumberFormatDecDecimals', disabled: true},
- {type: 'button', id: 'numberformatincdecimals', img: 'numberformatincdecimals', hint: _UNO('.uno:NumberFormatIncDecimals', 'spreadsheet', true), hidden: true, uno: 'NumberFormatIncDecimals', disabled: true},
- {type: 'break', id: 'break-number', hidden: true},
- {type: 'button', id: 'inserttextbox', img: 'text', hint: _UNO('.uno:Text', '', true), uno: 'Text?CreateDirectly:bool=true', hidden: true},
- {type: 'button', id: 'insertannotation', img: 'annotation', hint: _UNO('.uno:InsertAnnotation', '', true), hidden: true},
- {type: 'drop', id: 'inserttable', img: 'inserttable', hint: _('Insert table'), hidden: true, overlay: {onShow: insertTable},
- html: '<div id="inserttable-wrapper"><div id="inserttable-popup" class="inserttable-pop ui-widget ui-corner-all"><div class="inserttable-grid"></div><div id="inserttable-status" class="loleaflet-font" style="padding: 5px;"><br/></div></div></div>'},
- {type: 'button', id: 'insertgraphic', img: 'insertgraphic', hint: _UNO('.uno:InsertGraphic', '', true)},
- {type: 'menu', id: 'menugraphic', img: 'insertgraphic', hint: _UNO('.uno:InsertGraphic', '', true), hidden: true,
- items: [
- {id: 'localgraphic', text: _('Insert Local Image')},
- {id: 'remotegraphic', text: _UNO('.uno:InsertGraphic', '', true)},
- ]},
- {type: 'button', id: 'insertobjectchart', img: 'insertobjectchart', hint: _UNO('.uno:InsertObjectChart', '', true), uno: 'InsertObjectChart'},
- {type: 'drop', id: 'insertshapes', img: 'basicshapes_ellipse', hint: _('Insert shapes'), overlay: {onShow: insertShapes},
- html: '<div id="insertshape-wrapper"><div id="insertshape-popup" class="insertshape-pop ui-widget ui-corner-all"><div class="insertshape-grid"></div></div></div>'},
- {type: 'button', id: 'link', img: 'link', hint: _UNO('.uno:HyperlinkDialog', '', true), disabled: true},
- {type: 'button', id: 'insertsymbol', img: 'insertsymbol', hint: _UNO('.uno:InsertSymbol', '', true), uno: 'InsertSymbol'},
- {type: 'spacer'},
- {type: 'button', id: 'edit', img: 'edit'},
- {type: 'button', id: 'sidebar', img: 'sidebar_modify_page', hint: _UNO('.uno:Sidebar', '', true), uno: '.uno:Sidebar', hidden: true},
- {type: 'button', id: 'modifypage', img: 'sidebar_modify_page', hint: _UNO('.uno:ModifyPage', 'presentation', true), uno: '.uno:ModifyPage', hidden: true},
- {type: 'button', id: 'slidechangewindow', img: 'sidebar_slide_change', hint: _UNO('.uno:SlideChangeWindow', 'presentation', true), uno: '.uno:SlideChangeWindow', hidden: true},
- {type: 'button', id: 'customanimation', img: 'sidebar_custom_animation', hint: _UNO('.uno:CustomAnimation', 'presentation', true), uno: '.uno:CustomAnimation', hidden: true},
- {type: 'button', id: 'masterslidespanel', img: 'sidebar_master_slides', hint: _UNO('.uno:MasterSlidesPanel', 'presentation', true), uno: '.uno:MasterSlidesPanel', hidden: true},
- {type: 'break', id: 'breaksidebar', hidden: true},
- {type: 'button', id: 'fold', img: 'fold', desktop: true, mobile: false, hidden: true},
- {type: 'button', id: 'hamburger-tablet', img: 'hamburger', desktop: false, mobile: false, tablet: true, iosapptablet: false, hidden: true},
- {type: 'button', id: 'languagecode', desktop: false, mobile: true, tablet: false}
- ];
-
- var toolbar = $('#toolbar-up');
- toolbar.w2toolbar({
- name: 'editbar',
- tooltip: 'bottom',
- items: toolItems,
- onClick: function (e) {
- onClick(e, e.target);
- hideTooltip(this, e.target);
- },
- onRefresh: function(event) {
- if ((event.target === 'styles' || event.target === 'fonts' || event.target === 'fontsizes') && event.item) {
- var toolItem = $(this.box).find('#tb_'+ this.name +'_item_'+ w2utils.escapeId(event.item.id));
- if ((window.mode.isDesktop() && event.item.desktop == false)
- || (window.mode.isTablet() && event.item.tablet == false)) {
- toolItem.css('display', 'none');
- } else {
- toolItem.css('display', '');
- }
- }
-
- if (event.target === 'inserttable')
- insertTable();
-
- if (event.target === 'insertshapes')
- insertShapes();
- }
- });
-
- toolbar.bind('touchstart', function() {
- w2ui['editbar'].touchStarted = true;
- });
-}
-
function initNormalToolbar() {
- createMainToolbar();
+ map.addControl(L.control.topToolbar());
map.addControl(L.control.signingBar());
}
@@ -982,34 +760,6 @@ function onDocumentNameFocus() {
map._onLostFocus();
}
-function onStyleSelect(e) {
- var style = e.target.value;
- if (style.startsWith('.uno:')) {
- map.sendUnoCommand(style);
- }
- else if (map.getDocType() === 'text') {
- map.applyStyle(style, 'ParagraphStyles');
- }
- else if (map.getDocType() === 'spreadsheet') {
- map.applyStyle(style, 'CellStyles');
- }
- else if (map.getDocType() === 'presentation' || map.getDocType() === 'drawing') {
- map.applyLayout(style);
- }
- map.focus();
-}
-
-function onFontSelect(e) {
- var font = e.target.value;
- map.applyFont(font);
- map.focus();
-}
-
-function onFontSizeSelect(e) {
- map.applyFontSize(e.target.value);
- map.focus();
-}
-
function onInsertFile() {
var insertGraphic = L.DomUtil.get('insertgraphic');
if ('files' in insertGraphic) {
@@ -1041,12 +791,6 @@ function onInsertBackground() {
}
function onWopiProps(e) {
- if (e.HideSaveOption) {
- w2ui['editbar'].hide('save');
- }
- if (e.HidePrintOption) {
- w2ui['editbar'].hide('print');
- }
if (e.DisableCopy) {
$('input#formulaInput').bind('copy', function(evt) {
evt.preventDefault();
@@ -1072,68 +816,9 @@ function onWopiProps(e) {
$('#document-name-input').removeClass('editable');
$('#document-name-input').off('keypress', onDocumentNameKeyPress);
}
- if (e.EnableInsertRemoteImage === true && w2ui['editbar']) {
- w2ui['editbar'].hide('insertgraphic');
- w2ui['editbar'].show('menugraphic');
- }
}
function onDocLayerInit() {
- var toolbarUp = w2ui['editbar'];
- var docType = map.getDocType();
- var data;
-
- switch (docType) {
- case 'spreadsheet':
- if (toolbarUp) {
- toolbarUp.show('textalign', 'wraptext', 'breakspacing', 'insertannotation', 'conditionalformaticonset',
- 'numberformatcurrency', 'numberformatpercent',
- 'numberformatincdecimals', 'numberformatdecdecimals', 'break-number', 'togglemergecells', 'breakmergecells',
- 'setborderstyle', 'sortascending', 'sortdescending', 'breaksorting', 'backgroundcolor', 'breaksidebar', 'sidebar');
- toolbarUp.remove('styles');
- }
-
- break;
- case 'text':
- if (toolbarUp)
- toolbarUp.show('leftpara', 'centerpara', 'rightpara', 'justifypara', 'breakpara', 'linespacing',
- 'breakspacing', 'defaultbullet', 'defaultnumbering', 'breakbullet', 'incrementindent', 'decrementindent',
- 'breakindent', 'inserttable', 'insertannotation', 'backcolor', 'breaksidebar', 'sidebar');
-
- break;
- case 'presentation':
- // Fill the style select box if not yet filled
- if ($('.styles-select')[0] && $('.styles-select')[0].length === 1) {
- data = [''];
- // Inserts a separator element
- data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
-
- L.Styles.impressLayout.forEach(function(layout) {
- data = data.concat({id: layout.id, text: _(layout.text)});
- }, this);
-
- $('.styles-select').select2({
- data: data,
- placeholder: _UNO('.uno:LayoutStatus', 'presentation')
- });
- $('.styles-select').on('select2:select', onStyleSelect);
- }
-
- if (toolbarUp) {
- toolbarUp.show('breaksidebar', 'modifypage');
- }
-
- // FALLTHROUGH intended
- case 'drawing':
- if (toolbarUp)
- toolbarUp.show('leftpara', 'centerpara', 'rightpara', 'justifypara', 'breakpara', 'linespacing',
- 'breakspacing', 'defaultbullet', 'defaultnumbering', 'breakbullet', 'inserttextbox', 'inserttable', 'backcolor',
- 'breaksidebar', 'modifypage', 'slidechangewindow', 'customanimation', 'masterslidespanel');
- break;
- }
-
- _updateToolbarsVisibility();
-
if (window.mode.isMobile() || window.mode.isTablet()) {
if (!window.ThisIsAMobileApp)
$('#document-name-input').hide();
@@ -1143,9 +828,6 @@ function onDocLayerInit() {
$('#document-name-input').show();
}
- if (toolbarUp)
- toolbarUp.refresh();
-
if (window.ThisIsAMobileApp) {
// We can now set the document name in the menu bar
$('#document-name-input').prop('disabled', false);
@@ -1159,26 +841,6 @@ function onDocLayerInit() {
// TODO: Yes, it would be better to see it change as you rotate the device or invoke Split View.
);
}
-
- data = [6, 7, 8, 9, 10, 10.5, 11, 12, 13, 14, 15, 16, 18, 20,
- 22, 24, 26, 28, 32, 36, 40, 44, 48, 54, 60, 66, 72, 80, 88, 96];
- $('.fontsizes-select').select2({
- data: data,
- placeholder: ' ',
- //Allow manually entered font size.
- createTag: function(query) {
- return {
- id: query.term,
- text: query.term,
- tag: true
- };
- },
- tags: true,
- sorter: function(data) { return data.sort(function(a, b) {
- return parseFloat(a.text) - parseFloat(b.text);
- });}
- });
- $('.fontsizes-select').off('select2:select', onFontSizeSelect).on('select2:select', onFontSizeSelect);
}
function onCommandStateChanged(e) {
@@ -1186,79 +848,13 @@ function onCommandStateChanged(e) {
var statusbar = w2ui['actionbar'];
var commandName = e.commandName;
var state = e.state;
- var found = false;
- var value, color, div;
+ var color, div;
if (!commandName)
return;
if (commandName === '.uno:AssignLayout') {
$('.styles-select').val(state).trigger('change');
- } else if (commandName === '.uno:StyleApply') {
- if (!state) {
- return;
- }
-
- // For impress documents, no styles is supported.
- if (map.getDocType() === 'presentation') {
- return;
- }
-
- $('.styles-select option').each(function () {
- var value = this.value;
- // For writer we get UI names; ideally we should be getting only programmatic ones
- // For eg: 'Text body' vs 'Text Body'
- // (likely to be fixed in core to make the pattern consistent)
- if (state && value.toLowerCase() === state.toLowerCase()) {
- state = value;
- found = true;
- return;
- }
- });
- if (!found) {
- // we need to add the size
- $('.styles-select')
- .append($('<option></option>')
- .text(state));
- }
-
- stylesSelectValue = state;
- $('.styles-select').val(state).trigger('change');
- }
- else if (commandName === '.uno:CharFontName') {
- $('.fonts-select option').each(function () {
- value = this.value;
- if (value.toLowerCase() === state.toLowerCase()) {
- found = true;
- return;
- }
- });
- if (!found) {
- // we need to add the size
- $('.fonts-select')
- .append($('<option></option>')
- .text(state));
- }
- fontsSelectValue = state;
- $('.fonts-select').val(state).trigger('change');
- }
- else if (commandName === '.uno:FontHeight') {
- if (state === '0') {
- state = '';
- }
-
- $('.fontsizes-select option').each(function (i, e) {
- if ($(e).text() === state) {
- found = true;
- }
- });
- if (!found) {
- // we need to add the size
- $('.fontsizes-select')
- .append($('<option>')
- .text(state).val(state));
- }
- $('.fontsizes-select').val(state).trigger('change');
}
else if (commandName === '.uno:FontColor' || commandName === '.uno:Color') {
// confusingly, the .uno: command is named differently in Writer, Calc and Impress
@@ -1363,104 +959,6 @@ function onCommandStateChanged(e) {
}
}
-function updateCommandValues(e) {
- var data = [];
- var commandValues;
- // 1) For .uno:StyleApply
- // we need an empty option for the place holder to work
- if (e.commandName === '.uno:StyleApply') {
- var styles = [];
- var topStyles = [];
- commandValues = map.getToolbarCommandValues(e.commandName);
- if (typeof commandValues === 'undefined')
- return;
- var commands = commandValues.Commands;
- if (commands && commands.length > 0) {
- // Inserts a separator element
- data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
-
- commands.forEach(function (command) {
- var translated = command.text;
- if (L.Styles.styleMappings[command.text]) {
- // if it's in English, translate it
- translated = L.Styles.styleMappings[command.text].toLocaleString();
- }
- data = data.concat({id: command.id, text: translated });
- }, this);
- }
-
- if (map.getDocType() === 'text') {
- styles = commandValues.ParagraphStyles.slice(7, 19);
- topStyles = commandValues.ParagraphStyles.slice(0, 7);
- }
- else if (map.getDocType() === 'spreadsheet') {
- styles = commandValues.CellStyles;
- }
- else if (map.getDocType() === 'presentation') {
- // styles are not applied for presentation
- return;
- }
-
- if (topStyles.length > 0) {
- // Inserts a separator element
- data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
-
- topStyles.forEach(function (style) {
- data = data.concat({id: style, text: L.Styles.styleMappings[style].toLocaleString()});
- }, this);
- }
-
- if (styles !== undefined && styles.length > 0) {
- // Inserts a separator element
- data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
-
- styles.forEach(function (style) {
- var localeStyle;
- if (style.startsWith('outline')) {
- var outlineLevel = style.split('outline')[1];
- localeStyle = 'Outline'.toLocaleString() + ' ' + outlineLevel;
- } else {
- localeStyle = L.Styles.styleMappings[style];
- localeStyle = localeStyle === undefined ? style : localeStyle.toLocaleString();
- }
-
- data = data.concat({id: style, text: localeStyle});
- }, this);
- }
-
- $('.styles-select').select2({
- data: data,
- placeholder: _('Style')
- });
- $('.styles-select').val(stylesSelectValue).trigger('change');
- $('.styles-select').on('select2:select', onStyleSelect);
- w2ui['editbar'].resize();
- } else if (e.commandName === '.uno:CharFontName') {
- // 2) For .uno:CharFontName
- commandValues = map.getToolbarCommandValues(e.commandName);
- if (typeof commandValues === 'undefined') {
- return;
- }
-
- data = []; // reset data in order to avoid that the font select box is populated with styles, too.
- // Old browsers like IE11 et al don't like Object.keys with
- // empty arguments
- if (typeof commandValues === 'object') {
- data = data.concat(Object.keys(commandValues));
- }
-
- $('.fonts-select').select2({
- data: data.sort(function (a, b) { // also sort(localely)
- return a.localeCompare(b);
- }),
- placeholder: _('Font')
- });
- $('.fonts-select').on('select2:select', onFontSelect);
- $('.fonts-select').val(fontsSelectValue).trigger('change');
- w2ui['editbar'].resize();
- }
-}
-
function onUpdateParts(e) {
if (e.docType === 'text') {
var current = e.currentPage;
@@ -1566,24 +1064,12 @@ function onUpdatePermission(e) {
}
if (e.perm === 'edit') {
- // Enable list boxes
- $('.styles-select').prop('disabled', false);
- $('.fonts-select').prop('disabled', false);
- $('.fontsizes-select').prop('disabled', false);
-
if (window.mode.isMobile()) {
$('#toolbar-down').show();
}
}
- else {
- // Disable list boxes
- $('.styles-select').prop('disabled', true);
- $('.fonts-select').prop('disabled', true);
- $('.fontsizes-select').prop('disabled', true);
-
- if (window.mode.isMobile()) {
- $('#toolbar-down').hide();
- }
+ else if (window.mode.isMobile()) {
+ $('#toolbar-down').hide();
}
// We've resized the document container.
@@ -1658,12 +1144,6 @@ function setupToolbar(e) {
}
});
- if (!window.mode.isMobile()) {
- map.on('updatetoolbarcommandvalues', function(e) {
- updateCommandValues(e);
- });
- }
-
map.on('doclayerinit', onDocLayerInit);
map.on('updatepermission', onUpdatePermission);
map.on('wopiprops', onWopiProps);
@@ -1694,7 +1174,6 @@ function setupToolbar(e) {
global.setupToolbar = setupToolbar;
global.onClick = onClick;
global.hideTooltip = hideTooltip;
-global.onStyleSelect = onStyleSelect;
global.insertTable = insertTable;
global.insertShapes = insertShapes;
global.createShapesPanel = createShapesPanel;
diff --git a/loleaflet/src/control/Control.TopToolbar.js b/loleaflet/src/control/Control.TopToolbar.js
new file mode 100644
index 000000000..20a178f1b
--- /dev/null
+++ b/loleaflet/src/control/Control.TopToolbar.js
@@ -0,0 +1,554 @@
+/* -*- js-indent-level: 8 -*- */
+/*
+ * L.Control.TopToolbar
+ */
+
+/* global $ w2ui _ _UNO w2utils */
+L.Control.TopToolbar = L.Control.extend({
+ options: {
+ stylesSelectValue: null,
+ fontsSelectValue: null
+ },
+
+ onAdd: function (map) {
+ this.map = map;
+ this.create();
+
+ map.on('doclayerinit', this.onDocLayerInit, this);
+ map.on('updatepermission', this.onUpdatePermission, this);
+ map.on('wopiprops', this.onWopiProps, this);
+ map.on('commandstatechanged', this.onCommandStateChanged, this);
+
+ if (!window.mode.isMobile()) {
+ map.on('updatetoolbarcommandvalues', this.updateCommandValues, this);
+ }
+ },
+
+ onFontSizeSelect: function(e) {
+ this.map.applyFontSize(e.target.value);
+ this.map.focus();
+ },
+
+ onFontSelect: function(e) {
+ var font = e.target.value;
+ this.map.applyFont(font);
+ this.map.focus();
+ },
+
+ onStyleSelect: function(e) {
+ var style = e.target.value;
+ if (style.startsWith('.uno:')) {
+ this.map.sendUnoCommand(style);
+ }
+ else if (this.map.getDocType() === 'text') {
+ this.map.applyStyle(style, 'ParagraphStyles');
+ }
+ else if (this.map.getDocType() === 'spreadsheet') {
+ this.map.applyStyle(style, 'CellStyles');
+ }
+ else if (this.map.getDocType() === 'presentation' || this.map.getDocType() === 'drawing') {
+ this.map.applyLayout(style);
+ }
+ this.map.focus();
+ },
+
+ _updateVisibilityForToolbar: function(toolbar) {
+ if (!toolbar)
+ return;
+
+ var toShow = [];
+ var toHide = [];
+
+ toolbar.items.forEach(function(item) {
+ if (window.ThisIsTheiOSApp && window.mode.isTablet() && item.iosapptablet === false) {
+ toHide.push(item.id);
+ }
+ else if (((window.mode.isMobile() && item.mobile === false) || (window.mode.isTablet() && item.tablet === false) || (window.mode.isDesktop() && item.desktop === false) || (!window.ThisIsAMobileApp && item.mobilebrowser === false)) && !item.hidden) {
+ toHide.push(item.id);
+ }
+ else if (((window.mode.isMobile() && item.mobile === true) || (window.mode.isTablet() && item.tablet === true) || (window.mode.isDesktop() && item.desktop === true) || (window.ThisIsAMobileApp && item.mobilebrowser === true)) && item.hidden) {
+ toShow.push(item.id);
+ }
+ });
+
+ console.log('explicitly hiding: ' + toHide);
+ console.log('explicitly showing: ' + toShow);
+
+ toHide.forEach(function(item) { toolbar.hide(item); });
+ toShow.forEach(function(item) { toolbar.show(item); });
+ },
+
+ // mobile:false means hide it both for normal Online used from a mobile phone browser, and in a mobile app on a mobile phone
+ // mobilebrowser:false means hide it for normal Online used from a mobile browser, but don't hide it in a mobile app
+ // tablet:true means show it in normal Online from a tablet browser, and in a mobile app on a tablet
+ // tablet:false means hide it in normal Online used from a tablet browser, and in a mobile app on a tablet
+
+ getToolItems: function() {
+ return [
+ {type: 'button', id: 'closemobile', img: 'closemobile', desktop: false, mobile: false, tablet: true, hidden: true},
+ {type: 'button', id: 'save', img: 'save', hint: _UNO('.uno:Save')},
+ {type: 'button', id: 'print', img: 'print', hint: _UNO('.uno:Print', 'text'), mobile: false, tablet: false},
+ {type: 'break', id: 'savebreak', mobile: false},
+ {type: 'button', id: 'undo', img: 'undo', hint: _UNO('.uno:Undo'), uno: 'Undo', disabled: true, mobile: false},
+ {type: 'button', id: 'redo', img: 'redo', hint: _UNO('.uno:Redo'), uno: 'Redo', disabled: true, mobile: false},
+ {type: 'button', id: 'formatpaintbrush', img: 'copyformat', hint: _UNO('.uno:FormatPaintbrush'), uno: 'FormatPaintbrush', mobile: false},
+ {type: 'button', id: 'reset', img: 'deleteformat', hint: _UNO('.uno:ResetAttributes', 'text'), uno: 'ResetAttributes', mobile: false},
+ {type: 'break', mobile: false, tablet: false,},
+ {type: 'html', id: 'styles',
+ html: '<select class="styles-select"><option>' + _('Default Style') + '</option></select>',
+ onRefresh: function (edata) {
+ if (!edata.item.html) {
+ edata.isCancelled = true;
+ } else {
+ $.extend(edata, { onComplete: function (e) {
+ $('.styles-select').select2();
+ e.item.html = undefined;
+ }});
+ }
+ }, hidden: true, desktop: true, mobile: false, tablet: false},
+ {type: 'html', id: 'fonts',
+ html: '<select class="fonts-select"><option>Liberation Sans</option></select>',
+ onRefresh: function (edata) {
+ if (!edata.item.html) {
+ edata.isCancelled = true;
+ } else {
+ $.extend(edata, { onComplete: function (e) {
+ $('.fonts-select').select2();
+ e.item.html = undefined;
+ }});
+ }
+ }, mobile: false},
+ {type: 'html', id: 'fontsizes',
+ html: '<select class="fontsizes-select">',
+ onRefresh: function (edata) {
+ if (!edata.item.html) {
+ edata.isCancelled = true;
+ } else {
+ $.extend(edata, { onComplete: function (e) {
+ $('.fontsizes-select').select2({ dropdownAutoWidth: true, width: 'auto'});
+ e.item.html = undefined;
+ }});
+ }
+ }, mobile: false},
+ {type: 'break', id: 'breakstyles', mobile: false, tablet: false },
+ {type: 'button', id: 'languagecode', desktop: false, mobile: true, tablet: false},
+ {type: 'button', id: 'bold', img: 'bold', hint: _UNO('.uno:Bold'), uno: 'Bold'},
+ {type: 'button', id: 'italic', img: 'italic', hint: _UNO('.uno:Italic'), uno: 'Italic'},
+ {type: 'button', id: 'underline', img: 'underline', hint: _UNO('.uno:Underline'), uno: 'Underline'},
+ {type: 'button', id: 'strikeout', img: 'strikeout', hint: _UNO('.uno:Strikeout'), uno: 'Strikeout'},
+ {type: 'break', id: 'breakformatting'},
+ {type: 'text-color', id: 'fontcolor', img: 'textcolor', hint: _UNO('.uno:FontColor')},
+ {type: 'color', id: 'backcolor', img: 'backcolor', hint: _UNO('.uno:BackColor', 'text'), hidden: true},
+ {type: 'color', id: 'backgroundcolor', img: 'backgroundcolor', hint: _UNO('.uno:BackgroundColor'), hidden: true},
+ {type: 'break' , id: 'breakcolor', mobile:false},
+ {type: 'button', id: 'leftpara', img: 'alignleft', hint: _UNO('.uno:LeftPara', '', true),
+ uno: {textCommand: 'LeftPara', objectCommand: 'ObjectAlignLeft'},
+ hidden: true, unosheet: 'AlignLeft', disabled: true},
+ {type: 'button', id: 'centerpara', img: 'alignhorizontal', hint: _UNO('.uno:CenterPara', '', true),
+ uno: {textCommand: 'CenterPara', objectCommand: 'AlignCenter'},
+ hidden: true, unosheet: 'AlignHorizontalCenter', disabled: true},
+ {type: 'button', id: 'rightpara', img: 'alignright', hint: _UNO('.uno:RightPara', '', true),
+ uno: {textCommand: 'RightPara', objectCommand: 'ObjectAlignRight'},
+ hidden: true, unosheet: 'AlignRight', disabled: true},
+ {type: 'button', id: 'justifypara', img: 'alignblock', hint: _UNO('.uno:JustifyPara', '', true), uno: 'JustifyPara', hidden: true, unosheet: '', disabled: true},
+ {type: 'break', id: 'breakpara', hidden: true},
+ {type: 'drop', id: 'setborderstyle', img: 'setborderstyle', hint: _('Borders'), hidden: true,
+ html: '<table id="setborderstyle-grid"><tr><td class="w2ui-tb-image w2ui-icon frame01" onclick="setBorderStyle(1)"></td>' +
+ '<td class="w2ui-tb-image w2ui-icon frame02" onclick="setBorderStyle(2)"></td><td class="w2ui-tb-image w2ui-icon frame03" onclick="setBorderStyle(3)"></td>' +
+ '<td class="w2ui-tb-image w2ui-icon frame04" onclick="setBorderStyle(4)"></td></tr><tr><td class="w2ui-tb-image w2ui-icon frame05" onclick="setBorderStyle(5)"></td>' +
+ '<td class="w2ui-tb-image w2ui-icon frame06" onclick="setBorderStyle(6)"></td><td class="w2ui-tb-image w2ui-icon frame07" onclick="setBorderStyle(7)"></td>' +
+ '<td class="w2ui-tb-image w2ui-icon frame08" onclick="setBorderStyle(8)"></td></tr><tr><td class="w2ui-tb-image w2ui-icon frame09" onclick="setBorderStyle(9)"></td>' +
+ '<td class="w2ui-tb-image w2ui-icon frame10" onclick="setBorderStyle(10)"></td><td class="w2ui-tb-image w2ui-icon frame11" onclick="setBorderStyle(11)"></td>' +
+ '<td class="w2ui-tb-image w2ui-icon frame12" onclick="setBorderStyle(12)"></td></tr><tr>' +
+ '<td colspan="4" class="w2ui-tb-image w2ui-icon frame13" onclick="setBorderStyle(0)"><div id="div-frame13">' + _('More...') + '</div></td></tr></table>'
+ },
+ {type: 'button', id: 'togglemergecells', img: 'togglemergecells', hint: _UNO('.uno:ToggleMergeCells', 'spreadsheet', true), hidden: true, uno: 'ToggleMergeCells', disabled: true},
+ {type: 'break', id: 'breakmergecells', hidden: true},
+ {type: 'menu', id: 'textalign', img: 'alignblock', hint: _UNO('.uno:TextAlign'), hidden: true,
+ items: [
+ {id: 'alignleft', text: _UNO('.uno:AlignLeft', 'spreadsheet', true), icon: 'alignleft', uno: 'AlignLeft'},
+ {id: 'alignhorizontalcenter', text: _UNO('.uno:AlignHorizontalCenter', 'spreadsheet', true), icon: 'alignhorizontal', uno: 'AlignHorizontalCenter'},
+ {id: 'alignright', text: _UNO('.uno:AlignRight', 'spreadsheet', true), icon: 'alignright', uno: 'AlignRight'},
+ {id: 'alignblock', text: _UNO('.uno:AlignBlock', 'spreadsheet', true), icon: 'alignblock', uno: 'AlignBlock'},
+ ]},
+ {type: 'menu', id: 'linespacing', img: 'linespacing', hint: _UNO('.uno:FormatSpacingMenu'), hidden: true,
+ items: [
+ {id: 'spacepara1', text: _UNO('.uno:SpacePara1'), uno: 'SpacePara1'},
+ {id: 'spacepara15', text: _UNO('.uno:SpacePara15'), uno: 'SpacePara15'},
+ {id: 'spacepara2', text: _UNO('.uno:SpacePara2'), uno: 'SpacePara2'},
+ {type: 'break'},
+ {id: 'paraspaceincrease', text: _UNO('.uno:ParaspaceIncrease'), uno: 'ParaspaceIncrease'},
+ {id: 'paraspacedecrease', text: _UNO('.uno:ParaspaceDecrease'), uno: 'ParaspaceDecrease'}
+ ]},
+ {type: 'button', id: 'wraptext', img: 'wraptext', hint: _UNO('.uno:WrapText', 'spreadsheet', true), hidden: true, uno: 'WrapText', disabled: true},
+ {type: 'break', id: 'breakspacing', hidden: true},
+ {type: 'button', id: 'defaultnumbering', img: 'numbering', hint: _UNO('.uno:DefaultNumbering', '', true), hidden: true, uno: 'DefaultNumbering', disabled: true},
+ {type: 'button', id: 'defaultbullet', img: 'bullet', hint: _UNO('.uno:DefaultBullet', '', true), hidden: true, uno: 'DefaultBullet', disabled: true},
+ {type: 'break', id: 'breakbullet', hidden: true},
+ {type: 'button', id: 'incrementindent', img: 'incrementindent', hint: _UNO('.uno:IncrementIndent', '', true), uno: 'IncrementIndent', hidden: true, disabled: true},
+ {type: 'button', id: 'decrementindent', img: 'decrementindent', hint: _UNO('.uno:DecrementIndent', '', true), uno: 'DecrementIndent', hidden: true, disabled: true},
+ {type: 'break', id: 'breakindent', hidden: true},
+ {type: 'button', id: 'sortascending', img: 'sortascending', hint: _UNO('.uno:SortAscending', 'spreadsheet', true), uno: 'SortAscending', disabled: true, hidden: true},
+ {type: 'button', id: 'sortdescending', img: 'sortdescending', hint: _UNO('.uno:SortDescending', 'spreadsheet', true), uno: 'SortDescending', disabled: true, hidden: true},
+ {type: 'break', id: 'breaksorting', hidden: true},
+ {type: 'drop', id: 'conditionalformaticonset', img: 'conditionalformatdialog', hint: _UNO('.uno:ConditionalFormatMenu', 'spreadsheet', true), hidden: true,
+ html: '<table id="conditionalformatmenu-grid"><tr>' +
+ '<td class="w2ui-tb-image w2ui-icon iconset00" onclick="setConditionalFormatIconSet(0)"/><td class="w2ui-tb-image w2ui-icon iconset01" onclick="setConditionalFormatIconSet(1)"/><td class="w2ui-tb-image w2ui-icon iconset02" onclick="setConditionalFormatIconSet(2)"/></tr><tr>' +
+ '<td class="w2ui-tb-image w2ui-icon iconset03" onclick="setConditionalFormatIconSet(3)"/><td class="w2ui-tb-image w2ui-icon iconset04" onclick="setConditionalFormatIconSet(4)"/><td class="w2ui-tb-image w2ui-icon iconset05" onclick="setConditionalFormatIconSet(5)"/></tr><tr>' +
+ '<td class="w2ui-tb-image w2ui-icon iconset06" onclick="setConditionalFormatIconSet(6)"/><td class="w2ui-tb-image w2ui-icon iconset08" onclick="setConditionalFormatIconSet(8)"/><td class="w2ui-tb-image w2ui-icon iconset09" onclick="setConditionalFormatIconSet(9)"/></tr><tr>' + // iconset07 deliberately left out, see the .css for the reason
+ '<td class="w2ui-tb-image w2ui-icon iconset10" onclick="setConditionalFormatIconSet(10)"/><td class="w2ui-tb-image w2ui-icon iconset11" onclick="setConditionalFormatIconSet(11)"/><td class="w2ui-tb-image w2ui-icon iconset12" onclick="setConditionalFormatIconSet(12)"/></tr><tr>' +
+ '<td class="w2ui-tb-image w2ui-icon iconset13" onclick="setConditionalFormatIconSet(13)"/><td class="w2ui-tb-image w2ui-icon iconset14" onclick="setConditionalFormatIconSet(14)"/><td class="w2ui-tb-image w2ui-icon iconset15" onclick="setConditionalFormatIconSet(15)"/></tr><tr>' +
+ '<td class="w2ui-tb-image w2ui-icon iconset16" onclick="setConditionalFormatIconSet(16)"/><td class="w2ui-tb-image w2ui-icon iconset17" onclick="setConditionalFormatIconSet(17)"/><td class="w2ui-tb-image w2ui-icon iconset18" onclick="setConditionalFormatIconSet(18)"/></tr><tr>' +
+ '<td class="w2ui-tb-image w2ui-icon iconset19" onclick="setConditionalFormatIconSet(19)"/><td class="w2ui-tb-image w2ui-icon iconset20" onclick="setConditionalFormatIconSet(20)"/><td class="w2ui-tb-image w2ui-icon iconset21" onclick="setConditionalFormatIconSet(21)"/></tr></table>'
+ },
+ {type: 'button', id: 'numberformatcurrency', img: 'numberformatcurrency', hint: _UNO('.uno:NumberFormatCurrency', 'spreadsheet', true), hidden: true, uno: 'NumberFormatCurrency', disabled: true},
+ {type: 'button', id: 'numberformatpercent', img: 'numberformatpercent', hint: _UNO('.uno:NumberFormatPercent', 'spreadsheet', true), hidden: true, uno: 'NumberFormatPercent', disabled: true},
+ {type: 'button', id: 'numberformatdecdecimals', img: 'numberformatdecdecimals', hint: _UNO('.uno:NumberFormatDecDecimals', 'spreadsheet', true), hidden: true, uno: 'NumberFormatDecDecimals', disabled: true},
+ {type: 'button', id: 'numberformatincdecimals', img: 'numberformatincdecimals', hint: _UNO('.uno:NumberFormatIncDecimals', 'spreadsheet', true), hidden: true, uno: 'NumberFormatIncDecimals', disabled: true},
+ {type: 'break', id: 'break-number', hidden: true},
+ {type: 'button', id: 'inserttextbox', img: 'text', hint: _UNO('.uno:Text', '', true), uno: 'Text?CreateDirectly:bool=true', hidden: true},
+ {type: 'button', id: 'insertannotation', img: 'annotation', hint: _UNO('.uno:InsertAnnotation', '', true), hidden: true},
+ {type: 'drop', id: 'inserttable', img: 'inserttable', hint: _('Insert table'), hidden: true, overlay: {onShow: window.insertTable},
+ html: '<div id="inserttable-wrapper"><div id="inserttable-popup" class="inserttable-pop ui-widget ui-corner-all"><div class="inserttable-grid"></div><div id="inserttable-status" class="loleaflet-font" style="padding: 5px;"><br/></div></div></div>'},
+ {type: 'button', id: 'insertgraphic', img: 'insertgraphic', hint: _UNO('.uno:InsertGraphic', '', true)},
+ {type: 'menu', id: 'menugraphic', img: 'insertgraphic', hint: _UNO('.uno:InsertGraphic', '', true), hidden: true,
+ items: [
+ {id: 'localgraphic', text: _('Insert Local Image')},
+ {id: 'remotegraphic', text: _UNO('.uno:InsertGraphic', '', true)},
+ ]},
+ {type: 'button', id: 'insertobjectchart', img: 'insertobjectchart', hint: _UNO('.uno:InsertObjectChart', '', true), uno: 'InsertObjectChart'},
+ {type: 'drop', id: 'insertshapes', img: 'basicshapes_ellipse', hint: _('Insert shapes'), overlay: {onShow: window.insertShapes},
+ html: '<div id="insertshape-wrapper"><div id="insertshape-popup" class="insertshape-pop ui-widget ui-corner-all"><div class="insertshape-grid"></div></div></div>'},
+ {type: 'button', id: 'link', img: 'link', hint: _UNO('.uno:HyperlinkDialog', '', true), disabled: true},
+ {type: 'button', id: 'insertsymbol', img: 'insertsymbol', hint: _UNO('.uno:InsertSymbol', '', true), uno: 'InsertSymbol'},
+ {type: 'spacer'},
+ {type: 'button', id: 'edit', img: 'edit'},
+ {type: 'button', id: 'sidebar', img: 'sidebar_modify_page', hint: _UNO('.uno:Sidebar', '', true), uno: '.uno:Sidebar', hidden: true},
+ {type: 'button', id: 'modifypage', img: 'sidebar_modify_page', hint: _UNO('.uno:ModifyPage', 'presentation', true), uno: '.uno:ModifyPage', hidden: true},
+ {type: 'button', id: 'slidechangewindow', img: 'sidebar_slide_change', hint: _UNO('.uno:SlideChangeWindow', 'presentation', true), uno: '.uno:SlideChangeWindow', hidden: true},
+ {type: 'button', id: 'customanimation', img: 'sidebar_custom_animation', hint: _UNO('.uno:CustomAnimation', 'presentation', true), uno: '.uno:CustomAnimation', hidden: true},
+ {type: 'button', id: 'masterslidespanel', img: 'sidebar_master_slides', hint: _UNO('.uno:MasterSlidesPanel', 'presentation', true), uno: '.uno:MasterSlidesPanel', hidden: true},
+ {type: 'break', id: 'breaksidebar', hidden: true},
+ {type: 'button', id: 'fold', img: 'fold', desktop: true, mobile: false, hidden: true},
+ {type: 'button', id: 'hamburger-tablet', img: 'hamburger', desktop: false, mobile: false, tablet: true, iosapptablet: false, hidden: true},
+ {type: 'button', id: 'languagecode', desktop: false, mobile: true, tablet: false}
+ ];
+ },
+
+ create: function() {
+ var toolbar = $('#toolbar-up');
+ toolbar.w2toolbar({
+ name: 'editbar',
+ tooltip: 'bottom',
+ items: this.getToolItems(),
+ onClick: function (e) {
+ window.onClick(e, e.target);
+ window.hideTooltip(this, e.target);
+ },
+ onRefresh: function(event) {
+ if ((event.target === 'styles' || event.target === 'fonts' || event.target === 'fontsizes') && event.item) {
+ var toolItem = $(this.box).find('#tb_'+ this.name +'_item_'+ w2utils.escapeId(event.item.id));
+ if ((window.mode.isDesktop() && event.item.desktop == false)
+ || (window.mode.isTablet() && event.item.tablet == false)) {
+ toolItem.css('display', 'none');
+ } else {
+ toolItem.css('display', '');
+ }
+ }
+
+ if (event.target === 'inserttable')
+ window.insertTable();
+
+ if (event.target === 'insertshapes')
+ window.insertShapes();
+ }
+ });
+
+ toolbar.bind('touchstart', function() {
+ w2ui['editbar'].touchStarted = true;
+ });
+ },
+
+ onDocLayerInit: function() {
+ var toolbarUp = w2ui['editbar'];
+ var docType = this.map.getDocType();
+ var data;
+
+ switch (docType) {
+ case 'spreadsheet':
+ if (toolbarUp) {
+ toolbarUp.show('textalign', 'wraptext', 'breakspacing', 'insertannotation', 'conditionalformaticonset',
+ 'numberformatcurrency', 'numberformatpercent',
+ 'numberformatincdecimals', 'numberformatdecdecimals', 'break-number', 'togglemergecells', 'breakmergecells',
+ 'setborderstyle', 'sortascending', 'sortdescending', 'breaksorting', 'backgroundcolor', 'breaksidebar', 'sidebar');
+ toolbarUp.remove('styles');
+ }
+
+ break;
+ case 'text':
+ if (toolbarUp)
+ toolbarUp.show('leftpara', 'centerpara', 'rightpara', 'justifypara', 'breakpara', 'linespacing',
+ 'breakspacing', 'defaultbullet', 'defaultnumbering', 'breakbullet', 'incrementindent', 'decrementindent',
+ 'breakindent', 'inserttable', 'insertannotation', 'backcolor', 'breaksidebar', 'sidebar');
+
+ break;
+ case 'presentation':
+ // Fill the style select box if not yet filled
+ if ($('.styles-select')[0] && $('.styles-select')[0].length === 1) {
+ data = [''];
+ // Inserts a separator element
+ data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
+
+ L.Styles.impressLayout.forEach(function(layout) {
+ data = data.concat({id: layout.id, text: _(layout.text)});
+ }, this);
+
+ $('.styles-select').select2({
+ data: data,
+ placeholder: _UNO('.uno:LayoutStatus', 'presentation')
+ });
+ $('.styles-select').on('select2:select', this.onStyleSelect, this);
+ }
+
+ if (toolbarUp) {
+ toolbarUp.show('breaksidebar', 'modifypage');
+ }
+
+ // FALLTHROUGH intended
+ case 'drawing':
+ if (toolbarUp)
+ toolbarUp.show('leftpara', 'centerpara', 'rightpara', 'justifypara', 'breakpara', 'linespacing',
+ 'breakspacing', 'defaultbullet', 'defaultnumbering', 'breakbullet', 'inserttextbox', 'inserttable', 'backcolor',
+ 'breaksidebar', 'modifypage', 'slidechangewindow', 'customanimation', 'masterslidespanel');
+ break;
+ }
+
+ this._updateVisibilityForToolbar(w2ui['editbar']);
+
+ if (toolbarUp)
+ toolbarUp.refresh();
+
+ data = [6, 7, 8, 9, 10, 10.5, 11, 12, 13, 14, 15, 16, 18, 20,
+ 22, 24, 26, 28, 32, 36, 40, 44, 48, 54, 60, 66, 72, 80, 88, 96];
+ $('.fontsizes-select').select2({
+ data: data,
+ placeholder: ' ',
+ //Allow manually entered font size.
+ createTag: function(query) {
+ return {
+ id: query.term,
+ text: query.term,
+ tag: true
+ };
+ },
+ tags: true,
+ sorter: function(data) { return data.sort(function(a, b) {
+ return parseFloat(a.text) - parseFloat(b.text);
+ });}
+ });
+ $('.fontsizes-select').off('select2:select', this.onFontSizeSelect.bind(this)).on('select2:select', this.onFontSizeSelect.bind(this));
+ },
+
+ onUpdatePermission: function(e) {
+ if (e.perm === 'edit') {
+ // Enable list boxes
+ $('.styles-select').prop('disabled', false);
+ $('.fonts-select').prop('disabled', false);
+ $('.fontsizes-select').prop('disabled', false);
+ } else {
+ // Disable list boxes
+ $('.styles-select').prop('disabled', true);
+ $('.fonts-select').prop('disabled', true);
+ $('.fontsizes-select').prop('disabled', true);
+ }
+ },
+
+ onWopiProps: function(e) {
+ if (e.HideSaveOption) {
+ w2ui['editbar'].hide('save');
+ }
+ if (e.HidePrintOption) {
+ w2ui['editbar'].hide('print');
+ }
+ if (e.EnableInsertRemoteImage === true && w2ui['editbar']) {
+ w2ui['editbar'].hide('insertgraphic');
+ w2ui['editbar'].show('menugraphic');
+ }
+ },
+
+ updateCommandValues: function(e) {
+ var data = [];
+ var commandValues;
+ // 1) For .uno:StyleApply
+ // we need an empty option for the place holder to work
+ if (e.commandName === '.uno:StyleApply') {
+ var styles = [];
+ var topStyles = [];
+ commandValues = this.map.getToolbarCommandValues(e.commandName);
+ if (typeof commandValues === 'undefined')
+ return;
+ var commands = commandValues.Commands;
+ if (commands && commands.length > 0) {
+ // Inserts a separator element
+ data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
+
+ commands.forEach(function (command) {
+ var translated = command.text;
+ if (L.Styles.styleMappings[command.text]) {
+ // if it's in English, translate it
+ translated = L.Styles.styleMappings[command.text].toLocaleString();
+ }
+ data = data.concat({id: command.id, text: translated });
+ }, this);
+ }
+
+ if (this.map.getDocType() === 'text') {
+ styles = commandValues.ParagraphStyles.slice(7, 19);
+ topStyles = commandValues.ParagraphStyles.slice(0, 7);
+ }
+ else if (this.map.getDocType() === 'spreadsheet') {
+ styles = commandValues.CellStyles;
+ }
+ else if (this.map.getDocType() === 'presentation') {
+ // styles are not applied for presentation
+ return;
+ }
+
+ if (topStyles.length > 0) {
+ // Inserts a separator element
+ data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
+
+ topStyles.forEach(function (style) {
+ data = data.concat({id: style, text: L.Styles.styleMappings[style].toLocaleString()});
+ }, this);
+ }
+
+ if (styles !== undefined && styles.length > 0) {
+ // Inserts a separator element
+ data = data.concat({text: '\u2500\u2500\u2500\u2500\u2500\u2500', disabled: true});
+
+ styles.forEach(function (style) {
+ var localeStyle;
+ if (style.startsWith('outline')) {
+ var outlineLevel = style.split('outline')[1];
+ localeStyle = 'Outline'.toLocaleString() + ' ' + outlineLevel;
+ } else {
+ localeStyle = L.Styles.styleMappings[style];
+ localeStyle = localeStyle === undefined ? style : localeStyle.toLocaleString();
+ }
+
+ data = data.concat({id: style, text: localeStyle});
+ }, this);
+ }
+
+ $('.styles-select').select2({
+ data: data,
+ placeholder: _('Style')
+ });
+ $('.styles-select').val(this.options.stylesSelectValue).trigger('change');
+ $('.styles-select').on('select2:select', this.onStyleSelect.bind(this));
+ w2ui['editbar'].resize();
+ } else if (e.commandName === '.uno:CharFontName') {
+ // 2) For .uno:CharFontName
+ commandValues = this.map.getToolbarCommandValues(e.commandName);
+ if (typeof commandValues === 'undefined') {
+ return;
+ }
+
+ data = []; // reset data in order to avoid that the font select box is populated with styles, too.
+ // Old browsers like IE11 et al don't like Object.keys with
+ // empty arguments
+ if (typeof commandValues === 'object') {
+ data = data.concat(Object.keys(commandValues));
+ }
+
+ $('.fonts-select').select2({
+ data: data.sort(function (a, b) { // also sort(localely)
+ return a.localeCompare(b);
+ }),
+ placeholder: _('Font')
+ });
+ $('.fonts-select').on('select2:select', this.onFontSelect.bind(this));
+ $('.fonts-select').val(this.options.fontsSelectValue).trigger('change');
+ w2ui['editbar'].resize();
+ }
+ },
+
+ onCommandStateChanged: function(e) {
+ var commandName = e.commandName;
+ var state = e.state;
+ var found = false;
+ var value;
+
+ if (commandName === '.uno:StyleApply') {
+ if (!state) {
+ return;
+ }
+
+ // For impress documents, no styles is supported.
+ if (this.map.getDocType() === 'presentation') {
+ return;
+ }
+
+ $('.styles-select option').each(function () {
+ var value = this.value;
+ // For writer we get UI names; ideally we should be getting only programmatic ones
+ // For eg: 'Text body' vs 'Text Body'
+ // (likely to be fixed in core to make the pattern consistent)
+ if (state && value.toLowerCase() === state.toLowerCase()) {
+ state = value;
+ found = true;
+ return;
+ }
+ });
+ if (!found) {
+ // we need to add the size
+ $('.styles-select')
+ .append($('<option></option>')
+ .text(state));
+ }
+
+ this.options.stylesSelectValue = state;
+ $('.styles-select').val(state).trigger('change');
+ }
+ else if (commandName === '.uno:CharFontName') {
+ $('.fonts-select option').each(function () {
+ value = this.value;
+ if (value.toLowerCase() === state.toLowerCase()) {
+ found = true;
+ return;
+ }
+ });
+ if (!found) {
+ // we need to add the size
+ $('.fonts-select')
+ .append($('<option></option>')
+ .text(state));
+ }
+ this.options.fontsSelectValue = state;
+ $('.fonts-select').val(state).trigger('change');
+ }
+ else if (commandName === '.uno:FontHeight') {
+ if (state === '0') {
+ state = '';
+ }
+
+ $('.fontsizes-select option').each(function (i, e) {
+ if ($(e).text() === state) {
+ found = true;
+ }
+ });
+ if (!found) {
+ // we need to add the size
+ $('.fontsizes-select')
+ .append($('<option>')
+ .text(state).val(state));
+ }
+ $('.fontsizes-select').val(state).trigger('change');
+ }
+ }
+});
+
+L.control.topToolbar = function () {
+ return new L.Control.TopToolbar();
+};
commit aca7badc6dfb2b858ef5fe8dbb55a713cccd7ccc
Author: Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Thu Apr 16 11:13:21 2020 +0200
Commit: Szymon Kłos <szymon.klos at collabora.com>
CommitDate: Thu Apr 16 16:01:22 2020 +0200
Move signing bar to separate file
In the future should be merged with Signing.js
Change-Id: I3b5db8b20dcead4e0f1f80643de474fdba8245af
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/92348
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Szymon Kłos <szymon.klos at collabora.com>
diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am
index cc3b8a86a..7017c6e72 100644
--- a/loleaflet/Makefile.am
+++ b/loleaflet/Makefile.am
@@ -270,6 +270,7 @@ LOLEAFLET_JS =\
src/control/Control.FormulaBar.js \
src/control/Control.SheetsBar.js \
src/control/Control.PresentationBar.js \
+ src/control/Control.SigningBar.js \
src/control/Control.Layers.js \
src/control/Search.js \
src/control/Permission.js \
@@ -540,6 +541,7 @@ pot:
src/control/Control.Scroll.Annotation.js \
src/control/Control.SearchBar.js \
src/control/Control.SheetsBar.js \
+ src/control/Control.SigningBar.js \
src/control/Control.StatusBar.js \
src/control/Control.Tabs.js \
src/control/Control.Toolbar.js \
diff --git a/loleaflet/src/control/Control.SigningBar.js b/loleaflet/src/control/Control.SigningBar.js
new file mode 100644
index 000000000..dbccc9114
--- /dev/null
+++ b/loleaflet/src/control/Control.SigningBar.js
@@ -0,0 +1,64 @@
+/* -*- js-indent-level: 8 -*- */
+/*
+ * L.Control.SigningBar
+ */
+
+/* global $ w2ui */
+L.Control.SigningBar = L.Control.extend({
+
+ onAdd: function (map) {
+ this.map = map;
+ this.create();
+
+ map.on('doclayerinit', this.onDocLayerInit, this);
+ },
+
+ create: function() {
+ var that = this;
+ if (L.DomUtil.get('document-signing-bar') !== null) {
+ var toolbar = $('#document-signing-bar');
+ toolbar.w2toolbar({
+ name: 'document-signing-bar',
+ tooltip: 'bottom',
+ items: this.map.setupSigningToolbarItems(),
+ onClick: function (e) {
+ that.onClick(e, e.target);
+ window.hideTooltip(this, e.target);
+ },
+ onRefresh: function() {
+ }
+ });
+ toolbar.bind('touchstart', function() {
+ w2ui['document-signing-bar'].touchStarted = true;
+ });
+ }
+ },
+
+ onClick: function(e, id, item) {
+ if ('document-signing-bar' in w2ui && w2ui['document-signing-bar'].get(id) !== null) {
+ var toolbar = w2ui['document-signing-bar'];
+ item = toolbar.get(id);
+ }
+
+ // In the iOS app we don't want clicking on the toolbar to pop up the keyboard.
+ if (!window.ThisIsTheiOSApp && id !== 'zoomin' && id !== 'zoomout' && id !== 'mobile_wizard' && id !== 'insertion_mobile_wizard') {
+ this.map.focus(this.map.canAcceptKeyboardInput()); // Maintain same keyboard state.
+ }
+
+ if (item.disabled) {
+ return;
+ }
+
+ this.map.handleSigningClickEvent(id, item); // this handles a bunch of signing bar click events
+ },
+
+ onDocLayerInit: function() {
+ if (L.DomUtil.get('document-signing-bar') !== null) {
+ this.map.signingInitializeBar();
+ }
+ }
+});
+
+L.control.signingBar = function () {
+ return new L.Control.SigningBar();
+};
diff --git a/loleaflet/src/control/Control.Toolbar.js b/loleaflet/src/control/Control.Toolbar.js
index 529e0fa71..33fd4ac46 100644
--- a/loleaflet/src/control/Control.Toolbar.js
+++ b/loleaflet/src/control/Control.Toolbar.js
@@ -85,10 +85,6 @@ function onClick(e, id, item) {
var toolbar = w2ui['editbar'];
item = toolbar.get(id);
}
- else if ('document-signing-bar' in w2ui && w2ui['document-signing-bar'].get(id) !== null) {
- toolbar = w2ui['document-signing-bar'];
- item = toolbar.get(id);
- }
else if ('actionbar' in w2ui && w2ui['actionbar'].get(id) !== null) {
toolbar = w2ui['actionbar'];
item = toolbar.get(id);
@@ -189,9 +185,6 @@ function onClick(e, id, item) {
else if (id === 'languagecode') {
map.fire('languagedialog');
}
- else {
- map.handleSigningClickEvent(id, item); // this handles a bunch of signing bar click events
- }
}
function _setBorders(left, right, bottom, top, horiz, vert, color) {
@@ -830,29 +823,9 @@ function createMainToolbar() {
});
}
-function createSigningBar() {
- if (L.DomUtil.get('document-signing-bar') !== null) {
- var toolbar = $('#document-signing-bar');
- toolbar.w2toolbar({
- name: 'document-signing-bar',
- tooltip: 'bottom',
- items: map.setupSigningToolbarItems(),
- onClick: function (e) {
- onClick(e, e.target);
- hideTooltip(this, e.target);
- },
- onRefresh: function() {
- }
- });
- toolbar.bind('touchstart', function() {
- w2ui['document-signing-bar'].touchStarted = true;
- });
- }
-}
-
function initNormalToolbar() {
createMainToolbar();
- createSigningBar();
+ map.addControl(L.control.signingBar());
}
function setupSearchInput() {
@@ -1159,10 +1132,6 @@ function onDocLayerInit() {
break;
}
- if (L.DomUtil.get('document-signing-bar') !== null) {
- map.signingInitializeBar();
- }
-
_updateToolbarsVisibility();
if (window.mode.isMobile() || window.mode.isTablet()) {
More information about the Libreoffice-commits
mailing list