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"> <tr class="shape-only">
<td class="padding-small"></td> <td class="padding-small"></td>
</tr> </tr>
<tr class="shape-only"> <tr class="change-type">
<td class="padding-small"> <td class="padding-small">
<div class="separator horizontal"></div> <div class="separator horizontal"></div>
</td> </td>
</tr> </tr>
<tr class="shape-only change-type"> <tr class="change-type">
<td class="padding-small"> <td class="padding-small">
<label class="header" style="margin-top: 3px;"><%= scope.strChange %></label> <label class="header" style="margin-top: 3px;"><%= scope.strChange %></label>
<div id="shape-btn-change" style="display: inline-block; float:right;"></div> <div id="shape-btn-change" style="display: inline-block; float:right;"></div>
</td> </td>
</tr> </tr>
<tr class="shape-only change-type"> <tr class="shape-only">
<td class="padding-small"> <td class="padding-small">
<div class="separator horizontal"></div> <div class="separator horizontal"></div>
</td> </td>

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

@ -137,6 +137,8 @@ define([
if (shapeprops) { if (shapeprops) {
if (shapeprops.get_FromChart()) if (shapeprops.get_FromChart())
menu_props.imgProps.isChart = true; menu_props.imgProps.isChart = true;
else if (shapeprops.get_FromImage())
menu_props.imgProps.isOnlyImg = true;
else else
menu_props.imgProps.isShape = true; menu_props.imgProps.isShape = true;
} else if ( chartprops ) } else if ( chartprops )
@ -2266,8 +2268,7 @@ define([
menuChartEdit.setVisible(!_.isNull(value.imgProps.value.get_ChartProperties()) && !onlyCommonProps); menuChartEdit.setVisible(!_.isNull(value.imgProps.value.get_ChartProperties()) && !onlyCommonProps);
me.menuOriginalSize.setVisible(_.isNull(value.imgProps.value.get_ChartProperties()) && _.isNull(value.imgProps.value.get_ShapeProperties()) && me.menuOriginalSize.setVisible(value.imgProps.isOnlyImg);
!onlyCommonProps);
me.pictureMenu.items[10].setVisible(menuChartEdit.isVisible() || me.menuOriginalSize.isVisible()); me.pictureMenu.items[10].setVisible(menuChartEdit.isVisible() || me.menuOriginalSize.isVisible());
var islocked = value.imgProps.locked || (value.headerProps!==undefined && value.headerProps.locked); 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._noApply = true;
this.disableControls(this._locked, !shapeprops.get_CanFill()); this.disableControls(this._locked, !shapeprops.get_CanFill());
this.hideShapeOnlySettings(shapeprops.get_FromChart()); this.hideShapeOnlySettings(shapeprops.get_FromChart() || shapeprops.get_FromImage());
this.hideChangeTypeSettings(shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2' var hidechangetype = shapeprops.get_FromChart() || shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5' || shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='straightConnector1'); || 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(); var value = props.get_WrappingStyle();
if (this._state.WrappingStyle!==value) { if (this._state.WrappingStyle!==value) {
@ -1522,22 +1528,27 @@ define([
shapesStore = this.application.getCollection('ShapeGroups'); shapesStore = this.application.getCollection('ShapeGroups');
var count = shapesStore.length; var count = shapesStore.length;
for (var i=0; i<count-1; i++) { for (var i=-1; i<count-1 && count>0; i++) {
var shapeGroup = shapesStore.at(i); var shapeGroup = shapesStore.at(i>-1 ? i : i+1);
var menuItem = new Common.UI.MenuItem({ var menuItem = new Common.UI.MenuItem({
caption: shapeGroup.get('groupName'), caption: shapeGroup.get('groupName'),
menu: new Common.UI.Menu({ menu: new Common.UI.Menu({
menuAlign: 'tr-tl', menuAlign: 'tr-tl',
items: [ 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); me.btnChangeShape.menu.addItem(menuItem);
var store = shapeGroup.get('groupStore');
if (i<0) {
store = store.clone();
store.shift();
}
var shapePicker = new Common.UI.DataView({ var shapePicker = new Common.UI.DataView({
el: $('#id-shape-menu-shapegroup' + i), el: $('#id-shape-menu-shapegroup' + (i+1)),
store: shapeGroup.get('groupStore'), store: store,
parentMenu: menuItem.menu, parentMenu: menuItem.menu,
showLast: false, showLast: false,
itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>') 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> </td>
</tr> </tr>
<tr> <tr>
<td> <td class="padding-small">
<div style="display:inline-block;width:100px;vertical-align: middle;"> <div style="display:inline-block;width:100px;vertical-align: middle;">
<label class="input-label" style=""><%= scope.strSize %></label> <label class="input-label" style=""><%= scope.strSize %></label>
<div id="shape-combo-border-size" style="width: 93px;"></div> <div id="shape-combo-border-size" style="width: 93px;"></div>
@ -116,21 +116,18 @@
</div> </div>
</td> </td>
</tr> </tr>
<tr class="shape-only"> <tr class="change-type">
<td class="padding-small"></td>
</tr>
<tr class="shape-only">
<td class="padding-small"> <td class="padding-small">
<div class="separator horizontal"></div> <div class="separator horizontal"></div>
</td> </td>
</tr> </tr>
<tr class="shape-only change-type"> <tr class="change-type">
<td class="padding-small"> <td class="padding-small">
<label class="header" style="margin-top: 3px;"><%= scope.strChange %></label> <label class="header" style="margin-top: 3px;"><%= scope.strChange %></label>
<div id="shape-btn-change" style="display: inline-block; float:right;"></div> <div id="shape-btn-change" style="display: inline-block; float:right;"></div>
</td> </td>
</tr> </tr>
<tr class="shape-only change-type"> <tr class="shape-only">
<td class="padding-small"> <td class="padding-small">
<div class="separator horizontal"></div> <div class="separator horizontal"></div>
</td> </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); disabled = imgdisabled || shapedisabled || chartdisabled || (value.slideProps!==undefined && value.slideProps.locked);
// image properties // 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()) if (menuImgOriginalSize.isVisible())
menuImgOriginalSize.setDisabled(disabled || _.isNull(value.imgProps.value.get_ImageUrl()) || _.isUndefined(value.imgProps.value.get_ImageUrl())); 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)); menuShapeAdvanced.setVisible(_.isUndefined(value.imgProps) && _.isUndefined(value.chartProps));
menuChartEdit.setVisible(_.isUndefined(value.imgProps) && !_.isUndefined(value.chartProps) && (_.isUndefined(value.shapeProps) || value.shapeProps.isChart)); menuChartEdit.setVisible(_.isUndefined(value.imgProps) && !_.isUndefined(value.chartProps) && (_.isUndefined(value.shapeProps) || value.shapeProps.isChart));
menuImgShapeSeparator.setVisible(menuImageAdvanced.isVisible() || menuShapeAdvanced.isVisible() || menuChartEdit.isVisible()); 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(); var shapetype = props.asc_getType();
this.disableControls(this._locked==true, props.get_CanFill() !== true); this.disableControls(this._locked==true, props.get_CanFill() !== true);
this.hideShapeOnlySettings(props.get_FromChart()); this.hideShapeOnlySettings(props.get_FromChart() || props.get_FromImage());
this.hideChangeTypeSettings(shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2' var hidechangetype = props.get_FromChart() || shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5' || shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|| shapetype=='straightConnector1'); || 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 // background colors
var rec = null; var rec = null;
@ -1395,22 +1401,27 @@ define([
shapesStore = this.application.getCollection('ShapeGroups'); shapesStore = this.application.getCollection('ShapeGroups');
var count = shapesStore.length; var count = shapesStore.length;
for (var i=0; i<count-1; i++) { for (var i=-1; i<count-1 && count>0; i++) {
var shapeGroup = shapesStore.at(i); var shapeGroup = shapesStore.at(i>-1 ? i : i+1);
var menuItem = new Common.UI.MenuItem({ var menuItem = new Common.UI.MenuItem({
caption: shapeGroup.get('groupName'), caption: shapeGroup.get('groupName'),
menu: new Common.UI.Menu({ menu: new Common.UI.Menu({
menuAlign: 'tr-tl', menuAlign: 'tr-tl',
items: [ 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); me.btnChangeShape.menu.addItem(menuItem);
var store = shapeGroup.get('groupStore');
if (i<0) {
store = store.clone();
store.shift();
}
var shapePicker = new Common.UI.DataView({ var shapePicker = new Common.UI.DataView({
el: $('#id-shape-menu-shapegroup' + i), el: $('#id-shape-menu-shapegroup' + (i+1)),
store: shapeGroup.get('groupStore'), store: store,
parentMenu: menuItem.menu, parentMenu: menuItem.menu,
showLast: false, showLast: false,
itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>') 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){ 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, documentHolder = this.documentHolder,
seltype = cellinfo.asc_getFlags().asc_getSelectionType(), seltype = cellinfo.asc_getFlags().asc_getSelectionType(),
isCellLocked = cellinfo.asc_getLocked(), isCellLocked = cellinfo.asc_getLocked(),
@ -1285,6 +1285,8 @@ define([
if (shapeprops) { if (shapeprops) {
if (shapeprops.asc_getFromChart()) if (shapeprops.asc_getFromChart())
ischartmenu = true; ischartmenu = true;
else if (shapeprops.asc_getFromImage())
isimageonly = true;
else { else {
documentHolder.mnuShapeAdvanced.shapeInfo = elValue; documentHolder.mnuShapeAdvanced.shapeInfo = elValue;
isshapemenu = true; isshapemenu = true;
@ -1310,7 +1312,7 @@ define([
documentHolder.mnuChartEdit.setDisabled(isObjLocked); documentHolder.mnuChartEdit.setDisabled(isObjLocked);
documentHolder.pmiImgCut.setDisabled(isObjLocked); documentHolder.pmiImgCut.setDisabled(isObjLocked);
documentHolder.pmiImgPaste.setDisabled(isObjLocked); documentHolder.pmiImgPaste.setDisabled(isObjLocked);
documentHolder.mnuImgAdvanced.setVisible(isimagemenu && !isshapemenu && !ischartmenu); documentHolder.mnuImgAdvanced.setVisible(isimagemenu && (!isshapemenu || isimageonly) && !ischartmenu);
documentHolder.mnuImgAdvanced.setDisabled(isObjLocked); documentHolder.mnuImgAdvanced.setDisabled(isObjLocked);
var isInSign = !!signGuid; var isInSign = !!signGuid;

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

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

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

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