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

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

View file

@ -1289,9 +1289,14 @@ define([
this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : '';
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
var recentStore = new Backbone.Collection([], {model: PE.Models.ShapeModel}),
var recentStore = new Common.UI.DataViewGroupStore,
recentArr = options.recentShapes || [],
cols = (recentArr.length) > 18 ? 7 : 6,
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
var recent = _.where(me.dataViewItems, {groupIndex: 0});
var len = recent ? recent.length : 0;
@ -1412,7 +1417,16 @@ define([
this.addRecentItem(record);
},
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(),
model = {

View file

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

View file

@ -1249,7 +1249,7 @@ define([
btn.updateHint(me.tipInsertShape);
btn.setMenu(
new Common.UI.Menu({
cls: 'menu-shapes'
cls: 'menu-shapes menu-insert-shape'
}).on('hide:after', function (e) {
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>'),
groups: collection.toJSON(),
parentMenu: menuShape,
restoreHeight: true,
restoreHeight: 604,
textRecentlyUsed: me.textRecentlyUsed,
recentShapes: recents ? JSON.parse(recents) : null
});

View file

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