Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Hint Manager: change letter getting, add offsets, add hints for toolbar

Browse source
This commit is contained in:
JuliaSvinareva 2021-05-26 18:30:18 +03:00
parent 9f5a6f1f6e
commit 88f32b91f6
12 changed files with 255 additions and 104 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
apps/common/main/lib/component/Button.js
View file

@ -194,7 +194,7 @@ define([
'<% } %>';
var templateHugeCaption =
'<button type="button" class="btn <%= cls %>" id="<%= id %>" > ' +
'<button type="button" class="btn <%= cls %>" id="<%= id %>" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>"> ' +
'<div class="inner-box-icon">' +
templateBtnIcon +
'</div>' +
@ -205,7 +205,7 @@ define([
var templateHugeMenuCaption =
'<div class="btn-group icon-top" id="<%= id %>" style="<%= style %>">' +
'<button type="button" class="btn dropdown-toggle <%= cls %>" data-toggle="dropdown">' +
'<button type="button" class="btn dropdown-toggle <%= cls %>" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>">' +
'<div class="inner-box-icon">' +
templateBtnIcon +
'</div>' +
@ -223,7 +223,7 @@ define([
templateBtnIcon +
'</span>' +
'</button>' +
'<button type="button" class="btn <%= cls %> inner-box-caption dropdown-toggle" data-toggle="dropdown">' +
'<button type="button" class="btn <%= cls %> inner-box-caption dropdown-toggle" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>">' +
'<span class="btn-fixflex-vcenter">' +
'<span class="caption"><%= caption %></span>' +
'<i class="caret"></i>' +
@ -247,7 +247,8 @@ define([
split : false,
visible : true,
dataHint : '',
dataHintDirection: ''
dataHintDirection: '',
dataHintOffset: '0, 0'
},
template: _.template([
@ -263,13 +264,13 @@ define([
'}} %>',
'<% } %>',
'<% if ( !menu ) { %>',
'<button type="button" class="btn <%= cls %>" id="<%= id %>" style="<%= style %>" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" >',
'<button type="button" class="btn <%= cls %>" id="<%= id %>" style="<%= style %>" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>">',
'<% applyicon() %>',
'<span class="caption"><%= caption %></span>',
'</button>',
'<% } else if (split == false) {%>',
'<div class="btn-group" id="<%= id %>" style="<%= style %>">',
'<button type="button" class="btn dropdown-toggle <%= cls %>" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>">',
'<button type="button" class="btn dropdown-toggle <%= cls %>" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>">',
'<% applyicon() %>',
'<span class="caption"><%= caption %></span>',
'<span class="inner-box-caret">' +
@ -279,11 +280,11 @@ define([
'</div>',
'<% } else { %>',
'<div class="btn-group split" id="<%= id %>" style="<%= style %>">',
'<button type="button" class="btn <%= cls %>" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>">',
'<button type="button" class="btn <%= cls %>">',
'<% applyicon() %>',
'<span class="caption"><%= caption %></span>',
'</button>',
'<button type="button" class="btn <%= cls %> dropdown-toggle" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>">',
'<button type="button" class="btn <%= cls %> dropdown-toggle" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>">',
'<i class="caret"></i>',
'<span class="sr-only"></span>',
'</button>',
@ -354,7 +355,8 @@ define([
caption : me.caption,
style : me.style,
dataHint : me.options.dataHint,
dataHintDirection: me.options.dataHintDirection
dataHintDirection: me.options.dataHintDirection,
dataHintOffset: me.options.dataHintOffset
}));
if (me.menu && _.isObject(me.menu) && _.isFunction(me.menu.render))

10
apps/common/main/lib/component/ComboBox.js
View file

@ -87,13 +87,15 @@ define([
valueField : 'value',
search : false,
scrollAlwaysVisible: false,
takeFocusOnClose: false
takeFocusOnClose: false,
dataHint: '',
dataHintDirection: ''
},
template: _.template([
'<span class="input-group combobox <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<input type="text" class="form-control" spellcheck="false">',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>">',
'<span class="caret"></span>',
'</button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
@ -147,7 +149,9 @@ define([
menuCls : this.menuCls,
menuStyle : this.menuStyle,
items : items,
scope : me
scope : me,
dataHint : this.options.dataHint,
dataHintDirection: this.options.dataHintDirection
}));
if (this.itemsTemplate)
this.cmpEl.find('ul').html(

2
apps/common/main/lib/component/ComboBoxFonts.js
View file

@ -88,7 +88,7 @@ define([
'<div class="input-group combobox fonts <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<input type="text" class="form-control" spellcheck="false"> ',
'<div style="display: table-cell;"></div>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>"><span class="caret"></span></button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<li class="divider">',
'<% _.each(items, function(item) { %>',

8
apps/common/main/lib/component/ComboDataView.js
View file

@ -60,7 +60,9 @@ define([
beforeOpenHandler : null,
additionalMenuItems : null,
showLast: true,
minWidth: -1
minWidth: -1,
dataHint: '',
dataHintDirection: ''
},
template: _.template([
@ -110,7 +112,9 @@ define([
items: [
{template: _.template('<div class="menu-picker-container"></div>')}
]
})
}),
dataHint: this.options.dataHint,
dataHintDirection: this.options.dataHintDirection
});
if (this.options.additionalMenuItems != null) {

66
apps/common/main/lib/component/HintManager.js
View file

@ -48,7 +48,7 @@ if (Common.UI === undefined) {
Common.UI.HintManager = new(function() {
var _lang = 'en',
_arrLetters = [],
_arrAlphabet = [],
_isAlt = false,
_hintVisible = false,
_currentLevel = 0,
@ -91,6 +91,15 @@ Common.UI.HintManager = new(function() {
_currentLevel--;
};
var _getLetters = function(countButtons) {
var arr = [..._arrAlphabet];
arr[0] = _arrAlphabet[0].repeat(2);
for (var i = 1; arr.length < countButtons; i++) {
arr.push(_arrAlphabet[0] + _arrAlphabet[i]);
}
return arr;
};
var _getControls = function() {
/*if (!_controls[_currentLevel]) {
_controls[_currentLevel] = $('[data-hint=' + (_currentLevel) + ']').toArray();
@ -101,18 +110,11 @@ Common.UI.HintManager = new(function() {
var visibleItems = arr.filter(function (item) {
return $(item).is(':visible');
});
if (visibleItems.length > _arrLetters.length) {
var arrLength = _arrLetters.length;
var count = visibleItems.length - arrLength;
var arrIndexes = [];
for (var i = 0; arrIndexes.length < count; i++) {
var randInd = Math.floor(Math.random() * arrLength); //get random index
if (arrIndexes.indexOf(randInd) === -1 && randInd < arrLength - 1) {
arrIndexes.push(randInd);
_arrLetters[_arrLetters.length] = _arrLetters[randInd] + _arrLetters[randInd + 1];
_arrLetters[randInd] = _arrLetters[randInd] + _arrLetters[randInd];
}
}
var _arrLetters = [];
if (visibleItems.length > _arrAlphabet.length) {
_arrLetters = _getLetters(visibleItems.length);
} else {
_arrLetters = [..._arrAlphabet];
}
visibleItems.forEach(function (item, index) {
var el = $(item);
@ -129,22 +131,42 @@ Common.UI.HintManager = new(function() {
if (!item.hasClass('disabled')) {
var hint = $('<div style="" class="hint-div">' + item.attr('data-hint-title') + '</div>');
var direction = item.attr('data-hint-direction');
var offsets = item.attr('data-hint-offset') ? item.attr('data-hint-offset').split(',').map((item) => (parseInt(item))) : [0, 0];
var offset = item.offset();
if (direction === 'top')
hint.css({left: offset.left + (item.outerWidth() - 20) / 2, top: offset.top - 16});
if (direction === 'middle')
hint.css({
top: offset.top + item.outerHeight() / 2 + 6 + offsets[0],
left: offset.left + (item.outerWidth() - 20) / 2 + offsets[1]
});
else if (direction === 'top')
hint.css({
top: offset.top - 16 + offsets[0],
left: offset.left + (item.outerWidth() - 20) / 2 + offsets[1]
});
else if (direction === 'left-top')
hint.css({
top: offset.top - 16 + offsets[0],
left: offset.left - 16 + offsets[1]
});
else if (direction === 'right')
hint.css({
left: offset.left + item.outerWidth() - 4,
top: offset.top + (item.outerHeight() - 20) / 2
top: offset.top + (item.outerHeight() - 20) / 2 + offsets[0],
left: offset.left + item.outerWidth() - 4 + offsets[1]
});
else if (direction === 'left')
hint.css({left: offset.left - 18, top: offset.top + (item.outerHeight() - 20) / 2});
hint.css({
top: offset.top + (item.outerHeight() - 20) / 2 + offsets[0],
left: offset.left - 18 + offsets[1]
});
else if (direction === 'left-bottom')
hint.css({left: offset.left - 8, top: offset.top - item.outerHeight()});
hint.css({
top: offset.top + item.outerHeight() - 3 + offsets[0],
left: offset.left - 16 + offsets[1]
});
else
hint.css({
left: offset.left + (item.outerWidth() - 20) / 2,
top: offset.top + item.outerHeight() - 3
top: offset.top + item.outerHeight() - 3 + offsets[0],
left: offset.left + (item.outerWidth() - 20) / 2 + offsets[1]
});
$(document.body).append(hint);
@ -214,7 +236,7 @@ Common.UI.HintManager = new(function() {
var _getAlphabetLetters = function () {
Common.Utils.loadConfig('../../common/main/resources/alphabetletters/alphabetletters.json', function (langsJson) {
_arrLetters = langsJson[_lang];
_arrAlphabet = langsJson[_lang];
});
};

6
apps/common/main/lib/util/utils.js
View file

@ -858,7 +858,7 @@ Common.Utils.lockControls = function(causes, lock, opts, defControls) {
});
};
Common.Utils.injectButtons = function($slots, id, iconCls, caption, lock, split, menu, toggle) {
Common.Utils.injectButtons = function($slots, id, iconCls, caption, lock, split, menu, toggle, dataHint, dataHintDirection) {
var btnsArr = createButtonSet();
btnsArr.setDisabled(true);
id = id || ("id-toolbar-" + iconCls);
@ -876,7 +876,9 @@ Common.Utils.injectButtons = function($slots, id, iconCls, caption, lock, split,
menu: menu || false,
enableToggle: toggle || false,
lock: lock,
disabled: true
disabled: true,
dataHint: dataHint,
dataHintDirection: dataHintDirection
});
btnsArr.add(button);

3
apps/common/main/lib/view/Header.js
View file

@ -463,7 +463,8 @@ define([
iconCls: iconid,
disabled: disabled === true,
dataHint:'0',
dataHintDirection: 'left-bottom'
dataHintDirection: 'left',
dataHintOffset: '10, 10'
})).render(slot);
}

8
apps/common/main/lib/view/Plugins.js
View file

@ -159,7 +159,9 @@ define([
menu: modes && modes.length > 1,
split: modes && modes.length > 1,
value: guid,
hint: model.get('name')
hint: model.get('name'),
dataHint: '1',
dataHintDirection: 'bottom'
});
var $slot = $('<span class="btn-slot text x-huge"></span>').appendTo(_group);
@ -386,7 +388,9 @@ define([
menu: _menu_items.length > 1,
split: _menu_items.length > 1,
value: guid,
hint: model.get('name')
hint: model.get('name'),
dataHint: '1',
dataHintDirection: 'bottom'
});
if ( btn.split ) {

44
apps/common/main/lib/view/ReviewChanges.js
View file

@ -237,14 +237,18 @@ define([
cls: 'btn-toolbar x-huge icon-top',
caption: this.txtAccept,
split: !this.appConfig.canUseReviewPermissions,
iconCls: 'toolbar__icon btn-review-save'
iconCls: 'toolbar__icon btn-review-save',
dataHint: '1',
dataHintDirection: 'bottom'
});
this.btnReject = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
caption: this.txtReject,
split: !this.appConfig.canUseReviewPermissions,
iconCls: 'toolbar__icon btn-review-deny'
iconCls: 'toolbar__icon btn-review-deny',
dataHint: '1',
dataHintDirection: 'bottom'
});
if (this.appConfig.canFeatureComparison)
@ -260,7 +264,9 @@ define([
iconCls: 'toolbar__icon btn-ic-review',
caption: this.txtTurnon,
split: !this.appConfig.isReviewOnly,
enableToggle: true
enableToggle: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.btnsTurnReview = [this.btnTurnOn];
}
@ -268,13 +274,17 @@ define([
this.btnPrev = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-review-prev',
caption: this.txtPrev
caption: this.txtPrev,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.btnNext = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-review-next',
caption: this.txtNext
caption: this.txtNext,
dataHint: '1',
dataHintDirection: 'bottom'
});
if (!this.appConfig.isRestrictedEdit) {// hide Display mode option for fillForms and commenting mode
@ -317,7 +327,9 @@ define([
value: 'original'
}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
}
}
@ -335,7 +347,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-ic-coedit',
caption: this.txtCoAuthMode,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
}
@ -346,7 +360,9 @@ define([
this.btnHistory = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-ic-history',
caption: this.txtHistory
caption: this.txtHistory,
dataHint: '1',
dataHintDirection: 'bottom'
});
}
@ -355,7 +371,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-ic-chat',
caption: this.txtChat,
enableToggle: true
enableToggle: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
}
@ -364,13 +382,17 @@ define([
cls: 'btn-toolbar x-huge icon-top',
caption: this.txtCommentRemove,
split: true,
iconCls: 'toolbar__icon btn-rem-comment'
iconCls: 'toolbar__icon btn-rem-comment',
dataHint: '1',
dataHintDirection: 'bottom'
});
this.btnCommentResolve = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
caption: this.txtCommentResolve,
split: true,
iconCls: 'toolbar__icon btn-resolve-all'
iconCls: 'toolbar__icon btn-resolve-all',
dataHint: '1',
dataHintDirection: 'bottom'
});
}

2
apps/documenteditor/main/app/controller/Toolbar.js
View file

@ -3168,7 +3168,7 @@ define([
me.appOptions = config;
if ( config.canCoAuthoring && config.canComments ) {
this.btnsComment = Common.Utils.injectButtons(this.toolbar.$el.find('.slot-comment'), 'tlbtn-addcomment-', 'toolbar__icon btn-menu-comments', this.toolbar.capBtnComment);
this.btnsComment = Common.Utils.injectButtons(this.toolbar.$el.find('.slot-comment'), 'tlbtn-addcomment-', 'toolbar__icon btn-menu-comments', this.toolbar.capBtnComment, undefined, undefined, undefined, undefined, '1', 'bottom');
if ( this.btnsComment.length ) {
var _comments = DE.getController('Common.Controllers.Comments').getView();
this.btnsComment.forEach(function (btn) {

30
apps/documenteditor/main/app/view/Links.js
View file

@ -161,9 +161,9 @@ define([
var me = this,
$host = me.toolbar.$el;
this.btnsContents = Common.Utils.injectButtons($host.find('.btn-slot.btn-contents'), '', 'toolbar__icon btn-contents', me.capBtnInsContents, undefined, true, true );
this.btnsNotes = Common.Utils.injectButtons($host.find('.btn-slot.slot-notes'), '', 'toolbar__icon btn-notes', me.capBtnInsFootnote, undefined, true, true);
this.btnsHyperlink = Common.Utils.injectButtons($host.find('.btn-slot.slot-inshyperlink'), '', 'toolbar__icon btn-inserthyperlink', me.capBtnInsLink);
this.btnsContents = Common.Utils.injectButtons($host.find('.btn-slot.btn-contents'), '', 'toolbar__icon btn-contents', me.capBtnInsContents, undefined, true, true, undefined, '1', 'bottom' );
this.btnsNotes = Common.Utils.injectButtons($host.find('.btn-slot.slot-notes'), '', 'toolbar__icon btn-notes', me.capBtnInsFootnote, undefined, true, true, undefined, '1', 'bottom');
this.btnsHyperlink = Common.Utils.injectButtons($host.find('.btn-slot.slot-inshyperlink'), '', 'toolbar__icon btn-inserthyperlink', me.capBtnInsLink, undefined, undefined, undefined, undefined, '1', 'bottom');
Array.prototype.push.apply(this.paragraphControls, this.btnsContents.concat(this.btnsNotes, this.btnsHyperlink));
this.btnContentsUpdate = new Common.UI.Button({
@ -173,7 +173,9 @@ define([
caption: this.capBtnContentsUpdate,
split: true,
menu: true,
disabled: true
disabled: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnContentsUpdate);
@ -182,7 +184,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-bookmarks',
caption: this.capBtnBookmarks,
disabled: true
disabled: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnBookmarks);
@ -191,7 +195,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-caption',
caption: this.capBtnCaption,
disabled: true
disabled: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnCaption);
@ -200,7 +206,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-cross-reference',
caption: this.capBtnCrossRef,
disabled: true
disabled: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnCrossRef);
@ -209,7 +217,9 @@ define([
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-contents',
caption: this.capBtnTOF,
disabled: true
disabled: true,
dataHint: '1',
dataHintDirection: 'right'
});
this.paragraphControls.push(this.btnTableFigures);
@ -218,7 +228,9 @@ define([
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-update',
caption: this.capBtnContentsUpdate,
disabled: true
disabled: true,
dataHint: '1',
dataHintDirection: 'right'
});
this.paragraphControls.push(this.btnTableFiguresUpdate);

160
apps/documenteditor/main/app/view/Toolbar.js
View file

@ -157,28 +157,36 @@ define([
this.btnCopy = new Common.UI.Button({
id: 'id-toolbar-btn-copy',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-copy'
iconCls: 'toolbar__icon btn-copy',
dataHint: '0',
dataHintDirection: 'right'
});
this.toolbarControls.push(this.btnCopy);
this.btnPaste = new Common.UI.Button({
id: 'id-toolbar-btn-paste',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-paste'
iconCls: 'toolbar__icon btn-paste',
dataHint: '0',
dataHintDirection: 'right'
});
this.paragraphControls.push(this.btnPaste);
this.btnIncFontSize = new Common.UI.Button({
id: 'id-toolbar-btn-incfont',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-incfont'
iconCls: 'toolbar__icon btn-incfont',
dataHint: '1',
dataHintDirection: 'top'
});
this.paragraphControls.push(this.btnIncFontSize);
this.btnDecFontSize = new Common.UI.Button({
id: 'id-toolbar-btn-decfont',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-decfont'
iconCls: 'toolbar__icon btn-decfont',
dataHint: '1',
dataHintDirection: 'top'
});
this.paragraphControls.push(this.btnDecFontSize);
@ -261,7 +269,9 @@ define([
checkable: true
})
]
})
}),
dataHint: '1',
dataHintDirection: 'left-bottom'
});
this.paragraphControls.push(this.btnHighlightColor);
this.textOnlyControls.push(this.btnHighlightColor);
@ -283,7 +293,9 @@ define([
{template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 216px; margin: 10px;"></div>')},
{template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="">' + this.textNewColor + '</a>')}
]
})
}),
dataHint: '1',
dataHintDirection: 'left-bottom'
});
this.paragraphControls.push(this.btnFontColor);
@ -297,7 +309,9 @@ define([
{template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 216px; margin: 10px;"></div>')},
{template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
]
})
}),
dataHint: '1',
dataHintDirection: 'left-bottom'
});
this.paragraphControls.push(this.btnParagraphColor);
this.textOnlyControls.push(this.btnParagraphColor);
@ -314,7 +328,9 @@ define([
{caption: this.mniCapitalizeWords, value: Asc.c_oAscChangeTextCaseType.CapitalizeWords},
{caption: this.mniToggleCase, value: Asc.c_oAscChangeTextCaseType.ToggleCase}
]
})
}),
dataHint: '1',
dataHintDirection: 'top'
});
this.paragraphControls.push(this.btnChangeCase);
@ -417,7 +433,9 @@ define([
{caption: this.mniHiddenChars, value: 'characters', checkable: true},
{caption: this.mniHiddenBorders, value: 'table', checkable: true}
]
})
}),
dataHint: '1',
dataHintDirection: 'left-bottom'
});
this.toolbarControls.push(this.btnShowHidenChars);
@ -430,7 +448,7 @@ define([
split: true,
menu: true,
dataHint: '1',
dataHintDirection: 'top'
dataHintDirection: 'left-top'
});
this.paragraphControls.push(this.btnMarkers);
this.textOnlyControls.push(this.btnMarkers);
@ -444,7 +462,7 @@ define([
split: true,
menu: true,
dataHint: '1',
dataHintDirection: 'top'
dataHintDirection: 'left-top'
});
this.paragraphControls.push(this.btnNumbers);
this.textOnlyControls.push(this.btnNumbers);
@ -491,7 +509,9 @@ define([
{caption: this.mniDrawTable, value: 'draw', checkable: true},
{caption: this.mniEraseTable, value: 'erase', checkable: true}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertTable);
@ -506,7 +526,9 @@ define([
{caption: this.mniImageFromUrl, value: 'url'},
{caption: this.mniImageFromStorage, value: 'storage'}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertImage);
@ -515,7 +537,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
caption: me.capBtnInsChart,
iconCls: 'toolbar__icon btn-insertchart',
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertChart);
@ -524,7 +548,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-text',
caption: me.capBtnInsTextbox,
enableToggle: true
enableToggle: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertText);
this.btnInsertTextArt = new Common.UI.Button({
@ -537,7 +563,9 @@ define([
items: [
{template: _.template('<div id="id-toolbar-menu-insart" style="width: 239px; margin-left: 5px;"></div>')}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertTextArt);
@ -546,7 +574,9 @@ define([
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-editheader',
caption: me.capBtnInsHeader,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.mnuPageNumberPosPicker = {
conf: {disabled: false},
@ -568,7 +598,9 @@ define([
id: 'id-toolbar-btn-datetime',
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-datetime',
caption: me.capBtnDateTime
caption: me.capBtnDateTime,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsDateTime);
@ -576,7 +608,9 @@ define([
id: 'id-toolbar-btn-blankpage',
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-blankpage',
caption: me.capBtnBlankPage
caption: me.capBtnBlankPage,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnBlankPage);
@ -586,7 +620,9 @@ define([
iconCls: 'toolbar__icon btn-insertshape',
caption: me.capBtnInsShape,
enableToggle: true,
menu: new Common.UI.Menu({cls: 'menu-shapes'})
menu: new Common.UI.Menu({cls: 'menu-shapes'}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertShape);
@ -596,7 +632,9 @@ define([
iconCls: 'toolbar__icon btn-insertequation',
caption: me.capBtnInsEquation,
split: true,
menu: new Common.UI.Menu({cls: 'menu-shapes'})
menu: new Common.UI.Menu({cls: 'menu-shapes'}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertEquation);
@ -604,7 +642,9 @@ define([
id: 'tlbtn-insertsymbol',
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-symbol',
caption: me.capBtnInsSymbol
caption: me.capBtnInsSymbol,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnInsertSymbol);
@ -644,7 +684,9 @@ define([
{caption: '--'},
this.mnuDropCapAdvanced = new Common.UI.MenuItem({caption: this.mniEditDropCap})
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnDropCap);
@ -775,7 +817,9 @@ define([
{caption: '--'},
{caption: this.textColumnsCustom, value: 'advanced'}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.paragraphControls.push(this.btnColumns);
@ -804,7 +848,9 @@ define([
value: false
}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.toolbarControls.push(this.btnPageOrient);
@ -868,7 +914,9 @@ define([
{caption: '--'},
{caption: this.textPageMarginsCustom, value: 'advanced'}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.toolbarControls.push(this.btnPageMargins);
@ -992,7 +1040,9 @@ define([
{caption: '--'},
{caption: this.textPageSizeCustom, value: 'advanced'}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.toolbarControls.push(this.btnPageSize);
@ -1040,14 +1090,18 @@ define([
value: 5
}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
this.btnClearStyle = new Common.UI.Button({
id: 'id-toolbar-btn-clearstyle',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-clearstyle'
iconCls: 'toolbar__icon btn-clearstyle',
dataHint: '1',
dataHintDirection: 'top'
});
this.toolbarControls.push(this.btnClearStyle);
@ -1055,7 +1109,9 @@ define([
id: 'id-toolbar-btn-copystyle',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-copystyle',
enableToggle: true
enableToggle: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
this.toolbarControls.push(this.btnCopyStyle);
@ -1067,48 +1123,62 @@ define([
cls: 'shifted-left',
items: [],
restoreHeight: true
})
}),
dataHint: '1',
dataHintDirection: 'top'
});
this.toolbarControls.push(this.btnColorSchemas);
this.btnMailRecepients = new Common.UI.Button({
id: 'id-toolbar-btn-mailrecepients',
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-mailmerge'
iconCls: 'toolbar__icon btn-mailmerge',
dataHint: '1',
dataHintDirection: 'bottom'
});
me.btnImgAlign = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-img-align',
caption: me.capImgAlign,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
me.btnImgGroup = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-img-group',
caption: me.capImgGroup,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
me.btnImgForward = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-img-frwd',
caption: me.capImgForward,
split: true,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
me.btnImgBackward = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-img-bkwd',
caption: me.capImgBackward,
split: true,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
me.btnImgWrapping = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-img-wrap',
caption: me.capImgWrapping,
menu: true
menu: true,
dataHint: '1',
dataHintDirection: 'bottom'
});
me.btnWatermark = new Common.UI.Button({
@ -1127,7 +1197,9 @@ define([
value: 'remove'
}
]
})
}),
dataHint: '1',
dataHintDirection: 'bottom'
});
me.toolbarControls.push(me.btnImgAlign,
@ -1167,7 +1239,9 @@ define([
{value: 48, displayValue: "48"},
{value: 72, displayValue: "72"},
{value: 96, displayValue: "96"}
]
],
dataHint: '1',
dataHintDirection: 'left-top'
});
this.paragraphControls.push(this.cmbFontSize);
@ -1176,7 +1250,9 @@ define([
menuCls: 'scrollable-menu',
menuStyle: 'min-width: 325px;',
hint: this.tipFontName,
store: new Common.Collections.Fonts()
store: new Common.Collections.Fonts(),
dataHint: '1',
dataHintDirection: 'left-top'
});
this.paragraphControls.push(this.cmbFontName);
@ -1193,6 +1269,8 @@ define([
itemWidth: 104,
itemHeight: 38,
// hint : this.tipParagraphStyle,
dataHint: '1',
dataHintDirection: 'middle',
enableKeyEvents: true,
additionalMenuItems: [this.listStylesAdditionalMenuItem],
beforeOpenHandler: function (e) {
@ -1440,7 +1518,7 @@ define([
_injectComponent('#slot-img-wrapping', this.btnImgWrapping);
_injectComponent('#slot-btn-watermark', this.btnWatermark);
this.btnsPageBreak = Common.Utils.injectButtons($host.find('.btn-slot.btn-pagebreak'), '', 'toolbar__icon btn-pagebreak', this.capBtnInsPagebreak, undefined, true, true);
this.btnsPageBreak = Common.Utils.injectButtons($host.find('.btn-slot.btn-pagebreak'), '', 'toolbar__icon btn-pagebreak', this.capBtnInsPagebreak, undefined, true, true, undefined, '1', 'bottom');
Array.prototype.push.apply(this.paragraphControls, this.btnsPageBreak);
return $host;