[PE] Add recent shape in ComboDataViewShape component, add handler for hover and active states
This commit is contained in:
JuliaSvinareva
parent
23df51e17e
commit
cd1d4d9ec0
|
|
@ -74,6 +74,9 @@ define([
|
|||
initialize : function(options) {
|
||||
Common.UI.BaseView.prototype.initialize.call(this, options);
|
||||
|
||||
var filter = Common.localStorage.getKeysFilter();
|
||||
this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : '';
|
||||
|
||||
this.id = this.options.id || Common.UI.getId();
|
||||
this.cls = this.options.cls;
|
||||
this.style = this.options.style;
|
||||
|
|
@ -122,9 +125,20 @@ define([
|
|||
|
||||
fillComboView: function (collection) {
|
||||
var newStyles = [],
|
||||
store = collection.at(0).get('groupStore');
|
||||
for(var i = 0; i < 12; i ++) {
|
||||
newStyles.push(store.at(i));
|
||||
store = collection.at(0).get('groupStore').toJSON(),
|
||||
recents = Common.localStorage.getItem(this.appPrefix + 'recent-shapes');
|
||||
recents = recents ? JSON.parse(recents) : [];
|
||||
|
||||
if (recents.length > 0) {
|
||||
for(var i = 0; i < recents.length && i < 12; i ++) {
|
||||
newStyles.push(recents[i]);
|
||||
}
|
||||
}
|
||||
|
||||
if (newStyles.length < 12) {
|
||||
for(var j = newStyles.length; j < 12; j ++) {
|
||||
newStyles.push(store[j]);
|
||||
}
|
||||
}
|
||||
|
||||
this.fieldPicker.store.reset(newStyles);
|
||||
|
|
@ -219,6 +233,35 @@ define([
|
|||
return this;
|
||||
},
|
||||
|
||||
updateComboView: function (record) {
|
||||
var store = this.fieldPicker.store,
|
||||
type = record.get('data').shapeType,
|
||||
model = null;
|
||||
for (var i = 0; i < store.length; i++) {
|
||||
if (store.at(i).get('data').shapeType === type) {
|
||||
model = store.at(i);
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (!model) {
|
||||
store.pop();
|
||||
} else {
|
||||
store.remove([model]);
|
||||
}
|
||||
store.unshift([record]);
|
||||
},
|
||||
|
||||
setComboViewRecActive: function (isActive) {
|
||||
if (this.isRecordActive)
|
||||
$(this.cmpEl.find('.field-picker .item')).removeClass('active');
|
||||
$(this.cmpEl.find('.field-picker .item')[0])[isActive ? 'addClass' : 'removeClass']('active');
|
||||
this.isRecordActive = isActive;
|
||||
},
|
||||
|
||||
isComboViewRecActive: function () {
|
||||
return this.isRecordActive;
|
||||
},
|
||||
|
||||
checkSize: function() {
|
||||
if (this.cmpEl && this.cmpEl.is(':visible')) {
|
||||
var me = this,
|
||||
|
|
@ -335,8 +378,6 @@ define([
|
|||
tip.hide();
|
||||
}
|
||||
}
|
||||
|
||||
this.fieldPicker.deselectAll();
|
||||
},
|
||||
|
||||
onMenuPickerClick: function(dataView, itemView, record) {
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
&:not('.shapes') .item {
|
||||
&:not(.shapes) .item {
|
||||
padding: 2px;
|
||||
border: @scaled-one-px-value-ie solid @border-regular-control-ie;
|
||||
border: @scaled-one-px-value solid @border-regular-control;
|
||||
|
|
@ -123,7 +123,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
&.disabled:not('.shapes') {
|
||||
&.disabled:not(.shapes) {
|
||||
.item {
|
||||
&:hover:not(.selected) {
|
||||
.box-shadow(none);
|
||||
|
|
@ -135,7 +135,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
&:not('.shapes') .dropdown-menu {
|
||||
&:not(.shapes) .dropdown-menu {
|
||||
box-sizing: content-box;
|
||||
padding: 0;
|
||||
border-top-left-radius: 0;
|
||||
|
|
|
|||
|
|
@ -581,6 +581,19 @@
|
|||
margin: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
&:hover {
|
||||
background-color: @highlight-button-hover-ie;
|
||||
background-color: @highlight-button-hover;
|
||||
}
|
||||
&.active {
|
||||
background-color: @highlight-button-pressed-ie;
|
||||
background-color: @highlight-button-pressed;
|
||||
|
||||
svg.icon {
|
||||
fill: @icon-toolbar-header-ie;
|
||||
fill: @icon-toolbar-header;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.button {
|
||||
|
|
|
|||
|
|
@ -218,6 +218,9 @@ define([
|
|||
if ( this.toolbar.btnsInsertText.pressed() )
|
||||
this.toolbar.btnsInsertText.toggle(false, true);
|
||||
|
||||
if ( this.toolbar.cmbInsertShape.isComboViewRecActive() )
|
||||
this.toolbar.cmbInsertShape.setComboViewRecActive(false);
|
||||
|
||||
$(document.body).off('mouseup', checkInsertAutoshape);
|
||||
};
|
||||
|
||||
|
|
@ -2049,6 +2052,13 @@ define([
|
|||
}
|
||||
me.toolbar.cmbInsertShape.openButton.menu.on('show:before', onComboShowBefore);
|
||||
me.toolbar.cmbInsertShape.fillComboView(collection);
|
||||
me.toolbar.cmbInsertShape.on('click', function (btn, record) {
|
||||
if (record) {
|
||||
me.toolbar.cmbInsertShape.updateComboView(record);
|
||||
me.toolbar.cmbInsertShape.setComboViewRecActive(true);
|
||||
me.onInsertShape(record.get('data').shapeType);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
onResetSlides: function () {
|
||||
|
|
|
|||
|
|
@ -1663,6 +1663,7 @@ define([
|
|||
});
|
||||
shapePicker.on('item:click', function(picker, item, record, e) {
|
||||
if (me.api) {
|
||||
PE.getController('Toolbar').toolbar.cmbInsertShape.updateComboView(record);
|
||||
me.api.ChangeShapeType(record.get('data').shapeType);
|
||||
me.fireEvent('editcomplete', me);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1739,8 +1739,10 @@ define([
|
|||
});
|
||||
shapePicker.on('item:click', function(picker, item, record, e) {
|
||||
if (e.type !== 'click') Common.UI.Menu.Manager.hideAll();
|
||||
if (record)
|
||||
if (record) {
|
||||
me.fireEvent('insert:shape', [record.get('data').shapeType]);
|
||||
me.cmbInsertShape.updateComboView(record);
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
|
|
@ -1750,11 +1752,6 @@ define([
|
|||
recents = Common.localStorage.getItem('pe-recent-shapes');
|
||||
recents = recents ? JSON.parse(recents) : null;
|
||||
me.cmbInsertShape.setMenuPicker(collection, recents, me.textRecentlyUsed);
|
||||
me.cmbInsertShape.on('click', function (btn, record) {
|
||||
if (record) {
|
||||
me.fireEvent('insert:shape', [record.get('data').shapeType]);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
updateAddSlideMenu: function(collection) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue