[DE] Bug 42913: replace image from storage.

This commit is contained in:
Julia Radzhabova 2020-05-13 14:28:14 +03:00
parent 6bc7c8ff8b
commit fad29ce911
5 changed files with 69 additions and 67 deletions

View file

@ -75,20 +75,12 @@
</tr>
<tr>
<td colspan=2>
<label class="header" id="image-lbl-replace" ><%= scope.textInsert %></label>
</td>
</tr>
<tr>
<td width="50%">
<button type="button" class="btn btn-text-default" id="image-button-from-file" style="width:85px;"><%= scope.textFromFile %></button>
</td>
<td width="50%">
<button type="button" class="btn btn-text-default" id="image-button-from-url" style="width:85px;"><%= scope.textFromUrl %></button>
<div id="image-button-replace" style="width:100%;"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<button type="button" class="btn btn-text-default hidden" id="image-button-edit-object" style="width:100px;"><%= scope.textEdit %></button>
<button type="button" class="btn btn-text-default hidden" id="image-button-edit-object" style="width:100%;"><%= scope.textEditObject %></button>
</td>
</tr>
<tr>

View file

@ -101,9 +101,15 @@ define([
this.api.asc_registerCallback('asc_onImgWrapStyleChanged', _.bind(this._ImgWrapStyleChanged, this));
this.api.asc_registerCallback('asc_ChangeCropState', _.bind(this._changeCropState, this));
}
Common.NotificationCenter.on('storage:image-insert', _.bind(this.insertImageFromStorage, this));
return this;
},
setMode: function(mode) {
this.mode = mode;
},
updateMetricUnit: function() {
var value = Common.Utils.Metric.fnRecalcFromMM(this._state.Width);
this.labelWidth[0].innerHTML = this.textWidth + ': ' + value.toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName();
@ -164,30 +170,13 @@ define([
this.btnOriginalSize.cmpEl.width(w);
this.btnFitMargins.cmpEl.width(w);
this.btnInsertFromFile = new Common.UI.Button({
el: $('#image-button-from-file')
});
this.lockedControls.push(this.btnInsertFromFile);
this.btnInsertFromUrl = new Common.UI.Button({
el: $('#image-button-from-url')
});
this.lockedControls.push(this.btnInsertFromUrl);
this.btnEditObject = new Common.UI.Button({
el: $('#image-button-edit-object')
});
this.lockedControls.push(this.btnEditObject);
this.btnOriginalSize.on('click', _.bind(this.setOriginalSize, this));
this.btnInsertFromFile.on('click', _.bind(function(btn){
if (this._isFromFile) return;
this._isFromFile = true;
if (this.api) this.api.ChangeImageFromFile();
this.fireEvent('editcomplete', this);
this._isFromFile = false;
}, this));
this.btnInsertFromUrl.on('click', _.bind(this.insertFromUrl, this));
this.btnEditObject.on('click', _.bind(function(btn){
if (this.api) this.api.asc_startEditCurrentOleObject();
this.fireEvent('editcomplete', this);
@ -268,8 +257,26 @@ define([
this.btnCrop.menu.on('item:click', _.bind(this.onCropMenu, this));
this.lockedControls.push(this.btnCrop);
this.btnSelectImage = new Common.UI.Button({
parentEl: $('#image-button-replace'),
cls: 'btn-text-menu-default',
caption: this.textInsert,
style: "width:100%;",
menu: new Common.UI.Menu({
style: 'min-width: 194px;',
maxHeight: 200,
items: [
{caption: this.textFromFile, value: 0},
{caption: this.textFromUrl, value: 1},
{caption: this.textFromStorage, value: 2}
]
})
});
this.lockedControls.push(this.btnSelectImage);
this.btnSelectImage.menu.on('item:click', _.bind(this.onImageSelect, this));
this.btnSelectImage.menu.items[2].setVisible(this.mode.canRequestInsertImage || this.mode.fileChoiceUrl && this.mode.fileChoiceUrl.indexOf("{documentType}")>-1);
this.linkAdvanced = $('#image-advanced-link');
this.lblReplace = $('#image-lbl-replace');
$(this.el).on('click', '#image-advanced-link', _.bind(this.openAdvancedSettings, this));
},
@ -335,10 +342,8 @@ define([
var pluginGuid = props.asc_getPluginGuid();
value = (pluginGuid !== null && pluginGuid !== undefined);
if (this._state.isOleObject!==value) {
this.btnInsertFromUrl.setVisible(!value);
this.btnInsertFromFile.setVisible(!value);
this.btnSelectImage.setVisible(!value);
this.btnEditObject.setVisible(value);
this.lblReplace.text(value ? this.textEditObject : this.textInsert);
this.btnRotate270.setDisabled(value);
this.btnRotate90.setDisabled(value);
this.btnFlipV.setDisabled(value);
@ -350,8 +355,7 @@ define([
var plugin = DE.getCollection('Common.Collections.Plugins').findWhere({guid: pluginGuid});
this.btnEditObject.setDisabled(plugin===null || plugin ===undefined || this._locked);
} else {
this.btnInsertFromUrl.setDisabled(pluginGuid===null || this._locked);
this.btnInsertFromFile.setDisabled(pluginGuid===null || this._locked);
this.btnSelectImage.setDisabled(pluginGuid===null || this._locked);
}
}
},
@ -463,23 +467,41 @@ define([
}
},
insertFromUrl: function() {
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)) {
var props = new Asc.asc_CImgProperty();
props.put_ImageUrl(checkUrl);
me.api.ImgApply(props);
insertImageFromStorage: function(data) {
if (data && data.url && data.c=='change') {
var props = new Asc.asc_CImgProperty();
props.put_ImageUrl(data.url, data.token);
this.api.ImgApply(props);
}
},
onImageSelect: function(menu, item) {
if (item.value==1) {
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)) {
var props = new Asc.asc_CImgProperty();
props.put_ImageUrl(checkUrl);
me.api.ImgApply(props);
}
}
}
me.fireEvent('editcomplete', me);
}
me.fireEvent('editcomplete', me);
}
})).show();
})).show();
} else if (item.value==2) {
Common.NotificationCenter.trigger('storage:image-load', 'change');
} else {
if (this._isFromFile) return;
this._isFromFile = true;
if (this.api) this.api.ChangeImageFromFile();
this.fireEvent('editcomplete', this);
this._isFromFile = false;
}
},
onBtnRotateClick: function(btn) {
@ -606,6 +628,7 @@ define([
textHintFlipH: 'Flip Horizontally',
textCrop: 'Crop',
textCropFill: 'Fill',
textCropFit: 'Fit'
textCropFit: 'Fit',
textFromStorage: 'From Storage'
}, DE.Views.ImageSettings || {}));
});

