/pushapi: Auto stash before merge of "theslby/pushapi" and "development"
Push Frontend
This commit is contained in:
parent
59cbc920c2
commit
ff0fe0202f
16 changed files with 528 additions and 44 deletions
0
src/app/push/push.component.css
Normal file
0
src/app/push/push.component.css
Normal file
|
@ -1,4 +1,3 @@
|
|||
<push-notification
|
||||
title="hello"
|
||||
body="hi">
|
||||
</push-notification>
|
||||
<button (click)="subscribeToPush()">Subscribe To Push</button>
|
||||
<button (click)="unsubscribeFromPush()">Unsubscribe From Push</button>
|
||||
{{target}}
|
||||
|
|
25
src/app/push/push.component.spec.ts
Normal file
25
src/app/push/push.component.spec.ts
Normal file
|
@ -0,0 +1,25 @@
|
|||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PushComponent } from './push.component';
|
||||
|
||||
describe('PushComponent', () => {
|
||||
let component: PushComponent;
|
||||
let fixture: ComponentFixture<PushComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ PushComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PushComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
|
@ -1,19 +1,101 @@
|
|||
import { Component, OnInit} from '@angular/core'
|
||||
import { PushNotificationComponent } from 'ng2-notifications/ng2-notifications';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ConfigService } from './../config.service';
|
||||
import { PushService } from './../push.service';
|
||||
import { SwPush } from '@angular/service-worker';
|
||||
import "rxjs/Rx";
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'push',
|
||||
selector: 'app-push',
|
||||
templateUrl: './push.component.html',
|
||||
styleUrls: ['./push.component.css']
|
||||
})
|
||||
export class PushComponent implements OnInit {
|
||||
|
||||
})
|
||||
private VAPID_PUBLIC_KEY: string;
|
||||
|
||||
tweets = []
|
||||
target = ''
|
||||
|
||||
|
||||
export class PushComponent {
|
||||
|
||||
constructor(){}
|
||||
|
||||
ngOnInit(){
|
||||
|
||||
constructor(private pushService: PushService, private configService: ConfigService, private swPush: SwPush) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.VAPID_PUBLIC_KEY = this.configService.get('VAPID_PUBLIC_KEY')
|
||||
}
|
||||
|
||||
subscribeToPush() {
|
||||
|
||||
// Requesting messaging service to subscribe current client (browser)
|
||||
|
||||
this.swPush.requestSubscription({
|
||||
serverPublicKey: this.VAPID_PUBLIC_KEY
|
||||
})
|
||||
.then(pushSubscription => {
|
||||
|
||||
// Passing subscription object to our backend
|
||||
console.log(pushSubscription.endpoint)
|
||||
this.target = JSON.stringify(pushSubscription);
|
||||
console.log(pushSubscription.getKey)
|
||||
this.pushService.addSubscriber(pushSubscription)
|
||||
.subscribe(
|
||||
|
||||
res => {
|
||||
console.log('[App] Add subscriber request answer', res)
|
||||
},
|
||||
err => {
|
||||
console.log('[App] Add subscriber request failed', err)
|
||||
}
|
||||
|
||||
)
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
showNotification(){
|
||||
this.swPush.messages.subscribe(message => {
|
||||
console.log('[App] Push message received', message)
|
||||
})
|
||||
}
|
||||
|
||||
unsubscribeFromPush(){
|
||||
|
||||
// Get active subscription
|
||||
|
||||
this.swPush.subscription
|
||||
.take(1)
|
||||
.subscribe(pushSubscription => {
|
||||
|
||||
console.log('[App] pushSubscription', pushSubscription)
|
||||
|
||||
// Delete the subscription from the backend
|
||||
|
||||
this.pushService.deleteSubscriber(pushSubscription)
|
||||
.subscribe(
|
||||
|
||||
res => {
|
||||
console.log('[App] Delete subscriber request answer', res)
|
||||
// Unsubscribe current client (browser)
|
||||
|
||||
pushSubscription.unsubscribe()
|
||||
.then(success => {
|
||||
console.log('[App] Unsubscription successful', success)
|
||||
})
|
||||
.catch(err => {
|
||||
console.log('[App] Unsubscription failed', err)
|
||||
})
|
||||
|
||||
},
|
||||
err => {
|
||||
console.log('[App] Delete subscription request failed', err)
|
||||
}
|
||||
|
||||
)
|
||||
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue