From 94492446214e6b15c499b1db77b1580e39cc93c9 Mon Sep 17 00:00:00 2001 From: Hans-Peter Herzog Date: Mon, 28 Aug 2017 18:02:45 +0200 Subject: [PATCH] TT#21016 Call: Create common ExtJS component for all Call states Change-Id: If555df8a5b5e9bb4e2da155b53db84019533f58b --- classic/src/view/common/rtc/CallPanel.js | 20 +++++ classic/src/view/common/rtc/RtcController.js | 21 +++-- classic/src/view/common/rtc/RtcModel.js | 4 +- classic/src/view/common/rtc/RtcPanel.js | 88 +------------------ classic/src/view/common/rtc/composer/Fax.js | 2 +- classic/src/view/common/rtc/composer/Phone.js | 2 +- .../src/view/common/rtc/composer/PhoneKeys.js | 2 +- classic/src/view/common/rtc/composer/Sms.js | 2 +- 8 files changed, 43 insertions(+), 98 deletions(-) create mode 100644 classic/src/view/common/rtc/CallPanel.js diff --git a/classic/src/view/common/rtc/CallPanel.js b/classic/src/view/common/rtc/CallPanel.js new file mode 100644 index 00000000..657996fb --- /dev/null +++ b/classic/src/view/common/rtc/CallPanel.js @@ -0,0 +1,20 @@ + +Ext.define('NgcpCsc.view.common.rtc.CallPanel', { + extend: 'Ext.form.Panel', + alias: 'widget.call-panel', + layout: 'center', + bind: { + hidden: '{!callPanel}' + }, + items: [ + { + bind: { + hidden: '{!outgoingCallPending}' + }, + xtype: 'label', + text: 'Start call ...' + } + ] +}); + + diff --git a/classic/src/view/common/rtc/RtcController.js b/classic/src/view/common/rtc/RtcController.js index 1706df31..e092fcc9 100644 --- a/classic/src/view/common/rtc/RtcController.js +++ b/classic/src/view/common/rtc/RtcController.js @@ -458,31 +458,32 @@ Ext.define('NgcpCsc.view.common.rtc.RtcController', { }, outgoingPending: function() { - console.log('outgoingPending'); + console.log('outgoingCallPending'); + this.showOutgoingCallPendingState(); }, outgoingAccepted: function() { - console.log('outgoingAccepted'); + console.log('outgoingCallAccepted'); }, outgoingRingingStart: function() { - console.log('outgoingRingingStart'); + console.log('outgoingCallRingingStart'); }, outgoingRingingStop: function() { - console.log('outgoingRingingStop'); + console.log('outgoingCallRingingStop'); }, outgoingRemoteMedia: function(stream) { - console.log('outgoingRemoteMedia'); + console.log('outgoingCallRemoteMedia'); }, outgoingRemoteMediaEnded: function() { - console.log('outgoingRemoteMediaEnded'); + console.log('outgoingCallRemoteMediaEnded'); }, outgoingEnded: function() { - console.log('outgoingEnded'); + console.log('outgoingCallEnded'); this.callEnded(); }, @@ -513,6 +514,12 @@ Ext.define('NgcpCsc.view.common.rtc.RtcController', { } }, + showOutgoingCallPendingState: function() { + this.getViewModel().set('callPanel', true); + this.getViewModel().set('outgoingCallPending', true); + this.getViewModel().set('phoneComposerHidden', true); + }, + // parameter state true causes the class for the background color change to // be added, and parameter state false causes the class to be removed setRtcpanelTitleColor: function (state) { diff --git a/classic/src/view/common/rtc/RtcModel.js b/classic/src/view/common/rtc/RtcModel.js index ba278d83..2f8bd719 100644 --- a/classic/src/view/common/rtc/RtcModel.js +++ b/classic/src/view/common/rtc/RtcModel.js @@ -33,7 +33,9 @@ Ext.define('NgcpCsc.view.rtc.RtcModel', { rtcEngineCall: null, rtcEngineNetwork: null, rtcEngineClient: null, - rtcEngineSession: null + rtcEngineSession: null, + callPanel: true, + outgoingCallPending: false }, formulas: { disableSubmit: function(get) { diff --git a/classic/src/view/common/rtc/RtcPanel.js b/classic/src/view/common/rtc/RtcPanel.js index 16affc35..7fbdcf02 100644 --- a/classic/src/view/common/rtc/RtcPanel.js +++ b/classic/src/view/common/rtc/RtcPanel.js @@ -38,96 +38,12 @@ Ext.define('NgcpCsc.view.common.rtc.RtcPanel', { }, items: [{ - flex: 4, - reference: 'callpanel', - bind: { - hidden: '{callPanelHidden}' - }, - layout: { - type: 'vbox', - align: 'stretch', - pack: 'center' - }, - defaults: { - cls: 'rtc-container' - }, - items: [{ - margin: 20, - hidden: true, - width: '100%', - reference: 'videoObj', - html: "" - }, { - cls: 'rtc-avatar-container', - reference: 'avatar', - items: { - xtype: 'image', - cls: 'rtc-avatar', - bind: { - src: '{thumbnail}' - } - } - }, { - xtype: 'label', - margin: '20 0 20 0', - bind: '{status}' - }, { - xtype: 'container', - cls: 'rtc-btns-container', - layout: { - type: 'hbox', - align: 'stretch', - pack: 'center' - }, - defaults: { - xtype: 'button', - cls: 'rtc-icons', - enableToggle: true - }, - items: [{ - iconCls: Ngcp.csc.icons.phone, - bind: { - pressed: '{callEnabled}', - userCls: '{setuserCls}' - }, - handler: 'toggleCall' - }, { - iconCls: Ngcp.csc.icons.microphone, - bind: { - pressed: '{micEnabled}', - disabled: '{!connected}', - hidden: '{!micEnabled}' - }, - handler: 'toggleAudioVideo' - }, { - iconCls: Ngcp.csc.icons.microphone_slash, - bind: { - pressed: '{micEnabled}', - disabled: '{!connected}', - hidden: '{micEnabled}' - }, - handler: 'toggleAudioVideo' - }, { - iconCls: Ngcp.csc.icons.video, - bind: { - pressed: '{videoEnabled}', - disabled: '{!connected}' - }, - handler: 'toggleAudioVideo' - }, { - iconCls: Ngcp.csc.icons.comment, - bind: { - pressed: '{chatEnabled}', - disabled: '{!connected}' - }, - handler: 'toogleChat' - }] - }] - }, { xtype: 'phone-composer' }, { xtype: 'sms-composer' }, { xtype: 'fax-composer' + }, { + xtype: 'call-panel' }] }); diff --git a/classic/src/view/common/rtc/composer/Fax.js b/classic/src/view/common/rtc/composer/Fax.js index 0ae75649..7776039f 100644 --- a/classic/src/view/common/rtc/composer/Fax.js +++ b/classic/src/view/common/rtc/composer/Fax.js @@ -1,4 +1,4 @@ -Ext.define('NgcpCsc.view.common.composer.Fax', { +Ext.define('NgcpCsc.view.common.rtc.composer.Fax', { extend: 'Ext.form.Panel', alias: 'widget.fax-composer', diff --git a/classic/src/view/common/rtc/composer/Phone.js b/classic/src/view/common/rtc/composer/Phone.js index e572a3d4..bf2710e0 100644 --- a/classic/src/view/common/rtc/composer/Phone.js +++ b/classic/src/view/common/rtc/composer/Phone.js @@ -1,4 +1,4 @@ -Ext.define('NgcpCsc.view.common.composer.Phone', { +Ext.define('NgcpCsc.view.common.rtc.composer.Phone', { extend: 'Ext.panel.Panel', alias: 'widget.phone-composer', diff --git a/classic/src/view/common/rtc/composer/PhoneKeys.js b/classic/src/view/common/rtc/composer/PhoneKeys.js index 51ecf8bd..fa0d6da2 100644 --- a/classic/src/view/common/rtc/composer/PhoneKeys.js +++ b/classic/src/view/common/rtc/composer/PhoneKeys.js @@ -1,4 +1,4 @@ -Ext.define('NgcpCsc.view.common.composer.PhoneKeys', { +Ext.define('NgcpCsc.view.common.rtc.composer.PhoneKeys', { extend: 'Ext.panel.Panel', alias: 'widget.phonekeys', diff --git a/classic/src/view/common/rtc/composer/Sms.js b/classic/src/view/common/rtc/composer/Sms.js index 6e2119ec..281af398 100644 --- a/classic/src/view/common/rtc/composer/Sms.js +++ b/classic/src/view/common/rtc/composer/Sms.js @@ -1,4 +1,4 @@ -Ext.define('NgcpCsc.view.common.composer.Sms', { +Ext.define('NgcpCsc.view.common.rtc.composer.Sms', { extend: 'Ext.form.Panel', alias: 'widget.sms-composer',