From e48f97fb840bed80d903cd0a582ee69bb3851a7d Mon Sep 17 00:00:00 2001
From: Danil Kostin <danya.postfactum@gmail.com>
Date: Sun, 5 Aug 2018 00:53:42 +0900
Subject: [PATCH] Add Google and Twitter social auth

---
 package.json            |  2 ++
 src/components/Auth.vue | 24 ++++++++++++++++++++++++
 src/main.js             | 10 ++++++++++
 3 files changed, 36 insertions(+)

diff --git a/package.json b/package.json
index 0a79a42..e87d110 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "graphql": "^0.11.7",
     "graphql-request": "^1.4.0",
     "graphql-tag": "^2.5.0",
+    "hellojs": "^1.17.1",
     "heroku-ssl-redirect": "0.0.4",
     "is-image-url": "^1.1.8",
     "just-detect-adblock": "^1.0.0",
@@ -32,6 +33,7 @@
     "quasar-framework": "^0.14.4",
     "vue": "^2.5.0",
     "vue-coin-hive": "0.0.8",
+    "vue-hellojs": "0.0.4",
     "vue-router": "^3.0.1",
     "vuelidate": "^0.6.1"
   },
diff --git a/src/components/Auth.vue b/src/components/Auth.vue
index df69069..7469b86 100644
--- a/src/components/Auth.vue
+++ b/src/components/Auth.vue
@@ -10,6 +10,9 @@
       h6.light-paragraph.text-center(style="margin-bottom:30px;" v-if="invitedByUser && registering") You were invited by 
         h6.text-center {{invitedByUser.username}}
       h6.light-paragraph.text-center(v-if="localAuth" style="margin-bottom:30px;") Desktop Application
+      div.text-center
+        q-icon(@click="socialAuth('google')" name="fa-google" size="2rem" style="margin:0 10px" color="blue")
+        q-icon(@click="socialAuth('twitter')" name="fa-twitter" size="2rem" style="margin:0 10px" color="blue")
       div
         q-input(
           v-model="form.email"
@@ -137,6 +140,27 @@ export default {
         })
       }
     },
+    socialAuth(network) {
+      const hello = this.hello;
+      hello(network).login({
+        scope: 'email',
+        force: true,
+        auth_type: 'rerequest'
+      }).then(() => {
+        const authRes = hello(network).getAuthResponse();
+        /*
+          performs operations using the token from authRes
+        */
+        console.log(authRes.access_token);
+        hello(network).api('me').then(function (json) {
+          const profile = json;
+          console.log(profile);
+          /*
+            performs operations using the user info from profile
+          */
+        });
+      })
+    },
     checkInvitedBy: async function() {
       console.log(this.$route)
 
diff --git a/src/main.js b/src/main.js
index 3dfe3fc..aee9047 100644
--- a/src/main.js
+++ b/src/main.js
@@ -32,6 +32,16 @@ import 'quasar-extras/material-icons'
 import 'quasar-extras/fontawesome'
 // import 'quasar-extras/animate'
 
+const HelloJs = require('hellojs/dist/hello.all.min.js');
+const VueHello = require('vue-hellojs');
+
+HelloJs.init({
+  google: '474818646334-kgl6rsvpflvksrev5c0jvh6eem1dd9aj.apps.googleusercontent.com'
+}, {
+  redirect_uri: 'authcallback/'
+});
+Vue.use(VueHello, HelloJs);
+
 Quasar.start(() => {
   /* eslint-disable no-new */
   new Vue({