@vgroup/dialbox 0.0.62 → 0.0.64
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/dialbox.module.mjs +29 -3
- package/esm2020/lib/service/Notification.service.mjs +14 -5
- package/esm2020/lib/service/app-initializer.service.mjs +88 -0
- package/esm2020/lib/service/twilio.service.mjs +74 -18
- package/fesm2015/vgroup-dialbox.mjs +205 -24
- package/fesm2015/vgroup-dialbox.mjs.map +1 -1
- package/fesm2020/vgroup-dialbox.mjs +196 -24
- package/fesm2020/vgroup-dialbox.mjs.map +1 -1
- package/lib/service/app-initializer.service.d.ts +19 -0
- package/lib/service/twilio.service.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __awaiter } from 'tslib';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { Injectable, EventEmitter, Component, Input, Output, ViewChild, Inject, NgModule } from '@angular/core';
|
|
3
|
+
import { Injectable, EventEmitter, Component, Input, Output, ViewChild, Inject, PLATFORM_ID, APP_INITIALIZER, Injector, NgModule } from '@angular/core';
|
|
4
4
|
import swal from 'sweetalert2';
|
|
5
5
|
import { AsYouType } from 'libphonenumber-js';
|
|
6
6
|
import { throwError, BehaviorSubject, interval, Subscription } from 'rxjs';
|
|
@@ -13,7 +13,7 @@ import { MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|
|
13
13
|
import * as i5 from '@angular/router';
|
|
14
14
|
import { RouterLink, RouterModule } from '@angular/router';
|
|
15
15
|
import * as i4 from '@angular/common';
|
|
16
|
-
import { CommonModule } from '@angular/common';
|
|
16
|
+
import { isPlatformBrowser, CommonModule } from '@angular/common';
|
|
17
17
|
import * as i3 from '@angular/forms';
|
|
18
18
|
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
19
19
|
import { BrowserModule } from '@angular/platform-browser';
|
|
@@ -1302,13 +1302,23 @@ class NotificationService {
|
|
|
1302
1302
|
if ('serviceWorker' in navigator) {
|
|
1303
1303
|
navigator.serviceWorker.addEventListener('message', this.handleServiceWorkerMessage.bind(this));
|
|
1304
1304
|
}
|
|
1305
|
+
// Listen for incoming calls from Twilio service
|
|
1306
|
+
this.twilioService.currentCall.subscribe((call) => {
|
|
1307
|
+
if (call) {
|
|
1308
|
+
this.showNotification(call);
|
|
1309
|
+
}
|
|
1310
|
+
});
|
|
1305
1311
|
}
|
|
1306
1312
|
showNotification(callData) {
|
|
1307
|
-
|
|
1313
|
+
var _a;
|
|
1314
|
+
if (!callData)
|
|
1315
|
+
return;
|
|
1308
1316
|
this.twilioCallData = callData;
|
|
1309
|
-
const incomingNumber = callData.parameters.From;
|
|
1310
|
-
const
|
|
1311
|
-
const
|
|
1317
|
+
const incomingNumber = (_a = callData.parameters) === null || _a === void 0 ? void 0 : _a.From;
|
|
1318
|
+
const customParams = callData.customParameters || new Map();
|
|
1319
|
+
const callerName = customParams.get('name') || incomingNumber;
|
|
1320
|
+
const callerImage = customParams.get('image') || '';
|
|
1321
|
+
this.twilioAuthId = customParams.get('twilioAuthId');
|
|
1312
1322
|
if (('serviceWorker' in navigator)) {
|
|
1313
1323
|
navigator.serviceWorker.ready.then((registration) => {
|
|
1314
1324
|
const options = {
|
|
@@ -1393,26 +1403,82 @@ class TwilioService {
|
|
|
1393
1403
|
initializeTwilioDevice() {
|
|
1394
1404
|
if (this.token) {
|
|
1395
1405
|
this.extensionService.getIncomingCallToken().subscribe((data) => {
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
}
|
|
1406
|
+
try {
|
|
1407
|
+
this.incomingCallToken = data.token;
|
|
1408
|
+
localStorage.setItem('in-token', data.token);
|
|
1409
|
+
// Destroy existing device if any
|
|
1410
|
+
if (this.device) {
|
|
1411
|
+
this.device.destroy();
|
|
1412
|
+
}
|
|
1413
|
+
this.device = new Device(this.incomingCallToken, {
|
|
1414
|
+
allowIncomingWhileBusy: true,
|
|
1415
|
+
closeProtection: true
|
|
1416
|
+
});
|
|
1417
|
+
// Register the device
|
|
1418
|
+
this.device.register();
|
|
1419
|
+
// Set up device event listeners
|
|
1420
|
+
this.setupDeviceListeners();
|
|
1421
|
+
console.log('Twilio device initialized and registered');
|
|
1422
|
+
}
|
|
1423
|
+
catch (error) {
|
|
1424
|
+
console.error('Error initializing Twilio device:', error);
|
|
1425
|
+
}
|
|
1426
|
+
}, (error) => {
|
|
1427
|
+
console.error('Error getting Twilio token:', error);
|
|
1413
1428
|
});
|
|
1414
1429
|
}
|
|
1415
1430
|
}
|
|
1431
|
+
setupDeviceListeners() {
|
|
1432
|
+
if (!this.device)
|
|
1433
|
+
return;
|
|
1434
|
+
// Incoming call handler
|
|
1435
|
+
this.device.on('incoming', (call) => {
|
|
1436
|
+
console.log('Incoming call from:', call.parameters['From']);
|
|
1437
|
+
// Update call state
|
|
1438
|
+
this.currentCall.next(call);
|
|
1439
|
+
this.callType.next('INCOMING');
|
|
1440
|
+
this.currentCallState.next('incoming');
|
|
1441
|
+
// Show notification and open dialpad
|
|
1442
|
+
this.notificationSerivce.showNotification(call);
|
|
1443
|
+
this.openInProgressDialpad.next(true);
|
|
1444
|
+
// Set up call event listeners
|
|
1445
|
+
call.on('accept', () => {
|
|
1446
|
+
console.log('Call accepted');
|
|
1447
|
+
this.currentCallState.next('in-progress');
|
|
1448
|
+
this.isIncomingCallPicked.next(true);
|
|
1449
|
+
});
|
|
1450
|
+
call.on('disconnect', () => {
|
|
1451
|
+
console.log('Call disconnected');
|
|
1452
|
+
this.currentCallState.next('none');
|
|
1453
|
+
this.currentCall.next(null);
|
|
1454
|
+
this.isIncomingCallPicked.next(false);
|
|
1455
|
+
this.openInProgressDialpad.next(false);
|
|
1456
|
+
});
|
|
1457
|
+
call.on('cancel', () => {
|
|
1458
|
+
console.log('Call cancelled');
|
|
1459
|
+
this.currentCallState.next('none');
|
|
1460
|
+
this.currentCall.next(null);
|
|
1461
|
+
this.isIncomingCallPicked.next(false);
|
|
1462
|
+
this.openInProgressDialpad.next(false);
|
|
1463
|
+
});
|
|
1464
|
+
});
|
|
1465
|
+
// Error handling
|
|
1466
|
+
this.device.on('error', (error) => {
|
|
1467
|
+
console.error('Twilio Device Error:', error);
|
|
1468
|
+
// Attempt to reinitialize on error
|
|
1469
|
+
if (error.code === 31201) { // Invalid token error
|
|
1470
|
+
console.log('Attempting to refresh Twilio token...');
|
|
1471
|
+
this.initializeTwilioDevice();
|
|
1472
|
+
}
|
|
1473
|
+
});
|
|
1474
|
+
// Device ready
|
|
1475
|
+
this.device.on('registered', () => {
|
|
1476
|
+
console.log('Twilio device registered and ready');
|
|
1477
|
+
});
|
|
1478
|
+
this.device.on('unregistered', () => {
|
|
1479
|
+
console.log('Twilio device unregistered');
|
|
1480
|
+
});
|
|
1481
|
+
}
|
|
1416
1482
|
// onIncomingCall(){
|
|
1417
1483
|
// this.device.on('incoming', (call:any) => {
|
|
1418
1484
|
// console.log(call);
|
|
@@ -3201,6 +3267,96 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
3201
3267
|
}] }];
|
|
3202
3268
|
} });
|
|
3203
3269
|
|
|
3270
|
+
class AppInitializerService {
|
|
3271
|
+
constructor(injector, extensionService, router, platformId) {
|
|
3272
|
+
this.injector = injector;
|
|
3273
|
+
this.extensionService = extensionService;
|
|
3274
|
+
this.router = router;
|
|
3275
|
+
this.platformId = platformId;
|
|
3276
|
+
}
|
|
3277
|
+
getTwilioService() {
|
|
3278
|
+
if (!this.twilioService) {
|
|
3279
|
+
this.twilioService = this.injector.get(TwilioService);
|
|
3280
|
+
}
|
|
3281
|
+
return this.twilioService;
|
|
3282
|
+
}
|
|
3283
|
+
initializeApp() {
|
|
3284
|
+
return new Promise((resolve) => {
|
|
3285
|
+
if (isPlatformBrowser(this.platformId)) {
|
|
3286
|
+
this.initializeServices().then(() => {
|
|
3287
|
+
resolve();
|
|
3288
|
+
});
|
|
3289
|
+
}
|
|
3290
|
+
else {
|
|
3291
|
+
resolve();
|
|
3292
|
+
}
|
|
3293
|
+
});
|
|
3294
|
+
}
|
|
3295
|
+
initializeServices() {
|
|
3296
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
3297
|
+
try {
|
|
3298
|
+
// Initialize Twilio device
|
|
3299
|
+
yield this.initializeTwilio();
|
|
3300
|
+
// Fetch initial data
|
|
3301
|
+
yield this.fetchInitialData();
|
|
3302
|
+
console.log('App initialization complete');
|
|
3303
|
+
}
|
|
3304
|
+
catch (error) {
|
|
3305
|
+
console.error('Error during app initialization:', error);
|
|
3306
|
+
}
|
|
3307
|
+
});
|
|
3308
|
+
}
|
|
3309
|
+
initializeTwilio() {
|
|
3310
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
3311
|
+
const token = localStorage.getItem('ext_token');
|
|
3312
|
+
if (token) {
|
|
3313
|
+
try {
|
|
3314
|
+
const twilioService = this.getTwilioService();
|
|
3315
|
+
yield twilioService.initializeTwilioDevice();
|
|
3316
|
+
}
|
|
3317
|
+
catch (error) {
|
|
3318
|
+
console.error('Error initializing Twilio:', error);
|
|
3319
|
+
}
|
|
3320
|
+
}
|
|
3321
|
+
});
|
|
3322
|
+
}
|
|
3323
|
+
fetchInitialData() {
|
|
3324
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
3325
|
+
const token = localStorage.getItem('ext_token');
|
|
3326
|
+
if (token) {
|
|
3327
|
+
try {
|
|
3328
|
+
// Fetch caller ID
|
|
3329
|
+
const response = yield this.extensionService.fetchCallerId(token).toPromise();
|
|
3330
|
+
if (response && typeof response === 'object' && 'status' in response) {
|
|
3331
|
+
const callerIdRes = response;
|
|
3332
|
+
if (callerIdRes.status === 200) {
|
|
3333
|
+
const callerId = callerIdRes.callerid || 'Not set';
|
|
3334
|
+
localStorage.setItem('callerID', callerId);
|
|
3335
|
+
this.extensionService.changeMessage(callerId);
|
|
3336
|
+
}
|
|
3337
|
+
}
|
|
3338
|
+
}
|
|
3339
|
+
catch (error) {
|
|
3340
|
+
console.error('Error fetching initial data:', error);
|
|
3341
|
+
}
|
|
3342
|
+
}
|
|
3343
|
+
});
|
|
3344
|
+
}
|
|
3345
|
+
}
|
|
3346
|
+
AppInitializerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AppInitializerService, deps: [{ token: i0.Injector }, { token: ExtensionService }, { token: i5.Router }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3347
|
+
AppInitializerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AppInitializerService, providedIn: 'root' });
|
|
3348
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AppInitializerService, decorators: [{
|
|
3349
|
+
type: Injectable,
|
|
3350
|
+
args: [{
|
|
3351
|
+
providedIn: 'root'
|
|
3352
|
+
}]
|
|
3353
|
+
}], ctorParameters: function () {
|
|
3354
|
+
return [{ type: i0.Injector }, { type: ExtensionService }, { type: i5.Router }, { type: Object, decorators: [{
|
|
3355
|
+
type: Inject,
|
|
3356
|
+
args: [PLATFORM_ID]
|
|
3357
|
+
}] }];
|
|
3358
|
+
} });
|
|
3359
|
+
|
|
3204
3360
|
class DialboxModule {
|
|
3205
3361
|
}
|
|
3206
3362
|
DialboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
@@ -3217,7 +3373,19 @@ DialboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
|
|
|
3217
3373
|
IncomingCallComponent,
|
|
3218
3374
|
CallProgressComponent,
|
|
3219
3375
|
CallerIdDialogComponent] });
|
|
3220
|
-
DialboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialboxModule,
|
|
3376
|
+
DialboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialboxModule, providers: [
|
|
3377
|
+
{
|
|
3378
|
+
provide: APP_INITIALIZER,
|
|
3379
|
+
useFactory: (injector) => {
|
|
3380
|
+
return () => {
|
|
3381
|
+
const appInitializer = injector.get(AppInitializerService);
|
|
3382
|
+
return appInitializer.initializeApp();
|
|
3383
|
+
};
|
|
3384
|
+
},
|
|
3385
|
+
deps: [Injector],
|
|
3386
|
+
multi: true
|
|
3387
|
+
}
|
|
3388
|
+
], imports: [CommonModule,
|
|
3221
3389
|
FormsModule,
|
|
3222
3390
|
ReactiveFormsModule,
|
|
3223
3391
|
HttpClientModule,
|
|
@@ -3246,6 +3414,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
3246
3414
|
IncomingCallComponent,
|
|
3247
3415
|
CallProgressComponent,
|
|
3248
3416
|
CallerIdDialogComponent,
|
|
3417
|
+
],
|
|
3418
|
+
providers: [
|
|
3419
|
+
{
|
|
3420
|
+
provide: APP_INITIALIZER,
|
|
3421
|
+
useFactory: (injector) => {
|
|
3422
|
+
return () => {
|
|
3423
|
+
const appInitializer = injector.get(AppInitializerService);
|
|
3424
|
+
return appInitializer.initializeApp();
|
|
3425
|
+
};
|
|
3426
|
+
},
|
|
3427
|
+
deps: [Injector],
|
|
3428
|
+
multi: true
|
|
3429
|
+
}
|
|
3249
3430
|
]
|
|
3250
3431
|
}]
|
|
3251
3432
|
}] });
|