110swag / flashy-frontend

Commit cd28f392cbd14691ab6aa86691cae74fcf384db5

Authored by Rohan Rangray 2015-06-02 16:24:42 -0700

Got notifications working. Next order of business: enable subscribing only on mobile phones

Showing 3 changed files with 52 additions and 78 deletions Side-by-side Diff

scripts/SettingsController.js
scripts/service-worker.js
service-worker.js

...	...	@@ -11,7 +11,7 @@
11	11	console.log('chrome');
12	12
13	13	console.log('executing things outside of module');
14		- var PUSH_SERVER_URL = '/app/subscribe/';
	14	+ var PUSH_SERVER_URL = '/api/subscribe/';
15	15
16	16	function onPushSubscription(pushSubscription) {
17	17	console.log('pushSubscription = ', pushSubscription.endpoint);
18	18
19	19
...	...	@@ -20,37 +20,11 @@
20	20	// In this demo we just use send these values to
21	21	// our server via XHR which sends a push message.
22	22
23		- console.log('pushSubscription: ', pushSubscription);
24		-
25		- // Code to handle the XHR
26		- var formData = new FormData();
27		-
28	23	var endpoint = pushSubscription.endpoint;
	24	+ var subscriptionId = pushSubscription.subscriptionId;
29	25
30		- if ('subscriptionId' in pushSubscription) {
31		- // Make the endpoint always contain the subscriptionId
32		- // so the server is always consistent
33		- if (!endpoint.includes(pushSubscription.subscriptionId)) {
34		- endpoint += '/' + pushSubscription.subscriptionId;
35		- }
36		- }
37		-
38		- formData.append('registration_id', endpoint);
39		- console.log('registration_id: ', endpoint);
40		-
41		- console.log('tryna push');
42		-
43		- var req = new XMLHttpRequest();
44		- req.addEventListener('load', function(response) {
45		- console.log('response: ', response);
46		- });
47		- req.addEventListener('error', function(error) {
48		- console.log('error: ', error);
49		- });
50		- req.open('POST', PUSH_SERVER_URL);
51		- req.send(formData);
52		- console.log('pushed?');
53		-
	26	+ console.log('registration_id: ', subscriptionId);
	27	+ $http.post(PUSH_SERVER_URL, {'registration_id': subscriptionId});
54	28	}
55	29
56	30	function subscribeDevice() {
...	...	@@ -238,7 +212,7 @@
238	212	});
239	213	}
240	214
241		-// Once the service worker is registered set the initial state
	215	+ // Once the service worker is registered set the initial state
242	216	function initialiseState() {
243	217	// Is the Permissions API supported
244	218	if ('permissions' in navigator) {
...	...	@@ -265,7 +239,7 @@
265	239
266	240	// Check that service workers are supported
267	241	if ('serviceWorker' in navigator) {
268		- navigator.serviceWorker.register('scripts/service-worker.js')
	242	+ navigator.serviceWorker.register('service-worker.js')
269	243	.then(initialiseState);
270	244	} else {
271	245	// Service Workers aren't supported so you should hide the push UI

1		-'use strict';
2		-
3		-function showNotification(title, body, icon, data) {
4		- var notificationOptions = {
5		- body: body,
6		- icon: icon ? icon : 'images/touch/chrome-touch-icon-192x192.png',
7		- tag: 'simple-push-demo-notification',
8		- data: data
9		- };
10		- if (self.registration.showNotification) {
11		- self.registration.showNotification(title, notificationOptions);
12		- return;
13		- } else {
14		- new Notification(title, notificationOptions);
15		- }
16		-}
17		-
18		-self.addEventListener('push', function(event) {
19		- console.log('Received a push message', event);
20		-
21		- // Since this is no payload data with the first version
22		- // of Push notifications, here we'll grab some data from
23		- // an API and use it to populate a notification
24		- var title = 'You have cards waiting to be reviewed!';
25		- var message = 'check yo cards m8';
26		- var icon = 'flashy.ico';
27		- var notificationTag = 'simple-push-demo-notification';
28		-
29		- // Add this to the data of the notification
30		- var urlToOpen = '/api/subscribe/';
31		-
32		- var notificationFilter = {
33		- tag: 'simple-push-demo-notification'
34		- };
35		- var notificationData = {
36		- url: urlToOpen
37		- };
38		- return showNotification(title, message, icon, notificationData);
39		-});
40		-
41		-self.addEventListener('notificationclick', function(event) {
42		- console.log('On notification click: ', event);
43		-
44		- var url = event.notification.data.url;
45		- event.waitUntil(clients.openWindow(url));
46		-});

	1	+'use strict';
	2	+
	3	+function showNotification(title, body, icon, data) {
	4	+ var notificationOptions = {
	5	+ body: body,
	6	+ icon: icon ? icon : '/flashy.ico',
	7	+ tag: 'simple-push-demo-notification',
	8	+ data: data
	9	+ };
	10	+ if (self.registration.showNotification) {
	11	+ self.registration.showNotification(title, notificationOptions);
	12	+ return;
	13	+ } else {
	14	+ new Notification(title, notificationOptions);
	15	+ }
	16	+}
	17	+
	18	+self.addEventListener('push', function(event) {
	19	+ console.log('Received a push message', event);
	20	+
	21	+ // Since this is no payload data with the first version
	22	+ // of Push notifications, here we'll grab some data from
	23	+ // an API and use it to populate a notification
	24	+ var title = 'You have cards waiting to be reviewed!';
	25	+ var message = 'check yo cards m8';
	26	+ var icon = '/flashy.ico';
	27	+ var notificationTag = 'simple-push-demo-notification';
	28	+
	29	+ // Add this to the data of the notification
	30	+ var urlToOpen = '/api/subscribe/';
	31	+
	32	+ var notificationFilter = {
	33	+ tag: 'simple-push-demo-notification'
	34	+ };
	35	+ var notificationData = {
	36	+ url: urlToOpen
	37	+ };
	38	+ return showNotification(title, message, icon, notificationData);
	39	+});
	40	+
	41	+self.addEventListener('notificationclick', function(event) {
	42	+ console.log('On notification click: ', event);
	43	+
	44	+ var url = event.notification.data.url;
	45	+ event.waitUntil(clients.openWindow(url));
	46	+});