[DE] Insert content controls.

This commit is contained in:
Julia Radzhabova 2017-12-12 14:14:27 +03:00
parent b54fbbae00
commit eb3efa3778
7 changed files with 318 additions and 4 deletions

View file

@ -293,3 +293,4 @@
.button-normal-icon(btn-img-bkwd, 27, @toolbar-big-icon-size);
.button-normal-icon(btn-img-frwd, 28, @toolbar-big-icon-size);
.button-normal-icon(btn-img-wrap, 29, @toolbar-big-icon-size);
.button-normal-icon(btn-controls, 18, @toolbar-big-icon-size);

View file

@ -56,7 +56,8 @@ define([
'documenteditor/main/app/view/PageSizeDialog',
'documenteditor/main/app/view/NoteSettingsDialog',
'documenteditor/main/app/controller/PageLayout',
'documenteditor/main/app/view/CustomColumnsDialog'
'documenteditor/main/app/view/CustomColumnsDialog',
'documenteditor/main/app/view/ControlSettingsDialog'
], function () {
'use strict';
@ -283,6 +284,7 @@ define([
toolbar.btnInsertText.on('click', _.bind(this.onBtnInsertTextClick, this));
toolbar.btnInsertShape.menu.on('hide:after', _.bind(this.onInsertShapeHide, this));
toolbar.btnDropCap.menu.on('item:click', _.bind(this.onDropCapSelect, this));
toolbar.btnContentControls.menu.on('item:click', _.bind(this.onControlsSelect, this));
toolbar.mnuDropCapAdvanced.on('click', _.bind(this.onDropCapAdvancedClick, this));
toolbar.btnColumns.menu.on('item:click', _.bind(this.onColumnsSelect, this));
toolbar.btnPageOrient.menu.on('item:click', _.bind(this.onPageOrientSelect, this));
@ -640,7 +642,8 @@ define([
in_chart = false,
in_equation = false,
btn_eq_state = false,
in_image = false;
in_image = false,
in_control = false;
while (++i < selectedObjects.length) {
type = selectedObjects[i].get_ObjectType();
@ -720,6 +723,19 @@ define([
if ( !toolbar.btnDropCap.isDisabled() )
toolbar.mnuDropCapAdvanced.setDisabled(disable_dropcapadv);
if (!paragraph_locked && !header_locked) {
in_control = this.api.asc_IsContentControl();
var control_props = in_control ? this.api.asc_GetContentControlProperties() : null,
lock_type = (in_control&&control_props) ? control_props.get_Lock() : AscCommonWord.sdtlock_Unlocked,
control_plain = (in_control&&control_props) ? (control_props.get_ContentControlType()==AscCommonWord.sdttype_InlineLevel) : false;
(lock_type===undefined) && (lock_type = AscCommonWord.sdtlock_Unlocked);
toolbar.btnContentControls.menu.items[0].setDisabled(control_plain || lock_type==AscCommonWord.sdtlock_SdtContentLocked || lock_type==AscCommonWord.sdtlock_ContentLocked);
toolbar.btnContentControls.menu.items[1].setDisabled(control_plain || lock_type==AscCommonWord.sdtlock_SdtContentLocked || lock_type==AscCommonWord.sdtlock_ContentLocked);
toolbar.btnContentControls.menu.items[2].setDisabled(!in_control || lock_type==AscCommonWord.sdtlock_SdtContentLocked || lock_type==AscCommonWord.sdtlock_SdtLocked);
toolbar.btnContentControls.menu.items[4].setDisabled(!in_control);
}
need_disable = !can_add_table || header_locked || in_equation;
toolbar.btnInsertTable.setDisabled(need_disable);
@ -1667,6 +1683,40 @@ define([
}
},
onControlsSelect: function(menu, item) {
if (item.value == 'settings' || item.value == 'remove') {
if (this.api.asc_IsContentControl()) {
var props = this.api.asc_GetContentControlProperties();
if (props) {
var id = props.get_InternalId();
if (item.value == 'settings') {
var me = this;
(new DE.Views.ControlSettingsDialog({
props: props,
api: me.api,
handler: function(result, value) {
if (result == 'ok') {
me.api.asc_SetContentControlProperties(value, id);
}
Common.NotificationCenter.trigger('edit:complete', me.toolbar);
}
})).show();
} else {
this.api.asc_RemoveContentControlWrapper(id);
Common.component.Analytics.trackEvent('ToolBar', 'Remove Content Control');
}
}
}
} else {
this.api.asc_AddContentControl(item.value);
Common.component.Analytics.trackEvent('ToolBar', 'Add Content Control');
}
Common.NotificationCenter.trigger('edit:complete', this.toolbar);
},
onColumnsSelect: function(menu, item) {
if (_.isUndefined(item.value))
return;

View file

@ -138,6 +138,10 @@
<div class="group">
<span class="btn-slot text x-huge" id="slot-btn-dropcap"></span>
</div>
<div class="separator long"></div>
<div class="group">
<span class="btn-slot text x-huge" id="slot-btn-controls"></span>
</div>
</section>
<section class="panel" data-tab="layout">
<div class="group">

View file

@ -0,0 +1,207 @@
/*
*
* (c) Copyright Ascensio System Limited 2010-2017
*
* 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 Lubanas st. 125a-25, Riga, Latvia,
* EU, LV-1021.
*
* 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
*
*/
/**
* ControlSettingsDialog.js.js
*
* Created by Julia Radzhabova on 12.12.2017
* Copyright (c) 2017 Ascensio System SIA. All rights reserved.
*
*/
define([
'common/main/lib/util/utils',
'common/main/lib/component/CheckBox',
'common/main/lib/component/InputField',
'common/main/lib/view/AdvancedSettingsWindow'
], function () { 'use strict';
DE.Views.ControlSettingsDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({
options: {
contentWidth: 300,
height: 250
},
initialize : function(options) {
var me = this;
_.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-large">',
'<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-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>',
'<div class="footer center">',
'<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + me.okButtonText + '</button>',
'<button class="btn normal dlg-btn" result="cancel">' + me.cancelButtonText + '</button>',
'</div>'
].join('')
}, options);
this.api = options.api;
this.handler = options.handler;
this.props = options.props;
Common.Views.AdvancedSettingsWindow.prototype.initialize.call(this, this.options);
},
render: function() {
Common.Views.AdvancedSettingsWindow.prototype.render.call(this);
var me = this;
this.txtName = new Common.UI.InputField({
el : $('#control-settings-txt-name'),
allowBlank : true,
validateOnChange: false,
validateOnBlur: false,
style : 'width: 100%;',
value : ''
});
this.txtTag = new Common.UI.InputField({
el : $('#control-settings-txt-tag'),
allowBlank : true,
validateOnChange: false,
validateOnBlur: false,
style : 'width: 100%;',
value : ''
});
this.chLockDelete = new Common.UI.CheckBox({
el: $('#control-settings-chb-lock-delete'),
labelText: this.txtLockDelete
});
this.chLockEdit = new Common.UI.CheckBox({
el: $('#control-settings-chb-lock-edit'),
labelText: this.txtLockEdit
});
this.afterRender();
},
afterRender: function() {
this._setDefaults(this.props);
},
show: function() {
Common.Views.AdvancedSettingsWindow.prototype.show.apply(this, arguments);
},
_setDefaults: function (props) {
if (props) {
var val = props.get_Id();
this.txtName.setValue(val ? val : '');
val = props.get_Tag();
this.txtTag.setValue(val ? val : '');
val = props.get_Lock();
(val===undefined) && (val = AscCommonWord.sdtlock_Unlocked);
this.chLockDelete.setValue(val==AscCommonWord.sdtlock_SdtContentLocked || val==AscCommonWord.sdtlock_SdtLocked);
this.chLockEdit.setValue(val==AscCommonWord.sdtlock_SdtContentLocked || val==AscCommonWord.sdtlock_ContentLocked);
}
},
getSettings: function () {
var props = new AscCommonWord.CContentControlPr();
props.put_Id(this.txtName.getValue());
props.put_Tag(this.txtTag.getValue());
var lock = AscCommonWord.sdtlock_Unlocked;
if (this.chLockDelete.getValue()=='checked' && this.chLockEdit.getValue()=='checked')
lock = AscCommonWord.sdtlock_SdtContentLocked;
else if (this.chLockDelete.getValue()=='checked')
lock = AscCommonWord.sdtlock_SdtLocked;
else if (this.chLockEdit.getValue()=='checked')
lock = AscCommonWord.sdtlock_ContentLocked;
props.put_Lock(lock);
return props;
},
onDlgBtnClick: function(event) {
var me = this;
var state = (typeof(event) == 'object') ? event.currentTarget.attributes['result'].value : event;
if (state == 'ok') {
this.handler && this.handler.call(this, state, this.getSettings());
}
this.close();
},
onPrimary: function() {
return true;
},
textTitle: 'Content Control Settings',
textName: 'Title',
textTag: 'Tag',
txtLockDelete: 'Content control cannot be deleted',
txtLockEdit: 'Contents cannot be edited',
cancelButtonText: 'Cancel',
okButtonText: 'Ok'
}, DE.Views.ControlSettingsDialog || {}))
});

View file

@ -608,6 +608,36 @@ define([
});
this.paragraphControls.push(this.btnDropCap);
this.btnContentControls = new Common.UI.Button({
id: 'tlbtn-controls',
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'btn-controls',
caption: me.capBtnInsControls,
menu: new Common.UI.Menu({
cls: 'ppm-toolbar',
items: [
{
caption: this.textRichControl,
value: AscCommonWord.sdttype_BlockLevel
},
{
caption: this.textPlainControl,
value: AscCommonWord.sdttype_InlineLevel
},
{
caption: this.textRemoveControl,
value: 'remove'
},
{caption: '--'},
{
caption: this.mniEditControls,
value: 'settings'
}
]
})
});
this.paragraphControls.push(this.btnContentControls);
this.btnColumns = new Common.UI.Button({
id: 'tlbtn-columns',
cls: 'btn-toolbar x-huge icon-top',
@ -1270,6 +1300,7 @@ define([
_injectComponent('#slot-btn-instext', this.btnInsertText);
_injectComponent('#slot-btn-instextart', this.btnInsertTextArt);
_injectComponent('#slot-btn-dropcap', this.btnDropCap);
_injectComponent('#slot-btn-controls', this.btnContentControls);
_injectComponent('#slot-btn-columns', this.btnColumns);
_injectComponent('#slot-btn-inshyperlink', this.btnInsertHyperlink);
_injectComponent('#slot-btn-editheader', this.btnEditHeader);
@ -1527,6 +1558,7 @@ define([
this.btnInsertShape.updateHint(this.tipInsertShape);
this.btnInsertEquation.updateHint(this.tipInsertEquation);
this.btnDropCap.updateHint(this.tipDropCap);
this.btnContentControls.updateHint(this.tipControls);
this.btnColumns.updateHint(this.tipColumns);
this.btnPageOrient.updateHint(this.tipPageOrient);
this.btnPageSize.updateHint(this.tipPageSize);
@ -2470,7 +2502,13 @@ define([
capBtnComment: 'Comment',
textColumnsCustom: 'Custom Columns',
textSurface: 'Surface',
textTabProtect: 'Protection'
textTabProtect: 'Protection',
capBtnInsControls: 'Content Controls',
textRichControl: 'Insert rich text content control',
textPlainControl: 'Insert plain text content control',
textRemoveControl: 'Remove content control',
mniEditControls: 'Control Settings',
tipControls: 'Insert content controls'
}
})(), DE.Views.Toolbar || {}));
});

View file

@ -783,6 +783,13 @@
"DE.Views.ChartSettings.txtTight": "Tight",
"DE.Views.ChartSettings.txtTitle": "Chart",
"DE.Views.ChartSettings.txtTopAndBottom": "Top and bottom",
"DE.Views.ControlSettingsDialog.textTitle": "Content Control Settings",
"DE.Views.ControlSettingsDialog.textName": "Title",
"DE.Views.ControlSettingsDialog.textTag": "Tag",
"DE.Views.ControlSettingsDialog.txtLockDelete": "Content control cannot be deleted",
"DE.Views.ControlSettingsDialog.txtLockEdit": "Contents cannot be edited",
"DE.Views.ControlSettingsDialog.cancelButtonText": "Cancel",
"DE.Views.ControlSettingsDialog.okButtonText": "Ok",
"DE.Views.CustomColumnsDialog.cancelButtonText": "Cancel",
"DE.Views.CustomColumnsDialog.okButtonText": "Ok",
"DE.Views.CustomColumnsDialog.textColumns": "Number of columns",
@ -1791,5 +1798,11 @@
"DE.Views.Toolbar.txtScheme6": "Concourse",
"DE.Views.Toolbar.txtScheme7": "Equity",
"DE.Views.Toolbar.txtScheme8": "Flow",
"DE.Views.Toolbar.txtScheme9": "Foundry"
"DE.Views.Toolbar.txtScheme9": "Foundry",
"DE.Views.Toolbar.capBtnInsControls": "Content Controls",
"DE.Views.Toolbar.textRichControl": "Insert rich text content control",
"DE.Views.Toolbar.textPlainControl": "Insert plain text content control",
"DE.Views.Toolbar.textRemoveControl": "Remove content control",
"DE.Views.Toolbar.mniEditControls": "Control Settings",
"DE.Views.Toolbar.tipControls": "Insert content controls"
}

View file

@ -12,6 +12,7 @@ var sdk_dev_scrpipts = [
"../../../../sdkjs/common/HistoryCommon.js",
"../../../../sdkjs/common/TableId.js",
"../../../../sdkjs/common/TableIdChanges.js",
"../../../../sdkjs/common/macros.js",
"../../../../sdkjs/common/NumFormat.js",
"../../../../sdkjs/common/SerializeChart.js",
"../../../../sdkjs/common/AdvancedOptions.js",