From c7caef172ba328e0339e0db8236c9c3675a1cfd8 Mon Sep 17 00:00:00 2001 From: Mohannad Otaibi Date: Mon, 3 Oct 2022 21:34:51 +0300 Subject: [PATCH] little better --- .prettierrc | 1 - api/swarm.js | 16 +++++--- assets/scss/main.scss | 90 +++++++++++++++++++++++++++++++++++++++++- components/Home.vue | 79 +++++++++++++------------------------ nuxt.config.js | 9 ++--- package-lock.json | 53 ++++++++++++++++--------- package.json | 3 +- pages/index.vue | 4 +- pages/login.vue | 91 +------------------------------------------ plugins/utils.js | 8 ++++ schemes/foursquare.js | 15 ------- store/index.js | 14 +++---- utils/utils.js | 50 ++++++++++++++++++++++++ 13 files changed, 233 insertions(+), 200 deletions(-) create mode 100644 plugins/utils.js delete mode 100644 schemes/foursquare.js create mode 100644 utils/utils.js diff --git a/.prettierrc b/.prettierrc index 4c99de9..8f5c2bf 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,5 +1,4 @@ { - "bracketSpacing": true, "endOfLine": "lf", "htmlWhitespaceSensitivity": "css", "singleAttributePerLine": false, diff --git a/api/swarm.js b/api/swarm.js index 8f0b052..6e651d7 100644 --- a/api/swarm.js +++ b/api/swarm.js @@ -38,12 +38,16 @@ router.get('/authorize' ,(req, res) => { router.get('/users/self' ,async (req, res) => { try { - const auth_token = req.headers?.authorization?.split(' ')[1]; - var response = await axios.get('https://api.foursquare.com/v2/users/self',{ params: { - oauth_token: auth_token, - v: '20220901' - }}) - await res.json(response.data?.response?.user) + //console.log(req.headers.authorization); + const auth_token = req.headers?.authorization; + //console.log('here') + var response = await axios.get('https://api.foursquare.com/v2/users/self',{ + params: { + oauth_token: auth_token, + v: '20220901' + }}) + + await res.json(response.data?.response) } catch (error) { console.log(error) diff --git a/assets/scss/main.scss b/assets/scss/main.scss index d7fbb28..5367593 100644 --- a/assets/scss/main.scss +++ b/assets/scss/main.scss @@ -2,10 +2,96 @@ @import '_fonts.scss'; */ -@import '~bootstrap/scss/bootstrap'; /* these are the important lines for this task */ +@import "~bootstrap/scss/bootstrap"; /* these are the important lines for this task */ @import "bootstrap-icons/font/bootstrap-icons.css"; /* these are the important lines for this task */ /* if you want to override @import '_mixins.scss'; @import '_variables.scss'; -*/ \ No newline at end of file +*/ + +.swarm-img { + aspect-ratio: 1/1; + height: 34px; + display: inline-block; + background: white; + -webkit-mask: url("@/assets/images/swarm.png") center/contain; + mask: url("@/assets/images/swarm.png") center/contain; + -webkit-mask-repeat: no-repeat; + mask-repeat: no-repeat; +} + +body { + background-color: #f5f5f5; +} + +.form-signin { + max-width: 330px; + padding: 15px; + + .form-floating:focus-within { + z-index: 2; + } + + input[type="email"] { + margin-bottom: -1px; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + + input[type="password"] { + margin-bottom: 10px; + border-top-left-radius: 0; + border-top-right-radius: 0; + } +} + +.bd-placeholder-img { + font-size: 1.125rem; + text-anchor: middle; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; +} + +@media (min-width: 768px) { + .bd-placeholder-img-lg { + font-size: 3.5rem; + } +} + +.b-example-divider { + height: 3rem; + background-color: rgba(0, 0, 0, 0.1); + border: solid rgba(0, 0, 0, 0.15); + border-width: 1px 0; + box-shadow: inset 0 0.5em 1.5em rgba(0, 0, 0, 0.1), inset 0 0.125em 0.5em rgba(0, 0, 0, 0.15); +} + +.b-example-vr { + flex-shrink: 0; + width: 1.5rem; + height: 100vh; +} + +.bi { + vertical-align: -0.125em; + fill: currentColor; +} + +.nav-scroller { + position: relative; + z-index: 2; + height: 2.75rem; + overflow-y: hidden; + .nav { + display: flex; + flex-wrap: nowrap; + padding-bottom: 1rem; + margin-top: -1px; + overflow-x: auto; + text-align: center; + white-space: nowrap; + -webkit-overflow-scrolling: touch; + } +} diff --git a/components/Home.vue b/components/Home.vue index 20df0ea..08e3abe 100644 --- a/components/Home.vue +++ b/components/Home.vue @@ -1,60 +1,37 @@ diff --git a/nuxt.config.js b/nuxt.config.js index d2ca59c..3e2ddc6 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -26,9 +26,8 @@ export default { ], plugins: [ - { - src: '~/plugins/bootstrap.client.js' - }, + {src: '~/plugins/bootstrap.client.js'}, + {src: '~/plugins/utils.js'}, ], components: true, @@ -83,16 +82,14 @@ export default { scheme: "oauth2", responseType: 'code', clientId: 'OUYWUC4AHY4VSFCWA0EB055U3V4A01WYGRSAZ0MXLS0JKCUA', - clientSecret: 'DK3KXOIRRPM3CGGXUYHEDTPVJDDNPDGDE0GYHUBWRCPNQLAG', redirectUri: 'http://localhost:3000/login', codeChallengeMethod: '', accessType: 'offline', token: { property: 'access_token', - type: 'Bearer', + type: '', maxAge: 1800, }, - endpoints: { authorization: "https://foursquare.com/oauth2/authenticate", token: "http://localhost:3000/api/swarm/access_token", diff --git a/package-lock.json b/package-lock.json index 154c8e6..1acb6f1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,8 +14,9 @@ "@nuxtjs/proxy": "^2.1.0", "@popperjs/core": "^2.11.5", "body-parser": "^1.20.0", - "bootstrap": "^5.1.3", + "bootstrap": "^5.2.2", "bootstrap-icons": "^1.8.1", + "bootstrap-sass": "^3.4.3", "connect-timeout": "^1.9.0", "cookie": "^0.5.0", "core-js": "^3.19.3", @@ -3647,9 +3648,9 @@ "integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==" }, "node_modules/@popperjs/core": { - "version": "2.11.5", - "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", - "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==", + "version": "2.11.6", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz", + "integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==", "funding": { "type": "opencollective", "url": "https://opencollective.com/popperjs" @@ -4910,15 +4911,21 @@ "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" }, "node_modules/bootstrap": { - "version": "5.1.3", - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.3.tgz", - "integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==", - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/bootstrap" - }, + "version": "5.2.2", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.2.tgz", + "integrity": "sha512-dEtzMTV71n6Fhmbg4fYJzQsw1N29hJKO1js5ackCgIpDcGid2ETMGC6zwSYw09v05Y+oRdQ9loC54zB1La3hHQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ], "peerDependencies": { - "@popperjs/core": "^2.10.2" + "@popperjs/core": "^2.11.6" } }, "node_modules/bootstrap-icons": { @@ -4929,6 +4936,11 @@ "node": ">=10" } }, + "node_modules/bootstrap-sass": { + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/bootstrap-sass/-/bootstrap-sass-3.4.3.tgz", + "integrity": "sha512-vPgFnGMp1jWZZupOND65WS6mkR8rxhJxndT/AcMbqcq1hHMdkcH4sMPhznLzzoHOHkSCrd6J9F8pWBriPCKP2Q==" + }, "node_modules/boxen": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.1.2.tgz", @@ -19270,9 +19282,9 @@ "integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==" }, "@popperjs/core": { - "version": "2.11.5", - "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", - "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==" + "version": "2.11.6", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz", + "integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==" }, "@protobufjs/aspromise": { "version": "1.1.2", @@ -20323,9 +20335,9 @@ "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" }, "bootstrap": { - "version": "5.1.3", - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.3.tgz", - "integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==", + "version": "5.2.2", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.2.tgz", + "integrity": "sha512-dEtzMTV71n6Fhmbg4fYJzQsw1N29hJKO1js5ackCgIpDcGid2ETMGC6zwSYw09v05Y+oRdQ9loC54zB1La3hHQ==", "requires": {} }, "bootstrap-icons": { @@ -20333,6 +20345,11 @@ "resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.8.1.tgz", "integrity": "sha512-IXUqislddPJfwq6H+2nTkHyr9epO9h6u1AG0OZCx616w+TgzeoCjfmI3qJMQqt1J586gN2IxzB4M99Ip4sTZ1w==" }, + "bootstrap-sass": { + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/bootstrap-sass/-/bootstrap-sass-3.4.3.tgz", + "integrity": "sha512-vPgFnGMp1jWZZupOND65WS6mkR8rxhJxndT/AcMbqcq1hHMdkcH4sMPhznLzzoHOHkSCrd6J9F8pWBriPCKP2Q==" + }, "boxen": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.1.2.tgz", diff --git a/package.json b/package.json index bd8ce3f..0133b0b 100644 --- a/package.json +++ b/package.json @@ -15,8 +15,9 @@ "@nuxtjs/proxy": "^2.1.0", "@popperjs/core": "^2.11.5", "body-parser": "^1.20.0", - "bootstrap": "^5.1.3", + "bootstrap": "^5.2.2", "bootstrap-icons": "^1.8.1", + "bootstrap-sass": "^3.4.3", "connect-timeout": "^1.9.0", "cookie": "^0.5.0", "core-js": "^3.19.3", diff --git a/pages/index.vue b/pages/index.vue index f3a078b..f476ee9 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -4,6 +4,8 @@ diff --git a/pages/login.vue b/pages/login.vue index 80c1176..40333bd 100644 --- a/pages/login.vue +++ b/pages/login.vue @@ -25,93 +25,4 @@ export default { }, } - - - \ No newline at end of file + \ No newline at end of file diff --git a/plugins/utils.js b/plugins/utils.js new file mode 100644 index 0000000..17419ec --- /dev/null +++ b/plugins/utils.js @@ -0,0 +1,8 @@ +import myUtils from '~/utils/utils'; + +export default (ctx, inject) => { + // inject the repository in the context (ctx.app.$repository) + // And in the Vue instances (this.$repository in your components) + const utilsWithAxios = myUtils(ctx.$firebase) + inject('myUtils', utilsWithAxios()) +} diff --git a/schemes/foursquare.js b/schemes/foursquare.js deleted file mode 100644 index 403ce29..0000000 --- a/schemes/foursquare.js +++ /dev/null @@ -1,15 +0,0 @@ -import ha from '~auth/authModule' - -module.exports = function foursquare(nuxt, strategy) { - const DEFAULTS = { - scheme: "oauth2", - endpoints: { - authorization: "https://foursquare.com/oauth2/authenticate", - token: "https://foursquare.com/oauth2/access_token", - userInfo: "https://api.foursquare.com/v2/users/self" - }, - grantType: "authorization_code", - }; - ha.assignDefaults(strategy, DEFAULTS); - ha.addAuthorize(nuxt, strategy, true); -} diff --git a/store/index.js b/store/index.js index 2288397..ae770c8 100644 --- a/store/index.js +++ b/store/index.js @@ -2,6 +2,7 @@ var cookie = require('cookie'); export const actions = { async nuxtServerInit({commit}, {req}) { + console.log('loggedin', this.$auth.loggedIn) let auth = null if (req.headers.cookie) { @@ -12,18 +13,13 @@ export const actions = { try { // check data user login with cookie //console.log('haha') - let token = cookies['auth._token.social'].replace('Bearer ','') + //let token = cookies['auth._token.social'].replace('Bearer ','') //console.log('token from cookie', token) //console.log('getUrl', token) - const { data } = await this.$axios.get('fsapi/users/self/', { - params: { - oauth_token: token, - v: '20220901' - } - }) + //console.log('haha', data) // server return the data is cookie valid loggedIn is true - auth = data.data // set the data auth + //auth = data.data // set the data auth } catch (err) { // No valid cookie found @@ -33,7 +29,7 @@ export const actions = { // How we can set the user for AuthNuxt // Source: https://auth.nuxtjs.org/api/auth - this.$auth.setUser(auth); + //this.$auth.setUser(auth); }, } \ No newline at end of file diff --git a/utils/utils.js b/utils/utils.js new file mode 100644 index 0000000..105e705 --- /dev/null +++ b/utils/utils.js @@ -0,0 +1,50 @@ +// * with help of Alexander Lichter, Apr 18, 2020, https://blog.lichter.io/posts/nuxt-api-call-organization-and-decoupling/ +export default $firebase => () => ({ + + async createUserInFirebase() { + const userRef = $firebase.firestore.collection("users").doc($auth.user.user.id); + + try { + await userRef.set({ + user: $auth.user.user, + token: $auth.strategy.token.get(), + date: new Date(Date.now()), + }); + } catch (e) { + console.log(e); + } + }, + + async getUserFromFirebase(){ + + }, + + async getConfigsFromFirebase(){ + const configsRef = $firebase.firestore.collection("configs").doc($auth.user.user.id); + + try { + userConfigs = await configsRef.get(); + //console.log(userConfigs); + if (!userConfigs.exists) { + console.log('No such document!'); + } + else { + console.log('Document data:', userConfigs.data()); + return userConfigs.data(); + } + } + catch (e) { + console.log(e); + return null; + } + }, + + async setConfigsInFirebase(){ + + }, + + + + +}); +