110swag / flashy-frontend

Commit 62d8453e5c62ba6a1c328f587d347a5cdceeb4f1

Authored by Andrew Buss 2015-06-02 11:29:23 -0700

settings cleanup

Showing 2 changed files Side-by-side Diff

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

1	1	angular.module('flashy.SettingsController', ['ui.router']).
2	2
3		- controller('SettingsController', function($scope, $http) {
4		- $scope.changePassword = function(oldPassword, newPassword, confirmedNewPassword) {
	3	+ controller('SettingsController', function($scope, $http) {
	4	+ $scope.changePassword = function(oldPassword, newPassword, confirmedNewPassword) {
5	5
6		- };
7		- console.log('checking to see if chrome');
8		- if (!chrome) { return; }
9		- console.log('chrome');
10		- $scope.registerCallback = function(registrationId) {
11		- if (chrome.runtime.lastError) {
12		- console.log('Registration failed');
13		- }
	6	+ };
	7	+ console.log('checking to see if chrome');
	8	+ if (!chrome) {
	9	+ return;
	10	+ }
	11	+ console.log('chrome');
	12	+ });
14	13
15		- sendRegistrationId(registrationId, function(succeed) {
16		- if (succeed) {
17		- chrome.storage.local.set({registered: true});
18		- }
	14	+console.log('executing things outside of module');
	15	+var PUSH_SERVER_URL = '/app/subscribe/';
	16	+
	17	+function onPushSubscription(pushSubscription) {
	18	+ console.log('pushSubscription = ', pushSubscription.endpoint);
	19	+ // Here we would normally send the endpoint
	20	+ // and subscription ID to our server.
	21	+ // In this demo we just use send these values to
	22	+ // our server via XHR which sends a push message.
	23	+
	24	+ console.log('pushSubscription: ', pushSubscription);
	25	+
	26	+ // Code to handle the XHR
	27	+ var formData = new FormData();
	28	+
	29	+ var endpoint = pushSubscription.endpoint;
	30	+
	31	+ if ('subscriptionId' in pushSubscription) {
	32	+ // Make the endpoint always contain the subscriptionId
	33	+ // so the server is always consistent
	34	+ if (!endpoint.includes(pushSubscription.subscriptionId)) {
	35	+ endpoint += '/' + pushSubscription.subscriptionId;
	36	+ }
	37	+ }
	38	+
	39	+ formData.append('registration_id', endpoint);
	40	+ console.log('registration_id: ', endpoint);
	41	+
	42	+ console.log('tryna push');
	43	+
	44	+ var req = new XMLHttpRequest();
	45	+ req.addEventListener('load', function(response) {
	46	+ console.log('response: ', response);
	47	+ });
	48	+ req.addEventListener('error', function(error) {
	49	+ console.log('error: ', error);
	50	+ });
	51	+ req.open('POST', PUSH_SERVER_URL);
	52	+ req.send(formData);
	53	+ console.log('pushed?');
	54	+
	55	+}
	56	+
	57	+function subscribeDevice() {
	58	+ // We need the service worker registration to access the push manager
	59	+ navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
	60	+ serviceWorkerRegistration.pushManager.subscribe()
	61	+ .then(onPushSubscription)
	62	+ .catch(function(e) {
	63	+ console.log('Error in subscribing');
	64	+ // Check for a permission prompt issue
	65	+ if ('permissions' in navigator) {
	66	+ navigator.permissions.query({name: 'push', userVisibleOnly: true})
	67	+ .then(function(permissionStatus) {
	68	+ console.log('subscribe() Error: Push permission status = ',
	69	+ permissionStatus);
	70	+ if (permissionStatus.status === 'denied') {
	71	+ // The user blocked the permission prompt
	72	+ console.log('Ooops Notifications are Blocked',
	73	+ 'Unfortunately you just permanently blocked notifications. ' +
	74	+ 'Please unblock / allow them to switch on push ' +
	75	+ 'notifications.');
	76	+ } else {
	77	+ console.log('Ooops Push Couldn\'t Register',
	78	+ '<p>When we tried to ' +
	79	+ 'get the subscription ID for GCM, something went wrong,' +
	80	+ ' not sure why.</p>' +
	81	+ '<p>Have you defined "gcm_sender_id" and ' +
	82	+ '"gcm_user_visible_only" in the manifest?</p>' +
	83	+ '<p>Error message: ' +
	84	+ e.message +
	85	+ '</p>');
	86	+ }
	87	+ }).catch(function(err) {
	88	+ console.log('Ooops Push Couldn\'t Register',
	89	+ '<p>When we tried to ' +
	90	+ 'get the subscription ID for GCM, something went wrong, not ' +
	91	+ 'sure why.</p>' +
	92	+ '<p>Have you defined "gcm_sender_id" and ' +
	93	+ '"gcm_user_visible_only" in the manifest?</p>' +
	94	+ '<p>Error message: ' +
	95	+ err.message +
	96	+ '</p>');
19	97	});
20		- };
	98	+ } else {
	99	+ // Use notification permission to do something
	100	+ if (Notification.permission === 'denied') {
	101	+ console.log('Ooops Notifications are Blocked',
	102	+ 'Unfortunately you just permanently blocked notifications. ' +
	103	+ 'Please unblock / allow them to switch on push notifications.');
	104	+ } else {
	105	+ console.log('Ooops Push Couldn\'t Register',
	106	+ '<p>When we tried to ' +
	107	+ 'get the subscription ID for GCM, something went wrong, not ' +
	108	+ 'sure why.</p>' +
	109	+ '<p>Have you defined "gcm_sender_id" and ' +
	110	+ '"gcm_user_visible_only" in the manifest?</p>' +
	111	+ '<p>Error message: ' +
	112	+ e.message +
	113	+ '</p>');
	114	+ }
	115	+ }
	116	+ });
	117	+ });
	118	+}
21	119
22		- function sendRegistrationId(registrationId, callback) {
23		- console.log('registration id: ' + registrationId);
24		- $http.post('/api/subscribe/', JSON.stringify({
25		- 'registration_id': registrationId
26		- }));
27		- callback(true);
	120	+function unsubscribeDevice() {
	121	+ navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
	122	+ serviceWorkerRegistration.pushManager.getSubscription().then(
	123	+ function(pushSubscription) {
	124	+ // Check we have everything we need to unsubscribe
	125	+ if (!pushSubscription) {
	126	+ return;
28	127	}
29	128
30		- console.log('gonna try to launch service worker now');
31		- if ('serviceWorker' in navigator) {
	129	+ // TODO: Remove the device details from the server
	130	+ // i.e. the pushSubscription.subscriptionId and
	131	+ // pushSubscription.endpoint
32	132
33		- console.log('gonna try to launch service worker now');
34		- navigator.serviceWorker.register('scripts/service-worker.js').then(
35		- function(serviceWorkerRegistration) {
36		- serviceWorkerRegistration.pushManager.subscribe().then(
37		- function(pushSubscription) {
38		- console.log('sub id: ', pushSubscription.subscriptionId);
39		- console.log('endpoint: ', pushSubscription.endpoint);
40		- // The push subscription details needed by the application
41		- // server are now available, and can be sent to it using,
42		- // for example, an XMLHttpRequest.
43		- }, function(error) {
44		- // During development it often helps to log errors to the
45		- // console. In a production environment it might make sense to
46		- // also report information about errors back to the
47		- // application server.
48		- console.log('sub error: ', error);
49		- }
50		- );
	133	+ pushSubscription.unsubscribe().then(function(successful) {
	134	+ console.log('Unsubscribed from push: ', successful);
	135	+ if (!successful) {
	136	+ // The unsubscribe was unsuccessful, but we can
	137	+ // remove the subscriptionId from our server
	138	+ // and notifications will stop
	139	+ // This just may be in a bad state when the user returns
	140	+ console.error('We were unable to unregister from push');
	141	+ }
	142	+
	143	+ }).catch(function(e) {
	144	+ console.log('Unsubscribtion error: ', e);
51	145	});
	146	+ }.bind(this)).catch(function(e) {
	147	+ console.error('Error thrown while revoking push notifications. ' +
	148	+ 'Most likely because push was never registered', e);
	149	+ });
	150	+ });
	151	+}
52	152
53		- } else {
54		- console.log('Service workers aren\'t supported in this browser.');
55		- }
	153	+function permissionStatusChange(permissionStatus) {
	154	+ console.log('permissionStatusChange = ', permissionStatus);
	155	+ // If the notification permission is denied, it's a permanent block
	156	+ switch (permissionStatus.status) {
	157	+ case 'denied':
	158	+ console.log('Ooops Push has been Blocked',
	159	+ 'Unfortunately the user permanently blocked push. Please unblock / ' +
	160	+ 'allow them to switch on push notifications.');
	161	+ break;
	162	+ case 'granted':
	163	+ // Set the state of the push switch
	164	+ console.log('case granted');
	165	+ break;
	166	+ case 'prompt':
	167	+ console.log('case prompt');
	168	+ break;
	169	+ }
	170	+}
56	171
	172	+function setUpPushPermission() {
	173	+ navigator.permissions.query({name: 'push', userVisibleOnly: true})
	174	+ .then(function(permissionStatus) {
	175	+ // Set the initial state
	176	+ permissionStatusChange(permissionStatus);
57	177
	178	+ // Handle Permission State Changes
	179	+ permissionStatus.onchange = function() {
	180	+ permissionStatusChange(this);
	181	+ };
	182	+
	183	+ // Check if push is supported and what the current state is
	184	+ navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
	185	+ // Let's see if we have a subscription already
	186	+ serviceWorkerRegistration.pushManager.getSubscription()
	187	+ .then(function(subscription) {
	188	+ if (!subscription) {
	189	+ // NOOP
	190	+ return;
	191	+ }
	192	+
	193	+ // Update the current state with the
	194	+ // subscriptionid and endpoint
	195	+ onPushSubscription(subscription);
	196	+ })
	197	+ .catch(function(e) {
	198	+ console.log('An error occured while calling getSubscription()', e);
	199	+ });
	200	+ });
	201	+ }).catch(function(err) {
	202	+ console.log('Ooops Unable to check the permission',
	203	+ 'Unfortunately the permission for push notifications couldn\'t be ' +
	204	+ 'checked. Are you on Chrome 43+?');
58	205	});
	206	+}
	207	+
	208	+function setUpNotificationPermission() {
	209	+ // If the notification permission is denied, it's a permanent block
	210	+ if (Notification.permission === 'denied') {
	211	+ console.log('Ooops Notifications are Blocked',
	212	+ 'Unfortunately notifications are permanently blocked. Please unblock / ' +
	213	+ 'allow them to switch on push notifications.');
	214	+ return;
	215	+ } else if (Notification.permission === 'default') {
	216	+ console.log('notification permissions === default');
	217	+ return;
	218	+ }
	219	+
	220	+ // Check if push is supported and what the current state is
	221	+ navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
	222	+ // Let's see if we have a subscription already
	223	+ serviceWorkerRegistration.pushManager.getSubscription()
	224	+ .then(function(subscription) {
	225	+ if (!subscription) {
	226	+ // NOOP
	227	+ console.log('not subscription');
	228	+ return;
	229	+ }
	230	+
	231	+ // Update the current state with the
	232	+ // subscriptionid and endpoint
	233	+ console.log('onpushsubscription should be entered');
	234	+ onPushSubscription(subscription);
	235	+ })
	236	+ .catch(function(e) {
	237	+ console.log('An error occured while calling getSubscription()', e);
	238	+ });
	239	+ });
	240	+}
	241	+
	242	+// Once the service worker is registered set the initial state
	243	+function initialiseState() {
	244	+ // Is the Permissions API supported
	245	+ if ('permissions' in navigator) {
	246	+ console.log('setting push permissions');
	247	+ setUpPushPermission();
	248	+ return;
	249	+ } else {
	250	+ console.log('setting notification permissions');
	251	+ setUpNotificationPermission();
	252	+ }
	253	+}
	254	+window.addEventListener('load', function() {
	255	+ // When the toggle switch changes, enabled / disable push
	256	+ // messaging
	257	+ var enablePushSwitch = document.querySelector('.js-checkbox');
	258	+ enablePushSwitch.addEventListener('change', function(e) {
	259	+ if (e.target.checked) {
	260	+ subscribeDevice();
	261	+ } else {
	262	+ unsubscribeDevice();
	263	+ }
	264	+ });
	265	+
	266	+ // Check that service workers are supported
	267	+ if ('serviceWorker' in navigator) {
	268	+ navigator.serviceWorker.register('scripts/service-worker.js')
	269	+ .then(initialiseState);
	270	+ } else {
	271	+ // Service Workers aren't supported so you should hide the push UI
	272	+ // If it's currently visible.
	273	+ console.log('Ooops Service Workers aren\'t Supported',
	274	+ 'Service Workers aren\'t supported in this browser. ' +
	275	+ 'For this demo be sure to use ' +
	276	+ '<a href="https://www.google.co.uk/chrome/browser/canary.html">Chrome Canary</a>' +
	277	+ ' or version 42.');
	278	+ }
	279	+});

