feat(app): implement oauth-buttons directive

Author: kingcody

app/templates/Gruntfile.js

@@ -255,7 +255,8 @@ module.exports = function (grunt) {
           '/es5-shim/'<% if(!filters.css) { %>,
           /font-awesome\.css/<% if(filters.bootstrap) { %>,
           /bootstrap\.css/<% if(filters.sass) { %>,
-          /bootstrap-sass-official/<% }}} %>
+          /bootstrap-sass-official/<% } if(filters.oauth) { %>,
+          /bootstrap-social\.css/<% }}} %>
         ]
       },
       client: {

app/templates/_bower.json

@@ -6,7 +6,8 @@
     "json3": "~3.3.1",
     "es5-shim": "~3.0.1",<% if(filters.bootstrap) { if (filters.sass) { %>
     "bootstrap-sass-official": "~3.1.1",<% } %>
-    "bootstrap": "~3.1.1",<% } %>
+    "bootstrap": "~3.1.1",<% if(filters.oauth) { %>
+    "bootstrap-social": "~4.9.1",<% }} %>
     "angular-resource": "~1.4.0",
     "angular-cookies": "~1.4.0",
     "angular-sanitize": "~1.4.0",<% if (filters.ngroute) { %>

app/templates/client/app/account(auth)/login/login(html).html

@@ -41,18 +41,12 @@ <h1>Login</h1>
             Register
           </a>
         </div>
-<% if (filters.oauth) {%>
-        <hr>
-        <div><% if (filters.facebookAuth) {%>
-          <a class="btn btn-facebook" href="" ng-click="loginOauth('facebook')">
-            <i class="fa fa-facebook"></i> Connect with Facebook
-          </a><% } %><% if (filters.googleAuth) {%>
-          <a class="btn btn-google-plus" href="" ng-click="loginOauth('google')">
-            <i class="fa fa-google-plus"></i> Connect with Google+
-          </a><% } %><% if (filters.twitterAuth) {%>
-          <a class="btn btn-twitter" href="" ng-click="loginOauth('twitter')">
-            <i class="fa fa-twitter"></i> Connect with Twitter
-          </a><% } %>
+<% if (filters.oauth) { %>
+        <hr/>
+        <div class="row">
+          <div class="col-sm-4 col-md-3">
+            <oauth-buttons classes="btn-block"></oauth-buttons>
+          </div>
         </div><% } %>
       </form>
     </div>

app/templates/client/app/account(auth)/login/login(jade).jade

@@ -39,16 +39,8 @@ navbar
 <% if (filters.oauth) {%>
         hr
 
-        div<% if (filters.facebookAuth) {%>
-          a.btn.btn-facebook(href='', ng-click='loginOauth("facebook")')
-            i.fa.fa-facebook
-            |  Connect with Facebook
-          = ' '<% } %><% if (filters.googleAuth) {%>
-          a.btn.btn-google-plus(href='', ng-click='loginOauth("google")')
-            i.fa.fa-google-plus
-            |  Connect with Google+
-          = ' '<% } %><% if (filters.twitterAuth) {%>
-          a.btn.btn-twitter(href='', ng-click='loginOauth("twitter")')
-            i.fa.fa-twitter
-            |  Connect with Twitter<% } %><% } %>
+        .row
+          .col-sm-4.col-md-3
+            oauth-buttons(classes='btn-block')
+<% } %>
   hr

app/templates/client/app/account(auth)/login/login(less).less

@@ -1,7 +1,7 @@
 'use strict'
 
 angular.module '<%= scriptAppName %>'
-.controller 'LoginCtrl', ($scope, Auth<% if (filters.ngroute) { %>, $location<% } %><% if (filters.uirouter) { %>, $state<% } %><% if (filters.oauth) {%>, $window<% } %>) ->
+.controller 'LoginCtrl', ($scope, Auth<% if (filters.ngroute) { %>, $location<% } %><% if (filters.uirouter) { %>, $state<% } %>) ->
   $scope.user = {}
   $scope.errors = {}
   $scope.login = (form) ->
@@ -18,6 +18,3 @@ angular.module '<%= scriptAppName %>'
 
       .catch (err) ->
         $scope.errors.other = err.message
-<% if (filters.oauth) {%>
-  $scope.loginOauth = (provider) ->
-    $window.location.href = '/auth/' + provider<% } %>

app/templates/client/app/account(auth)/login/login(sass).scss

@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('<%= scriptAppName %>')
-  .controller('LoginCtrl', function($scope, Auth<% if (filters.ngroute) { %>, $location<% } %><% if (filters.uirouter) { %>, $state<% } %><% if (filters.oauth) { %>, $window<% } %>) {
+  .controller('LoginCtrl', function($scope, Auth<% if (filters.ngroute) { %>, $location<% } %><% if (filters.uirouter) { %>, $state<% } %>) {
     $scope.user = {};
     $scope.errors = {};
 
@@ -22,8 +22,5 @@ angular.module('<%= scriptAppName %>')
         });
       }
     };
-<% if (filters.oauth) {%>
-    $scope.loginOauth = function(provider) {
-      $window.location.href = '/auth/' + provider;
-    };<% } %>
+
   });

app/templates/client/app/account(auth)/login/login(stylus).styl

@@ -74,18 +74,12 @@ <h1>Sign up</h1>
             Login
           </a>
         </div>
-<% if (filters.oauth) {%>
-        <hr>
-        <div><% if (filters.facebookAuth) {%>
-          <a class="btn btn-facebook" href="" ng-click="loginOauth('facebook')">
-            <i class="fa fa-facebook"></i> Connect with Facebook
-          </a><% } %><% if (filters.googleAuth) {%>
-          <a class="btn btn-google-plus" href="" ng-click="loginOauth('google')">
-            <i class="fa fa-google-plus"></i> Connect with Google+
-          </a><% } %><% if (filters.twitterAuth) {%>
-          <a class="btn btn-twitter" href="" ng-click="loginOauth('twitter')">
-            <i class="fa fa-twitter"></i> Connect with Twitter
-          </a><% } %>
+<% if (filters.oauth) { %>
+        <hr/>
+        <div class="row">
+          <div class="col-sm-4 col-md-3">
+            <oauth-buttons classes="btn-block"></oauth-buttons>
+          </div>
         </div><% } %>
       </form>
     </div>