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

[DE] Add settings for multilevel list

Browse source
This commit is contained in:
Julia Radzhabova 2019-12-17 17:25:12 +03:00
parent 7b1f56d69f
commit 3585f70ccc
3 changed files with 33 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -288,6 +288,7 @@ define([
toolbar.mnuMultilevelPicker.on('item:click', _.bind(this.onSelectBullets, this, toolbar.btnMultilevels)); toolbar.mnuMultilevelPicker.on('item:click', _.bind(this.onSelectBullets, this, toolbar.btnMultilevels));
toolbar.mnuMarkerSettings.on('click', _.bind(this.onMarkerSettingsClick, this, 0)); toolbar.mnuMarkerSettings.on('click', _.bind(this.onMarkerSettingsClick, this, 0));
toolbar.mnuNumberSettings.on('click', _.bind(this.onMarkerSettingsClick, this, 1)); toolbar.mnuNumberSettings.on('click', _.bind(this.onMarkerSettingsClick, this, 1));
toolbar.mnuMultilevelSettings.on('click', _.bind(this.onMarkerSettingsClick, this, 2));
toolbar.btnHighlightColor.on('click', _.bind(this.onBtnHighlightColor, this)); toolbar.btnHighlightColor.on('click', _.bind(this.onBtnHighlightColor, this));
toolbar.btnFontColor.on('click', _.bind(this.onBtnFontColor, this)); toolbar.btnFontColor.on('click', _.bind(this.onBtnFontColor, this));
toolbar.btnParagraphColor.on('click', _.bind(this.onBtnParagraphColor, this)); toolbar.btnParagraphColor.on('click', _.bind(this.onBtnParagraphColor, this));
@ -502,6 +503,7 @@ define([
this.toolbar.mnuMarkersPicker.deselectAll(true); this.toolbar.mnuMarkersPicker.deselectAll(true);
this.toolbar.mnuMultilevelPicker.deselectAll(true); this.toolbar.mnuMultilevelPicker.deselectAll(true);
this.toolbar.mnuMarkerSettings && this.toolbar.mnuMarkerSettings.setDisabled(this._state.bullets.subtype<0); this.toolbar.mnuMarkerSettings && this.toolbar.mnuMarkerSettings.setDisabled(this._state.bullets.subtype<0);
this.toolbar.mnuMultilevelSettings && this.toolbar.mnuMultilevelSettings.setDisabled(this._state.bullets.subtype<0);
break; break;
case 1: case 1:
var idx; var idx;
@ -538,6 +540,7 @@ define([
this.toolbar.mnuNumbersPicker.deselectAll(true); this.toolbar.mnuNumbersPicker.deselectAll(true);
this.toolbar.mnuMultilevelPicker.deselectAll(true); this.toolbar.mnuMultilevelPicker.deselectAll(true);
this.toolbar.mnuNumberSettings && this.toolbar.mnuNumberSettings.setDisabled(idx==0); this.toolbar.mnuNumberSettings && this.toolbar.mnuNumberSettings.setDisabled(idx==0);
this.toolbar.mnuMultilevelSettings && this.toolbar.mnuMultilevelSettings.setDisabled(idx==0);
break; break;
case 2: case 2:
this.toolbar.btnMultilevels.toggle(true, true); this.toolbar.btnMultilevels.toggle(true, true);
@ -1333,7 +1336,6 @@ define([
level = me.api.asc_GetCurrentNumberingLvl(), level = me.api.asc_GetCurrentNumberingLvl(),
props = (listId !== null) ? me.api.asc_GetNumberingPr(listId).get_Lvl(level) : null; props = (listId !== null) ? me.api.asc_GetNumberingPr(listId).get_Lvl(level) : null;
if (props) { if (props) {
var type = props.get_Format();
(new DE.Views.ListSettingsDialog({ (new DE.Views.ListSettingsDialog({
api: me.api, api: me.api,
props: props, props: props,
@ -2217,6 +2219,7 @@ define([
this.toolbar.mnuMultilevelPicker.selectByIndex(0, true); this.toolbar.mnuMultilevelPicker.selectByIndex(0, true);
this.toolbar.mnuMarkerSettings && this.toolbar.mnuMarkerSettings.setDisabled(true); this.toolbar.mnuMarkerSettings && this.toolbar.mnuMarkerSettings.setDisabled(true);
this.toolbar.mnuNumberSettings && this.toolbar.mnuNumberSettings.setDisabled(true); this.toolbar.mnuNumberSettings && this.toolbar.mnuNumberSettings.setDisabled(true);
this.toolbar.mnuMultilevelSettings && this.toolbar.mnuMultilevelSettings.setDisabled(true);
}, },
_getApiTextSize: function () { _getApiTextSize: function () {

29
apps/documenteditor/main/app/view/ListSettingsDialog.js
View file

@ -52,7 +52,7 @@ define([
DE.Views.ListSettingsDialog = Common.UI.Window.extend(_.extend({ DE.Views.ListSettingsDialog = Common.UI.Window.extend(_.extend({
options: { options: {
type: Asc.c_oAscNumberingFormat.Bullet, type: 0, // 0 - markers, 1 - numbers, 2 - multilevel
width: 300, width: 300,
height: 334, height: 334,
style: 'min-width: 240px;', style: 'min-width: 240px;',
@ -62,7 +62,7 @@ define([
}, },
initialize : function(options) { initialize : function(options) {
this.type = (options.type!==undefined) ? options.type : Asc.c_oAscNumberingFormat.Bullet; this.type = options.type || 0;
_.extend(this.options, { _.extend(this.options, {
title: this.txtTitle title: this.txtTitle
@ -73,7 +73,7 @@ define([
'<table cols="2" style="width: 100%;">', '<table cols="2" style="width: 100%;">',
'<tr>', '<tr>',
'<td style="padding-right: 5px;">', '<td style="padding-right: 5px;">',
'<% if (type == Asc.c_oAscNumberingFormat.Bullet) { %>', '<% if (type == 0) { %>',
'<label class="input-label">' + this.txtBullet + '</label>', '<label class="input-label">' + this.txtBullet + '</label>',
'<button type="button" class="btn btn-text-default" id="id-dlg-bullet-font" style="width: 100%;margin-bottom: 10px;">' + this.txtFont + '</button>', '<button type="button" class="btn btn-text-default" id="id-dlg-bullet-font" style="width: 100%;margin-bottom: 10px;">' + this.txtFont + '</button>',
'<% } else { %>', '<% } else { %>',
@ -96,8 +96,14 @@ define([
'<div id="id-dlg-bullet-color" style="margin-bottom: 10px;"></div>', '<div id="id-dlg-bullet-color" style="margin-bottom: 10px;"></div>',
'</td>', '</td>',
'</tr>', '</tr>',
'</table>',
'<table cols="2" style="width: 100%;">',
'<tr>', '<tr>',
'<td colspan="2">', '<td class="<% if (type != 2) { %> hidden <% } %>" style="width: 50px; padding-right: 10px;">',
'<label>' + this.textLevel + '</label>',
'<div id="levels-list" style="width:100%; height: 120px;margin-top: 2px; "></div>',
'</td>',
'<td>',
'<label>' + this.textPreview + '</label>', '<label>' + this.textPreview + '</label>',
'<div id="bulleted-list-preview" style="margin-top: 2px; height: 120px; width: 100%; border: 1px solid #cfcfcf;"></div>', '<div id="bulleted-list-preview" style="margin-top: 2px; height: 120px; width: 100%; border: 1px solid #cfcfcf;"></div>',
'</td>', '</td>',
@ -108,6 +114,7 @@ define([
this.props = options.props; this.props = options.props;
this.level = options.level; this.level = options.level;
this.api = options.api;
this.options.tpl = _.template(this.template)(this.options); this.options.tpl = _.template(this.template)(this.options);
Common.UI.Window.prototype.initialize.call(this, this.options); Common.UI.Window.prototype.initialize.call(this, this.options);
@ -170,7 +177,7 @@ define([
this.cmbFormat = new Common.UI.ComboBox({ this.cmbFormat = new Common.UI.ComboBox({
el : $window.find('#id-dlg-numbering-format'), el : $window.find('#id-dlg-numbering-format'),
menuStyle : 'min-width: 100%;', menuStyle : 'min-width: 100%;max-height: 183px;',
editable : false, editable : false,
cls : 'input-group-nr', cls : 'input-group-nr',
data : [ data : [
@ -244,6 +251,15 @@ define([
} }
}, this)); }, this));
var levels = [];
for (var i=0; i<9; i++)
levels.push({value: i, levelProps: null});
this.levelsList = new Common.UI.ListView({
el: $('#levels-list', this.$window),
store: new Common.UI.DataViewStore(levels),
itemTemplate: _.template('<div id="<%= id %>" class="list-item" style="pointer-events:none;overflow: hidden; text-overflow: ellipsis;"><%= (value+1) %></div>')
});
this.afterRender(); this.afterRender();
}, },
@ -399,6 +415,7 @@ define([
textAuto: 'Auto', textAuto: 'Auto',
textPreview: 'Preview', textPreview: 'Preview',
txtType: 'Type', txtType: 'Type',
txtLikeText: 'Like a text' txtLikeText: 'Like a text',
textLevel: 'Level'
}, DE.Views.ListSettingsDialog || {})) }, DE.Views.ListSettingsDialog || {}))
}); });

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

@ -1635,7 +1635,12 @@ define([
new Common.UI.Menu({ new Common.UI.Menu({
style: 'min-width: 90px', style: 'min-width: 90px',
items: [ items: [
{template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 93px; margin: 0 5px;"></div>')} {template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 93px; margin: 0 16px;"></div>')},
this.mnuMultilevelSettings = new Common.UI.MenuItem({
caption: this.textListSettings,
disabled: (this.mnuMultilevelPicker.conf.index || 0)==0,
value: 'settings'
})
] ]
}) })
); );