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

Merge pull request #267 from ONLYOFFICE/feature/de-controls

Browse source 
Feature/de controls
This commit is contained in:
Julia Radzhabova 2019-11-19 13:26:32 +03:00 committed by GitHub
parent 6f0636a687 508e81a7d1
commit b37f5921b7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 808 additions and 94 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
apps/common/main/lib/view/SymbolTableDialog.js
View file

@ -453,6 +453,15 @@ define([
var init = (aFontSelects.length<1);
init && this.initFonts();
if (options.font) {
for(var i = 0; i < aFontSelects.length; ++i){
if(aFontSelects[i].displayValue === options.font){
nCurrentFont = i;
break;
}
}
}
if (nCurrentFont < 0)
nCurrentFont = 0;
@ -477,6 +486,10 @@ define([
nCurrentSymbol = aRanges[0].Start;
}
if (options.code) {
nCurrentSymbol = options.code;
}
if (init && this.options.lang && this.options.lang != 'en') {
var me = this;
loadTranslation(this.options.lang, function(){
@ -536,6 +549,7 @@ define([
for(i = 0; i < aFontSelects.length; ++i){
aFontSelects[i].value = i;
}
if(!oFontsByName[sInitFont]){
if(oFontsByName['Cambria Math']){
sInitFont = 'Cambria Math';

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

@ -380,6 +380,7 @@ define([
this.api.asc_registerCallback('asc_onContextMenu', _.bind(this.onContextMenu, this));
this.api.asc_registerCallback('asc_onShowParaMarks', _.bind(this.onShowParaMarks, this));
this.api.asc_registerCallback('asc_onChangeSdtGlobalSettings', _.bind(this.onChangeSdtGlobalSettings, this));
this.api.asc_registerCallback('asc_onTextLanguage', _.bind(this.onTextLanguage, this));
Common.NotificationCenter.on('fonts:change', _.bind(this.onApiChangeFont, this));
} else if (this.mode.isRestrictedEdit) {
this.api.asc_registerCallback('asc_onFocusObject', _.bind(this.onApiFocusObjectRestrictedEdit, this));
@ -752,10 +753,11 @@ define([
(lock_type===undefined) && (lock_type = Asc.c_oAscSdtLockType.Unlocked);
if (!paragraph_locked && !header_locked) {
toolbar.btnContentControls.menu.items[0].setDisabled(control_plain || lock_type==Asc.c_oAscSdtLockType.SdtContentLocked || lock_type==Asc.c_oAscSdtLockType.ContentLocked);
toolbar.btnContentControls.menu.items[1].setDisabled(control_plain || lock_type==Asc.c_oAscSdtLockType.SdtContentLocked || lock_type==Asc.c_oAscSdtLockType.ContentLocked);
toolbar.btnContentControls.menu.items[3].setDisabled(!in_control || lock_type==Asc.c_oAscSdtLockType.SdtContentLocked || lock_type==Asc.c_oAscSdtLockType.SdtLocked);
toolbar.btnContentControls.menu.items[5].setDisabled(!in_control);
var control_disable = control_plain || lock_type==Asc.c_oAscSdtLockType.SdtContentLocked || lock_type==Asc.c_oAscSdtLockType.ContentLocked;
for (var i=0; i<7; i++)
toolbar.btnContentControls.menu.items[i].setDisabled(control_disable);
toolbar.btnContentControls.menu.items[8].setDisabled(!in_control || lock_type==Asc.c_oAscSdtLockType.SdtContentLocked || lock_type==Asc.c_oAscSdtLockType.SdtLocked);
toolbar.btnContentControls.menu.items[10].setDisabled(!in_control);
}
var need_text_disable = paragraph_locked || header_locked || in_chart;
@ -1733,6 +1735,8 @@ define([
(new DE.Views.ControlSettingsDialog({
props: props,
api: me.api,
controlLang: me._state.lang,
interfaceLang: me.mode.lang,
handler: function(result, value) {
if (result == 'ok') {
me.api.asc_SetContentControlProperties(value, id);
@ -1749,7 +1753,17 @@ define([
}
}
} else {
this.api.asc_AddContentControl(item.value);
if (item.value == 'plain' || item.value == 'rich')
this.api.asc_AddContentControl((item.value=='plain') ? Asc.c_oAscSdtLevelType.Inline : Asc.c_oAscSdtLevelType.Block);
else if (item.value == 'picture')
this.api.asc_AddContentControlPicture();
else if (item.value == 'checkbox')
this.api.asc_AddContentControlCheckBox();
else if (item.value == 'date')
this.api.asc_AddContentControlDatePicker();
else if (item.value == 'combobox' || item.value == 'dropdown')
this.api.asc_AddContentControlList(item.value == 'combobox');
Common.component.Analytics.trackEvent('ToolBar', 'Add Content Control');
}
@ -2952,6 +2966,10 @@ define([
}
},
onTextLanguage: function(langId) {
this._state.lang = langId;
},
textEmptyImgUrl : 'You need to specify image URL.',
textWarning : 'Warning',
textFontSizeErr : 'The entered value is incorrect.<br>Please enter a numeric value between 1 and 100',

151
apps/documenteditor/main/app/template/ControlSettingsDialog.template Normal file
View file

@ -0,0 +1,151 @@
<div id="id-adv-control-settings-general" class="settings-panel active">
<div class="inner-content">
<table cols="1" style="width: 100%;">
<tr>
<td class="padding-small">
<label class="input-label"><%= scope.textName %></label>
<div id="control-settings-txt-name"></div>
</td>
</tr>
<tr>
<td class="padding-large">
<label class="input-label"><%= scope.textTag %></label>
<div id="control-settings-txt-tag"></div>
</td>
</tr>
<tr>
<td class="padding-large">
<div class="separator horizontal"></div>
</td>
</tr>
</table>
<table cols="2" style="width: auto;">
<tr>
<td class="padding-small" colspan="2">
<label class="header"><%= scope.textAppearance %></label>
</td>
</tr>
<tr>
<td class="padding-small">
<label class="input-label" style="margin-right: 10px;"><%= scope.textShowAs %></label>
</td>
<td class="padding-small">
<div id="control-settings-combo-show" class="input-group-nr" style="display: inline-block; width:120px;"></div>
</td>
</tr>
<tr>
<td class="padding-small">
<label class="input-label" style="margin-right: 10px;"><%= scope.textColor %></label>
</td>
<td class="padding-small">
<div id="control-settings-color-btn" style="display: inline-block;"></div>
</td>
</tr>
<tr>
<td class="padding-large" colspan="2">
<button type="button" class="btn btn-text-default auto" id="control-settings-btn-all" style="min-width: 98px;"><%= scope.textApplyAll %></button>
</td>
</tr>
</table>
</div>
</div>
<div id="id-adv-control-settings-lock" class="settings-panel active">
<div class="inner-content">
<table cols="1" style="width: 100%;">
<tr>
<td class="padding-small">
<div id="control-settings-chb-lock-delete"></div>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="control-settings-chb-lock-edit"></div>
</td>
</tr>
</table>
</div>
</div>
<div id="id-adv-control-settings-list" class="settings-panel active">
<div class="inner-content">
<table cols="2" style="width: 100%;">
<tr>
<td>
<label class="header" style="width: 99px;"><%= scope.textDisplayName %></label>
<label class="header" style=""><%= scope.textValue %></label>
</td>
<td></td>
</tr>
<tr style="vertical-align: top;">
<td class="padding-small">
<div id="control-settings-list" style="width:200px; height: 192px;margin-right: 10px;"></div>
</td>
<td class="padding-small">
<button type="button" class="btn btn-text-default" id="control-settings-btn-add" style="min-width: 86px;margin-bottom: 5px;"><%= scope.textAdd %></button>
<button type="button" class="btn btn-text-default" id="control-settings-btn-change" style="min-width: 86px;margin-bottom: 5px;"><%= scope.textChange %></button>
<button type="button" class="btn btn-text-default" id="control-settings-btn-delete" style="min-width: 86px;margin-bottom: 5px;"><%= scope.textDelete %></button>
<button type="button" class="btn btn-text-default" id="control-settings-btn-up" style="min-width: 86px;margin-bottom: 5px;"><%= scope.textUp %></button>
<button type="button" class="btn btn-text-default" id="control-settings-btn-down" style="min-width: 86px;margin-bottom: 5px;"><%= scope.textDown %></button>
</td>
</tr>
</table>
</div>
</div>
<div id="id-adv-control-settings-date" class="settings-panel active">
<div class="inner-content">
<table cols="1" style="width: 100%;">
<tr>
<td>
<label><%= scope.textFormat %></label>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="control-settings-txt-format" style="width: 100%;"></div>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="control-settings-format" style="width: 100%; height: 165px;"></div>
</td>
</tr>
<tr>
<td>
<label><%= scope.textLang %></label>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="control-settings-lang"></div>
</td>
</tr>
</table>
</div>
</div>
<div id="id-adv-control-settings-checkbox" class="settings-panel">
<div class="inner-content">
<table cols="3" style="width: auto;">
<tr>
<td class="padding-small">
<label class="input-label" style="margin-right: 10px;"><%= scope.textChecked %></label>
</td>
<td class="padding-small">
<div id="control-settings-input-checked" style="margin-right: 10px;"></div>
</td>
<td class="padding-small">
<button type="button" class="btn btn-text-default" id="control-settings-btn-checked-edit" style="min-width:86px;"><%= scope.textChange %></button>
</td>
</tr>
<tr>
<td class="padding-small">
<label class="input-label" style="margin-right: 10px;"><%= scope.textUnchecked %></label>
</td>
<td class="padding-small">
<div id="control-settings-input-unchecked" style="margin-right: 10px;"></div>
</td>
<td class="padding-small">
<button type="button" class="btn btn-text-default" id="control-settings-btn-unchecked-edit" style="min-width:86px;"><%= scope.textChange %></button>
</td>
</tr>
</table>
</div>
</div>

469
apps/documenteditor/main/app/view/ControlSettingsDialog.js
View file

@ -39,17 +39,21 @@
*
*/
define([
define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
'common/main/lib/util/utils',
'common/main/lib/component/CheckBox',
'common/main/lib/component/InputField',
'common/main/lib/view/AdvancedSettingsWindow'
], function () { 'use strict';
'common/main/lib/view/AdvancedSettingsWindow',
'common/main/lib/view/SymbolTableDialog',
'documenteditor/main/app/view/EditListItemDialog'
], function (contentTemplate) { 'use strict';
DE.Views.ControlSettingsDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({
options: {
contentWidth: 310,
height: 412
height: 392,
toggleGroup: 'control-adv-settings-group',
storageName: 'de-control-settings-adv-category'
},
initialize : function(options) {
@ -57,83 +61,16 @@ define([
_.extend(this.options, {
title: this.textTitle,
template: [
'<div class="box" style="height:' + (me.options.height - 85) + 'px;">',
'<div class="content-panel" style="padding: 0 5px;"><div class="inner-content">',
'<div class="settings-panel active">',
'<table cols="1" style="width: 100%;">',
'<tr>',
'<td class="padding-small">',
'<label class="input-label">', me.textName, '</label>',
'<div id="control-settings-txt-name"></div>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-large">',
'<label class="input-label">', me.textTag, '</label>',
'<div id="control-settings-txt-tag"></div>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-large">',
'<div class="separator horizontal"></div>',
'</td>',
'</tr>',
'</table>',
'<table cols="2" style="width: auto;">',
'<tr>',
'<td class="padding-small" colspan="2">',
'<label class="header">', me.textAppearance, '</label>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-small">',
'<label class="input-label" style="margin-right: 10px;">', me.textShowAs,'</label>',
'</td>',
'<td class="padding-small">',
'<div id="control-settings-combo-show" class="input-group-nr" style="display: inline-block; width:120px;"></div>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-small">',
'<label class="input-label" style="margin-right: 10px;">', me.textColor, '</label>',
'</td>',
'<td class="padding-small">',
'<div id="control-settings-color-btn" style="display: inline-block;"></div>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-large" colspan="2">',
'<button type="button" class="btn btn-text-default auto" id="control-settings-btn-all" style="min-width: 98px;">', me.textApplyAll,'</button>',
'</td>',
'</tr>',
'</table>',
'<table cols="1" style="width: 100%;">',
'<tr>',
'<td class="padding-large">',
'<div class="separator horizontal"></div>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-small">',
'<label class="header">', me.textLock, '</label>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-small">',
'<div id="control-settings-chb-lock-delete"></div>',
'</td>',
'</tr>',
'<tr>',
'<td class="padding-small">',
'<div id="control-settings-chb-lock-edit"></div>',
'</td>',
'</tr>',
'</table>',
'</div></div>',
'</div>',
'</div>'
].join('')
items: [
{panelId: 'id-adv-control-settings-general', panelCaption: this.strGeneral},
{panelId: 'id-adv-control-settings-lock', panelCaption: this.textLock},
{panelId: 'id-adv-control-settings-list', panelCaption: this.textCombobox},
{panelId: 'id-adv-control-settings-date', panelCaption: this.textDate},
{panelId: 'id-adv-control-settings-checkbox',panelCaption: this.textCheckbox}
],
contentTemplate: _.template(contentTemplate)({
scope: this
})
}, options);
this.handler = options.handler;
@ -222,6 +159,117 @@ define([
labelText: this.txtLockEdit
});
// combobox & dropdown list
this.list = new Common.UI.ListView({
el: $('#control-settings-list', this.$window),
store: new Common.UI.DataViewStore(),
emptyText: '',
template: _.template(['<div class="listview inner" style=""></div>'].join('')),
itemTemplate: _.template([
'<div id="<%= id %>" class="list-item" style="width: 100%;display:inline-block;">',
'<div style="width:90px;display: inline-block;vertical-align: middle; overflow: hidden; text-overflow: ellipsis;white-space: pre;margin-right: 5px;"><%= name %></div>',
'<div style="width:90px;display: inline-block;vertical-align: middle; overflow: hidden; text-overflow: ellipsis;white-space: pre;"><%= value %></div>',
'</div>'
].join(''))
});
this.list.on('item:select', _.bind(this.onSelectItem, this));
this.btnAdd = new Common.UI.Button({
el: $('#control-settings-btn-add')
});
this.btnAdd.on('click', _.bind(this.onAddItem, this));
this.btnChange = new Common.UI.Button({
el: $('#control-settings-btn-change')
});
this.btnChange.on('click', _.bind(this.onChangeItem, this));
this.btnDelete = new Common.UI.Button({
el: $('#control-settings-btn-delete')
});
this.btnDelete.on('click', _.bind(this.onDeleteItem, this));
this.btnUp = new Common.UI.Button({
el: $('#control-settings-btn-up')
});
this.btnUp.on('click', _.bind(this.onMoveItem, this, true));
this.btnDown = new Common.UI.Button({
el: $('#control-settings-btn-down')
});
this.btnDown.on('click', _.bind(this.onMoveItem, this, false));
// date picker
var data = [{ value: 0x042C }, { value: 0x0402 }, { value: 0x0405 }, { value: 0x0407 }, {value: 0x0807}, { value: 0x0408 }, { value: 0x0C09 }, { value: 0x0809 }, { value: 0x0409 }, { value: 0x0C0A }, { value: 0x080A },
{ value: 0x040B }, { value: 0x040C }, { value: 0x0410 }, { value: 0x0411 }, { value: 0x0412 }, { value: 0x0426 }, { value: 0x0413 }, { value: 0x0415 }, { value: 0x0416 },
{ value: 0x0816 }, { value: 0x0419 }, { value: 0x041B }, { value: 0x0424 }, { value: 0x081D }, { value: 0x041D }, { value: 0x041F }, { value: 0x0422 }, { value: 0x042A }, { value: 0x0804 }];
data.forEach(function(item) {
var langinfo = Common.util.LanguageInfo.getLocalLanguageName(item.value);
item.displayValue = langinfo[1];
item.langName = langinfo[0];
});
this.cmbLang = new Common.UI.ComboBox({
el : $('#control-settings-lang'),
menuStyle : 'min-width: 100%; max-height: 185px;',
cls : 'input-group-nr',
editable : false,
data : data
});
this.cmbLang.setValue(0x0409);
this.cmbLang.on('selected',function(combo, record) {
me.updateFormats(record.value);
});
this.listFormats = new Common.UI.ListView({
el: $('#control-settings-format'),
store: new Common.UI.DataViewStore(),
scrollAlwaysVisible: true
});
this.listFormats.on('item:select', _.bind(this.onSelectFormat, this));
this.txtDate = new Common.UI.InputField({
el : $('#control-settings-txt-format'),
allowBlank : true,
validateOnChange: false,
validateOnBlur: false,
style : 'width: 100%;',
value : ''
});
// Check Box
this.txtChecked = new Common.UI.InputField({
el : $('#control-settings-input-checked'),
allowBlank : true,
validateOnChange: false,
validateOnBlur: false,
style : 'width: 30px;',
value : ''
});
this.txtChecked._input.attr('disabled', true);
this.txtChecked._input.css({'text-align': 'center', 'font-size': '16px'});
this.txtUnchecked = new Common.UI.InputField({
el : $('#control-settings-input-unchecked'),
allowBlank : true,
validateOnChange: false,
validateOnBlur: false,
style : 'width: 30px;',
value : ''
});
this.txtUnchecked._input.attr('disabled', true);
this.txtUnchecked._input.css({'text-align': 'center', 'font-size': '16px'});
this.btnEditChecked = new Common.UI.Button({
el: $('#control-settings-btn-checked-edit')
});
this.btnEditChecked.on('click', _.bind(this.onEditCheckbox, this, true));
this.btnEditUnchecked = new Common.UI.Button({
el: $('#control-settings-btn-unchecked-edit')
});
this.btnEditUnchecked.on('click', _.bind(this.onEditCheckbox, this, false));
this.afterRender();
},
@ -252,6 +300,10 @@ define([
afterRender: function() {
this.updateThemeColors();
this._setDefaults(this.props);
if (this.storageName) {
var value = Common.localStorage.getItem(this.storageName);
this.setActiveCategory((value!==null) ? parseInt(value) : 0);
}
},
show: function() {
@ -286,6 +338,69 @@ define([
(val===undefined) && (val = Asc.c_oAscSdtLockType.Unlocked);
this.chLockDelete.setValue(val==Asc.c_oAscSdtLockType.SdtContentLocked || val==Asc.c_oAscSdtLockType.SdtLocked);
this.chLockEdit.setValue(val==Asc.c_oAscSdtLockType.SdtContentLocked || val==Asc.c_oAscSdtLockType.ContentLocked);
var type = props.get_SpecificType();
//for list controls
this.btnsCategory[2].setVisible(type == Asc.c_oAscContentControlSpecificType.ComboBox || type == Asc.c_oAscContentControlSpecificType.DropDownList);
if (type == Asc.c_oAscContentControlSpecificType.ComboBox || type == Asc.c_oAscContentControlSpecificType.DropDownList) {
this.btnsCategory[2].setCaption(type == Asc.c_oAscContentControlSpecificType.ComboBox ? this.textCombobox : this.textDropDown);
var specProps = (type == Asc.c_oAscContentControlSpecificType.ComboBox) ? props.get_ComboBoxPr() : props.get_DropDownListPr();
if (specProps) {
var count = specProps.get_ItemsCount();
var arr = [];
for (var i=0; i<count; i++) {
arr.push({
value: specProps.get_ItemValue(i),
name: specProps.get_ItemDisplayText(i)
});
}
this.list.store.reset(arr);
}
this.disableListButtons();
}
//for date picker
this.btnsCategory[3].setVisible(type == Asc.c_oAscContentControlSpecificType.DateTime);
if (type == Asc.c_oAscContentControlSpecificType.DateTime) {
var specProps = props.get_DateTimePr();
if (specProps) {
this.datetime = specProps;
var lang = specProps.get_LangId() || this.options.controlLang;
if (lang) {
var item = this.cmbLang.store.findWhere({value: lang});
item = item ? item.get('value') : 0x0409;
this.cmbLang.setValue(item);
}
this.updateFormats(this.cmbLang.getValue());
var format = specProps.get_DateFormat();
var rec = this.listFormats.store.findWhere({format: format});
this.listFormats.selectRecord(rec);
this.listFormats.scrollToRecord(rec);
this.txtDate.setValue(format);
}
}
// for check box
this.btnsCategory[4].setVisible(type == Asc.c_oAscContentControlSpecificType.CheckBox);
if (type == Asc.c_oAscContentControlSpecificType.CheckBox) {
var specProps = props.get_CheckBoxPr();
if (specProps) {
var code = specProps.get_CheckedSymbol(),
font = specProps.get_CheckedFont();
font && this.txtChecked.cmpEl.css('font-family', font);
code && this.txtChecked.setValue(String.fromCharCode(code));
this.checkedBox = {code: code, font: font};
code = specProps.get_UncheckedSymbol();
font = specProps.get_UncheckedFont();
font && this.txtUnchecked.cmpEl.css('font-family', font);
code && this.txtUnchecked.setValue(String.fromCharCode(code));
this.uncheckedBox = {code: code, font: font};
}
}
this.type = type;
}
},
@ -312,6 +427,39 @@ define([
lock = Asc.c_oAscSdtLockType.ContentLocked;
props.put_Lock(lock);
// for list controls
if (this.type == Asc.c_oAscContentControlSpecificType.ComboBox || this.type == Asc.c_oAscContentControlSpecificType.DropDownList) {
var specProps = new AscCommon.CSdtComboBoxPr();
this.list.store.each(function (item, index) {
specProps.add_Item(item.get('name'), item.get('value'));
});
(this.type == Asc.c_oAscContentControlSpecificType.ComboBox) ? props.put_ComboBoxPr(specProps) : props.put_DropDownListPr(specProps);
}
//for date picker
if (this.type == Asc.c_oAscContentControlSpecificType.DateTime) {
var specProps = new AscCommon.CSdtDatePickerPr();
specProps.put_DateFormat(this.txtDate.getValue());
specProps.put_LangId(this.cmbLang.getValue());
props.put_DateTimePr(specProps);
}
// for check box
if (this.type == Asc.c_oAscContentControlSpecificType.CheckBox) {
if (this.checkedBox && this.checkedBox.changed || this.uncheckedBox && this.uncheckedBox.changed) {
var specProps = new AscCommon.CSdtCheckBoxPr();
if (this.checkedBox) {
specProps.put_CheckedSymbol(this.checkedBox.code);
specProps.put_CheckedFont(this.checkedBox.font);
}
if (this.uncheckedBox) {
specProps.put_UncheckedSymbol(this.uncheckedBox.code);
specProps.put_UncheckedFont(this.uncheckedBox.font);
}
props.put_CheckBoxPr(specProps);
}
}
return props;
},
@ -339,6 +487,147 @@ define([
}
},
onSelectItem: function(listView, itemView, record) {
this.disableListButtons(false);
},
disableListButtons: function(disabled) {
if (disabled===undefined)
disabled = !this.list.getSelectedRec();
this.btnChange.setDisabled(disabled);
this.btnDelete.setDisabled(disabled);
this.btnUp.setDisabled(disabled);
this.btnDown.setDisabled(disabled);
},
onAddItem: function() {
var me = this,
win = new DE.Views.EditListItemDialog({
store: me.list.store,
handler: function(result, name, value) {
if (result == 'ok') {
var rec = me.list.store.add({
value: value,
name: name
});
if (rec) {
me.list.selectRecord(rec);
me.list.scrollToRecord(rec);
me.disableListButtons();
}
}
me.list.cmpEl.find('.listview').focus();
}
});
win.show();
},
onChangeItem: function() {
var me = this,
rec = this.list.getSelectedRec(),
win = new DE.Views.EditListItemDialog({
store: me.list.store,
handler: function(result, name, value) {
if (result == 'ok') {
if (rec) {
rec.set({
value: value,
name: name
});
}
}
me.list.cmpEl.find('.listview').focus();
}
});
rec && win.show();
rec && win.setSettings({name: rec.get('name'), value: rec.get('value')});
},
onDeleteItem: function(btn, eOpts){
var rec = this.list.getSelectedRec();
if (rec) {
var store = this.list.store;
var idx = _.indexOf(store.models, rec);
store.remove(rec);
if (idx>store.length-1) idx = store.length-1;
if (store.length>0) {
this.list.selectByIndex(idx);
this.list.scrollToRecord(store.at(idx));
}
}
this.disableListButtons();
this.list.cmpEl.find('.listview').focus();
},
onMoveItem: function(up) {
var store = this.list.store,
length = store.length,
rec = this.list.getSelectedRec();
if (rec) {
var index = store.indexOf(rec);
store.add(store.remove(rec), {at: up ? Math.max(0, index-1) : Math.min(length-1, index+1)});
this.list.selectRecord(rec);
this.list.scrollToRecord(rec);
}
this.list.cmpEl.find('.listview').focus();
},
updateFormats: function(lang) {
if (this.datetime) {
var props = this.datetime,
formats = props.get_FormatsExamples(),
arr = [];
for (var i = 0, len = formats.length; i < len; i++)
{
props.get_String(formats[i], undefined, lang);
var rec = new Common.UI.DataViewModel();
rec.set({
format: formats[i],
value: props.get_String(formats[i], undefined, lang)
});
arr.push(rec);
}
this.listFormats.store.reset(arr);
this.listFormats.selectByIndex(0);
var rec = this.listFormats.getSelectedRec();
this.listFormats.scrollToRecord(rec);
this.txtDate.setValue(rec.get('format'));
}
},
onEditCheckbox: function(checked) {
if (this.api) {
var me = this,
props = (checked) ? me.checkedBox : me.uncheckedBox,
cmp = (checked) ? me.txtChecked : me.txtUnchecked,
handler = function(dlg, result, settings) {
if (result == 'ok') {
props.changed = true;
props.code = settings.code;
props.font = settings.font;
props.font && cmp.cmpEl.css('font-family', props.font);
settings.symbol && cmp.setValue(settings.symbol);
}
},
win = new Common.Views.SymbolTableDialog({
api: me.api,
lang: me.options.interfaceLang,
modal: true,
type: 0,
font: props.font,
code: props.code,
handler: handler
});
win.show();
win.on('symbol:dblclick', handler);
}
},
onSelectFormat: function(lisvView, itemView, record) {
if (!record) return;
this.txtDate.setValue(record.get('format'));
},
textTitle: 'Content Control Settings',
textName: 'Title',
textTag: 'Tag',
@ -352,7 +641,23 @@ define([
textNewColor: 'Add New Custom Color',
textApplyAll: 'Apply to All',
textAppearance: 'Appearance',
textSystemColor: 'System'
textSystemColor: 'System',
strGeneral: 'General',
textAdd: 'Add',
textChange: 'Edit',
textDelete: 'Delete',
textUp: 'Up',
textDown: 'Down',
textCombobox: 'Combo box',
textDropDown: 'Drop-down list',
textDisplayName: 'Display name',
textValue: 'Value',
textDate: 'Date format',
textLang: 'Language',
textFormat: 'Display the date like this',
textCheckbox: 'Check box',
textChecked: 'Checked symbol',
textUnchecked: 'Unchecked symbol'
}, DE.Views.ControlSettingsDialog || {}))
});

175
apps/documenteditor/main/app/view/EditListItemDialog.js Normal file
View file

@ -0,0 +1,175 @@
/*
*
* (c) Copyright Ascensio System SIA 2010-2019
*
* This program is a free software product. You can redistribute it and/or
* modify it under the terms of the GNU Affero General Public License (AGPL)
* version 3 as published by the Free Software Foundation. In accordance with
* Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect
* that Ascensio System SIA expressly excludes the warranty of non-infringement
* of any third-party rights.
*
* This program is distributed WITHOUT ANY WARRANTY; without even the implied
* warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For
* details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
*
* You can contact Ascensio System SIA at 20A-12 Ernesta Birznieka-Upisha
* street, Riga, Latvia, EU, LV-1050.
*
* The interactive user interfaces in modified source and object code versions
* of the Program must display Appropriate Legal Notices, as required under
* Section 5 of the GNU AGPL version 3.
*
* Pursuant to Section 7(b) of the License you must retain the original Product
* logo when distributing the program. Pursuant to Section 7(e) we decline to
* grant you any rights under trademark law for use of our trademarks.
*
* All the Product's GUI elements, including illustrations and icon sets, as
* well as technical writing content are licensed under the terms of the
* Creative Commons Attribution-ShareAlike 4.0 International. See the License
* terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
*
*/
/**
* EditListItemDialog.js
*
* Created by Julia Radzhabova on 05.11.2019
* Copyright (c) 2019 Ascensio System SIA. All rights reserved.
*
*/
define([
'common/main/lib/component/Window',
'common/main/lib/component/InputField'
], function () { 'use strict';
DE.Views.EditListItemDialog = Common.UI.Window.extend(_.extend({
options: {
width: 330,
header: false,
cls: 'modal-dlg',
buttons: ['ok', 'cancel']
},
initialize : function(options) {
_.extend(this.options, options || {});
this.template = [
'<div class="box">',
'<div class="input-row">',
'<label>' + this.textDisplayName + '</label>',
'</div>',
'<div id="id-dlg-label-name" class="input-row" style="margin-bottom: 8px;"></div>',
'<div class="input-row">',
'<label>' + this.textValue + '</label>',
'</div>',
'<div id="id-dlg-label-value" class="input-row"></div>',
'</div>'
].join('');
this.options.tpl = _.template(this.template)(this.options);
Common.UI.Window.prototype.initialize.call(this, this.options);
},
render: function() {
Common.UI.Window.prototype.render.call(this);
var me = this;
me.inputName = new Common.UI.InputField({
el : $('#id-dlg-label-name'),
allowBlank : false,
blankError : me.textNameError,
style : 'width: 100%;',
validateOnBlur: false,
validation : function(value) {
return value ? true : '';
}
});
me.inputName._input.on('input', function (e) {
if (me.copyvalue==undefined && me.inputValue.getValue()==me.inputName.getValue()) {
me.copyvalue = 1;
}
if (me.copyvalue==1)
me.inputValue.setValue($(e.target).val());
else if (me.copyvalue==2)
me.copyvalue = 0;
});
me.inputValue = new Common.UI.InputField({
el : $('#id-dlg-label-value'),
style : 'width: 100%;',
validateOnBlur: false,
validation : function(value) {
if (value!=='' && me.options.store) {
var rec = me.options.store.findWhere({value: value});
if (rec)
return me.textValueError
}
return true;
}
});
me.inputValue._input.on('input', function (e) {
if (me.copyvalue==undefined && me.inputValue.getValue()==me.inputName.getValue()) {
me.copyvalue = 2;
}
if (me.copyvalue==2)
me.inputName.setValue($(e.target).val());
else if (me.copyvalue==1)
me.copyvalue = 0;
});
var $window = this.getChild();
$window.find('.btn').on('click', _.bind(this.onBtnClick, this));
},
show: function() {
Common.UI.Window.prototype.show.apply(this, arguments);
var me = this;
_.delay(function(){
me.inputName.cmpEl.find('input').focus();
},50);
},
onPrimary: function(event) {
this._handleInput('ok');
return false;
},
onBtnClick: function(event) {
this._handleInput(event.currentTarget.attributes['result'].value);
},
_handleInput: function(state) {
if (this.options.handler) {
if (state == 'ok') {
if (this.inputName.checkValidate() !== true) {
this.inputName.cmpEl.find('input').focus();
return;
}
if (this.inputValue.checkValidate() !== true) {
this.inputValue.cmpEl.find('input').focus();
return;
}
}
this.options.handler.call(this, state, this.inputName.getValue(), this.inputValue.getValue());
}
this.close();
},
setSettings: function (props) {
if (props) {
this.inputName.setValue(props.name || '');
this.inputValue.setValue(props.value || '');
}
},
textDisplayName: 'Display name',
textValue: 'Value',
textNameError: 'Display name must not be empty.',
textValueError: 'An item with the same value already exists.'
}, DE.Views.EditListItemDialog || {}));
});

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

@ -638,18 +638,43 @@ define([
items: [
{
caption: this.textPlainControl,
iconCls: 'mnu-control-plain',
value: Asc.c_oAscSdtLevelType.Inline
// iconCls: 'mnu-control-plain',
value: 'plain'
},
{
caption: this.textRichControl,
iconCls: 'mnu-control-rich',
value: Asc.c_oAscSdtLevelType.Block
// iconCls: 'mnu-control-rich',
value: 'rich'
},
{
caption: this.textPictureControl,
// iconCls: 'mnu-control-rich',
value: 'picture'
},
{
caption: this.textComboboxControl,
// iconCls: 'mnu-control-rich',
value: 'combobox'
},
{
caption: this.textDropdownControl,
// iconCls: 'mnu-control-rich',
value: 'dropdown'
},
{
caption: this.textDateControl,
// iconCls: 'mnu-control-rich',
value: 'date'
},
{
caption: this.textCheckboxControl,
// iconCls: 'mnu-control-rich',
value: 'checkbox'
},
{caption: '--'},
{
caption: this.textRemoveControl,
iconCls: 'mnu-control-remove',
// iconCls: 'mnu-control-remove',
value: 'remove'
},
{caption: '--'},
@ -2286,6 +2311,11 @@ define([
textEditWatermark: 'Custom Watermark',
textRemWatermark: 'Remove Watermark',
tipWatermark: 'Edit watermark',
textPictureControl: 'Picture',
textComboboxControl: 'Combo box',
textCheckboxControl: 'Check box',
textDropdownControl: 'Drop-down list',
textDateControl: 'Date',
capBtnAddComment: 'Add Comment',
capBtnInsSymbol: 'Symbol',
tipInsertSymbol: 'Insert symbol'

25
apps/documenteditor/main/locale/en.json
View file

@ -1096,6 +1096,22 @@
"DE.Views.ControlSettingsDialog.textTitle": "Content Control Settings",
"DE.Views.ControlSettingsDialog.txtLockDelete": "Content control cannot be deleted",
"DE.Views.ControlSettingsDialog.txtLockEdit": "Contents cannot be edited",
"DE.Views.ControlSettingsDialog.strGeneral": "General",
"DE.Views.ControlSettingsDialog.textAdd": "Add",
"DE.Views.ControlSettingsDialog.textChange": "Edit",
"DE.Views.ControlSettingsDialog.textDelete": "Delete",
"DE.Views.ControlSettingsDialog.textUp": "Up",
"DE.Views.ControlSettingsDialog.textDown": "Down",
"DE.Views.ControlSettingsDialog.textCombobox": "Combo box",
"DE.Views.ControlSettingsDialog.textDropDown": "Drop-down list",
"DE.Views.ControlSettingsDialog.textDisplayName": "Display name",
"DE.Views.ControlSettingsDialog.textValue": "Value",
"DE.Views.ControlSettingsDialog.textDate": "Date format",
"DE.Views.ControlSettingsDialog.textLang": "Language",
"DE.Views.ControlSettingsDialog.textFormat": "Display the date like this",
"DE.Views.ControlSettingsDialog.textCheckbox": "Check box",
"DE.Views.ControlSettingsDialog.textChecked": "Checked symbol",
"DE.Views.ControlSettingsDialog.textUnchecked": "Unchecked symbol",
"DE.Views.CustomColumnsDialog.textColumns": "Number of columns",
"DE.Views.CustomColumnsDialog.textSeparator": "Column divider",
"DE.Views.CustomColumnsDialog.textSpacing": "Spacing between columns",
@ -2136,11 +2152,11 @@
"DE.Views.Toolbar.textOddPage": "Odd Page",
"DE.Views.Toolbar.textPageMarginsCustom": "Custom margins",
"DE.Views.Toolbar.textPageSizeCustom": "Custom Page Size",
"DE.Views.Toolbar.textPlainControl": "Insert plain text content control",
"DE.Views.Toolbar.textPlainControl": "Plain text",
"DE.Views.Toolbar.textPortrait": "Portrait",
"DE.Views.Toolbar.textRemoveControl": "Remove content control",
"DE.Views.Toolbar.textRemWatermark": "Remove Watermark",
"DE.Views.Toolbar.textRichControl": "Insert rich text content control",
"DE.Views.Toolbar.textRichControl": "Rich text",
"DE.Views.Toolbar.textRight": "Right: ",
"DE.Views.Toolbar.textStrikeout": "Strikethrough",
"DE.Views.Toolbar.textStyleMenuDelete": "Delete style",
@ -2247,6 +2263,11 @@
"DE.Views.Toolbar.txtScheme7": "Equity",
"DE.Views.Toolbar.txtScheme8": "Flow",
"DE.Views.Toolbar.txtScheme9": "Foundry",
"DE.Views.Toolbar.textPictureControl": "Picture",
"DE.Views.Toolbar.textComboboxControl": "Combo box",
"DE.Views.Toolbar.textCheckboxControl": "Check box",
"DE.Views.Toolbar.textDropdownControl": "Drop-down list",
"DE.Views.Toolbar.textDateControl": "Date",
"DE.Views.WatermarkSettingsDialog.textAuto": "Auto",
"DE.Views.WatermarkSettingsDialog.textBold": "Bold",
"DE.Views.WatermarkSettingsDialog.textColor": "Text color",