1	1	'use strict';
2	2
3		-var PUSH_SERVER_URL = 'https://flashy.cards/app/subscribe/';
4		-
5		-function onPushSubscription(pushSubscription) {
6		- console.log('pushSubscription = ', pushSubscription.endpoint);
7		- // Here we would normally send the endpoint
8		- // and subscription ID to our server.
9		- // In this demo we just use send these values to
10		- // our server via XHR which sends a push message.
11		-
12		- console.log('pushSubscription: ', pushSubscription);
13		-
14		- // Code to handle the XHR
15		- var formData = new FormData();
16		-
17		- var endpoint = pushSubscription.endpoint;
18		-
19		- fetch(PUSH_SERVER_URL, {
20		- method: 'post',
21		- body: formData
22		- }).then(function(response) {
23		- console.log('Response = ', response);
24		- }).catch(function(err) {
25		- console.log('Fetch Error :-S', err);
26		- });
27		-
28		-}
29		-
30		-function subscribeDevice() {
31		- // We need the service worker registration to access the push manager
32		- navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
33		- serviceWorkerRegistration.pushManager.subscribe()
34		- .then(onPushSubscription)
35		- .catch(function(e) {
36		- // Check for a permission prompt issue
37		- if ('permissions' in navigator) {
38		- navigator.permissions.query({name: 'push', userVisibleOnly: true})
39		- .then(function(permissionStatus) {
40		- console.log('subscribe() Error: Push permission status = ',
41		- permissionStatus);
42		- if (permissionStatus.status === 'denied') {
43		- // The user blocked the permission prompt
44		- console.log('Ooops Notifications are Blocked',
45		- 'Unfortunately you just permanently blocked notifications. ' +
46		- 'Please unblock / allow them to switch on push ' +
47		- 'notifications.');
48		- } else {
49		- console.log('Ooops Push Couldn\'t Register',
50		- '<p>When we tried to ' +
51		- 'get the subscription ID for GCM, something went wrong,' +
52		- ' not sure why.</p>' +
53		- '<p>Have you defined "gcm_sender_id" and ' +
54		- '"gcm_user_visible_only" in the manifest?</p>' +
55		- '<p>Error message: ' +
56		- e.message +
57		- '</p>');
58		- }
59		- }).catch(function(err) {
60		- console.log('Ooops Push Couldn\'t Register',
61		- '<p>When we tried to ' +
62		- 'get the subscription ID for GCM, something went wrong, not ' +
63		- 'sure why.</p>' +
64		- '<p>Have you defined "gcm_sender_id" and ' +
65		- '"gcm_user_visible_only" in the manifest?</p>' +
66		- '<p>Error message: ' +
67		- err.message +
68		- '</p>');
69		- });
70		- } else {
71		- // Use notification permission to do something
72		- if (Notification.permission === 'denied') {
73		- console.log('Ooops Notifications are Blocked',
74		- 'Unfortunately you just permanently blocked notifications. ' +
75		- 'Please unblock / allow them to switch on push notifications.');
76		- } else {
77		- console.log('Ooops Push Couldn\'t Register',
78		- '<p>When we tried to ' +
79		- 'get the subscription ID for GCM, something went wrong, not ' +
80		- 'sure why.</p>' +
81		- '<p>Have you defined "gcm_sender_id" and ' +
82		- '"gcm_user_visible_only" in the manifest?</p>' +
83		- '<p>Error message: ' +
84		- e.message +
85		- '</p>');
86		- }
87		- }
88		- });
89		- });
90		-}
91		-
92		-function unsubscribeDevice() {
93		- navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
94		- serviceWorkerRegistration.pushManager.getSubscription().then(
95		- function(pushSubscription) {
96		- // Check we have everything we need to unsubscribe
97		- if (!pushSubscription) {
98		- return;
99		- }
100		-
101		- // TODO: Remove the device details from the server
102		- // i.e. the pushSubscription.subscriptionId and
103		- // pushSubscription.endpoint
104		-
105		- pushSubscription.unsubscribe().then(function(successful) {
106		- console.log('Unsubscribed from push: ', successful);
107		- if (!successful) {
108		- // The unsubscribe was unsuccessful, but we can
109		- // remove the subscriptionId from our server
110		- // and notifications will stop
111		- // This just may be in a bad state when the user returns
112		- console.error('We were unable to unregister from push');
113		- }
114		-
115		- }).catch(function(e) {
116		- console.log('Unsubscribtion error: ', e);
117		- });
118		- }.bind(this)).catch(function(e) {
119		- console.error('Error thrown while revoking push notifications. ' +
120		- 'Most likely because push was never registered', e);
121		- });
122		- });
123		-}
124		-
125		-function permissionStatusChange(permissionStatus) {
126		- console.log('permissionStatusChange = ', permissionStatus);
127		- // If the notification permission is denied, it's a permanent block
128		- switch (permissionStatus.status) {
129		- case 'denied':
130		- console.log('Ooops Push has been Blocked',
131		- 'Unfortunately the user permanently blocked push. Please unblock / ' +
132		- 'allow them to switch on push notifications.');
133		- break;
134		- case 'granted':
135		- // Set the state of the push switch
136		- console.log("case granted");
137		- break;
138		- case 'prompt':
139		- console.log("case prompt");
140		- break;
	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);
141	15	}
142	16	}
143	17
144		-function setUpPushPermission() {
145		- navigator.permissions.query({name: 'push', userVisibleOnly: true})
146		- .then(function(permissionStatus) {
147		- // Set the initial state
148		- permissionStatusChange(permissionStatus);
	18	+self.addEventListener('push', function(event) {
	19	+ console.log('Received a push message', event);
149	20
150		- // Handle Permission State Changes
151		- permissionStatus.onchange = function() {
152		- permissionStatusChange(this);
153		- };
	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';
154	28
155		- // Check if push is supported and what the current state is
156		- navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
157		- // Let's see if we have a subscription already
158		- serviceWorkerRegistration.pushManager.getSubscription()
159		- .then(function(subscription) {
160		- if (!subscription) {
161		- // NOOP
162		- return;
163		- }
	29	+ // Add this to the data of the notification
	30	+ var urlToOpen = '/api/subscribe/';
164	31
165		- // Update the current state with the
166		- // subscriptionid and endpoint
167		- onPushSubscription(subscription);
168		- })
169		- .catch(function(e) {
170		- console.log('An error occured while calling getSubscription()', e);
171		- });
172		- });
173		- }).catch(function(err) {
174		- console.log('Ooops Unable to check the permission',
175		- 'Unfortunately the permission for push notifications couldn\'t be ' +
176		- 'checked. Are you on Chrome 43+?');
177		- });
178		-}
	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	+});
