110swag / flashy-frontend

Download as
Browse Code ยป

Commit e94cfa2d2968d32119e34a290b1e6033baff7385

Authored by Chung Wang
1 parent eaa6cd5422
Exists in master and in 1 other branch ef9f9dd363e92d55eb4d80d036193be39572172b

Add more checking for existence of services and checkbox change

Showing 1 changed file with 53 additions and 7 deletions Inline Diff

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