Revert "Removed Login with Facebook"

This reverts commit e68711b.

api/controllers/UserController.js

@@ -54,6 +54,24 @@ module.exports = {
     );
   },
 
+  async tryLoginWithFacebook(req, res) {
+    const response = await axios.post(
+      `${process.env.AUTH_URL}/api/v2/login-with-facebook`,
+      {
+        code: req.query.code,
+        redirect_uri: 'https://www.thefirstspine.fr/login-with-facebook',
+      },
+    );
+
+    const responseJson = response.data;
+    if (response.status >= 400) {
+      return res.redirect('/login');
+    }
+
+    req.session.access_token = responseJson.access_token;
+    return res.redirect(req.query.redirect ? `/${req.query.redirect}` : '/profile');
+  },
+
   async logout(req, res) {
     req.session.access_token = null;
     return res.redirect('/');

config/locales/fr.json

@@ -382,4 +382,4 @@
 		"tipText": "Cet accès anticipé est gratuit et le restera pendant toute la période de développement. Si vous voulez encourager son développement, vous pouvez donner un pourboire aux développeurs pour qu'ils puissent continuer leur travail en tout sérénité. Le nom que vous nous donnerez sera présent dans le jeu final !"
 	},
 	"Vos codes sont arrivés !": "Vos codes sont arrivés !"
-}
+}

config/policies.js

@@ -21,6 +21,7 @@ module.exports.policies = {
 
   UserController: {
     '*': ['load-user', 'set-locale', 'is-logged-in'],
+    'tryLoginWithFacebook': ['load-user', 'set-locale'],
     'viewForgottenPasswordForm': ['load-user', 'set-locale'],
     'sendNewPassword': ['load-user', 'set-locale'],
     'viewLoginForm': ['load-user', 'set-locale'],

config/routes.js

@@ -64,6 +64,7 @@ module.exports.routes = {
   'POST /login': 'UserController.tryLogin',
   'GET /forgotten-password': 'UserController.viewForgottenPasswordForm',
   'POST /forgotten-password': 'UserController.sendNewPassword',
+  'GET /login-with-facebook': 'UserController.tryLoginWithFacebook',
   'GET /profile': 'UserController.viewProfile',
   'POST /profile': 'UserController.editProfile',
   'GET /subscribe': 'UserController.viewSubscriptionForm',

views/components/facebook-login.ejs

@@ -0,0 +1,23 @@
+<script>
+Vue.component('facebook-login', {
+  data: function () {
+    return {
+    }
+  },
+  mounted: async function() {
+  },
+  methods: {
+    fblogin() {
+      window.location.href = 'https://www.facebook.com/v6.0/dialog/oauth?client_id=481790999175484&redirect_uri=https://www.thefirstspine.fr/login-with-facebook&scope=email';
+    }
+  },
+  props: [],
+  template: '#facebook-login',
+})
+</script>
+
+<script type="text/x-template" id="facebook-login">
+  <div>
+    <a class="button is-facebook is-size-5" v-on:click="fblogin()"><%= __("login.loginWithFacebook") %></a>
+  </div>
+</script>

views/layouts/layout.ejs

@@ -55,6 +55,7 @@
     <%- include('../components/card.ejs'); %>
     <%- include('../components/card-autoload.ejs'); %>
     <%- include('../components/service-checker.ejs'); %>
+    <%- include('../components/facebook-login.ejs'); %>
     <%- include('../components/codeinput.ejs'); %>
     <%- include('../components/navigation.ejs'); %>
     <%- include('../components/date.ejs'); %>

views/pages/login.ejs

@@ -6,7 +6,7 @@
       <div class="column is-8 is-offset-2">
         <div class="columns">
           <div class="column is-one-third">
-            <div class="illustration" style="min-height: 500px;"></div>
+            <div class="illustration"></div>
           </div>
           <form class="column" method="POST" action="/login?redirect=<%= redirect %>">
             <h1 class="is-size-3 has-text-centered is-uppercase"><%= __("login.title") %></h1>
@@ -42,7 +42,22 @@
                 </div>
               </div>
               <div class="field">
-                <div class="notification is-danger is-light">Facebook is no longer supporting Login for The First Spine. We decided to delete the feature.</div>
+                <div class="columns">
+                  <div class="column">
+                    <hr class="middle" />
+                  </div>
+                  <div class="column has-text-centered is-one-quarter">
+                    <span class="middle"><%= __("login.or") %></span>
+                  </div>
+                  <div class="column">
+                    <hr class="middle" />
+                  </div>
+                </div>
+              </div>
+              <div class="field">
+                <div class="control">
+                  <facebook-login></facebook-login>
+                </div>
               </div>
             </div>
             <div class="informations">

views/pages/subscribe.ejs

@@ -49,10 +49,28 @@
                   <input type="submit" value="<%= __("subscribe.subscribe") %>" class="button is-primary is-size-5" />
                 </div>
               </div>
+              <div class="field">
+                <div class="columns">
+                  <div class="column">
+                    <hr class="middle" />
+                  </div>
+                  <div class="column has-text-centered is-one-quarter">
+                    <span class="middle"><%= __("subscribe.or") %></span>
+                  </div>
+                  <div class="column">
+                    <hr class="middle" />
+                  </div>
+                </div>
+              </div>
+              <div class="field">
+                <div class="control">
+                  <facebook-login></facebook-login>
+                </div>
+              </div>
             </div>
           </form>
           <div class="column is-one-third">
-            <div class="illustration" style="min-height: 500px;"></div>
+            <div class="illustration"></div>
           </div>
         </div>
       </div>