From 3a4cbd47d87c80211c3c70b1db9fce718cfb4c03 Mon Sep 17 00:00:00 2001 From: Harshvardhan Baldwa Date: Fri, 13 Sep 2019 04:11:56 +0530 Subject: [PATCH] added push notifications!!! --- package-lock.json | 103 +++++++++++++++++++++++++++++++++++++++ package.json | 1 + src/app/app.component.ts | 4 ++ src/app/app.module.ts | 5 +- src/app/app.service.ts | 42 +++++++++++++++- 5 files changed, 153 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index d8ff6ff..78c1ade 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6668,6 +6668,109 @@ "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==", "dev": true }, + "ngx-push-notifications": { + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/ngx-push-notifications/-/ngx-push-notifications-7.0.2.tgz", + "integrity": "sha512-nB6ArHAOtA31s7kO6852VikAHQU4NZEzovXj7CIkPLo4aYwzfm7rLGunnPnGs7ZO9iE1EujU2C1wjCDSpnWZnQ==", + "requires": { + "@angular/animations": "~7.2.0", + "@angular/common": "~7.2.0", + "@angular/compiler": "~7.2.0", + "@angular/core": "~7.2.0", + "@angular/forms": "~7.2.0", + "@angular/platform-browser": "~7.2.0", + "@angular/platform-browser-dynamic": "~7.2.0", + "@angular/router": "~7.2.0", + "core-js": "^2.5.4", + "rxjs": "~6.3.3", + "tslib": "^1.9.0", + "zone.js": "~0.8.26" + }, + "dependencies": { + "@angular/animations": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-7.2.15.tgz", + "integrity": "sha512-8oBt3HLgd2+kyJHUgsd7OzKCCss67t2sch15XNoIWlOLfxclqU+EfFE6t/vCzpT8/+lpZS6LU9ZrTnb+UBj5jg==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/common": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/common/-/common-7.2.15.tgz", + "integrity": "sha512-2b5JY2HWVHCf3D1GZjmde7jdAXSTXkYtmjLtA9tQkjOOTr80eHpNSujQqnzb97dk9VT9OjfjqTQd7K3pxZz8jw==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/compiler": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-7.2.15.tgz", + "integrity": "sha512-5yb4NcLk8GuXkYf7Dcor4XkGueYp4dgihzDmMjYDUrV0NPhubKlr+SwGtLOtzgRBWJ1I2bO0S3zwa0q0OgIPOw==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/core": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/core/-/core-7.2.15.tgz", + "integrity": "sha512-XsuYm0jEU/mOqwDOk2utThv8J9kESkAerfuCHClE9rB2TtHUOGCfekF7lJWqjjypu6/J9ygoPFo7hdAE058ZGg==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/forms": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-7.2.15.tgz", + "integrity": "sha512-p0kcIQLtBBC1qeTA6M3nOuXf/k91E80FKquVM9zEsO2kDjI0oZJVfFYL2UMov5samlJOPN+t6lRHEIUa7ApPsw==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/platform-browser": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-7.2.15.tgz", + "integrity": "sha512-aYgmPsbC9Tvp9vmKWD8voeAp4crwCay7/D6lM3ClEe2EeK934LuEXq3/uczMrFVbnIX7BBIo8fh03Tl7wbiGPw==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/platform-browser-dynamic": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-7.2.15.tgz", + "integrity": "sha512-UL2PqhzXMD769NQ6Lh6pxlBDKvN9Qol3XLRFil80lwJ1GRW16ITeYbCamcafIH2GOyd88IhmYcbMfUQ/6q4MMQ==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@angular/router": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@angular/router/-/router-7.2.15.tgz", + "integrity": "sha512-qAubRJRQanguUqJQ76J9GSZ4JFtoyhJKRmX5P23ANZJXpB6YLzF2fJmOGi+E6cV8F0tKBMEq1pjxFTisx0MXwQ==", + "requires": { + "tslib": "^1.9.0" + } + }, + "core-js": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.9.tgz", + "integrity": "sha512-HOpZf6eXmnl7la+cUdMnLvUxKNqLUzJvgIziQ0DiF3JwSImNphIqdGqzj6hIKyX04MmV0poclQ7+wjWvxQyR2A==" + }, + "rxjs": { + "version": "6.3.3", + "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.3.3.tgz", + "integrity": "sha512-JTWmoY9tWCs7zvIk/CvRjhjGaOd+OVBM987mxFo+OW66cGpdKjZcpmc74ES1sB//7Kl/PAe8+wEakuhG4pcgOw==", + "requires": { + "tslib": "^1.9.0" + } + }, + "zone.js": { + "version": "0.8.29", + "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.8.29.tgz", + "integrity": "sha512-mla2acNCMkWXBD+c+yeUrBUrzOxYMNFdQ6FGfigGGtEVBPJx07BQeJekjt9DmH1FtZek4E9rE1eRR9qQpxACOQ==" + } + } + }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", diff --git a/package.json b/package.json index d9f7b07..7e58aa1 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "lodash": "^4.17.15", "mongoose": "^5.6.9", "mongoose-unique-validator": "^2.0.3", + "ngx-push-notifications": "^7.0.2", "rxjs": "~6.4.0", "tslib": "^1.9.0", "zone.js": "~0.9.1" diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 06b7592..1b15c91 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -51,6 +51,10 @@ export class AppComponent implements OnInit, OnDestroy { }); } }); + const isGranted = this.ladderService.notifications.isPermissionGranted; + if (!isGranted) { + this.ladderService.notifications.requestPermission(); + } } ngOnDestroy() { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 72d5d9b..7fb0e75 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,5 +1,8 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; + +import { PushNotificationService } from 'ngx-push-notifications'; + import { AmazingTimePickerModule } from 'amazing-time-picker'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { MatToolbarModule, @@ -79,7 +82,7 @@ import { AuthInterceptor } from './auth/auth-interceptor'; MatProgressSpinnerModule, MatSnackBarModule, ], - providers: [{ provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }], + providers: [{ provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }, PushNotificationService], bootstrap: [AppComponent] }) export class AppModule { } diff --git a/src/app/app.service.ts b/src/app/app.service.ts index 3497617..747102c 100644 --- a/src/app/app.service.ts +++ b/src/app/app.service.ts @@ -11,6 +11,8 @@ import { Profile } from 'selenium-webdriver/firefox'; import { MatSnackBar } from '@angular/material'; import { environment } from '../environments/environment'; +import { PushNotificationOptions, PushNotificationService } from 'ngx-push-notifications'; + const BackendURLNotifications = environment.apiUrl + 'notification/'; const BackendURLLadder = environment.apiUrl + 'table/'; const BackendURLChallenge = environment.apiUrl + 'challenge/'; @@ -29,12 +31,14 @@ export class LadderService { private sportsUpdate = new Subject(); private challengesN: number; + private challengesNOld: number; private challengesUpdatesN = new Subject(); private challengesP: number; private challengesUpdatesP = new Subject(); private challengesC: number; + private challengesCOld: number; private challengesUpdatesC = new Subject(); @@ -56,7 +60,12 @@ export class LadderService { private player1: boolean; private player1Sub = new Subject(); - constructor(private http: HttpClient, private router: Router, private snackBar: MatSnackBar) {} + constructor( + private http: HttpClient, + private router: Router, + private snackBar: MatSnackBar, + public notifications: PushNotificationService + ) { } // Notifications getNumberChallenge(id: string) { @@ -64,7 +73,13 @@ export class LadderService { this.http.post(BackendURLNotifications + 'challengesN/', myId) .subscribe((notification) => { this.challengesN = Number(notification); + // tslint:disable: triple-equals + if (this.challengesN != this.challengesNOld && this.challengesNOld != undefined) { + this.myNotifi('New Challenge', 'You got a new challenge!', '/challenges'); + } this.challengesUpdatesN.next(this.challengesN); + this.challengesNOld = this.challengesN; + }); } @@ -90,7 +105,11 @@ export class LadderService { this.http.post(BackendURLNotifications + 'challengesC/', myId) .subscribe((notification) => { this.challengesC = Number(notification); + if (this.challengesC != this.challengesCOld && this.challengesCOld != undefined) { + this.myNotifi('Confirm Result', 'You got a new confirmation!', '/confirmation/confirm'); + } this.challengesUpdatesC.next(this.challengesC); + this.challengesCOld = this.challengesC; }); } @@ -336,4 +355,25 @@ export class LadderService { this.snackBar.open(message, action, { duration: 2000 }); } +// Notifications Bitches!!! + myNotifi(title: string, body: string, link: string) { + const options = new PushNotificationOptions(); + options.body = body; + + this.notifications.create(title, options).subscribe((notif) => { + if (notif.event.type === 'show') { + setTimeout(() => { + notif.notification.close(); + }, 10000); + } + if (notif.event.type === 'click') { + this.router.navigate([link]); + notif.notification.close(); + } + }, + (err) => { + console.log(err); + }); + } + }