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

TT#10057 Ngcp-csc implement new cf module styling

Browse Source 
Adjust layout and styling of sections, for call forward module, so
that it meets new requirements (from 27.01 meeting).

Change-Id: I3d0adc914aec796ece36143a6fd7c8491a1e42cf
changes/13/11213/3
Robert Axelsen 8 years ago
parent 9a1d5e0d3d
commit c2fa8ce2b6
6 changed files with 178 additions and 115 deletions
Show Stats Download Patch File Download Diff File

57
app/locales.js
Unescape View File

@ -572,18 +572,18 @@ Ext.define('Ngcp.csc.locales', {
sp: 'List B'
},
first_ring: {
en: 'First ring:',
it: 'First ring:',
de: 'First ring:',
fr: 'First ring:',
sp: 'First ring:'
en: 'first ring',
it: 'first ring',
de: 'first ring',
fr: 'first ring',
sp: 'first ring'
},
then_forward_to: {
en: 'Then forward to:',
it: 'Then forward to:',
de: 'Then forward to:',
fr: 'Then forward to:',
sp: 'Then forward to:'
en: 'then forward to',
it: 'then forward to',
de: 'then forward to',
fr: 'then forward to',
sp: 'then forward to'
},
add_new_destination: {
en: 'ADD NEW DESTINATION',
@ -593,25 +593,25 @@ Ext.define('Ngcp.csc.locales', {
sp: 'ADD NEW DESTINATION'
},
when_phone_online: {
en: 'When My Phone is Online:',
it: 'When My Phone is Online:',
de: 'When My Phone is Online:',
fr: 'When My Phone is Online:',
sp: 'When My Phone is Online:'
en: 'When I am online ...',
it: 'When I am online ...',
de: 'When I am online ...',
fr: 'When I am online ...',
sp: 'When I am online ...'
},
when_phone_busy: {
en: 'When My Phone is Busy:',
it: 'When My Phone is Busy:',
de: 'When My Phone is Busy:',
fr: 'When My Phone is Busy:',
sp: 'When My Phone is Busy:'
en: 'When I am busy ...',
it: 'When I am busy ...',
de: 'When I am busy ...',
fr: 'When I am busy ...',
sp: 'When I am busy ...'
},
when_phone_offline: {
en: 'When My Phone is Offline:',
it: 'When My Phone is Offline:',
de: 'When My Phone is Offline:',
fr: 'When My Phone is Offline:',
sp: 'When My Phone is Offline:'
en: 'When I am offline ...',
it: 'When I am offline ...',
de: 'When I am offline ...',
fr: 'When I am offline ...',
sp: 'When I am offline ...'
},
drag_text: {
en: 'Drag and drop to move',
@ -710,6 +710,13 @@ Ext.define('Ngcp.csc.locales', {
de: 'Enter secs',
fr: 'Enter secs',
sp: 'Enter secs'
},
for_calling_parties: {
en: 'For calling parties ...',
it: 'For calling parties ...',
de: 'For calling parties ...',
fr: 'For calling parties ...',
sp: 'For calling parties ...'
}
},
filters: {

110
classic/sass/src/view/pages/callforward/CallForward.scss
Unescape View File

@ -1,32 +1,43 @@
/* mixins */
@include extjs-panel-ui (
$ui: 'cf-container',
);
@include extjs-panel-ui ( $ui: 'cf-container', );
@include extjs-panel-ui ( $ui: 'cf-widget', );
@include extjs-panel-ui ( $ui: 'cf-mainform', );
@include extjs-panel-ui ( $ui: 'cf-grid', );
@mixin icon($icon) {
@include fa-icon;
@extend .fa;
@extend .fa-#{$icon}::before;
};
@include extjs-panel-ui (
$ui: 'cf-widget',
);
@include extjs-panel-ui (
$ui: 'cf-mainform',
);
/* custom css */
/* 1. CallForwardMainForm */
.x-panel-cf-mainform {
#busyFirstDest-labelTextEl,
#offlineFirstDest-labelTextEl,
#onlineFirstDest-labelTextEl,
.cf-formtext {
font-weight: 600;
margin-bottom: 7px;
}
}
@include extjs-panel-ui (
$ui: 'cf-grid',
);
.x-panel-cf-mainform .cf-formtext:nth-child(2n+1) {
margin: 10px 40px 0 0;
}
/* custom css */
.x-panel-cf-container .x-autocontainer-innerCt {
font-size: 120%;
.x-panel-cf-mainform .cf-subheader {
padding-top: 20px;
}
.x-panel-cf-widget {
border: solid 1px;
border-color: #d0d0d0;
padding: 20px 10px;
.x-panel-cf-mainform {
#busyFirstRingFields,
#offlineFirstRingFields,
#onlineFirstRingFields {
margin-bottom: 10px;
}
}
/* 2. CallForwardMainForm segmented buttons */
.x-panel-cf-mainform .x-segmented-button .x-btn-button-default-small {
display: inline-block;
}
@ -39,17 +50,44 @@
float: left;
}
.cf-subheader {
font-weight: 600;
.x-panel-cf-mainform .x-segmented-button {
white-space: nowrap;
}
.cf-subtitle {
font-size: 110%;
font-weight: 600;
.x-panel-cf-mainform .x-segmented-button:first-child {
margin-bottom: 10px;
}
.cf-deactivate-day {
color: #B4B8B3;
.x-panel-cf-mainform .x-segmented-button-item-horizontal {
display: inline-block;
width: 32%;
height: 35px;
margin-right: 5px;
margin-left: 5px;
}
.x-panel-cf-mainform .x-segmented-button-item-horizontal.x-segmented-button-first {
margin-left: 10px;
}
.x-panel-cf-mainform .x-segmented-button-item-horizontal.x-segmented-button-last {
margin-right: 0;
}
/* 2. CallForwardMainForm grid */
.x-panel-cf-mainform div.x-grid-empty::before {
@include icon(circle);
font-size: 0.7em;
margin: 0 4px;
}
.x-panel-cf-mainform .x-grid-empty {
margin-top: -2px;
color: black;
}
.x-panel-cf-mainform .x-grid-row {
background: white;
}
.x-panel-cf-grid .x-grid-cell-inner {
@ -58,10 +96,26 @@
}
.x-panel-cf-grid .cf-tpl-fa {
font-size: .7em;
font-size: 0.7em;
margin: 0 4px;
}
.x-panel-cf-grid .x-grid-row {
height: 32px;
}
/* 2. CallForwardMainForm other */
.x-panel-cf-widget {
border: solid 1px;
border-color: #d0d0d0;
padding: 20px 10px;
}
.cf-deactivate-day {
color: #B4B8B3;
}
.cf-title {
font-size: 110%;
font-weight: 600;
}

1
classic/src/view/login/Login.js
Unescape View File

@ -81,7 +81,6 @@ Ext.define('NgcpCsc.view.login.Login', {
'select': 'languageSelection'
}
},
// TODO: remember me & forgotten pswd
{
xtype: 'container',
layout: 'hbox',

2
classic/src/view/pages/callforward/CallForward.js
Unescape View File

@ -68,7 +68,7 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForward', {
xtype: 'core-container',
items: [{
padding: '0 0 20 0',
html: Ext.String.format('<div class="fa fa-mail-forward cf-subtitle"> {0}</div>', Ngcp.csc.locales.callforward.subtitle[localStorage.getItem('languageSelected')])
html: Ext.String.format('<div class="fa fa-mail-forward cf-title"> {0}</div>', Ngcp.csc.locales.callforward.subtitle[localStorage.getItem('languageSelected')])
}, {
xtype: 'callforwardmainform'
}]

111
classic/src/view/pages/callforward/CallForwardMainForm.js
Unescape View File

@ -8,7 +8,7 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
},
fieldDefaults: {
labelAlign: 'top'
labelSeparator : ''
},
margin: '0 10 0 0',
@ -82,6 +82,10 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
iconCls: 'x-fa fa-pencil',
iconAlign: 'right'
}]
}, {
xtype: 'container',
userCls: 'cf-formtext',
html: Ngcp.csc.locales.callforward.for_calling_parties[localStorage.getItem('languageSelected')]
}, {
xtype: 'segmentedbutton',
itemId: 'sourceButtons',
@ -107,35 +111,28 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
iconCls: 'x-fa fa-pencil',
iconAlign: 'right'
}]
}, {
xtype: 'panel',
userCls: 'cf-subheader-large',
html: Ngcp.csc.locales.callforward.when_phone_online[localStorage.getItem('languageSelected')] + '<hr>',
height: 50,
ui: 'cf-container',
margin: '0 0 10 0'
}, {
xtype: 'container',
userCls: 'cf-subheader',
html: Ngcp.csc.locales.callforward.first_ring[localStorage.getItem('languageSelected')],
height: 25
userCls: 'cf-formtext cf-subheader',
html: Ngcp.csc.locales.callforward.when_phone_online[localStorage.getItem('languageSelected')]
}, {
xtype: 'panel',
layout: 'hbox',
id: 'onlineFirstRingFields',
height: 50,
padding: '0 11 0 0',
margin: '0 0 0 50',
items: [{
xtype: 'combo',
store: ['Own phone', 'Voicemail', 'Fax2Mail', 'None'],
id: 'onlineFirstDest',
fieldLabel: Ngcp.csc.locales.callforward.first_ring[localStorage.getItem('languageSelected')],
value: 'Own phone',
allowBlank: false,
editable: false,
listeners: {
change: 'selectFirstRing'
},
flex: 5
flex: 8
}, {
xtype: 'combo',
store: ['for 10 secs', 'for 20 secs', 'for 30 secs', 'for 40 secs', 'for 50 secs', 'for 60 secs'],
@ -143,18 +140,24 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
id: 'onlineFirstTimeout',
allowBlank: false,
editable: false,
flex: 1,
flex: 2,
margin: '0 0 0 10',
bind: {
hidden: '{online_timeout_hidden}'
}
}]
}, {
xtype: 'container',
html: Ngcp.csc.locales.callforward.then_forward_to[localStorage.getItem('languageSelected')],
userCls: 'cf-subheader'
},
onlineGrid,
{
layout: 'hbox',
margin: '10 0 0 50',
items: [{
xtype: 'container',
html: Ngcp.csc.locales.callforward.then_forward_to[localStorage.getItem('languageSelected')],
userCls: 'cf-formtext'
},
onlineGrid
]
}, {
html: Ngcp.csc.locales.callforward.add_new_destination[localStorage.getItem('languageSelected')],
xtype: 'button',
id: 'onlineButton',
@ -164,35 +167,28 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
element: 'el',
click: 'addEmptyRow'
}
}, {
xtype: 'panel',
userCls: 'cf-subheader-large',
html: Ngcp.csc.locales.callforward.when_phone_busy[localStorage.getItem('languageSelected')] + '<hr>',
height: 50,
ui: 'cf-container',
margin: '0 0 10 0'
}, {
xtype: 'container',
userCls: 'cf-subheader',
html: Ngcp.csc.locales.callforward.first_ring[localStorage.getItem('languageSelected')],
height: 25
userCls: 'cf-formtext cf-subheader',
html: Ngcp.csc.locales.callforward.when_phone_busy[localStorage.getItem('languageSelected')]
}, {
xtype: 'panel',
layout: 'hbox',
id: 'busyFirstRingFields',
height: 50,
padding: '0 11 0 0',
margin: '0 0 0 50',
items: [{
xtype: 'combo',
store: ['Own phone', 'Voicemail', 'Fax2Mail', 'None'],
id: 'busyFirstDest',
fieldLabel: Ngcp.csc.locales.callforward.first_ring[localStorage.getItem('languageSelected')],
value: 'None',
allowBlank: false,
editable: false,
listeners: {
change: 'selectFirstRing'
},
flex: 5
flex: 8
}, {
xtype: 'combo',
store: ['for 10 secs', 'for 20 secs', 'for 30 secs', 'for 40 secs', 'for 50 secs', 'for 60 secs'],
@ -200,18 +196,24 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
id: 'busyFirstTimeout',
allowBlank: false,
editable: false,
flex: 1,
flex: 2,
margin: '0 0 0 10',
bind: {
hidden: '{busy_timeout_hidden}'
}
}]
}, {
xtype: 'container',
html: Ngcp.csc.locales.callforward.then_forward_to[localStorage.getItem('languageSelected')],
userCls: 'cf-subheader'
},
busyGrid,
{
layout: 'hbox',
margin: '10 0 0 50',
items: [{
xtype: 'container',
html: Ngcp.csc.locales.callforward.then_forward_to[localStorage.getItem('languageSelected')],
userCls: 'cf-formtext'
},
busyGrid
]
}, {
html: Ngcp.csc.locales.callforward.add_new_destination[localStorage.getItem('languageSelected')],
xtype: 'button',
id: 'busyButton',
@ -221,35 +223,28 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
element: 'el',
click: 'addEmptyRow'
}
}, {
xtype: 'panel',
userCls: 'cf-subheader-large',
html: Ngcp.csc.locales.callforward.when_phone_offline[localStorage.getItem('languageSelected')] + '<hr>',
height: 50,
ui: 'cf-container',
margin: '0 0 10 0'
}, {
xtype: 'container',
userCls: 'cf-subheader',
html: Ngcp.csc.locales.callforward.first_ring[localStorage.getItem('languageSelected')],
height: 25
userCls: 'cf-formtext cf-subheader',
html: Ngcp.csc.locales.callforward.when_phone_offline[localStorage.getItem('languageSelected')]
}, {
xtype: 'panel',
layout: 'hbox',
id: 'offlineFirstRingFields',
height: 50,
padding: '0 11 0 0',
margin: '0 0 0 50',
items: [{
xtype: 'combo',
store: ['Own phone', 'Voicemail', 'Fax2Mail', 'None'],
id: 'offlineFirstDest',
fieldLabel: Ngcp.csc.locales.callforward.first_ring[localStorage.getItem('languageSelected')],
value: 'None',
allowBlank: false,
editable: false,
listeners: {
change: 'selectFirstRing'
},
flex: 5
flex: 8
}, {
xtype: 'combo',
store: ['for 10 secs', 'for 20 secs', 'for 30 secs', 'for 40 secs', 'for 50 secs', 'for 60 secs'],
@ -257,18 +252,24 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainForm', {
id: 'offlineFirstTimeout',
allowBlank: false,
editable: false,
flex: 1,
flex: 2,
margin: '0 0 0 10',
bind: {
hidden: '{offline_timeout_hidden}'
}
}]
}, {
xtype: 'container',
html: Ngcp.csc.locales.callforward.then_forward_to[localStorage.getItem('languageSelected')],
userCls: 'cf-subheader'
},
offlineGrid,
{
layout: 'hbox',
margin: '10 0 0 50',
items: [{
xtype: 'container',
html: Ngcp.csc.locales.callforward.then_forward_to[localStorage.getItem('languageSelected')],
userCls: 'cf-formtext'
},
offlineGrid
]
}, {
html: Ngcp.csc.locales.callforward.add_new_destination[localStorage.getItem('languageSelected')],
xtype: 'button',
id: 'offlineButton',

12
classic/src/view/pages/callforward/CallForwardMainGrid.js
Unescape View File

@ -3,13 +3,19 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainGrid', {
selModel: 'cellmodel',
rowLines: false,
width: '100%',
hideHeaders: true,
ui: 'cf-grid',
viewConfig: {
plugins: {
ptype: 'gridviewdragdrop',
dragText: Ngcp.csc.locales.callforward.drag_text[localStorage.getItem('languageSelected')]
},
markDirty: false,
emptyText: Ngcp.csc.locales.callforward.nowhere[localStorage.getItem('languageSelected')]
emptyText: Ngcp.csc.locales.callforward.nowhere[localStorage.getItem('languageSelected')],
stripeRows: false
},
plugins: {
@ -17,10 +23,6 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardMainGrid', {
clicksToEdit: 1
},
hideHeaders: true,
ui: 'cf-grid',
initComponent: function() {
var me = this;

Write Preview
Loading…
Cancel
Save