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

Fix Bug 36850. Added Default Size for images in the context menu, added Change Shape Type for images in the right settings panel.

Browse source
This commit is contained in:
Julia Radzhabova 2018-02-06 11:56:13 +03:00
parent 00dea9fd5c
commit 1703a115e1
9 changed files with 83 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
apps/documenteditor/main/app/template/ShapeSettings.template
View file

@ -134,18 +134,18 @@
<tr class="shape-only">
<td class="padding-small"></td>
</tr>
<tr class="shape-only">
<tr class="change-type">
<td class="padding-small">
<div class="separator horizontal"></div>
</td>
</tr>
<tr class="shape-only change-type">
<tr class="change-type">
<td class="padding-small">
<label class="header" style="margin-top: 3px;"><%= scope.strChange %></label>
<div id="shape-btn-change" style="display: inline-block; float:right;"></div>
</td>
</tr>
<tr class="shape-only change-type">
<tr class="shape-only">
<td class="padding-small">
<div class="separator horizontal"></div>
</td>

5
apps/documenteditor/main/app/view/DocumentHolder.js
View file

@ -137,6 +137,8 @@ define([
if (shapeprops) {
if (shapeprops.get_FromChart())
menu_props.imgProps.isChart = true;
else if (shapeprops.get_FromImage())
menu_props.imgProps.isOnlyImg = true;
else
menu_props.imgProps.isShape = true;
} else if ( chartprops )
@ -2266,8 +2268,7 @@ define([
menuChartEdit.setVisible(!_.isNull(value.imgProps.value.get_ChartProperties()) && !onlyCommonProps);
me.menuOriginalSize.setVisible(_.isNull(value.imgProps.value.get_ChartProperties()) && _.isNull(value.imgProps.value.get_ShapeProperties()) &&
!onlyCommonProps);
me.menuOriginalSize.setVisible(value.imgProps.isOnlyImg);
me.pictureMenu.items[10].setVisible(menuChartEdit.isVisible() || me.menuOriginalSize.isVisible());
var islocked = value.imgProps.locked || (value.headerProps!==undefined && value.headerProps.locked);

31
apps/documenteditor/main/app/view/ShapeSettings.js
View file

@ -755,11 +755,17 @@ define([
this._noApply = true;
this.disableControls(this._locked, !shapeprops.get_CanFill());
this.hideShapeOnlySettings(shapeprops.get_FromChart());
this.hideChangeTypeSettings(shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|| shapetype=='straightConnector1');
this.hideShapeOnlySettings(shapeprops.get_FromChart() || shapeprops.get_FromImage());
var hidechangetype = shapeprops.get_FromChart() || shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|| shapetype=='straightConnector1';
this.hideChangeTypeSettings(hidechangetype);
if (!hidechangetype) {
this.btnChangeShape.menu.items[0].setVisible(shapeprops.get_FromImage());
this.btnChangeShape.menu.items[1].setVisible(!shapeprops.get_FromImage());
}
var value = props.get_WrappingStyle();
if (this._state.WrappingStyle!==value) {
@ -1522,22 +1528,27 @@ define([
shapesStore = this.application.getCollection('ShapeGroups');
var count = shapesStore.length;
for (var i=0; i<count-1; i++) {
var shapeGroup = shapesStore.at(i);
for (var i=-1; i<count-1 && count>0; i++) {
var shapeGroup = shapesStore.at(i>-1 ? i : i+1);
var menuItem = new Common.UI.MenuItem({
caption: shapeGroup.get('groupName'),
menu: new Common.UI.Menu({
menuAlign: 'tr-tl',
items: [
{ template: _.template('<div id="id-shape-menu-shapegroup' + i + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
{ template: _.template('<div id="id-shape-menu-shapegroup' + (i+1) + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
]
})
});
me.btnChangeShape.menu.addItem(menuItem);
var store = shapeGroup.get('groupStore');
if (i<0) {
store = store.clone();
store.shift();
}
var shapePicker = new Common.UI.DataView({
el: $('#id-shape-menu-shapegroup' + i),
store: shapeGroup.get('groupStore'),
el: $('#id-shape-menu-shapegroup' + (i+1)),
store: store,
parentMenu: menuItem.menu,
showLast: false,
itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>')

11
apps/presentationeditor/main/app/template/ShapeSettings.template
View file

@ -97,7 +97,7 @@
</td>
</tr>
<tr>
<td>
<td class="padding-small">
<div style="display:inline-block;width:100px;vertical-align: middle;">
<label class="input-label" style=""><%= scope.strSize %></label>
<div id="shape-combo-border-size" style="width: 93px;"></div>
@ -116,21 +116,18 @@
</div>
</td>
</tr>
<tr class="shape-only">
<td class="padding-small"></td>
</tr>
<tr class="shape-only">
<tr class="change-type">
<td class="padding-small">
<div class="separator horizontal"></div>
</td>
</tr>
<tr class="shape-only change-type">
<tr class="change-type">
<td class="padding-small">
<label class="header" style="margin-top: 3px;"><%= scope.strChange %></label>
<div id="shape-btn-change" style="display: inline-block; float:right;"></div>
</td>
</tr>
<tr class="shape-only change-type">
<tr class="shape-only">
<td class="padding-small">
<div class="separator horizontal"></div>
</td>

4
apps/presentationeditor/main/app/view/DocumentHolder.js
View file

@ -3101,12 +3101,12 @@ define([
disabled = imgdisabled || shapedisabled || chartdisabled || (value.slideProps!==undefined && value.slideProps.locked);
// image properties
menuImgOriginalSize.setVisible(_.isUndefined(value.shapeProps) && _.isUndefined(value.chartProps));
menuImgOriginalSize.setVisible((_.isUndefined(value.shapeProps) || value.shapeProps.value.get_FromImage()) && _.isUndefined(value.chartProps));
if (menuImgOriginalSize.isVisible())
menuImgOriginalSize.setDisabled(disabled || _.isNull(value.imgProps.value.get_ImageUrl()) || _.isUndefined(value.imgProps.value.get_ImageUrl()));
menuImageAdvanced.setVisible(_.isUndefined(value.shapeProps) && _.isUndefined(value.chartProps));
menuImageAdvanced.setVisible((_.isUndefined(value.shapeProps) || value.shapeProps.value.get_FromImage()) && _.isUndefined(value.chartProps));
menuShapeAdvanced.setVisible(_.isUndefined(value.imgProps) && _.isUndefined(value.chartProps));
menuChartEdit.setVisible(_.isUndefined(value.imgProps) && !_.isUndefined(value.chartProps) && (_.isUndefined(value.shapeProps) || value.shapeProps.isChart));
menuImgShapeSeparator.setVisible(menuImageAdvanced.isVisible() || menuShapeAdvanced.isVisible() || menuChartEdit.isVisible());

31
apps/presentationeditor/main/app/view/ShapeSettings.js
View file

@ -687,11 +687,17 @@ define([
var shapetype = props.asc_getType();
this.disableControls(this._locked==true, props.get_CanFill() !== true);
this.hideShapeOnlySettings(props.get_FromChart());
this.hideChangeTypeSettings(shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|| shapetype=='straightConnector1');
this.hideShapeOnlySettings(props.get_FromChart() || props.get_FromImage());
var hidechangetype = props.get_FromChart() || shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|| shapetype=='straightConnector1';
this.hideChangeTypeSettings(hidechangetype);
if (!hidechangetype) {
this.btnChangeShape.menu.items[0].setVisible(props.get_FromImage());
this.btnChangeShape.menu.items[1].setVisible(!props.get_FromImage());
}
// background colors
var rec = null;
@ -1395,22 +1401,27 @@ define([
shapesStore = this.application.getCollection('ShapeGroups');
var count = shapesStore.length;
for (var i=0; i<count-1; i++) {
var shapeGroup = shapesStore.at(i);
for (var i=-1; i<count-1 && count>0; i++) {
var shapeGroup = shapesStore.at(i>-1 ? i : i+1);
var menuItem = new Common.UI.MenuItem({
caption: shapeGroup.get('groupName'),
menu: new Common.UI.Menu({
menuAlign: 'tr-tl',
items: [
{ template: _.template('<div id="id-shape-menu-shapegroup' + i + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
{ template: _.template('<div id="id-shape-menu-shapegroup' + (i+1) + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
]
})
});
me.btnChangeShape.menu.addItem(menuItem);
var store = shapeGroup.get('groupStore');
if (i<0) {
store = store.clone();
store.shift();
}
var shapePicker = new Common.UI.DataView({
el: $('#id-shape-menu-shapegroup' + i),
store: shapeGroup.get('groupStore'),
el: $('#id-shape-menu-shapegroup' + (i+1)),
store: store,
parentMenu: menuItem.menu,
showLast: false,
itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>')

6
apps/spreadsheeteditor/main/app/controller/DocumentHolder.js
View file

@ -1249,7 +1249,7 @@ define([
},
fillMenuProps: function(cellinfo, showMenu, event){
var iscellmenu, isrowmenu, iscolmenu, isallmenu, ischartmenu, isimagemenu, istextshapemenu, isshapemenu, istextchartmenu,
var iscellmenu, isrowmenu, iscolmenu, isallmenu, ischartmenu, isimagemenu, istextshapemenu, isshapemenu, istextchartmenu, isimageonly,
documentHolder = this.documentHolder,
seltype = cellinfo.asc_getFlags().asc_getSelectionType(),
isCellLocked = cellinfo.asc_getLocked(),
@ -1285,6 +1285,8 @@ define([
if (shapeprops) {
if (shapeprops.asc_getFromChart())
ischartmenu = true;
else if (shapeprops.asc_getFromImage())
isimageonly = true;
else {
documentHolder.mnuShapeAdvanced.shapeInfo = elValue;
isshapemenu = true;
@ -1310,7 +1312,7 @@ define([
documentHolder.mnuChartEdit.setDisabled(isObjLocked);
documentHolder.pmiImgCut.setDisabled(isObjLocked);
documentHolder.pmiImgPaste.setDisabled(isObjLocked);
documentHolder.mnuImgAdvanced.setVisible(isimagemenu && !isshapemenu && !ischartmenu);
documentHolder.mnuImgAdvanced.setVisible(isimagemenu && (!isshapemenu || isimageonly) && !ischartmenu);
documentHolder.mnuImgAdvanced.setDisabled(isObjLocked);
var isInSign = !!signGuid;

11
apps/spreadsheeteditor/main/app/template/ShapeSettings.template
View file

@ -97,7 +97,7 @@
</td>
</tr>
<tr>
<td>
<td class="padding-small">
<div style="display:inline-block;width:100px;vertical-align: middle;">
<label class="input-label" style=""><%= scope.strSize %></label>
<div id="shape-combo-border-size" style="width: 93px;"></div>
@ -116,21 +116,18 @@
</div>
</td>
</tr>
<tr class="shape-only">
<td class="padding-small"></td>
</tr>
<tr class="shape-only">
<tr class="change-type">
<td class="padding-small">
<div class="separator horizontal"></div>
</td>
</tr>
<tr class="shape-only change-type">
<tr class="change-type">
<td class="padding-small">
<label class="header" style="margin-top: 3px;"><%= scope.strChange %></label>
<div id="shape-btn-change" style="display: inline-block; float:right;"></div>
</td>
</tr>
<tr class="shape-only change-type">
<tr class="shape-only">
<td class="padding-small">
<div class="separator horizontal"></div>
</td>

31
apps/spreadsheeteditor/main/app/view/ShapeSettings.js
View file

@ -711,11 +711,17 @@ define([
this._noApply = true;
this.disableControls(this._locked, !shapeprops.asc_getCanFill());
this.hideShapeOnlySettings(shapeprops.asc_getFromChart());
this.hideChangeTypeSettings(shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|| shapetype=='straightConnector1');
this.hideShapeOnlySettings(shapeprops.asc_getFromChart() || shapeprops.asc_getFromImage());
var hidechangetype = shapeprops.get_FromChart() || shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|| shapetype=='straightConnector1';
this.hideChangeTypeSettings(hidechangetype);
if (!hidechangetype) {
this.btnChangeShape.menu.items[0].setVisible(shapeprops.get_FromImage());
this.btnChangeShape.menu.items[1].setVisible(!shapeprops.get_FromImage());
}
// background colors
var rec = null;
@ -1420,22 +1426,27 @@ define([
shapesStore = this.application.getCollection('ShapeGroups');
var count = shapesStore.length;
for (var i=0; i<count-1; i++) {
var shapeGroup = shapesStore.at(i);
for (var i=-1; i<count-1 && count>0; i++) {
var shapeGroup = shapesStore.at(i>-1 ? i : i+1);
var menuItem = new Common.UI.MenuItem({
caption: shapeGroup.get('groupName'),
menu: new Common.UI.Menu({
menuAlign: 'tr-tl',
items: [
{ template: _.template('<div id="id-shape-menu-shapegroup' + i + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
{ template: _.template('<div id="id-shape-menu-shapegroup' + (i+1) + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
]
})
});
me.btnChangeShape.menu.addItem(menuItem);
var store = shapeGroup.get('groupStore');
if (i<0) {
store = store.clone();
store.shift();
}
var shapePicker = new Common.UI.DataView({
el: $('#id-shape-menu-shapegroup' + i),
store: shapeGroup.get('groupStore'),
el: $('#id-shape-menu-shapegroup' + (i+1)),
store: store,
parentMenu: menuItem.menu,
showLast: false,
itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>')