Merge pull request #271 from ONLYOFFICE/feature/placeholders

Feature/placeholders
This commit is contained in:
Julia Radzhabova 2019-11-28 10:26:27 +03:00 committed by GitHub
commit 6c2c246cb9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 194 additions and 44 deletions

View file

@ -88,6 +88,11 @@ define([
this.$window.find('.dlg-btn').on('click', _.bind(this.onDlgBtnClick, this));
},
show: function() {
this.setPlaceholder();
Common.UI.Window.prototype.show.apply(this, arguments);
},
setChartData: function(data) {
this._chartData = data;
if (this._isExternalDocReady)
@ -143,6 +148,14 @@ define([
}
},
setPlaceholder: function(placeholder) {
this._placeholder = placeholder;
},
getPlaceholder: function() {
return this._placeholder;
},
textSave: 'Save & Exit',
textClose: 'Close',
textTitle: 'Chart Editor'

View file

@ -112,7 +112,7 @@ define([
if (this.api) {
( diagramEditor.isEditMode() )
? this.api.asc_editChartDrawingObject(data)
: this.api.asc_addChartDrawingObject(data);
: this.api.asc_addChartDrawingObject(data, diagramEditor.getPlaceholder());
}
}, this));
diagramEditor.on('hide', _.bind(function(cmp, message) {

View file

@ -325,7 +325,10 @@ define([
});
meEl.on('click', function(e){
if (e.target.localName == 'canvas') {
meEl.focus();
if (me._preventClick)
me._preventClick = false;
else
meEl.focus();
}
});
meEl.on('mousedown', function(e){
@ -675,18 +678,6 @@ define([
me.mode.isEdit = false;
};
var onDoubleClickOnChart = function(chart) {
if (me.mode.isEdit && !me._isDisabled) {
var diagramEditor = PE.getController('Common.Controllers.ExternalDiagramEditor').getView('Common.Views.ExternalDiagramEditor');
if (diagramEditor && chart) {
diagramEditor.setEditMode(true);
diagramEditor.show();
diagramEditor.setChartData(new Asc.asc_CChartBinary(chart));
}
}
};
var onTextLanguage = function(langid) {
me._currLang.id = langid;
};
@ -1581,12 +1572,18 @@ define([
if (me.mode.isEdit===true) {
me.api.asc_registerCallback('asc_onDialogAddHyperlink', _.bind(onDialogAddHyperlink, me));
me.api.asc_registerCallback('asc_doubleClickOnChart', onDoubleClickOnChart);
me.api.asc_registerCallback('asc_doubleClickOnChart', _.bind(me.editChartClick, me));
me.api.asc_registerCallback('asc_onSpellCheckVariantsFound', _.bind(onSpellCheckVariantsFound, me));
me.api.asc_registerCallback('asc_onShowSpecialPasteOptions', _.bind(onShowSpecialPasteOptions, me));
me.api.asc_registerCallback('asc_onHideSpecialPasteOptions', _.bind(onHideSpecialPasteOptions, me));
me.api.asc_registerCallback('asc_ChangeCropState', _.bind(onChangeCropState, me));
me.api.asc_registerCallback('asc_onHidePlaceholderActions', _.bind(me.onHidePlaceholderActions, me));
me.api.asc_registerPlaceholderCallback(AscCommon.PlaceholderButtonType.Image, _.bind(me.onInsertImage, me, true));
me.api.asc_registerPlaceholderCallback(AscCommon.PlaceholderButtonType.ImageUrl, _.bind(me.onInsertImageUrl, me, true));
me.api.asc_registerPlaceholderCallback(AscCommon.PlaceholderButtonType.Chart, _.bind(me.onClickPlaceholderChart, me));
me.api.asc_registerPlaceholderCallback(AscCommon.PlaceholderButtonType.Table, _.bind(me.onClickPlaceholderTable, me));
me.api.asc_registerPlaceholderCallback(AscCommon.PlaceholderButtonType.Video, _.bind(me.onClickPlaceholder, me, AscCommon.PlaceholderButtonType.Video));
me.api.asc_registerPlaceholderCallback(AscCommon.PlaceholderButtonType.Audio, _.bind(me.onClickPlaceholder, me, AscCommon.PlaceholderButtonType.Audio));
}
me.api.asc_registerCallback('asc_onCoAuthoringDisconnect', _.bind(onCoAuthoringDisconnect, me));
Common.NotificationCenter.on('api:disconnect', _.bind(onCoAuthoringDisconnect, me));
@ -1701,15 +1698,17 @@ define([
}
},
/** coauthoring end **/
editChartClick: function(){
var diagramEditor = PE.getController('Common.Controllers.ExternalDiagramEditor').getView('Common.Views.ExternalDiagramEditor');
if (diagramEditor) {
diagramEditor.setEditMode(true);
diagramEditor.show();
editChartClick: function(chart, placeholder){
if (this.mode.isEdit && !this._isDisabled) {
var diagramEditor = PE.getController('Common.Controllers.ExternalDiagramEditor').getView('Common.Views.ExternalDiagramEditor');
var chart = this.api.asc_getChartObject();
if (chart) {
if (diagramEditor) {
diagramEditor.setEditMode(chart===undefined || typeof chart == 'object'); //edit from doubleclick or context menu
diagramEditor.show();
if (typeof chart !== 'object')
chart = this.api.asc_getChartObject(chart, placeholder);
diagramEditor.setChartData(new Asc.asc_CChartBinary(chart));
diagramEditor.setPlaceholder(placeholder);
}
}
},
@ -2662,7 +2661,7 @@ define([
var menuChartEdit = new Common.UI.MenuItem({
caption : me.editChartText
}).on('click', _.bind(me.editChartClick, me));
}).on('click', _.bind(me.editChartClick, me, undefined));
var menuParagraphVAlign = new Common.UI.MenuItem({
caption : me.vertAlignText,
@ -2781,29 +2780,12 @@ define([
caption : this.textFromFile
}).on('click', function(item) {
setTimeout(function(){
if (me.api) me.api.ChangeImageFromFile();
me.fireEvent('editcomplete', me);
me.onInsertImage();
}, 10);
}),
new Common.UI.MenuItem({
caption : this.textFromUrl
}).on('click', function(item) {
(new Common.Views.ImageFromUrlDialog({
handler: function(result, value) {
if (result == 'ok') {
if (me.api) {
var checkUrl = value.replace(/ /g, '');
if (!_.isEmpty(checkUrl)) {
var props = new Asc.asc_CImgProperty();
props.put_ImageUrl(checkUrl);
me.api.ImgApply(props);
}
}
}
me.fireEvent('editcomplete', me);
}
})).show();
})
}).on('click', _.bind(me.onInsertImageUrl, me, false))
]
})
});
@ -3432,6 +3414,159 @@ define([
this._isDisabled = state;
},
onInsertImage: function(placeholder, obj, x, y) {
if (this.api)
(placeholder) ? this.api.asc_addImage(obj) : this.api.ChangeImageFromFile();
this.fireEvent('editcomplete', this);
},
onInsertImageUrl: function(placeholder, obj, x, y) {
var me = this;
(new Common.Views.ImageFromUrlDialog({
handler: function(result, value) {
if (result == 'ok') {
if (me.api) {
var checkUrl = value.replace(/ /g, '');
if (!_.isEmpty(checkUrl)) {
if (placeholder)
me.api.AddImageUrl(checkUrl, undefined, undefined, obj);
else {
var props = new Asc.asc_CImgProperty();
props.put_ImageUrl(checkUrl);
me.api.ImgApply(props, obj);
}
}
}
}
me.fireEvent('editcomplete', me);
}
})).show();
},
onClickPlaceholderChart: function(obj, x, y) {
if (!this.api) return;
var menu = this.placeholderMenuChart,
menuContainer = menu ? this.cmpEl.find(Common.Utils.String.format('#menu-container-{0}', menu.id)) : null,
me = this;
this._fromShowPlaceholder = true;
Common.UI.Menu.Manager.hideAll();
if (!menu) {
this.placeholderMenuChart = menu = new Common.UI.Menu({
style: 'width: 435px;',
items: [
{template: _.template('<div id="id-placeholder-menu-chart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>')}
]
});
// Prepare menu container
menuContainer = $(Common.Utils.String.format('<div id="menu-container-{0}" style="position: absolute; z-index: 10000;"><div class="dropdown-toggle" data-toggle="dropdown"></div></div>', menu.id));
this.cmpEl.append(menuContainer);
menu.render(menuContainer);
menu.cmpEl.attr({tabindex: "-1"});
menu.on('hide:after', function(){
if (!me._fromShowPlaceholder)
me.api.asc_uncheckPlaceholders();
});
var picker = new Common.UI.DataView({
el: $('#id-placeholder-menu-chart'),
parentMenu: menu,
showLast: false,
// restoreHeight: 421,
groups: new Common.UI.DataViewGroupStore(Common.define.chartData.getChartGroupData()),
store: new Common.UI.DataViewStore(Common.define.chartData.getChartData()),
itemTemplate: _.template('<div id="<%= id %>" class="item-chartlist <%= iconCls %>"></div>')
});
picker.on('item:click', function (picker, item, record, e) {
me.editChartClick(record.get('type'), obj);
});
}
menuContainer.css({left: x, top : y});
menuContainer.attr('data-value', 'prevent-canvas-click');
this._preventClick = true;
menu.show();
menu.alignPosition();
_.delay(function() {
menu.cmpEl.focus();
}, 10);
this._fromShowPlaceholder = false;
},
onClickPlaceholderTable: function(obj, x, y) {
if (!this.api) return;
var menu = this.placeholderMenuTable,
menuContainer = menu ? this.cmpEl.find(Common.Utils.String.format('#menu-container-{0}', menu.id)) : null,
me = this;
this._fromShowPlaceholder = true;
Common.UI.Menu.Manager.hideAll();
if (!menu) {
this.placeholderMenuTable = menu = new Common.UI.Menu({
items: [
{template: _.template('<div id="id-placeholder-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>')},
{caption: me.mniCustomTable, value: 'custom'}
]
});
// Prepare menu container
menuContainer = $(Common.Utils.String.format('<div id="menu-container-{0}" style="position: absolute; z-index: 10000;"><div class="dropdown-toggle" data-toggle="dropdown"></div></div>', menu.id));
this.cmpEl.append(menuContainer);
menu.render(menuContainer);
menu.cmpEl.attr({tabindex: "-1"});
menu.on('hide:after', function(){
if (!me._fromShowPlaceholder)
me.api.asc_uncheckPlaceholders();
});
var picker = new Common.UI.DimensionPicker({
el: $('#id-placeholder-menu-tablepicker'),
minRows: 8,
minColumns: 10,
maxRows: 8,
maxColumns: 10
});
picker.on('select', function(picker, columns, rows){
me.api.put_Table(columns, rows, obj);
me.fireEvent('editcomplete', me);
});
menu.on('item:click', function(menu, item, e){
if (item.value === 'custom') {
(new Common.Views.InsertTableDialog({
handler: function(result, value) {
if (result == 'ok')
me.api.put_Table(value.columns, value.rows, obj);
me.fireEvent('editcomplete', me);
}
})).show();
}
});
}
menuContainer.css({left: x, top : y});
menuContainer.attr('data-value', 'prevent-canvas-click');
this._preventClick = true;
menu.show();
menu.alignPosition();
_.delay(function() {
menu.cmpEl.focus();
}, 10);
this._fromShowPlaceholder = false;
},
onHidePlaceholderActions: function() {
this.placeholderMenuChart && this.placeholderMenuChart.hide();
},
onClickPlaceholder: function(type, obj, x, y) {
if (!this.api) return;
if (type == AscCommon.PlaceholderButtonType.Video) {
// this.api.addVideo(obj);
} else if (type == AscCommon.PlaceholderButtonType.Audio) {
// this.api.addAudio(obj);
}
this.fireEvent('editcomplete', this);
},
insertRowAboveText : 'Row Above',
insertRowBelowText : 'Row Below',
insertColumnLeftText : 'Column Left',
@ -3607,7 +3742,8 @@ define([
toDictionaryText: 'Add to Dictionary',
txtPrintSelection: 'Print Selection',
addToLayoutText: 'Add to Layout',
txtResetLayout: 'Reset Slide'
txtResetLayout: 'Reset Slide',
mniCustomTable: 'Insert custom table'
}, PE.Views.DocumentHolder || {}));
});

View file

@ -1127,6 +1127,7 @@
"PE.Views.DocumentHolder.txtUnderbar": "Bar under text",
"PE.Views.DocumentHolder.txtUngroup": "Ungroup",
"PE.Views.DocumentHolder.vertAlignText": "Vertical Alignment",
"PE.Views.DocumentHolder.mniCustomTable": "Insert custom table",
"PE.Views.DocumentPreview.goToSlideText": "Go to Slide",
"PE.Views.DocumentPreview.slideIndexText": "Slide {0} of {1}",
"PE.Views.DocumentPreview.txtClose": "Close slideshow",