sipwise
/
ngcp-csc
mirror of https://github.com/sipwise/ngcp-csc.git
1
0
Fork 0
Code Issues Releases Wiki Activity

TT#14102 Csc pbx submodules onblur save + tooltip

Browse Source 
What was done:
 1. Add blur listeners to fields
 2. Implement controller for blur event that checks if any of the
    fields in DOM .hasFocus, and if false we save card
 3. Implement change of tooltip for editCard icon when clicked and
    changes to saveCard icon

Change-Id: I772fa4f033b5ec2a4656cc372ad5b57cb42c3ad1
changes/39/12839/2
Robert Axelsen 8 years ago
parent c8e32eb5cc
commit e7c0de41f8
5 changed files with 108 additions and 18 deletions
Show Stats Download Patch File Download Diff File

31
app/utils/locales.js
Unescape View File

@ -948,19 +948,26 @@ Ext.define('Ngcp.csc.locales', {
fr: 'Remove group',
sp: 'Remove group'
},
edit_seat: {
en: 'Edit seat',
it: 'Edit seat',
de: 'Edit seat',
fr: 'Edit seat',
sp: 'Edit seat'
edit_entry: {
en: 'Edit entry',
it: 'Edit entry',
de: 'Edit entry',
fr: 'Edit entry',
sp: 'Edit entry'
},
remove_seat: {
en: 'Remove seat',
it: 'Remove seat',
de: 'Remove seat',
fr: 'Remove seat',
sp: 'Remove seat'
remove_entry: {
en: 'Remove entry',
it: 'Remove entry',
de: 'Remove entry',
fr: 'Remove entry',
sp: 'Remove entry'
},
save_entry: {
en: 'Save entry',
it: 'Save entry',
de: 'Save entry',
fr: 'Save entry',
sp: 'Save entry'
},
edit_device: {
en: 'Edit device',

24
classic/src/view/pages/pbxconfig/PbxConfigController.js
Unescape View File

@ -136,6 +136,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
elClassList.remove(Ngcp.csc.icons.floppy.split(' ')[1]);
elClassList.add(Ngcp.csc.icons.edit.split(' ')[1]);
el.dataset.callback = 'editCard';
el.dataset.qtip = Ngcp.csc.locales.filters.tooltips.edit_entry[localStorage.getItem('languageSelected')];
this.showHideFocusFieldsById(recId, storeName, 'hide');
this.toggleCancelCard(el, 'off');
},
@ -241,6 +242,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
elClassList.remove(Ngcp.csc.icons.edit.split(' ')[1])
elClassList.add(Ngcp.csc.icons.floppy.split(' ')[1]);
el.dataset.callback = 'saveCard';
el.dataset.qtip = Ngcp.csc.locales.filters.tooltips.save_entry[localStorage.getItem('languageSelected')];
me.toggleCancelCard(el, 'on');
grid.updateLayout();
}, 50);
@ -354,6 +356,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
elClassList.remove(Ngcp.csc.icons.edit.split(' ')[1]);
elClassList.add(Ngcp.csc.icons.floppy.split(' ')[1]);
el.dataset.callback = 'saveCard';
el.dataset.qtip = Ngcp.csc.locales.filters.tooltips.save_entry[localStorage.getItem('languageSelected')];
Ext.defer(function() {
me.showHideFocusFieldsById(recId, storeName, 'show');
}, 50);
@ -415,6 +418,27 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
editCard.dataset.callback = 'editCard';
break;
}
},
fieldBlurred: function(event) {
var me = this;
var fields = this.getView().query('textfield');
var anyFieldHasFocus = false;
Ext.defer(function() {
for (i = 0; i < fields.length; i++) {
if (fields[i].hasFocus) {
anyFieldHasFocus = true;
}
}
if (!anyFieldHasFocus) {
var currentRoute = window.location.hash;
var storeName = me.getStoreFromRoute(currentRoute);
var recId = event.id.split("-")[3];
var iconDivId = 'edit' + storeName.slice(0, -1) + '-' + recId;
var iconDiv = document.getElementById(iconDivId);
me.saveCard(iconDiv);
}
}, 1);
}
});

25
classic/src/view/pages/pbxconfig/devices/DevicesGrid.js
Unescape View File

