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

[PE] Change shape menu in right panel, fix duplication in recent shapes (bug 43485)

Browse source
This commit is contained in:
JuliaSvinareva 2021-09-16 16:53:48 +03:00
parent ccbabe5325
commit e1a268fc5a
4 changed files with 52 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
apps/common/main/lib/component/DataView.js
View file

@ -1289,9 +1289,14 @@ define([
this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : ''; this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : '';
me.groups = options.groups; me.groups = options.groups;
if (options.isFromImage) {
var store = me.groups[0].groupStore.clone();
store.shift();
me.groups[0].groupStore = store;
}
// add recent shapes to store // add recent shapes to store
var recentStore = new Backbone.Collection([], {model: PE.Models.ShapeModel}), var recentStore = new Common.UI.DataViewGroupStore,
recentArr = options.recentShapes || [], recentArr = options.recentShapes || [],
cols = (recentArr.length) > 18 ? 7 : 6, cols = (recentArr.length) > 18 ? 7 : 6,
height = Math.ceil(recentArr.length/cols) * 35 + 3, height = Math.ceil(recentArr.length/cols) * 35 + 3,
@ -1346,7 +1351,7 @@ define([
}); });
}); });
} }
if (me.updateDataViewItems) { if (me.updateDataViewItems && me.cmpEl.is(':visible')) {
// add recent item in dataViewItems // add recent item in dataViewItems
var recent = _.where(me.dataViewItems, {groupIndex: 0}); var recent = _.where(me.dataViewItems, {groupIndex: 0});
var len = recent ? recent.length : 0; var len = recent ? recent.length : 0;
@ -1412,7 +1417,16 @@ define([
this.addRecentItem(record); this.addRecentItem(record);
}, },
addRecentItem: function (rec) { addRecentItem: function (rec) {
var me = this; var me = this,
exist = false,
type = rec.get('data').shapeType;
for (var i = 0; i < me.recentShapes.length; i++) {
if (me.recentShapes[i].data.shapeType === type) {
exist = true;
break;
}
}
if (exist) return;
var item = rec.toJSON(), var item = rec.toJSON(),
model = { model = {

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

@ -1437,7 +1437,7 @@ define([
iconCls: 'btn-change-shape', iconCls: 'btn-change-shape',
menu : new Common.UI.Menu({ menu : new Common.UI.Menu({
menuAlign: 'tr-br', menuAlign: 'tr-br',
cls: 'menu-shapes', cls: 'menu-shapes menu-change-shape',
items: [] items: []
}), }),
dataHint: '1', dataHint: '1',
@ -1641,47 +1641,35 @@ define([
fillAutoShapes: function() { fillAutoShapes: function() {
var me = this, var me = this,
shapesStore = this.application.getCollection('ShapeGroups'), shapesStore = this.application.getCollection('ShapeGroups'),
count = shapesStore.length; recents = Common.localStorage.getItem('pe-recent-shapes');
var onShowAfter = function(menu) { for (var i = 0; i < 2; i++) {
for (var i=-1; i<count-1 && count>0; i++) { var menuitem = new Common.UI.MenuItem({
var store = shapesStore.at(i > -1 ? i : 0).get('groupStore'); template: _.template('<div id="id-change-shape-menu-<%= options.index %>" class="menu-insertshape"></div>'),
if (i<0) { index: i
store = store.clone(); });
store.shift(); me.btnChangeShape.menu.addItem(menuitem);
}
var shapePicker = new Common.UI.DataViewSimple({ var shapePicker = new Common.UI.DataViewShape({
el: $('#id-shape-menu-shapegroup' + (i+1), menu.items[i+1].$el), el: $('#id-change-shape-menu-' + i),
store: store, itemTemplate: _.template('<div class="item-shape" id="<%= id %>"><svg width="20" height="20" class=\"icon\"><use xlink:href=\"#svg-icon-<%= data.shapeType %>\"></use></svg></div>'),
parentMenu: menu.items[i+1].menu, groups: shapesStore.toJSON(),
itemTemplate: _.template('<div class="item-shape" id="<%= id %>"><svg width="20" height="20" class=\"icon\"><use xlink:href=\"#svg-icon-<%= data.shapeType %>\"></use></svg></div>') parentMenu: me.btnChangeShape.menu,
}); restoreHeight: 604,
shapePicker.on('item:click', function(picker, item, record, e) { textRecentlyUsed: me.textRecentlyUsed,
if (me.api) { recentShapes: recents ? JSON.parse(recents) : null,
me.api.ChangeShapeType(record.get('data').shapeType); isFromImage: i === 0
me.fireEvent('editcomplete', me); });
} shapePicker.on('item:click', function(picker, item, record, e) {
if (e.type !== 'click') if (me.api) {
me.btnChangeShape.menu.hide(); me.api.ChangeShapeType(record.get('data').shapeType);
}); me.fireEvent('editcomplete', me);
} }
menu.off('show:after', onShowAfter); if (e.type !== 'click')
}; me.btnChangeShape.menu.hide();
me.btnChangeShape.menu.on('show:after', onShowAfter);
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+1) + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
]
})
}); });
me.btnChangeShape.menu.addItem(menuItem);
} }
me.btnChangeShape.menu.items[0].setVisible(me._state.isFromImage); me.btnChangeShape.menu.items[0].setVisible(me._state.isFromImage);
me.btnChangeShape.menu.items[1].setVisible(!me._state.isFromImage); me.btnChangeShape.menu.items[1].setVisible(!me._state.isFromImage);
}, },
@ -1954,6 +1942,7 @@ define([
textPosition: 'Position', textPosition: 'Position',
tipAddGradientPoint: 'Add gradient point', tipAddGradientPoint: 'Add gradient point',
tipRemoveGradientPoint: 'Remove gradient point', tipRemoveGradientPoint: 'Remove gradient point',
textAngle: 'Angle' textAngle: 'Angle',
textRecentlyUsed: 'Recently Used'
}, PE.Views.ShapeSettings || {})); }, PE.Views.ShapeSettings || {}));
}); });

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