View file

@ -245,8 +245,8 @@ define([
},
setMode: function(mode) {
if (this.mergeSettings)
this.mergeSettings.setMode(mode);
this.mergeSettings && this.mergeSettings.setMode(mode);
this.imageSettings && this.imageSettings.setMode(mode);
},
onBtnMenuClick: function(btn, e) {

View file

@ -498,20 +498,6 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
return item ? item.get('displayValue') : null;
},
insertFromUrl: function() {
var me = this;
(new Common.Views.ImageFromUrlDialog({
handler: function(result, value) {
if (result == 'ok') {
var checkUrl = value.replace(/ /g, '');
if (!_.isEmpty(checkUrl)) {
me.props.put_ImageUrl(checkUrl);
}
}
}
})).show();
},
onImageSelect: function(menu, item) {
if (item.value==1) {
var me = this;
@ -709,7 +695,7 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
textColor: 'Text color',
textNewColor: 'Add New Custom Color',
textLanguage: 'Language',
textFromStorage: 'From storage',
textFromStorage: 'From Storage',
textSelect: 'Select Image'
}, DE.Views.WatermarkSettingsDialog || {}))

View file

@ -1631,6 +1631,7 @@
"DE.Views.ImageSettings.txtThrough": "Through",
"DE.Views.ImageSettings.txtTight": "Tight",
"DE.Views.ImageSettings.txtTopAndBottom": "Top and bottom",
"DE.Views.ImageSettings.textFromStorage": "From Storage",
"DE.Views.ImageSettingsAdvanced.strMargins": "Text Padding",
"DE.Views.ImageSettingsAdvanced.textAbsoluteWH": "Absolute",
"DE.Views.ImageSettingsAdvanced.textAlignment": "Alignment",
@ -2426,6 +2427,6 @@
"DE.Views.WatermarkSettingsDialog.textUnderline": "Underline",
"DE.Views.WatermarkSettingsDialog.tipFontName": "Font Name",
"DE.Views.WatermarkSettingsDialog.tipFontSize": "Font Size",
"DE.Views.WatermarkSettingsDialog.textFromStorage": "From storage",
"DE.Views.WatermarkSettingsDialog.textFromStorage": "From Storage",
"DE.Views.WatermarkSettingsDialog.textSelect": "Select Image"
}