[DE] Add cross-reference

This commit is contained in:
Julia Radzhabova 2020-09-22 16:48:45 +03:00
parent f18e64ad9a
commit f61c7bbbb7
4 changed files with 354 additions and 3 deletions

View file

@ -47,7 +47,8 @@ define([
'documenteditor/main/app/view/TableOfContentsSettings',
'documenteditor/main/app/view/BookmarksDialog',
'documenteditor/main/app/view/CaptionDialog',
'documenteditor/main/app/view/NotesRemoveDialog'
'documenteditor/main/app/view/NotesRemoveDialog',
'documenteditor/main/app/view/CrossReferenceDialog'
], function () {
'use strict';
@ -69,7 +70,8 @@ define([
'links:notes': this.onNotesClick,
'links:hyperlink': this.onHyperlinkClick,
'links:bookmarks': this.onBookmarksClick,
'links:caption': this.onCaptionClick
'links:caption': this.onCaptionClick,
'links:crossref': this.onCrossRefClick
},
'DocumentHolder': {
'links:contents': this.onTableContents,
@ -171,6 +173,9 @@ define([
need_disable = in_header;
this.view.btnCaption.setDisabled(need_disable);
need_disable = paragraph_locked || header_locked || in_image;
this.view.btnCrossRef.setDisabled(need_disable);
},
onApiCanAddHyperlink: function(value) {
@ -443,6 +448,18 @@ define([
onShowContentControlsActions: function(obj, x, y) {
(obj.type == Asc.c_oAscContentControlSpecificType.TOC) && this.onShowTOCActions(obj, x, y);
},
onCrossRefClick: function(btn) {
var me = this;
(new DE.Views.CrossReferenceDialog({
api: me.api,
handler: function (result, settings) {
if (result == 'ok') {
}
Common.NotificationCenter.trigger('edit:complete', me.toolbar);
}
})).show();
}
}, DE.Controllers.Links || {}));

View file

@ -158,6 +158,7 @@
<span class="btn-slot text x-huge slot-inshyperlink"></span>
<span class="btn-slot text x-huge" id="slot-btn-bookmarks"></span>
<span class="btn-slot text x-huge" id="slot-btn-caption"></span>
<span class="btn-slot text x-huge" id="slot-btn-crossref"></span>
</div>
</section>
</section>

View file

@ -0,0 +1,317 @@
/*
*
* (c) Copyright Ascensio System SIA 2010-2020
*
* 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
*
*/
/**
* CrossReferenceDialog.js
*
* Created by Julia Radzhabova on 22.09.2020
* Copyright (c) 2020 Ascensio System SIA. All rights reserved.
*
*/
define([
'common/main/lib/component/Window',
'common/main/lib/component/ComboBox'
], function () { 'use strict';
DE.Views.CrossReferenceDialog = Common.UI.Window.extend(_.extend({
options: {
width: 400,
height: 406,
style: 'min-width: 240px;',
cls: 'modal-dlg'
},
initialize : function(options) {
_.extend(this.options, {
title: this.txtTitle,
buttons: [{value: 'ok', caption: this.textInsert}, 'close']
}, options || {});
this.template = [
'<div class="box">',
'<table cols="2" style="width: 100%;">',
'<tr>',
'<td style="padding-right: 5px;">',
'<label class="input-label">' + this.txtType + '</label>',
'<div id="id-dlg-cross-type" class="input-group-nr" style="width: 100%;margin-bottom: 10px;"></div>',
'</td>',
'<td style="padding-left: 5px;">',
'<label class="input-label">' + this.txtReference + '</label>',
'<div id="id-dlg-cross-ref" class="input-group-nr" style="width: 100%;margin-bottom: 10px;"></div>',
'</td>',
'</tr>',
'<tr>',
'<td colspan="2" style="padding-bottom: 10px;">',
'<div id="id-dlg-cross-insert-as" style="width:100%;"></div>',
'</td>',
'</tr>',
'<tr>',
'<td colspan="2" style="padding-bottom: 7px;">',
'<div id="id-dlg-cross-below-above" style="width:100%;"></div>',
'</td>',
'</tr>',
'<tr>',
'<td colspan="2" style="padding-bottom: 10px;">',
'<div id="id-dlg-cross-separate" style="display: inline-block;vertical-align: middle;margin-right: 10px;"></div>',
'<div id="id-dlg-cross-separator" style="display: inline-block;vertical-align: middle;"></div>',
'</td>',
'</tr>',
'<tr>',
'<td colspan="2" style="width: 100%;">',
'<label>' + this.textWhich + '</label>',
'<div id="id-dlg-cross-list" class="no-borders" style="width:100%; height:161px;margin-top: 2px; "></div>',
'</td>',
'</tr>',
'</table>',
'</div>'
].join('');
this.props = options.props;
this.api = options.api;
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,
$window = this.getChild();
$window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));
this.cmbType = new Common.UI.ComboBox({
el : $window.find('#id-dlg-cross-type'),
menuStyle : 'min-width: 100%;',
editable : false,
cls : 'input-group-nr',
data : [
{ value: 0, displayValue: this.textParagraph },
{ value: 1, displayValue: this.textHeading },
{ value: 2, displayValue: this.textBookmark },
{ value: 3, displayValue: this.textFootnote },
{ value: 4, displayValue: this.textEndnote },
{ value: 5, displayValue: this.textEquation },
{ value: 6, displayValue: this.textFigure },
{ value: 7, displayValue: this.textTable }
]
});
this.cmbType.on('selected', _.bind(this.onTypeSelected, this));
this.cmbReference = new Common.UI.ComboBox({
el : $window.find('#id-dlg-cross-ref'),
menuStyle : 'min-width: 100%;max-height: 183px;',
editable : false,
cls : 'input-group-nr',
data : []
});
this.cmbReference.on('selected', _.bind(function (combo, record) {
if (this._changedProps) {
if (!this._changedProps.get_TextPr()) this._changedProps.put_TextPr(new AscCommonWord.CTextPr());
this._changedProps.get_TextPr().put_FontSize((record.value>0) ? record.value : undefined);
}
if (this.api) {
this.api.SetDrawImagePreviewBullet('bulleted-list-preview', this.props, this.level, this.type==2);
}
}, this));
this.chInsertAs = new Common.UI.CheckBox({
el: $window.find('#id-dlg-cross-insert-as'),
labelText: this.textInsertAs
});
this.chBelowAbove = new Common.UI.CheckBox({
el: $window.find('#id-dlg-cross-below-above'),
labelText: this.textIncludeAbove
});
this.chSeparator = new Common.UI.CheckBox({
el: $window.find('#id-dlg-cross-separate'),
labelText: this.textSeparate
}).on('change', _.bind(function(field, newValue, oldValue, eOpts){
var checked = field.getValue() === 'checked';
this.inputSeparator.setDisabled(checked);
}, this));
this.inputSeparator = new Common.UI.InputField({
el: $window.findById('#id-dlg-cross-separator'),
style: 'width: 35px;',
validateOnBlur: false,
disabled: true
});
this.refList = new Common.UI.ListView({
el: $window.find('#id-dlg-cross-list'),
store: new Common.UI.DataViewStore()
});
this.refList.on('item:select', _.bind(this.onSelectReference, this));
this.afterRender();
},
afterRender: function() {
this._setDefaults(this.props);
},
_handleInput: function(state) {
if (this.options.handler) {
this.options.handler.call(this, state, {});
}
if (state=='ok') {
return;
}
this.close();
},
onBtnClick: function(event) {
this._handleInput(event.currentTarget.attributes['result'].value);
},
onPrimary: function(event) {
this._handleInput('ok');
return false;
},
_setDefaults: function (props) {
this.cmbType.setValue(0);
this.onTypeSelected(this.cmbType, this.cmbType.getSelectedRecord());
if (props) {
}
},
onSelectReference: function(listView, itemView, record) {
// record.get('value');
},
onTypeSelected: function (combo, record) {
var arr = [];
switch (record.value) {
case 0: // paragraph
arr = [
{ value: Asc.c_oAscDocumentRefenceToType.PageNum, displayValue: this.textPageNum },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNum, displayValue: this.textParaNum },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNumNoContext, displayValue: this.textParaNumNo },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNumFullContex, displayValue: this.textParaNumFull },
{ value: Asc.c_oAscDocumentRefenceToType.Text, displayValue: this.textText },
{ value: Asc.c_oAscDocumentRefenceToType.AboveBelow, displayValue: this.textAboveBelow }
];
break;
case 1: // heading
arr = [
{ value: Asc.c_oAscDocumentRefenceToType.Text, displayValue: this.textHeadingText },
{ value: Asc.c_oAscDocumentRefenceToType.PageNum, displayValue: this.textPageNum },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNum, displayValue: this.textHeadingNum },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNumNoContext, displayValue: this.textHeadingNumNo },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNumFullContex, displayValue: this.textHeadingNumFull },
{ value: Asc.c_oAscDocumentRefenceToType.AboveBelow, displayValue: this.textAboveBelow }
];
break;
case 2: // bookmark
arr = [
{ value: Asc.c_oAscDocumentRefenceToType.Text, displayValue: this.textBookmarkText },
{ value: Asc.c_oAscDocumentRefenceToType.PageNum, displayValue: this.textPageNum },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNum, displayValue: this.textParaNum },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNumNoContext, displayValue: this.textParaNumNo },
{ value: Asc.c_oAscDocumentRefenceToType.ParaNumFullContex, displayValue: this.textParaNumFull },
{ value: Asc.c_oAscDocumentRefenceToType.AboveBelow, displayValue: this.textAboveBelow }
];
break;
case 3: // note
arr = [
{ value: Asc.c_oAscDocumentRefenceToType.NoteNumber, displayValue: this.textNoteNum },
{ value: Asc.c_oAscDocumentRefenceToType.PageNum, displayValue: this.textPageNum },
{ value: Asc.c_oAscDocumentRefenceToType.AboveBelow, displayValue: this.textAboveBelow },
{ value: Asc.c_oAscDocumentRefenceToType.NoteNumberFormatted, displayValue: this.textNoteNumForm }
];
break;
case 4: // end note
arr = [
{ value: Asc.c_oAscDocumentRefenceToType.NoteNumber, displayValue: this.textEndNoteNum },
{ value: Asc.c_oAscDocumentRefenceToType.PageNum, displayValue: this.textPageNum },
{ value: Asc.c_oAscDocumentRefenceToType.AboveBelow, displayValue: this.textAboveBelow },
{ value: Asc.c_oAscDocumentRefenceToType.NoteNumberFormatted, displayValue: this.textEndNoteNumForm }
];
break;
case 5: // Equation
case 6: // Shape
case 7: // Table
arr = [
{ value: Asc.c_oAscDocumentRefenceToType.EntireCaption, displayValue: this.textCaption },
{ value: Asc.c_oAscDocumentRefenceToType.OnlyLabelAndNumber, displayValue: this.textLabelNum },
{ value: Asc.c_oAscDocumentRefenceToType.OnlyCaptionText, displayValue: this.textOnlyCaption },
{ value: Asc.c_oAscDocumentRefenceToType.PageNum, displayValue: this.textPageNum },
{ value: Asc.c_oAscDocumentRefenceToType.AboveBelow, displayValue: this.textAboveBelow }
];
break;
}
this.cmbReference.setData(arr);
this.cmbReference.setValue(arr[0].value);
},
txtTitle: 'Cross-reference',
txtType: 'Reference type',
txtReference: 'Insert reference to',
textInsertAs: 'Insert as hyperlink',
textSeparate: 'Separate numbers with',
textIncludeAbove: 'Include above/below',
textWhich: 'For which caption',
textPageNum: 'Page number',
textParaNum: 'Paragraph number',
textParaNumNo: 'Paragraph number (no context)',
textParaNumFull: 'Paragraph number (full context)',
textText: 'Paragraph text',
textAboveBelow: 'Above/below',
textHeadingText: 'Heading text',
textHeadingNum: 'Heading number',
textHeadingNumNo: 'Heading number (no context)',
textHeadingNumFull: 'Heading number (full context)',
textBookmarkText: 'Bookmark text',
textNoteNum: 'Footnote number',
textNoteNumForm: 'Footnote number (formatted)',
textEndNoteNum: 'Endnote number',
textEndNoteNumForm: 'Endnote number (formatted)',
textCaption: 'Entire caption',
textLabelNum: 'Only label and number',
textOnlyCaption: 'Only caption text',
textParagraph: 'Paragraph',
textHeading: 'Heading',
textBookmark: 'Bookmark',
textFootnote: 'Footnote',
textEndnote: 'Endnote',
textEquation: 'Equation',
textFigure: 'Figure',
textTable: 'Table',
textInsert: 'Insert'
}, DE.Views.CrossReferenceDialog || {}))
});

