feat(oauth): multiple strategies per account; changeable email

angular-fullstack · Jul 26, 2014 · ef06272 · ef06272
1 parent 46466b1
commit ef06272
Show file tree

Hide file tree

Showing 33 changed files with 789 additions and 383 deletions.
diff --git a/app/index.js b/app/index.js
@@ -139,17 +139,17 @@ var AngularFullstackGenerator = yeoman.generators.Base.extend({
         {
           value: 'googleAuth',
           name: 'Google',
-          checked: false
+          checked: true
         },
         {
           value: 'facebookAuth',
           name: 'Facebook',
-          checked: false
+          checked: true
         },
         {
           value: 'twitterAuth',
           name: 'Twitter',
-          checked: false
+          checked: true
         }
       ]
     }, {

diff --git a/app/templates/client/app/account(auth)/settings/settings(html).html b/app/templates/client/app/account(auth)/settings/settings(html).html
@@ -3,16 +3,35 @@
 <div class="container">
   <div class="row">
     <div class="col-sm-12">
-      <h1>Change Password</h1>
+      <h1>Email</h1>
     </div>
     <div class="col-sm-12">
-      <form class="form" name="form" ng-submit="changePassword(form)" novalidate>
+      <form role="form" name="email" ng-submit="changeEmail()" novalidate>
+
+        <div class="form-group has-feedback">
+          <label>Current Email</label>
+          <input type="email" name="email" class="form-control" ng-model="user.email" placeholder='ex. me@awesome.com' />
+          <p class="help-block" ng-show="!email.email.$valid">
+              | Email not valid
+          </p>
+        </div>
+
+        <button class="btn btn-lg btn-primary" type="submit">Save changes</button>
+      </form>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-sm-12">
+      <h1><% if (filters.oauth) { %>{{ user.localEnabled ? 'Change' : 'Set' }}<% } else { %>Change<% } %> Password</h1>
+    </div>
+    <div class="col-sm-12">
+      <form name="pwd" ng-submit="<% if(filters.oauth) { %>!user.localEnabled ? setPassword() : <% } %>changePassword()" novalidate>
 
         <div class="form-group">
           <label>Current Password</label>
 
-          <input type="password" name="password" class="form-control" ng-model="user.oldPassword"
-                 mongoose-error/>
+          <input type="password" name="old" placeholder='ex. password123' class="form-control" ng-model="user.oldPassword"
+                 mongoose-error <% if (filters.oauth) { %>ng-disabled='!user.localEnabled' <% } %>/>
           <p class="help-block" ng-show="form.password.$error.mongoose">
               {{ errors.other }}
           </p>
@@ -21,11 +40,11 @@ <h1>Change Password</h1>
         <div class="form-group">
           <label>New Password</label>
 
-          <input type="password" name="newPassword" class="form-control" ng-model="user.newPassword"
+          <input type="password" name="new" placeholder='ex. GoofyM1ckeyDonald&Pluto' class="form-control" ng-model="user.newPassword"
                  ng-minlength="3"
-                 required/>
+                 required />
           <p class="help-block"
-             ng-show="(form.newPassword.$error.minlength || form.newPassword.$error.required) && (form.newPassword.$dirty || submitted)">
+             ng-show="(pwd.new.$error.minlength || pwd.new.$error.required) && (pwd.new.$dirty || pwd.submitted)">
             Password must be at least 3 characters.
           </p>
         </div>
@@ -36,4 +55,12 @@ <h1>Change Password</h1>
       </form>
     </div>
   </div>
+  <% if (filters.oauth) { %>
+  <!-- <div class="row">
+    <div class="col-sm-12">
+      <h1>Social accounts</h1>
+    </div>
+    <div class="col-sm-12"></div>
+  </div> -->
+  <% } %>
 </div>
diff --git a/app/templates/client/app/account(auth)/settings/settings(jade).jade b/app/templates/client/app/account(auth)/settings/settings(jade).jade
@@ -2,20 +2,47 @@ div(ng-include='"components/navbar/navbar.html"')
 .container
   .row
     .col-sm-12
-      h1 Change Password
+      h1 Email
+
+    .col-sm-12
+      form(role='form', name='email', ng-submit='changeEmail()', novalidate)
+
+        .form-group.has-feedback
+          label Current Email
+          input.form-control(type='email', name='email', ng-model='user.email', placeholder='ex. me@awesome.com')
+          span.glyphicon.glyphicon-ok.form-control-feedback(ng-if='email.confirmed', title='email confirmed')
+          p.help-block(ng-show='!email.email.$valid')
+            | Email not valid
+
+        button.btn.btn-lg.btn-primary(type='submit') Save changes
+
+  .row
     .col-sm-12
-      form.form(name='form', ng-submit='changePassword(form)', novalidate='')
+      h1 <% if (filters.oauth) { %>{{ user.localEnabled ? 'Change' : 'Set' }}<% } else { %>Change<% } %> Password
+
+    .col-sm-12
+      form(role='form', name='pwd', ng-submit='<% if(filters.oauth) { %>!user.localEnabled ? setPassword() : <% } %>changePassword()', novalidate)
+
         .form-group
           label Current Password
-          input.form-control(type='password', name='password', ng-model='user.oldPassword', mongoose-error='')
-          p.help-block(ng-show='form.password.$error.mongoose')
+          input.form-control(type='password', name='old', placeholder='ex. password123', ng-model='user.oldPassword', <% if (filters.oauth) { %>ng-disabled='!user.localEnabled', <% } %>mongoose-error='')
+          p.help-block(ng-show='pwd.old.$error.mongoose')
             | {{ errors.other }}
+
         .form-group
           label New Password
-          input.form-control(type='password', name='newPassword', ng-model='user.newPassword', ng-minlength='3', required='')
-          p.help-block(ng-show='(form.newPassword.$error.minlength || form.newPassword.$error.required) && (form.newPassword.$dirty || submitted)')
+          input.form-control(type='password', name='new', placeholder='ex. GoofyM1ckeyDonald&Pluto', ng-model='user.newPassword', ng-minlength='3', required)
+          p.help-block(ng-show='(pwd.new.$error.minlength || pwd.new.$error.required) && (pwd.new.$dirty || pwd.submitted)')
             | Password must be at least 3 characters.
 
-        p.help-block  {{ message }}
+        p.help-block {{ message }}
 
         button.btn.btn-lg.btn-primary(type='submit') Save changes
+
+<% if (filters.oauth) { %>
+  //- .row
+  //-   .col-sm-12
+  //-     h1 Social accounts
+
+  //-   .col-sm-12
+<% } %>
diff --git a/app/templates/client/app/account(auth)/settings/settings.controller(coffee).coffee b/app/templates/client/app/account(auth)/settings/settings.controller(coffee).coffee
@@ -1,17 +1,59 @@
 'use strict'
 
 angular.module '<%= scriptAppName %>'
-.controller 'SettingsCtrl', ($scope, User, Auth) ->
+.controller 'SettingsCtrl', ($scope, Auth) ->
   $scope.errors = {}
-  $scope.changePassword = (form) ->
-    $scope.submitted = true
 
-    if form.$valid
+  $scope.user = Auth.getCurrentUser()
+  $scope.email = {}
+
+  getEmail = (user) ->
+    return [null, null] unless $scope.user.credentials.length
+
+    for c in $scope.user.credentials when c.type is 'email'
+      return [c.value, c.confirmed]
+
+    [null, null]
+
+  [initialEmail, $scope.email.confirmed] = getEmail $scope.user
+
+  $scope.user.email = initialEmail
+
+  $scope.changeEmail = ->
+    if $scope.email.$valid
+      Auth.changeEmail initialEmail, $scope.user.email
+      .then ->
+        $scope.message = 'Email successfully changed'
+
+      .catch ->
+        # TODO: handle errors
+        $scope.message = ''
+
+  $scope.changePassword = ->
+    $scope.pwd.submitted = true
+
+    if $scope.pwd.$valid
       Auth.changePassword $scope.user.oldPassword, $scope.user.newPassword
       .then ->
-        $scope.message = 'Password successfully changed.'
+        $scope.message = 'Password successfully changed'
 
       .catch ->
-        form.password.$setValidity 'mongoose', false
+        $scope.pwd.old.$setValidity 'mongoose', false
         $scope.errors.other = 'Incorrect password'
         $scope.message = ''
+<% if (filters.oauth) { %>
+  $scope.setPassword = ->
+    $scope.pwd.submitted = true
+
+    if $scope.pwd.$valid
+      Auth.setPassword $scope.user.newPassword
+      .then ->
+        $scope.message = 'Password successfully set'
+        $scope.user.localEnabled = true
+        $scope.user.newPassword = ''
+
+      .catch ->
+        $scope.pwd.old.$setValidity 'mongoose', false
+        $scope.errors.other = 'Another account with that email already exists'
+        $scope.message = ''
+<% } %>
diff --git a/app/templates/client/app/account(auth)/settings/settings.controller(js).js b/app/templates/client/app/account(auth)/settings/settings.controller(js).js
@@ -1,21 +1,71 @@
 'use strict';
 
 angular.module('<%= scriptAppName %>')
-  .controller('SettingsCtrl', function ($scope, User, Auth) {
+  .controller('SettingsCtrl', function ($scope, Auth) {
     $scope.errors = {};
 
-    $scope.changePassword = function(form) {
-      $scope.submitted = true;
-      if(form.$valid) {
+    $scope.user = Auth.getCurrentUser();
+    $scope.email = {};
+
+    var getEmail = function(user) {
+      if (!$scope.user.credentials.length) {
+        return null;
+      }
+
+      for(var i in $scope.user.credentials) {
+        var c = $scope.user.credentials[i];
+        if(c.type==='email') return [c.value, c.confirmed];
+      }
+    };
+
+    var tmp = getEmail($scope.user);
+
+    var initialEmail = tmp ? tmp[0] : null;
+    $scope.email.confirmed = tmp ? tmp[1] : null;
+
+    $scope.user.email = initialEmail;
+
+    $scope.changeEmail = function () {
+      if($scope.email.$valid) {
+        Auth.changeEmail(initialEmail, $scope.user.email)
+        .then(function() {
+          $scope.message = 'Email successfully changed';
+        })
+        .catch(function() {
+          // TODO: handle errors
+          $scope.message = '';
+        });
+      }
+    }
+
+    $scope.changePassword = function() {
+      $scope.pwd.submitted = true;
+      if($scope.pwd.$valid) {
         Auth.changePassword( $scope.user.oldPassword, $scope.user.newPassword )
         .then( function() {
-          $scope.message = 'Password successfully changed.';
+          $scope.message = 'Password successfully changed';
         })
         .catch( function() {
-          form.password.$setValidity('mongoose', false);
+          $scope.pwd.old.$setValidity('mongoose', false);
           $scope.errors.other = 'Incorrect password';
           $scope.message = '';
         });
       }
 		};
+<% if (filters.oauth) { %>
+    $scope.setPassword = function() {
+      $scope.submitted = true;
+      if($scope.pwd.$valid) {
+        Auth.changePassword( $scope.user.newPassword )
+        .then( function() {
+          $scope.message = 'Password successfully set';
+        })
+        .catch( function() {
+          $scope.pwd.old.$setValidity('mongoose', false);
+          $scope.errors.other = 'Another account with that email already exists';
+          $scope.message = '';
+        });
+      }
+    };
+<% } %>
   });
diff --git a/app/templates/client/app/admin(auth)/admin(css).css b/app/templates/client/app/admin(auth)/admin(css).css
@@ -1 +1,3 @@
 .trash { color:rgb(209, 91, 71); }
+.confirm { color:rgb(240, 173, 78); }
+.confirmed { color:rgb(92, 184, 92); }
diff --git a/app/templates/client/app/admin(auth)/admin(html).html b/app/templates/client/app/admin(auth)/admin(html).html
@@ -6,6 +6,7 @@
     <li class="list-group-item" ng-repeat="user in users">
         <strong>{{user.name}}</strong><br>
         <span class="text-muted">{{user.email}}</span>
+        <a ng-click="confirm(user)" ng-class="user.credentials[0].confirmed ? 'confirmed' : 'confirm'"><span class="glyphicon glyphicon-ok-circle"></span></a>
         <a ng-click="delete(user)" class="trash"><span class="glyphicon glyphicon-trash pull-right"></span></a>
     </li>
   </ul>

diff --git a/app/templates/client/app/admin(auth)/admin(jade).jade b/app/templates/client/app/admin(auth)/admin(jade).jade
@@ -6,6 +6,9 @@ div(ng-include='"components/navbar/navbar.html"')
     li.list-group-item(ng-repeat='user in users')
       strong {{user.name}}
       br
-      span.text-muted {{user.email}}
-      a.trash(ng-click='delete(user)')
+      span.text-muted {{user.credentials[0].value}}
+      a(ng-click='confirm(user)', ng-class="user.credentials[0].confirmed ? 'confirmed' : 'confirm'", title='confirm email')
+        span.glyphicon.glyphicon-ok-circle
+
+      a.trash(ng-click='delete(user)', title='delete user')
         span.glyphicon.glyphicon-trash.pull-right
diff --git a/app/templates/client/app/admin(auth)/admin(less).less b/app/templates/client/app/admin(auth)/admin(less).less
@@ -1 +1,3 @@
-.trash { color:rgb(209, 91, 71); }
+.trash { color:rgb(209, 91, 71); }
+.confirm { color:rgb(240, 173, 78); }
+.confirmed { color:rgb(92, 184, 92); }
diff --git a/app/templates/client/app/admin(auth)/admin(sass).scss b/app/templates/client/app/admin(auth)/admin(sass).scss
@@ -1 +1,3 @@
 .trash { color:rgb(209, 91, 71); }
+.confirm { color:rgb(240, 173, 78); }
+.confirmed { color:rgb(92, 184, 92); }
diff --git a/app/templates/client/app/admin(auth)/admin(stylus).styl b/app/templates/client/app/admin(auth)/admin(stylus).styl
@@ -1,2 +1,8 @@
 .trash
-    color rgb(209, 91, 71)
+    color rgb(209, 91, 71)
+
+.confirm
+    color: rgb(240, 173, 78)
+
+.confirmed
+    color: rgb(92, 184, 92)
diff --git a/app/templates/client/app/admin(auth)/admin.controller(coffee).coffee b/app/templates/client/app/admin(auth)/admin.controller(coffee).coffee
@@ -1,7 +1,7 @@
 'use strict'
 
 angular.module '<%= scriptAppName %>'
-.controller 'AdminCtrl', ($scope, $http, Auth, User) ->
+.controller 'AdminCtrl', ($scope, $http, User) ->
 
   $http.get '/api/users'
   .success (users) ->
@@ -11,3 +11,6 @@ angular.module '<%= scriptAppName %>'
     User.remove id: user._id
     angular.forEach $scope.users, (u, i) ->
       $scope.users.splice i, 1 if u is user
+
+  $scope.confirm = (user) ->
+    User.confirm id: user._id, null
diff --git a/app/templates/client/app/admin(auth)/admin.controller(js).js b/app/templates/client/app/admin(auth)/admin.controller(js).js
@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('<%= scriptAppName %>')
-  .controller('AdminCtrl', function ($scope, $http, Auth, User) {
+  .controller('AdminCtrl', function ($scope, $http, User) {
 
     $http.get('/api/users').success(function(users) {
       $scope.users = users;
@@ -15,4 +15,8 @@ angular.module('<%= scriptAppName %>')
         }
       });
     };
+
+    $scope.confirm = function(user) {
+      User.confirm({ id:user._id }, null);
+    };
   });