179	40
180		-function setUpNotificationPermission() {
181		- // If the notification permission is denied, it's a permanent block
182		- if (Notification.permission === 'denied') {
183		- console.log('Ooops Notifications are Blocked',
184		- 'Unfortunately notifications are permanently blocked. Please unblock / ' +
185		- 'allow them to switch on push notifications.');
186		- return;
187		- } else if (Notification.permission === 'default') {
188		- console.log("notification permissions === default");
189		- return;
190		- }
	41	+self.addEventListener('notificationclick', function(event) {
	42	+ console.log('On notification click: ', event);
191	43
192		- // Check if push is supported and what the current state is
193		- navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
194		- // Let's see if we have a subscription already
195		- serviceWorkerRegistration.pushManager.getSubscription()
196		- .then(function(subscription) {
197		- if (!subscription) {
198		- // NOOP
199		- console.log("not subscription");
200		- return;
201		- }
202		-
203		- // Update the current state with the
204		- // subscriptionid and endpoint
205		- onPushSubscription(subscription);
206		- })
207		- .catch(function(e) {
208		- console.log('An error occured while calling getSubscription()', e);
209		- });
210		- });
211		-}
212		-
213		-// Once the service worker is registered set the initial state
214		-function initialiseState() {
215		- // Is the Permissions API supported
216		- if ('permissions' in navigator) {
217		- setUpPushPermission();
218		- return;
219		- } else {
220		- setUpNotificationPermission();
221		- }
222		-}
223		-
224		-self.addEventListener('UIReady', function() {
225		- // When the toggle switch changes, enabled / disable push
226		- // messaging
227		- var enablePushSwitch = document.querySelector('.js-checkbox');
228		- enablePushSwitch.addEventListener('change', function(e) {
229		- if (e.target.checked) {
230		- subscribeDevice();
231		- } else {
232		- unsubscribeDevice();
233		- }
234		- });
235		-
236		- // Check that service workers are supported
237		- if ('serviceWorker' in navigator) {
238		- navigator.serviceWorker.register('/service-worker.js', {
239		- scope: './'
240		- })
241		- .then(initialiseState);
242		- } else {
243		- // Service Workers aren't supported so you should hide the push UI
244		- // If it's currently visible.
245		- console.log('Ooops Service Workers aren\'t Supported',
246		- 'Service Workers aren\'t supported in this browser. ' +
247		- 'For this demo be sure to use ' +
248		- '<a href="https://www.google.co.uk/chrome/browser/canary.html">Chrome Canary</a>' +
249		- ' or version 42.');
250		- }
	44	+ var url = event.notification.data.url;
	45	+ event.waitUntil(clients.openWindow(url));
251	46	});