View file

@ -124,6 +124,10 @@ define([
this.btnCaption.on('click', function (b, e) {
me.fireEvent('links:caption');
});
this.btnCrossRef.on('click', function (b, e) {
me.fireEvent('links:crossref');
});
}
return {
@ -177,6 +181,15 @@ define([
});
this.paragraphControls.push(this.btnCaption);
this.btnCrossRef = new Common.UI.Button({
parentEl: $host.find('#slot-btn-crossref'),
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'toolbar__icon btn-crossref',
caption: this.capBtnCrossRef,
disabled: true
});
this.paragraphControls.push(this.btnCrossRef);
this._state = {disabled: false};
Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this));
},
@ -308,6 +321,7 @@ define([
me.btnBookmarks.updateHint(me.tipBookmarks);
me.btnCaption.updateHint(me.tipCaption);
me.btnCrossRef.updateHint(me.tipCrossRef);
setEvents.call(me);
});
@ -357,7 +371,9 @@ define([
mniInsEndnote: 'Insert Endnote',
textConvertToEndnotes: 'Convert All Footnotes to Endnotes',
textConvertToFootnotes: 'Convert All Endnotes to Footnotes',
textSwapNotes: 'Swap Footnotes and Endnotes'
textSwapNotes: 'Swap Footnotes and Endnotes',
capBtnCrossRef: 'Cross-reference',
tipCrossRef: 'Insert cross-reference'
}
}()), DE.Views.Links || {}));
});