Skip to content

B
BoxDialer
Commit 41c692c1 authored by Muhammadali's avatar Muhammadali
Browse files
Options

update

parent 2c70425d
Show whitespace changes
Inline Side-by-side
Showing with 842 additions and 1045 deletions
src/components/CallHistoryInputDropdown/index.jsx
View file @ 41c692c1
...@@ -43,7 +43,6 @@ const CallHistoryInputDropdown = ({ ...@@ -43,7 +43,6 @@ const CallHistoryInputDropdown = ({
.scrollTo(document.getElementById('numbersDiv').scrollWidth, 0); .scrollTo(document.getElementById('numbersDiv').scrollWidth, 0);
}, [inputValue]); }, [inputValue]);
console.log('input_modal: ', modal, numberSelectHistory);
document.querySelector('body').addEventListener('click', function (e) { document.querySelector('body').addEventListener('click', function (e) {
if (modal) setModal(false); if (modal) setModal(false);
}); });
......
src/components/Modal/index.jsx
View file @ 41c692c1
...@@ -13,7 +13,6 @@ import DialpadIcon from '@mui/icons-material/Dialpad'; ...@@ -13,7 +13,6 @@ import DialpadIcon from '@mui/icons-material/Dialpad';
import CallCardDropDown from '../CallCardDropDown'; import CallCardDropDown from '../CallCardDropDown';
import ModalNumpad from '../ModalNumpad'; import ModalNumpad from '../ModalNumpad';
import {useConfigHoldMute} from "../../storage" import {useConfigHoldMute} from "../../storage"
// import { contextModalEventProperty } from '../../context/modalEventProperty';
const Modal = ({ children, hidden, hangupButton, phoneNumber, callType }) => { const Modal = ({ children, hidden, hangupButton, phoneNumber, callType }) => {
const boxDialer = window.BoxDialer; const boxDialer = window.BoxDialer;
...@@ -24,7 +23,6 @@ const Modal = ({ children, hidden, hangupButton, phoneNumber, callType }) => { ...@@ -24,7 +23,6 @@ const Modal = ({ children, hidden, hangupButton, phoneNumber, callType }) => {
const [transferModel, setTransferModel] = useState(true); const [transferModel, setTransferModel] = useState(true);
const [numpadModal, setNumpadModal] = useState(false); const [numpadModal, setNumpadModal] = useState(false);
console.log('callType_modal: ', callType)
useEffect(() => { useEffect(() => {
setModalHidden(hidden); setModalHidden(hidden);
...@@ -172,11 +170,6 @@ const Modal = ({ children, hidden, hangupButton, phoneNumber, callType }) => { ...@@ -172,11 +170,6 @@ const Modal = ({ children, hidden, hangupButton, phoneNumber, callType }) => {
<div className='round'></div> <div className='round'></div>
<p className='name'>No name</p> <p className='name'>No name</p>
</ModalContainer.Head> </ModalContainer.Head>
{/* <hr />
<ModalContainer.Body rollUp={rollUp}></ModalContainer.Body>
<hr />
<ModalContainer.Bottom rollUp={rollUp}></ModalContainer.Bottom>
<hr /> */}
{selectModalType(callType)} {selectModalType(callType)}
</ModalContainer> </ModalContainer>
<div className='rollUpVesion'> <div className='rollUpVesion'>
......
src/components/ModalPhoneNumpad/index.jsx
View file @ 41c692c1
...@@ -186,9 +186,7 @@ const ModalPhoneNumpad = ({ ...@@ -186,9 +186,7 @@ const ModalPhoneNumpad = ({
}, [handleKeyUp]); }, [handleKeyUp]);
// `${Data.getHours()}:${Data.getMinutes()} ${Data.getDate()}.${Data.getMonth()+1}.${Data.getFullYear()}` // `${Data.getHours()}:${Data.getMinutes()} ${Data.getDate()}.${Data.getMonth()+1}.${Data.getFullYear()}`
const callButton = () => { const callButton = () => {
// inset if ----------
// -------------------
var currentTime = new Date(); var currentTime = new Date();
if (dynamicValue === 'connected') { if (dynamicValue === 'connected') {
if ( if (
...@@ -196,8 +194,7 @@ const ModalPhoneNumpad = ({ ...@@ -196,8 +194,7 @@ const ModalPhoneNumpad = ({
call_history.slice(-1)[0]?.value != inputValue call_history.slice(-1)[0]?.value != inputValue
) { ) {
let newCallsStringify = JSON.stringify([ let newCallsStringify = JSON.stringify([
...call_history, ...call_history, {
{
value: inputValue, value: inputValue,
time: `${currentTime.getHours()}:${currentTime.getMinutes()} ${currentTime.getDate()}.${currentTime.getMonth()}.${currentTime.getFullYear()}`, time: `${currentTime.getHours()}:${currentTime.getMinutes()} ${currentTime.getDate()}.${currentTime.getMonth()}.${currentTime.getFullYear()}`,
}, },
...@@ -213,6 +210,7 @@ const ModalPhoneNumpad = ({ ...@@ -213,6 +210,7 @@ const ModalPhoneNumpad = ({
}, },
}); });
} }
}; };
const selectFunc = (e) => { const selectFunc = (e) => {
setInputValue(e); setInputValue(e);
...@@ -287,7 +285,6 @@ const ModalPhoneNumpad = ({ ...@@ -287,7 +285,6 @@ const ModalPhoneNumpad = ({
<p className='call_text'>{translator.translate('CALL')}</p> <p className='call_text'>{translator.translate('CALL')}</p>
</div> </div>
<div className='right' onClick={() => setExNum(!exNum)}> <div className='right' onClick={() => setExNum(!exNum)}>
{/* <KeyboardControlKeyIcon className='icon' /> */}
<div className='icon'></div> <div className='icon'></div>
</div> </div>
</NumberButton.CallButton> </NumberButton.CallButton>
...@@ -310,10 +307,6 @@ const ModalPhoneNumpad = ({ ...@@ -310,10 +307,6 @@ const ModalPhoneNumpad = ({
))} ))}
</NumberButton.CallButtonModalInset> </NumberButton.CallButtonModalInset>
</NumberButton.CallButtonModal> </NumberButton.CallButtonModal>
{/* <ModalPhoneNumpadStyle.Window
visiblevalue={exNum}
onClick={() => setExNum(false)}
/> */}
</NumberButton> </NumberButton>
</> </>
) : ( ) : (
......
src/components/ModalPhoneNumpad/style.js
View file @ 41c692c1
...@@ -17,7 +17,6 @@ const ModalPhoneNumpadStyle = styled.div` ...@@ -17,7 +17,6 @@ const ModalPhoneNumpadStyle = styled.div`
bottom: 120px; bottom: 120px;
transition: ${({ switchAnim }) => transition: ${({ switchAnim }) =>
typeof switchAnim !== 'undefined' ? (switchAnim ? '0.2s' : '0s') : '0.2s'}; typeof switchAnim !== 'undefined' ? (switchAnim ? '0.2s' : '0s') : '0.2s'};
${({ switchAnim }) => console.log('switchAnim: ', switchAnim)}
z-index: 9999; z-index: 9999;
${({ hiddenValue, position, variant }) => ${({ hiddenValue, position, variant }) =>
hiddenValue hiddenValue
......
src/components/setting/index.jsx
View file @ 41c692c1
...@@ -32,8 +32,6 @@ const SettingComponent = ({ ...@@ -32,8 +32,6 @@ const SettingComponent = ({
setSettingPage(count) setSettingPage(count)
} }
console.log('elem: ', elem)
useEffect(() => { useEffect(() => {
console.log('settingPage: ', settingPage) console.log('settingPage: ', settingPage)
if(elem){ if(elem){
......
src/components/settingComponents/fixComponent/index.jsx
View file @ 41c692c1
...@@ -10,8 +10,6 @@ const FixComponent = () => { ...@@ -10,8 +10,6 @@ const FixComponent = () => {
const useColorConfigStore = useColorConfig((store) => store) const useColorConfigStore = useColorConfig((store) => store)
console.log('useColorConfig client: ', useColorConfigStore.state.autoAnswer)
const marks = [ const marks = [
{ {
value: 1, value: 1,
......
src/lib/boxDIaler.js
View file @ 41c692c1
/** @format */ /** @format */
import { toast } from 'react-hot-toast'; import {toast} from 'react-hot-toast';
import outcomingringTone from '../sounds/ringtone.wav'; import outcomingringTone from '../sounds/ringtone.wav';
import waitRingTone from '../sounds/ringbacktone.wav'; import waitRingTone from '../sounds/ringbacktone.wav';
import pickSound from '../sounds/dtmf.wav'; import pickSound from '../sounds/dtmf.wav';
import { WebSocketInterface, UA } from 'jssip'; import {WebSocketInterface, UA} from 'jssip';
import tugpng from '../img/tug.png'; import tugpng from '../img/tug.png';
import packageJson from '../../package.json'; import packageJson from '../../package.json';
...@@ -43,12 +43,10 @@ export class BoxDialer { ...@@ -43,12 +43,10 @@ export class BoxDialer {
oscillator2; oscillator2;
extnum; extnum;
timer = { timer = {
time: 0, time: 0, type: null,
type: null,
}; };
innerTimer = { innerTimer = {
time: 0, time: 0, type: null,
type: null,
}; };
options; options;
socket; socket;
...@@ -85,13 +83,11 @@ export class BoxDialer { ...@@ -85,13 +83,11 @@ export class BoxDialer {
this.waitRingTone.loop = true; this.waitRingTone.loop = true;
this.callEvetsBoxDialer = { this.callEvetsBoxDialer = {
callHold: false, callHold: false, callMute: null,
callMute: null,
}; };
this.options = { this.options = {
eventHandlers: this.uaEvents(), eventHandlers: this.uaEvents(), mediaConstraints: {audio: true, video: false},
mediaConstraints: { audio: true, video: false },
}; };
} }
...@@ -160,35 +156,22 @@ export class BoxDialer { ...@@ -160,35 +156,22 @@ export class BoxDialer {
return { return {
progress: (e) => { progress: (e) => {
console.log('%c progress', 'font-size: 22px; color: green;', e); console.log('%c progress', 'font-size: 22px; color: green;', e);
// this.hangupButtonClick();
// this.closeBxCall();
// window.innerCallBegin(true);
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: true, bool: true, type: 'connectingOutgoing', from: this?.callSession?._remote_identity?._uri?.user,
type: 'connectingOutgoing',
from: this?.callSession?._remote_identity?._uri?.user,
}); });
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', stateCode: 'connectingOutgoing', funcParam: {
stateCode: 'connectingOutgoing', bool: false, callType: '',
funcParam: {
bool: false,
callType: '',
}, },
}); });
}, }, failed: (e) => {
failed: (e) => {
console.log('%c failed', 'font-size: 22px; color: green;', e); console.log('%c failed', 'font-size: 22px; color: green;', e);
if (e?.cause) { if (e?.cause) {
toast.error(e?.cause); toast.error(e?.cause);
} }
// console.log('call failed with cause: ' + e.data);
this.closeBxCall(); this.closeBxCall();
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: false, bool: false, type: null, from: '',
type: null,
from: '',
}); });
this.stopInnerTimer(); this.stopInnerTimer();
if (e.cause == 'User Denied Media Access') { if (e.cause == 'User Denied Media Access') {
...@@ -200,45 +183,30 @@ export class BoxDialer { ...@@ -200,45 +183,30 @@ export class BoxDialer {
}); });
window.navigator.mediaDevices window.navigator.mediaDevices
.getUserMedia({ audio: true }) .getUserMedia({audio: true})
.then(function (stream) { .then(function (stream) {
console.log( console.log('User_Danied_Media_Access', 'You let me use your mic!',);
'User_Danied_Media_Access',
'You let me use your mic!',
);
}) })
.catch(function (err) { .catch(function (err) {
console.log('User_Danied_Media_Access', 'No mic for you!'); console.log('User_Danied_Media_Access', 'No mic for you!');
}); });
} }
}, }, ended: (e) => {
ended: (e) => {
console.log('%c ended', 'font-size: 22px; color: green;'); console.log('%c ended', 'font-size: 22px; color: green;');
this.closeBxCall(); this.closeBxCall();
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: false, bool: false, type: null, from: '',
type: null,
from: '',
}); });
this.stopInnerTimer(); this.stopInnerTimer();
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', funcParam: {
funcParam: { bool: false, callType: '',
bool: false,
callType: '',
}, },
}); });
this.removeViExternalCard(); this.removeViExternalCard();
}, }, confirmed: (e) => {
confirmed: (e) => {
console.log('%c confirmed', 'font-size: 22px; color: green;', e); console.log('%c confirmed', 'font-size: 22px; color: green;', e);
// console.log(`%c BXLOG:`, datas, 'background-color: red;');
this.onSipStateChange.innerCallerModal({
bool: true,
type: 'connected',
from: this?.callSession?._remote_identity?._uri?.user,
});
this.startInnerTimer();
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState',
stateCode: 'connected', stateCode: 'connected',
...@@ -248,16 +216,21 @@ export class BoxDialer { ...@@ -248,16 +216,21 @@ export class BoxDialer {
callFromName: 'Test', callFromName: 'Test',
}, },
}); });
this.onSipStateChange.innerCallerModal({
bool: true, type: 'connected', from: this?.callSession?._remote_identity?._uri?.user,
});
this.startInnerTimer();
}, },
}; };
} }
isUaRunning() { isUaRunning() {
return ( return (Boolean(typeof window.BX !== 'undefined') && Boolean(window.localStorage.getItem(BX.bitrix_sessid() + '_mycall')) && Boolean(window.localStorage.getItem('mycall')));
Boolean(typeof window.BX !== 'undefined') &&
Boolean(window.localStorage.getItem(BX.bitrix_sessid() + '_mycall')) &&
Boolean(window.localStorage.getItem('mycall'))
);
} }
removeViExternalCard() { removeViExternalCard() {
...@@ -301,13 +274,12 @@ export class BoxDialer { ...@@ -301,13 +274,12 @@ export class BoxDialer {
showNotification(cbk) { showNotification(cbk) {
let callerId = this.callSession._remote_identity._uri.user; let callerId = this.callSession._remote_identity._uri.user;
const greeting = new Notification(`Звонок от ${callerId}`, { const greeting = new Notification(`Звонок от ${callerId}`, {
body: 'Answer Call', body: 'Answer Call', icon: tugpng,
icon: tugpng,
}); });
greeting.addEventListener('click', cbk); greeting.addEventListener('click', cbk);
} }
onSoundType({ type, bool }) { onSoundType({type, bool}) {
this.ringtone.remove(); this.ringtone.remove();
this.waitRingTone.remove(); this.waitRingTone.remove();
this.pickSound.remove(); this.pickSound.remove();
...@@ -354,14 +326,13 @@ export class BoxDialer { ...@@ -354,14 +326,13 @@ export class BoxDialer {
} }
} }
sipRegister = ({ number, secret, wsurl, isIce }) => { sipRegister = ({number, secret, wsurl, isIce}) => {
try { try {
if (window?.alovoice_setversion && packageJson?.version) { if (window?.alovoice_setversion && packageJson?.version) {
window.alovoice_setversion(packageJson?.version); window.alovoice_setversion(packageJson?.version);
} }
if (this.options) { if (this.options) {
if (typeof BX !== 'undefined') if (typeof BX !== 'undefined') BX?.localStorage?.remove('viExternalCard');
BX?.localStorage?.remove('viExternalCard');
this.socket = new WebSocketInterface(`wss://${wsurl}/ws`); this.socket = new WebSocketInterface(`wss://${wsurl}/ws`);
this.callSession = false; this.callSession = false;
...@@ -380,67 +351,35 @@ export class BoxDialer { ...@@ -380,67 +351,35 @@ export class BoxDialer {
register_expires: 60, register_expires: 60,
}); });
if (typeof BX !== 'undefined') { if (typeof BX !== 'undefined') {
console.log( console.log('setting_my_call =============================-----------',);
'setting_my_call =============================-----------', window.localStorage.setItem(BX.bitrix_sessid() + '_mycall', this.ua.configuration.instance_id,);
); window.localStorage.setItem('mycall', this.ua.configuration.instance_id,);
window.localStorage.setItem(
BX.bitrix_sessid() + '_mycall',
this.ua.configuration.instance_id,
);
window.localStorage.setItem(
'mycall',
this.ua.configuration.instance_id,
);
} }
this.ua.on('connected', (e) => { this.ua.on('connected', (e) => {
console.log( console.log('%c sip_register [connected]: ', 'font-size: 22px; color: yellow;', e,);
'%c sip_register [connected]: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.ua.on('disconnected', (e) => { this.ua.on('disconnected', (e) => {
this.onSipStateChange.dynamicValue('pending'); this.onSipStateChange.dynamicValue('pending');
console.log( console.log('%c sip_register [disconnected]: ', 'font-size: 22px; color: yellow;', e,);
'%c sip_register [disconnected]: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.ua.on('registered', (e) => { this.ua.on('registered', (e) => {
this.onSipStateChange.dynamicValue('connected'); this.onSipStateChange.dynamicValue('connected');
console.log( console.log('%c sip_register [registered]: ', 'font-size: 22px; color: yellow;', e,);
'%c sip_register [registered]: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.ua.on('unregistered', (e) => { this.ua.on('unregistered', (e) => {
console.log( console.log('%c sip_register [unregistered]: ', 'font-size: 22px; color: yellow;', e,);
'%c sip_register [unregistered]: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.ua.on('registrationFailed', (e) => { this.ua.on('registrationFailed', (e) => {
console.log( console.log('%c sip_register [registrationFailed]: ', 'font-size: 22px; color: yellow;', e,);
'%c sip_register [registrationFailed]: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.ua.on('connecting', (e) => { this.ua.on('connecting', (e) => {
console.log('%c connecting: ', 'font-size: 22px; color: yellow;', e); console.log('%c connecting: ', 'font-size: 22px; color: yellow;', e);
}); });
this.ua.on('registrationExpiring', (e) => { this.ua.on('registrationExpiring', (e) => {
console.log( console.log('%c registrationExpiring: ', 'font-size: 22px; color: yellow;', e,);
'%c registrationExpiring: ',
'font-size: 22px; color: yellow;',
e,
);
this.ua.register(); this.ua.register();
}); });
this.ua.on('newMessage', (e) => { this.ua.on('newMessage', (e) => {
...@@ -454,45 +393,33 @@ export class BoxDialer { ...@@ -454,45 +393,33 @@ export class BoxDialer {
}); });
this.ua.on('newRTCSession', (data) => { this.ua.on('newRTCSession', (data) => {
console.log( console.log('%c newRTCSession: ', 'font-size: 22px; color: yellow;', data,);
'%c newRTCSession: ',
'font-size: 22px; color: yellow;',
data,
);
this.callSession = data.session; this.callSession = data.session;
if (this.callSession && this.callSession.connection) { if (this.callSession && this.callSession.connection) {
this.callSession.connection.onaddstream = (e) => { this.callSession.connection.onaddstream = (e) => {
this.strmTrack = e.stream.getAudioTracks(); this.strmTrack = e.stream.getAudioTracks();
if (this.strmTrack[0]) { if (this.strmTrack[0]) {
this.remoteAudio.srcObject = new MediaStream([ this.remoteAudio.srcObject = new MediaStream([this.strmTrack[0],]);
this.strmTrack[0],
]);
this.remoteAudio.play(); this.remoteAudio.play();
} }
}; };
} }
this.setGuiPhoneState({
funcName: 'modalState',
funcParam: {
bool: true,
callType: 'incoming',
},
});
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: true, bool: true, type: 'connectingIncoming', from: this?.callSession?._remote_identity?._uri?.user,
type: 'connectingIncoming',
from: this?.callSession?._remote_identity?._uri?.user,
}); });
if (this.callSession.direction === 'incoming') { if (this.callSession.direction === 'incoming') {
this.setGuiPhoneState({
funcName: 'modalState', funcParam: {
bool: true, callType: 'incoming',
},
});
let second; let second;
console.log( console.log('auto_answer is work: ', this.globalHistoryData?.autoAnswer,);
'auto_answer is work: ',
this.globalHistoryData?.autoAnswer,
);
if (this.globalHistoryData?.autoAnswer) { if (this.globalHistoryData?.autoAnswer) {
switch (this.globalHistoryData?.autoAnswerSecond) { switch (this.globalHistoryData?.autoAnswerSecond) {
case 1: case 1:
...@@ -517,94 +444,72 @@ export class BoxDialer { ...@@ -517,94 +444,72 @@ export class BoxDialer {
this.showNotification(() => { this.showNotification(() => {
this.answerButtonClick(); this.answerButtonClick();
}); });
this.onSoundType({ type: 'ring', bool: true }); this.onSoundType({type: 'ring', bool: true});
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', stateCode: 'connectingIncoming', funcParam: {
stateCode: 'connectingIncoming', bool: true, callType: 'incoming',
funcParam: {
bool: true,
callType: 'incoming',
}, },
}); });
// window.innerCallBegin(); // window.innerCallBegin();
this.callSession.on('progress', (e) => { this.callSession.on('progress', (e) => {
console.log( console.log('%c progress: ', 'font-size: 22px; color: yellow;', e,);
'%c progress: ',
'font-size: 22px; color: yellow;',
e,
);
this.setGuiPhoneState({ this.setGuiPhoneState({
stateCode: 'incoming', stateCode: 'incoming',
}); });
}); });
// incoming call here // incoming call here
this.callSession.on('accepted', () => { this.callSession.on('accepted', () => {
console.log( console.log('%c newRTCSession accepted: ', 'font-size: 22px; color: yellow;', e,);
'%c newRTCSession accepted: ',
'font-size: 22px; color: yellow;',
e,
);
// the call has answered // the call has answered
this.onSoundType({ type: 'ring', bool: false }); this.onSoundType({type: 'ring', bool: false});
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', stateCode: 'connected', funcParam: {
stateCode: 'connected', bool: true, callType: 'connected',
funcParam: {
bool: true,
callType: 'connected',
}, },
}); });
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: false, bool: false, type: '', from: '',
type: '',
from: '',
}); });
}); });
this.callSession.on('confirmed', () => { this.callSession.on('confirmed', () => {
console.log(
'%c newRTCSession confirmed: ',
'font-size: 22px; color: yellow;', this.setGuiPhoneState({
); funcName: 'modalState', funcParam: {
// this handler will be called for incoming calls too bool: true, callType: 'connected',
console.log( },
'%c incoming confirmed', });
'font-size: 22px; color: yellow;',
);
console.log('%c newRTCSession confirmed: ', 'font-size: 22px; color: yellow;',);
console.log('%c incoming confirmed', 'font-size: 22px; color: yellow;',);
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: true, bool: true, type: 'connected', from: this?.callSession?._remote_identity?._uri?.user,
type: 'connected',
from: this?.callSession?._remote_identity?._uri?.user,
}); });
this.startInnerTimer(); this.startInnerTimer();
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', stateCode: 'connected', funcParam: {
stateCode: 'connected', bool: true, callType: 'connected',
funcParam: {
bool: true,
callType: 'connected',
}, },
}); });
}); });
this.callSession.on('ended', () => { this.callSession.on('ended', () => {
console.log( console.log('%c newRTCSession ended: ', 'font-size: 22px; color: yellow;',);
'%c newRTCSession ended: ',
'font-size: 22px; color: yellow;',
);
// the call has ended // the call has ended
console.log('%c incoming end', 'font-size: 22px; color: yellow;'); console.log('%c incoming end', 'font-size: 22px; color: yellow;');
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: false, bool: false, type: null, from: '',
type: null,
from: '',
}); });
this.stopInnerTimer(); this.stopInnerTimer();
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', funcParam: {
funcParam: { bool: false, callType: '',
bool: false,
callType: '',
}, },
}); });
this.closeBxCall(); this.closeBxCall();
...@@ -613,32 +518,22 @@ export class BoxDialer { ...@@ -613,32 +518,22 @@ export class BoxDialer {
}); });
this.callSession.on('failed', () => { this.callSession.on('failed', () => {
// unable to establish the call // unable to establish the call
console.log( console.log('%c incoming faile ', 'font-size: 22px; color: yellow;',);
'%c incoming faile ',
'font-size: 22px; color: yellow;',
);
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: false, bool: false, type: null,
type: null,
}); });
this.stopInnerTimer(); this.stopInnerTimer();
this.onSoundType({ type: 'ring', bool: false }); this.onSoundType({type: 'ring', bool: false});
this.closeBxCall(); this.closeBxCall();
this.hangupButtonClick(); this.hangupButtonClick();
this.setGuiPhoneState({ this.setGuiPhoneState({
funcName: 'modalState', funcName: 'modalState', funcParam: {
funcParam: { bool: false, callType: '',
bool: false,
callType: '',
}, },
}); });
}); });
this.callSession.on('connecting', (e) => { this.callSession.on('connecting', (e) => {
console.log( console.log('%c connecting: ', 'font-size: 22px; color: yellow;', e,);
'%c connecting: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('sending', (e) => { this.callSession.on('sending', (e) => {
console.log('%c sending: ', 'font-size: 22px; color: yellow;', e); console.log('%c sending: ', 'font-size: 22px; color: yellow;', e);
...@@ -651,18 +546,10 @@ export class BoxDialer { ...@@ -651,18 +546,10 @@ export class BoxDialer {
console.log('%c newInfo: ', 'font-size: 22px; color: yellow;', e); console.log('%c newInfo: ', 'font-size: 22px; color: yellow;', e);
}); });
this.callSession.on('hold', (e) => { this.callSession.on('hold', (e) => {
console.log( console.log('%c ___________hold: ', 'font-size: 22px; color: yellow;', e,);
'%c ___________hold: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('unhold', (e) => { this.callSession.on('unhold', (e) => {
console.log( console.log('%c ___________unhold: ', 'font-size: 22px; color: yellow;', e,);
'%c ___________unhold: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('muted', (e) => { this.callSession.on('muted', (e) => {
console.log('%c muted: ', 'font-size: 22px; color: yellow;', e); console.log('%c muted: ', 'font-size: 22px; color: yellow;', e);
...@@ -671,11 +558,7 @@ export class BoxDialer { ...@@ -671,11 +558,7 @@ export class BoxDialer {
console.log('%c unmuted: ', 'font-size: 22px; color: yellow;', e); console.log('%c unmuted: ', 'font-size: 22px; color: yellow;', e);
}); });
this.callSession.on('reinvite', (e) => { this.callSession.on('reinvite', (e) => {
console.log( console.log('%c reinvite: ', 'font-size: 22px; color: yellow;', e,);
'%c reinvite: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('update', (e) => { this.callSession.on('update', (e) => {
console.log('%c update: ', 'font-size: 22px; color: yellow;', e); console.log('%c update: ', 'font-size: 22px; color: yellow;', e);
...@@ -684,59 +567,28 @@ export class BoxDialer { ...@@ -684,59 +567,28 @@ export class BoxDialer {
console.log('%c refer: ', 'font-size: 22px; color: yellow;', e); console.log('%c refer: ', 'font-size: 22px; color: yellow;', e);
}); });
this.callSession.on('replaces', (e) => { this.callSession.on('replaces', (e) => {
console.log( console.log('%c replaces: ', 'font-size: 22px; color: yellow;', e,);
'%c replaces: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('sdp', (e) => { this.callSession.on('sdp', (e) => {
console.log('%c sdp: ', 'font-size: 22px; color: yellow;', e); console.log('%c sdp: ', 'font-size: 22px; color: yellow;', e);
}); });
this.callSession.on('icecandidate', (e) => { this.callSession.on('icecandidate', (e) => {
console.log( console.log('%c icecandidate: ', 'font-size: 22px; color: yellow;', e,);
'%c icecandidate: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('getusermediafailed', (e) => { this.callSession.on('getusermediafailed', (e) => {
console.log( console.log('%c getusermediafailed: ', 'font-size: 22px; color: yellow;', e,);
'%c getusermediafailed: ',
'font-size: 22px; color: yellow;',
e,
);
}); });
this.callSession.on('peerconnection: createofferfailed', (e) => { this.callSession.on('peerconnection: createofferfailed', (e) => {
console.log( console.log('%c peerconnection: createofferfailed: ', 'font-size: 22px; color: yellow;', e,);
'%c peerconnection: createofferfailed: ', });
'font-size: 22px; color: yellow;', this.callSession.on('peerconnection: setlocaldescriptionfailed', (e) => {
e, console.log('%c peerconnection: setlocaldescriptionfailed: ', 'font-size: 22px; color: yellow;', e,);
); },);
}); this.callSession.on('peerconnection: setremotedescriptionfailed', (e) => {
this.callSession.on( console.log('%c peerconnection: setremotedescriptionfailed: ', 'font-size: 22px; color: yellow;', e,);
'peerconnection: setlocaldescriptionfailed', },);
(e) => {
console.log(
'%c peerconnection: setlocaldescriptionfailed: ',
'font-size: 22px; color: yellow;',
e,
);
},
);
this.callSession.on(
'peerconnection: setremotedescriptionfailed',
(e) => {
console.log(
'%c peerconnection: setremotedescriptionfailed: ',
'font-size: 22px; color: yellow;',
e,
);
},
);
} }
}); });
this.ua.start(); this.ua.start();
} }
} catch (err) { } catch (err) {
...@@ -768,7 +620,7 @@ export class BoxDialer { ...@@ -768,7 +620,7 @@ export class BoxDialer {
return sipState && uiStates[sipState] ? uiStates[sipState] : ''; return sipState && uiStates[sipState] ? uiStates[sipState] : '';
} }
callBxMethods({ bxMethodName, bxFuncParams, callback }) { callBxMethods({bxMethodName, bxFuncParams, callback}) {
if (window.BX24 && window.BX24.placement) { if (window.BX24 && window.BX24.placement) {
window?.BX24.placement.call(bxMethodName, bxFuncParams, callback); window?.BX24.placement.call(bxMethodName, bxFuncParams, callback);
} else if (window.alovoicePhone && window.alovoicePhone.callMethods) { } else if (window.alovoicePhone && window.alovoicePhone.callMethods) {
...@@ -781,37 +633,33 @@ export class BoxDialer { ...@@ -781,37 +633,33 @@ export class BoxDialer {
closeBxCall() { closeBxCall() {
if (window.BX24 && window.BX24.placement) { if (window.BX24 && window.BX24.placement) {
window?.BX24.placement.call('CallCardClose', {}, () => {}); window?.BX24.placement.call('CallCardClose', {}, () => {
} else if ( });
window.alovoicePhone && } else if (window.alovoicePhone && window.alovoicePhone.callMethods && window.alovoicePhone.bodClose) {
window.alovoicePhone.callMethods &&
window.alovoicePhone.bodClose
) {
window?.alovoicePhone?.bodClose(); window?.alovoicePhone?.bodClose();
} }
} }
setGuiPhoneState({ stateCode, funcName, funcParam }) { setGuiPhoneState({stateCode, funcName, funcParam}) {
console.log('boxdialer_setGuiPhoneState_states: ', { stateCode, funcName, funcParam }) console.log('boxdialer_setGuiPhoneState_states: ', {stateCode, funcName, funcParam})
if (window?.alovoice_wsphone && !!stateCode?.length) { if (window?.alovoice_wsphone && !!stateCode?.length) {
console.log( console.log('this_getBxUiState_stateCode', stateCode, this.getBxUiState(stateCode),);
'this_getBxUiState_stateCode',
stateCode,
this.getBxUiState(stateCode),
);
this.callBxMethods({ this.callBxMethods({
bxMethodName: 'CallCardSetUiState', bxMethodName: 'CallCardSetUiState',
bxFuncParams: { uiState: this.getBxUiState(stateCode) }, bxFuncParams: {uiState: this.getBxUiState(stateCode)},
callback: (e) => { callback: (e) => {
console.log(e, `CallCardSetUiState method done ${e}`); console.log(e, `CallCardSetUiState method done ${e}`);
}, },
}); });
} else if ( } else if (!window?.alovoice_wsphone && !!funcName && this.onSipStateChange[funcName] !== 'undefined' && !!funcParam) {
!window?.alovoice_wsphone && console.log('setGuiPhoneState_for_alovoice_cloud_run_command: ', {
!stateCode?.length && stateCode, funcName, funcParam,
!!funcName && },
this.onSipStateChange[funcName] !== 'undefined' !window?.alovoice_wsphone,
) { !!funcName,
this.onSipStateChange[funcName] !== 'undefined',
!!funcParam
)
this.onSipStateChange[funcName](funcParam); this.onSipStateChange[funcName](funcParam);
} }
} }
...@@ -820,40 +668,32 @@ export class BoxDialer { ...@@ -820,40 +668,32 @@ export class BoxDialer {
console.log(`%c BXLOG:`, datas, 'background-color: red;'); console.log(`%c BXLOG:`, datas, 'background-color: red;');
} }
onSessionEvent({ type, event }) {} onSessionEvent({type, event}) {
}
selectUser() { selectUser() {
BX.Runtime.loadExtension('ui.entity-selector').then((exports) => { BX.Runtime.loadExtension('ui.entity-selector').then((exports) => {
const { Dialog, TagSelector } = exports; const {Dialog, TagSelector} = exports;
const dialog = new BX.UI.EntitySelector.Dialog({ const dialog = new BX.UI.EntitySelector.Dialog({
// targetNode: button, // targetNode: button,
enableSearch: true, enableSearch: true, multiple: false, context: 'MY_MODULE_CONTEXT', entities: [{
multiple: false,
context: 'MY_MODULE_CONTEXT',
entities: [
{
id: 'user', // пользователи id: 'user', // пользователи
options: { selectFields: ['ufPhoneInner'] }, options: {selectFields: ['ufPhoneInner']},
}, }, {
{
id: 'department', // структура компании: выбор только пользователей id: 'department', // структура компании: выбор только пользователей
}, },], events: {
],
events: {
'_Item:onSelect': (event) => { '_Item:onSelect': (event) => {
const { item } = event.getData(); const {item} = event.getData();
const dialog = event.getTarget(); const dialog = event.getTarget();
const selectedItems = dialog.getSelectedItems(); const selectedItems = dialog.getSelectedItems();
if (item.customData.get('ufPhoneInner')) { if (item.customData.get('ufPhoneInner')) {
this.transferButtonClick(item.customData.get('ufPhoneInner')); this.transferButtonClick(item.customData.get('ufPhoneInner'));
} }
}, }, get 'Item:onSelect'() {
get 'Item:onSelect'() {
return this['_Item:onSelect']; return this['_Item:onSelect'];
}, }, set 'Item:onSelect'(value) {
set 'Item:onSelect'(value) {
this['_Item:onSelect'] = value; this['_Item:onSelect'] = value;
}, },
}, },
...@@ -862,7 +702,7 @@ export class BoxDialer { ...@@ -862,7 +702,7 @@ export class BoxDialer {
}); });
} }
// call_connected; // call_connected;
setSipStateChangeCallback(callback, funcName) { setSipStateChangeCallback(callback, funcName) {
this.onSipStateChange[funcName] = callback.bind(this); this.onSipStateChange[funcName] = callback.bind(this);
} }
...@@ -884,19 +724,11 @@ export class BoxDialer { ...@@ -884,19 +724,11 @@ export class BoxDialer {
this.callDirection = 'out'; this.callDirection = 'out';
let phoneNumberString = phoneNumber.toString(); let phoneNumberString = phoneNumber.toString();
console.log('boxdialer_initialized_param: ', phoneNumber)
if (phoneNumberString.length) { if (phoneNumberString.length) {
this.onSipStateChange.phoneModal(false); this.onSipStateChange.phoneModal(false);
this.options.extraHeaders = [`X-ALOVOICE-EXTNUM: ${this.extnum}`]; this.options.extraHeaders = [`X-ALOVOICE-EXTNUM: ${this.extnum}`];
this.callSession = this.ua.call( this.callSession = this.ua.call('sip:' + phoneNumberString + '@' + this.sipDomain, this.options,);
'sip:' + phoneNumberString + '@' + this.sipDomain,
this.options,
);
// this.callSession.connection.addEventListener('addstream', (event) => {
// console.log('--== ss OUT STREAM: ');
// this.remoteAudio.srcObject = event.stream;
// this.remoteAudio.play();
// });
} else { } else {
toast.error('Do not correct number', { toast.error('Do not correct number', {
style: { style: {
...@@ -908,7 +740,7 @@ export class BoxDialer { ...@@ -908,7 +740,7 @@ export class BoxDialer {
} }
skipButtonClick() { skipButtonClick() {
this.onSoundType({ type: 'ring', bool: false }); this.onSoundType({type: 'ring', bool: false});
this.hangupButtonClick(); this.hangupButtonClick();
} }
...@@ -922,17 +754,17 @@ export class BoxDialer { ...@@ -922,17 +754,17 @@ export class BoxDialer {
muteButtonClick() { muteButtonClick() {
let { audio } = this.callSession.isMuted(); let {audio} = this.callSession.isMuted();
if (audio) { if (audio) {
this.callSession.unmute(); this.callSession.unmute();
console.log('muteButtonClick_unmute'); console.log('muteButtonClick_unmute');
this.onSipStateChange['setCallEvents']({ callMute: false }); this.onSipStateChange['setCallEvents']({callMute: false});
} else { } else {
this.callSession.mute(); this.callSession.mute();
console.log('muteButtonClick_mute'); console.log('muteButtonClick_mute');
this.onSipStateChange['setCallEvents']({ callMute: true }); this.onSipStateChange['setCallEvents']({callMute: true});
} }
} }
...@@ -948,15 +780,15 @@ export class BoxDialer { ...@@ -948,15 +780,15 @@ export class BoxDialer {
holdButtonClick() { holdButtonClick() {
let { local } = this.callSession.isOnHold(); let {local} = this.callSession.isOnHold();
console.log('local: ', local); console.log('local: ', local);
if (local) { if (local) {
this.callSession.unhold(); this.callSession.unhold();
this.onSipStateChange['setCallEvents']({ callHold: false }); this.onSipStateChange['setCallEvents']({callHold: false});
} else { } else {
this.callSession.hold(); this.callSession.hold();
this.onSipStateChange['setCallEvents']({ callHold: true }); this.onSipStateChange['setCallEvents']({callHold: true});
} }
} }
...@@ -965,18 +797,12 @@ export class BoxDialer { ...@@ -965,18 +797,12 @@ export class BoxDialer {
} }
hangupButtonClick() { hangupButtonClick() {
this.onSoundType({ type: 'ring', bool: false }); this.onSoundType({type: 'ring', bool: false});
this.onSipStateChange.innerCallerModal({ this.onSipStateChange.innerCallerModal({
bool: false, bool: false, type: null, from: '',
type: null, });
from: '', console.log('hangupButtonClick========-----------', this.callSession._status,);
}); if (this.callSession && this.callSession._status != '8') this.callSession.terminate();
console.log(
'hangupButtonClick========-----------',
this.callSession._status,
);
if (this.callSession && this.callSession._status != '8')
this.callSession.terminate();
} }
transferButtonClick(number) { transferButtonClick(number) {
......
src/root/index.jsx
View file @ 41c692c1
...@@ -11,7 +11,6 @@ import InnerCaller from '../components/InnerCaller'; ...@@ -11,7 +11,6 @@ import InnerCaller from '../components/InnerCaller';
import {useConfigHoldMute} from "../storage" import {useConfigHoldMute} from "../storage"
import SettingComponent from "../components/setting" import SettingComponent from "../components/setting"
import {useColorConfig} from "../storage/globalColorConfig" import {useColorConfig} from "../storage/globalColorConfig"
// import { contextModalEventProperty } from '../context/modalEventProperty';
const Root = ({wsphonedata, onSetDnd, setWsphonedata, callMethod}) => { const Root = ({wsphonedata, onSetDnd, setWsphonedata, callMethod}) => {
const boxDialer = window.BoxDialer; const boxDialer = window.BoxDialer;
...@@ -178,14 +177,6 @@ const Root = ({wsphonedata, onSetDnd, setWsphonedata, callMethod}) => { ...@@ -178,14 +177,6 @@ const Root = ({wsphonedata, onSetDnd, setWsphonedata, callMethod}) => {
extnums={wsphonedata.extnums} extnums={wsphonedata.extnums}
/> />
{/*
incoming
outgoing
connectingIncoming
connectingOutgoing
connected
*/}
<Modal <Modal
className='tailwindGlobalCss' className='tailwindGlobalCss'
hidden={modalState.bool} hidden={modalState.bool}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Technounit-GROUP 2023