110swag / flashy-frontend

Compare View

switch
from
...
to
 
Commits (2)

Diff

Showing 2 changed files Inline Diff

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