@ -51,6 +51,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
width: '96%'
}]
},
userCls: Ext.os.is.Desktop ? 'pbx-widget-grid big-820' : 'pbx-widget-grid small-100',
plugins: [{
@ -96,6 +97,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -128,6 +133,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -160,6 +169,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
},
listeners: {
focus: 'setFieldValue',
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed',
select: 'deviceSelected'
},
@ -196,6 +209,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
},
store: ['Ext1', 'Ext2', 'Ext3']
@ -231,6 +248,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
},
store: ['Ext1', 'Ext2', 'Ext3']
@ -332,8 +353,8 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.devices.DevicesGrid', {
xtype: 'label',
bind: {
html: '<div class="card-wrapper"><div class="card-icon-row">' +
'<div id="removeDevice-{record.id}" class="card-icon" data-callback="removeCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.remove_seat[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.trash2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="editDevice-{record.id}" class="card-icon" data-callback="editCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.edit_seat[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.edit2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="removeDevice-{record.id}" class="card-icon" data-callback="removeCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.remove_entry[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.trash2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="editDevice-{record.id}" class="card-icon" data-callback="editCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.edit_entry[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.edit2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="cancelDevice-{record.id}" class="card-icon hidden" data-callback="cancelCard" data-qtip="' + Ngcp.csc.locales.pbxconfig.cancel_operation[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.block2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'</div></div>'
}

21
classic/src/view/pages/pbxconfig/groups/GroupsGrid.js
Unescape View File

@ -32,6 +32,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.GroupsGrid', {
width: '96%'
}]
},
userCls: Ext.os.is.Desktop ? 'pbx-widget-grid big-820' : 'pbx-widget-grid small-100',
plugins: [{
@ -73,6 +74,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.GroupsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -105,6 +110,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.GroupsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -146,6 +155,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.GroupsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -182,6 +195,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.GroupsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}, {
@ -199,8 +216,8 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.GroupsGrid', {
xtype: 'label',
bind: {
html: '<div class="card-wrapper"><div class="card-icon-row">' +
'<div id="removeGroup-{record.id}" class="card-icon" data-callback="removeCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.remove_seat[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.trash2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="editGroup-{record.id}" class="card-icon" data-callback="editCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.edit_seat[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.edit2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="removeGroup-{record.id}" class="card-icon" data-callback="removeCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.remove_entry[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.trash2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="editGroup-{record.id}" class="card-icon" data-callback="editCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.edit_entry[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.edit2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="cancelGroup-{record.id}" class="card-icon hidden" data-callback="cancelCard" data-qtip="' + Ngcp.csc.locales.pbxconfig.cancel_operation[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.block2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'</div></div>'
}

25
classic/src/view/pages/pbxconfig/seats/SeatsGrid.js
Unescape View File

@ -32,6 +32,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
width: '96%'
}]
},
userCls: Ext.os.is.Desktop ? 'pbx-widget-grid big-820' : 'pbx-widget-grid small-100',
plugins: [{
@ -75,6 +76,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -108,6 +113,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -143,6 +152,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -177,6 +190,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -213,6 +230,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
focus: {
fn: 'setFieldValue'
},
blur: {
fn: 'fieldBlurred',
el: 'element'
},
specialkey: 'onEnterPressed'
}
}]
@ -220,8 +241,8 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
xtype: 'label',
bind: {
html: '<div class="card-wrapper"><div class="card-icon-row">' +
'<div id="removeSeat-{record.id}" class="card-icon" data-callback="removeCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.remove_seat[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.trash2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="editSeat-{record.id}" class="card-icon" data-callback="editCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.edit_seat[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.edit2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="removeSeat-{record.id}" class="card-icon" data-callback="removeCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.remove_entry[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.trash2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="editSeat-{record.id}" class="card-icon" data-callback="editCard" data-qtip="' + Ngcp.csc.locales.filters.tooltips.edit_entry[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.edit2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'<div id="cancelSeat-{record.id}" class="card-icon hidden" data-callback="cancelCard" data-qtip="' + Ngcp.csc.locales.pbxconfig.cancel_operation[localStorage.getItem('languageSelected')] + '"><i class="' + Ngcp.csc.icons.block2x + ' green-icon pointer" aria-hidden="true"></i></div>' +
'</div></div>'
}

Write Preview
Loading…
Cancel
Save