@ -1249,7 +1249,7 @@ define([
btn.updateHint(me.tipInsertShape); btn.updateHint(me.tipInsertShape);
btn.setMenu( btn.setMenu(
new Common.UI.Menu({ new Common.UI.Menu({
cls: 'menu-shapes' cls: 'menu-shapes menu-insert-shape'
}).on('hide:after', function (e) { }).on('hide:after', function (e) {
me.fireEvent('insert:shape', ['menu:hide']); me.fireEvent('insert:shape', ['menu:hide']);
}) })
@ -1703,7 +1703,7 @@ define([
itemTemplate: _.template('<div class="item-shape" id="<%= id %>"><svg width="20" height="20" class=\"icon\"><use xlink:href=\"#svg-icon-<%= data.shapeType %>\"></use></svg></div>'), itemTemplate: _.template('<div class="item-shape" id="<%= id %>"><svg width="20" height="20" class=\"icon\"><use xlink:href=\"#svg-icon-<%= data.shapeType %>\"></use></svg></div>'),
groups: collection.toJSON(), groups: collection.toJSON(),
parentMenu: menuShape, parentMenu: menuShape,
restoreHeight: true, restoreHeight: 604,
textRecentlyUsed: me.textRecentlyUsed, textRecentlyUsed: me.textRecentlyUsed,
recentShapes: recents ? JSON.parse(recents) : null recentShapes: recents ? JSON.parse(recents) : null
}); });

11
apps/presentationeditor/main/resources/less/app.less
View file

@ -257,14 +257,11 @@
} }
} }
.menu-shapes { .menu-insert-shape, .menu-change-shape {
width: 362px; width: 362px;
padding-top: 8px; padding: 14px 5px 5px 10px;
.menu-insertshape { .group-description {
margin: 5px 5px 0 10px; padding-left: 4px;
.group-description {
padding-left: 4px;
}
} }
.dataview .grouped-data .group-items-container .item { .dataview .grouped-data .group-items-container .item {
box-shadow: none; box-shadow: none;