bit-badger/myPrayerJournal
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases 36 Activity

+Vuex +ElementUI +Pug

Browse Source 
- Log on now works, storing user profile in vuex state
- Templates in Pug = awesome
This commit is contained in:
Daniel J. Summers 2017-08-05 22:48:09 -05:00
parent 338f11d1ab
commit 196db30cc5
13 changed files with 506 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

349
src/app/package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "djs-consulting",
"version": "1.0.0",
"name": "my-prayer-journal",
"version": "0.8.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@ -51,6 +51,21 @@
}
}
},
"acorn-globals": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
"integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8=",
"requires": {
"acorn": "4.0.13"
},
"dependencies": {
"acorn": {
"version": "4.0.13",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
"integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
}
}
},
"acorn-jsx": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-3.0.1.tgz",
@ -236,6 +251,11 @@
"resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
"integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
},
"asap": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
"integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
},
"asn1": {
"version": "0.2.3",
"resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
@ -295,6 +315,11 @@
"integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0=",
"dev": true
},
"async-validator": {
"version": "1.6.9",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-1.6.9.tgz",
"integrity": "sha1-qDCdqouDQhzb1GKOAm1quyUZLTQ="
},
"asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
@ -581,6 +606,11 @@
"babel-types": "6.25.0"
}
},
"babel-helper-vue-jsx-merge-props": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-2.0.2.tgz",
"integrity": "sha1-rOscNzWIJ54nVeoc/TXCI5T9M/g="
},
"babel-helpers": {
"version": "6.24.1",
"resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz",
@ -1572,6 +1602,14 @@
"supports-color": "4.2.1"
}
},
"character-parser": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/character-parser/-/character-parser-2.2.0.tgz",
"integrity": "sha1-x84o821LzZdE5f/CxfzeHHMmH8A=",
"requires": {
"is-regex": "1.0.4"
}
},
"chokidar": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
@ -1911,6 +1949,22 @@
}
}
},
"constantinople": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/constantinople/-/constantinople-3.1.0.tgz",
"integrity": "sha1-dWnKqKo/jVk11i4fqW+fcCzYHHk=",
"requires": {
"acorn": "3.3.0",
"is-expression": "2.1.0"
},
"dependencies": {
"acorn": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
"integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
}
}
},
"constants-browserify": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
@ -2551,6 +2605,11 @@
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
"integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
},
"deepmerge": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.0.tgz",
"integrity": "sha512-Hm4+NyDQGgH3oYhKqR0gd99veBBZpnEUNoEfFl+3PRkQL+LKGJEBgqimeofAWzUn6aBzcaYPJrRigto/WfDzTg=="
},
"defined": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
@ -2663,6 +2722,11 @@
"isarray": "1.0.0"
}
},
"doctypes": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/doctypes/-/doctypes-1.1.0.tgz",
"integrity": "sha1-6oCxBqh1OHdOijpKWv4pPeSJ4Kk="
},
"dom-converter": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.1.4.tgz",
@ -2834,6 +2898,17 @@
"integrity": "sha1-0OAmc1dUdwkBrjAaIWZMukXZL30=",
"dev": true
},
"element-ui": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/element-ui/-/element-ui-1.4.1.tgz",
"integrity": "sha512-4jZu41iMuV8Semz0MG7nd8HIicyXlMJY923NvuIXoM3Q3llnwpwBVBqaPAgL3VrRnwzLKxyR/GjxxQDBqf/bvQ==",
"requires": {
"async-validator": "1.6.9",
"babel-helper-vue-jsx-merge-props": "2.0.2",
"deepmerge": "1.5.0",
"throttle-debounce": "1.0.1"
}
},
"elliptic": {
"version": "6.4.0",
"resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
@ -3899,8 +3974,7 @@
"function-bind": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz",
"integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E=",
"dev": true
"integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
},
"generate-function": {
"version": "2.0.0",
@ -4024,8 +4098,7 @@
"graceful-readlink": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
"integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
"dev": true
"integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
},
"growl": {
"version": "1.9.2",
@ -4410,7 +4483,6 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz",
"integrity": "sha1-hGFzP1OLCDfJNh45qauelwTcLyg=",
"dev": true,
"requires": {
"function-bind": "1.1.0"
}
@ -4942,6 +5014,22 @@
"is-primitive": "2.0.0"
}
},
"is-expression": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/is-expression/-/is-expression-2.1.0.tgz",
"integrity": "sha1-kb6dR968/vB3l36XIr5tz7RGXvA=",
"requires": {
"acorn": "3.3.0",
"object-assign": "4.1.1"
},
"dependencies": {
"acorn": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
"integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
}
}
},
"is-extendable": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
@ -5038,11 +5126,24 @@
"integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
"dev": true
},
"is-promise": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
"integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o="
},
"is-property": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
"integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
},
"is-regex": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
"integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE=",
"requires": {
"has": "1.0.1"
}
},
"is-resolvable": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.0.0.tgz",
@ -5228,6 +5329,11 @@
"nopt": "3.0.6"
}
},
"js-stringify": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz",
"integrity": "sha1-Fzb939lyTyijaCrcYjCufk6Weds="
},
"js-tokens": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
@ -5334,6 +5440,15 @@
}
}
},
"jstransformer": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/jstransformer/-/jstransformer-1.0.0.tgz",
"integrity": "sha1-7Yvwkh4vPx7U1cGkT2hwntJHIsM=",
"requires": {
"is-promise": "2.1.0",
"promise": "7.3.1"
}
},
"karma": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/karma/-/karma-1.7.0.tgz",
@ -6950,8 +7065,7 @@
"path-parse": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
"integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
"dev": true
"integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME="
},
"path-to-regexp": {
"version": "0.1.7",
@ -9030,6 +9144,14 @@
"resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz",
"integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74="
},
"promise": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
"integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
"requires": {
"asap": "2.0.6"
}
},
"proto-list": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
@ -9095,6 +9217,180 @@
"randombytes": "2.0.5"
}
},
"pug": {
"version": "2.0.0-rc.2",
"resolved": "https://registry.npmjs.org/pug/-/pug-2.0.0-rc.2.tgz",
"integrity": "sha1-B4RVJ3kKssa+Z9z16x8xgECB8Eo=",
"requires": {
"pug-code-gen": "1.1.1",
"pug-filters": "2.1.3",
"pug-lexer": "3.1.0",
"pug-linker": "3.0.1",
"pug-load": "2.0.7",
"pug-parser": "3.0.0",
"pug-runtime": "2.0.3",
"pug-strip-comments": "1.0.2"
}
},
"pug-attrs": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/pug-attrs/-/pug-attrs-2.0.2.tgz",
"integrity": "sha1-i+KyIlVo/6ddG4Zpgr/59BEa/8s=",
"requires": {
"constantinople": "3.1.0",
"js-stringify": "1.0.2",
"pug-runtime": "2.0.3"
}
},
"pug-code-gen": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-1.1.1.tgz",
"integrity": "sha1-HPcnRO8qA56uajNAyqoRBYcSWOg=",
"requires": {
"constantinople": "3.1.0",
"doctypes": "1.1.0",
"js-stringify": "1.0.2",
"pug-attrs": "2.0.2",
"pug-error": "1.3.2",
"pug-runtime": "2.0.3",
"void-elements": "2.0.1",
"with": "5.1.1"
}
},
"pug-error": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/pug-error/-/pug-error-1.3.2.tgz",
"integrity": "sha1-U659nSm7A89WRJOgJhCfVMR/XyY="
},
"pug-filters": {
"version": "2.1.3",
"resolved": "https://registry.npmjs.org/pug-filters/-/pug-filters-2.1.3.tgz",
"integrity": "sha1-1ZdnoiDeeX3XVUifZoNM+aqDqlQ=",
"requires": {
"clean-css": "3.4.28",
"constantinople": "3.1.0",
"jstransformer": "1.0.0",
"pug-error": "1.3.2",
"pug-walk": "1.1.3",
"resolve": "1.3.3",
"uglify-js": "2.8.29"
},
"dependencies": {
"clean-css": {
"version": "3.4.28",
"resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.28.tgz",
"integrity": "sha1-vxlF6C/ICPVWlebd6uwBQA79A/8=",
"requires": {
"commander": "2.8.1",
"source-map": "0.4.4"
}
},
"commander": {
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
"integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ=",
"requires": {
"graceful-readlink": "1.0.1"
}
},
"source-map": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
"integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
"requires": {
"amdefine": "1.0.1"
}
},
"uglify-js": {
"version": "2.8.29",
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
"integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
"requires": {
"source-map": "0.5.6",
"uglify-to-browserify": "1.0.2",
"yargs": "3.10.0"
},
"dependencies": {
"source-map": {
"version": "0.5.6",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
"integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
}
}
}
}
},
"pug-lexer": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/pug-lexer/-/pug-lexer-3.1.0.tgz",
"integrity": "sha1-/QhzdtSmdbT1n4/vQiiDQ06VgaI=",
"requires": {
"character-parser": "2.2.0",
"is-expression": "3.0.0",
"pug-error": "1.3.2"
},
"dependencies": {
"acorn": {
"version": "4.0.13",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
"integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
},
"is-expression": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/is-expression/-/is-expression-3.0.0.tgz",
"integrity": "sha1-Oayqa+f9HzRx3ELHQW5hwkMXrJ8=",
"requires": {
"acorn": "4.0.13",
"object-assign": "4.1.1"
}
}
}
},
"pug-linker": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/pug-linker/-/pug-linker-3.0.1.tgz",
"integrity": "sha1-uj+P8hPKjzowSFm0T+0Tynud+hk=",
"requires": {
"pug-error": "1.3.2",
"pug-walk": "1.1.3"
}
},
"pug-load": {
"version": "2.0.7",
"resolved": "https://registry.npmjs.org/pug-load/-/pug-load-2.0.7.tgz",
"integrity": "sha1-Ux0MbhFUYBDphGMNA99AY2fS3nc=",
"requires": {
"object-assign": "4.1.1",
"pug-walk": "1.1.3"
}
},
"pug-parser": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/pug-parser/-/pug-parser-3.0.0.tgz",
"integrity": "sha1-N8YZ3YAPZCGHzk1s4aFkzddUh6M=",
"requires": {
"pug-error": "1.3.2",
"token-stream": "0.0.1"
}
},
"pug-runtime": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/pug-runtime/-/pug-runtime-2.0.3.tgz",
"integrity": "sha1-mBYmB7D86eJU1CfzOYelrucWi9o="
},
"pug-strip-comments": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/pug-strip-comments/-/pug-strip-comments-1.0.2.tgz",
"integrity": "sha1-0xOvoBvMN0mA4TmeI+vy65vchRM=",
"requires": {
"pug-error": "1.3.2"
}
},
"pug-walk": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/pug-walk/-/pug-walk-1.1.3.tgz",
"integrity": "sha1-181bI9s8qHxjbIaglz+c2OAwQ2w="
},
"punycode": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
@ -9592,7 +9888,6 @@
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
"integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
"dev": true,
"requires": {
"path-parse": "1.0.5"
}
@ -10421,6 +10716,11 @@
"resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
},
"throttle-debounce": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.0.1.tgz",
"integrity": "sha1-2tD+Ew+drzcZ/eoz3Dao5rp/MLU="
},
"throttleit": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
@ -10487,6 +10787,11 @@
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
"integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc="
},
"token-stream": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/token-stream/-/token-stream-0.0.1.tgz",
"integrity": "sha1-zu78cXp2xDFvEm0LnbqlXX598Bo="
},
"toposort": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/toposort/-/toposort-1.0.3.tgz",
@ -10799,8 +11104,7 @@
"void-elements": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
"integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w=",
"dev": true
"integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
},
"vue": {
"version": "2.4.2",
@ -10921,6 +11225,11 @@
"integrity": "sha512-j3TBDtjqz7pC9XUzeSeqF5oekqPahxyUHsdG+kZKDH/V/DTexq5inYdLGstnqCUljoLC9LTj3H/5hmyToeSd1A==",
"dev": true
},
"vuex": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-2.3.1.tgz",
"integrity": "sha1-zejpl8H5lXcZvH3qFU+appHZgaY="
},
"watchpack": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
@ -11217,6 +11526,22 @@
"resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
"integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
},
"with": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/with/-/with-5.1.1.tgz",
"integrity": "sha1-+k2qktrzLE6pTtRTyB8EaGtXXf4=",
"requires": {
"acorn": "3.3.0",
"acorn-globals": "3.1.0"
},
"dependencies": {
"acorn": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
"integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
}
}
},
"wordwrap": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",

7
src/app/package.json
View File

@ -14,11 +14,12 @@
"lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
},
"dependencies": {
"EventEmitter": "^1.0.0",
"auth0-js": "^8.8.0",
"bootstrap-vue": "^0.18.0",
"element-ui": "^1.4.1",
"pug": "^2.0.0-rc.2",
"vue": "^2.3.3",
"vue-router": "^2.6.0"
"vue-router": "^2.6.0",
"vuex": "^2.3.1"
},
"devDependencies": {
"autoprefixer": "^7.1.2",

34
src/app/src/App.vue
View File

@ -1,37 +1,17 @@
<template>
<div id="app">
<navigation :auth="auth" />
<div id="content" class="container">
<router-view :auth="auth"></router-view>
</div>
<footer>
<p class="text-right"><i>myPrayerJournal v0.8.0</i></p>
</footer>
</div>
<template lang="pug">
#app
navigation
#content.container
router-view
footer
p.text-right: i myPrayerJournal v0.8.0
</template>
<script>
import AuthService from './auth/AuthService'
import Navigation from './components/Navigation.vue'
const auth = new AuthService()
const { login, logout, authenticated, authNotifier } = auth
export default {
name: 'app',
data: function () {
authNotifier.on('authChange', authState => {
this.authenticated = authState.authenticated
})
return {
auth,
authenticated
}
},
methods: {
login,
logout
},
components: {
Navigation
}

0
src/app/src/api/Api.js Normal file
View File

59
src/app/src/auth/AuthService.js
View File

@ -1,11 +1,9 @@
import auth0 from 'auth0-js'
import { AUTH_CONFIG } from './auth0-variables'
import EventEmitter from 'EventEmitter'
import router from './../router'
import * as types from '@/store/mutation-types'
export default class AuthService {
authenticated = this.isAuthenticated()
authNotifier = new EventEmitter()
constructor () {
this.login = this.login.bind(this)
@ -20,23 +18,61 @@ export default class AuthService {
redirectUri: AUTH_CONFIG.callbackUrl,
audience: `https://${AUTH_CONFIG.domain}/userinfo`,
responseType: 'token id_token',
scope: 'openid'
scope: 'openid profile email'
})
login () {
this.auth0.authorize()
}
handleAuthentication () {
/**
* Promisified parseHash function
*/
parseHash () {
return new Promise((resolve, reject) => {
this.auth0.parseHash((err, authResult) => {
if (err) {
reject(err)
} else {
resolve(authResult)
}
})
})
}
/**
* Promisified userInfo function
*
* @param token The auth token from the login result
*/
userInfo (token) {
return new Promise((resolve, reject) => {
this.auth0.client.userInfo(token, (err, user) => {
if (err) {
reject(err)
} else {
resolve(user)
}
})
})
}
handleAuthentication (store, router) {
this.parseHash()
.then(authResult => {
if (authResult && authResult.accessToken && authResult.idToken) {
this.setSession(authResult)
this.userInfo(authResult.accessToken)
.then(user => {
store.commit(types.USER_LOGGED_ON, user)
router.replace('/dashboard')
} else if (err) {
})
}
})
.catch(err => {
router.replace('/')
console.log(err)
alert(`Error: ${err.error}. Check the console for further details.`)
}
})
}
@ -48,17 +84,16 @@ export default class AuthService {
localStorage.setItem('access_token', authResult.accessToken)
localStorage.setItem('id_token', authResult.idToken)
localStorage.setItem('expires_at', expiresAt)
this.authNotifier.emit('authChange', { authenticated: true })
}
logout () {
logout (store, router) {
// Clear access token and ID token from local storage
localStorage.removeItem('access_token')
localStorage.removeItem('id_token')
localStorage.removeItem('expires_at')
this.userProfile = null
this.authNotifier.emit('authChange', false)
localStorage.setItem('user_profile', JSON.stringify({}))
// navigate to the home route
store.commit(types.USER_LOGGED_OFF)
router.replace('/')
}

20
src/app/src/components/Dashboard.vue
View File

@ -1,21 +1,23 @@
<template>
<article>
<page-title title="Your Dashboard" />
<p>here you are! {{ JSON.stringify(this.user) }}</p>
</article>
<template lang="pug">
article
page-title(:title="title")
p here you are!
</template>
<script>
import { mapState } from 'vuex'
import PageTitle from './PageTitle'
export default {
name: 'dashboard',
props: ['user'],
data () {
return {}
},
components: {
PageTitle
},
computed: {
title () {
return `${this.user.given_name}'s Dashboard`
},
...mapState(['user'])
}
}
</script>

32
src/app/src/components/Home.vue
View File

@ -1,22 +1,15 @@
<template>
<article>
<page-title title="Welcome!" hideOnPage="true" />
<div class="row">
<div class="col">
<p>&nbsp;</p>
<p>
myPrayerJournal is a place where individuals can record their prayer requests, record that they prayed for
them, update them as God moves in the situation, and record a final answer received on that request.&nbsp; It
will also allow individuals to review their answered prayers.
</p>
<p>
This site is currently in very limited alpha, as it is being developed with a core group of test users.&nbsp;
If this is something in which you are interested, check back around mid-November 2017 for an update on the
<template lang="pug">
article
page-title(title="Welcome!" hideOnPage="true")
p &nbsp;
p.
myPrayerJournal is a place where individuals can record their prayer requests, record that they prayed for them,
update them as God moves in the situation, and record a final answer received on that request.&nbsp; It will also
allow individuals to review their answered prayers.
p.
This site is currently in very limited alpha, as it is being developed with a core group of test users.&nbsp; If
this is something in which you are interested, check back around mid-November 2017 for an update on the
development progress.
</p>
</div>
</div>
</article>
</template>
<script>
@ -24,9 +17,6 @@ import PageTitle from './PageTitle.vue'
export default {
name: 'home',
data () {
return {}
},
components: {
PageTitle
}

50
src/app/src/components/Navigation.vue
View File

@ -1,25 +1,41 @@
<template>
<b-navbar toggleable type="inverse" variant="inverse" fixed="top">
<b-nav-toggle target="navCollapse"></b-nav-toggle>
<b-link class="navbar-brand" :to="{ name: 'Home' }">
<span style="font-weight:100;">my</span><span style="font-weight:600;">Prayer</span><span style="font-weight:700;">Journal</span>
</b-link>
<b-collapse is-nav id="navCollapse">
<b-nav is-nav-bar>
<b-nav-item v-if="auth.authenticated" :to="{ name: 'Dashboard' }">Dashboard</b-nav-item>
<b-nav-item v-if="auth.authenticated" @click="auth.logout()">Log Off</b-nav-item>
<b-nav-item v-if="!auth.authenticated" @click="auth.login()">Log On</b-nav-item>
</b-nav>
</b-collapse>
</b-navbar>
<template lang="pug">
el-menu(theme="dark" mode="horizontal" class="mpj-top-nav" router=true)
el-menu-item(index="/")
span(style="font-weight:100;") my
span(style="font-weight:600;") Prayer
span(style="font-weight:700;") Journal
el-menu-item(v-if="isAuthenticated" index="/dashboard") Dashboard
el-menu-item(v-if="isAuthenticated" index="3"): a(@click.stop="logOff()") Log Off
el-menu-item(v-if="!isAuthenticated" index="4"): a(@click.stop="logOn()") Log On
</template>
<script>
import { mapState } from 'vuex'
import AuthService from '@/auth/AuthService'
export default {
name: 'navigation',
props: ['auth'],
data: function () {
return { }
data () {
return {
auth0: new AuthService()
}
},
methods: {
logOn () {
this.auth0.login()
},
logOff () {
this.auth0.logout(this.$store, this.$router)
}
},
computed: mapState(['isAuthenticated'])
}
</script>
<style scoped>
.mpj-top-nav {
position: fixed;
top: 0px;
width: 100%;
}
</style>

7
src/app/src/components/PageTitle.vue
View File

@ -1,14 +1,11 @@
<template>
<h2 v-if="!hideOnPage" class="mpj-page-title" v-html="title"></h2>
<template lang="pug">
h2.mpj-page-title(v-if="!hideOnPage" v-html="title")
</template>
<script>
export default {
name: 'page-title',
props: ['title', 'hideOnPage'],
data () {
return {}
},
created () {
document.title = `${this.title} « myPrayerJournal`
},

5
src/app/src/components/user/LogOn.vue
View File

@ -3,11 +3,12 @@
</template>
<script>
import AuthService from '@/auth/AuthService'
export default {
name: 'log-on',
props: ['auth'],
data () {
this.auth.handleAuthentication()
new AuthService().handleAuthentication(this.$store, this.$router)
return {}
}
}

8
src/app/src/main.js
View File

@ -1,18 +1,22 @@
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
import App from './App'
import router from './router'
import store from './store'
Vue.config.productionTip = false
Vue.use(BootstrapVue)
Vue.use(ElementUI)
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
store,
template: '<App/>',
components: { App }
})

31
src/app/src/store/index.js Normal file
View File

@ -0,0 +1,31 @@
import Vue from 'vue'
import Vuex from 'vuex'
import AuthService from '@/auth/AuthService'
import * as types from './mutation-types'
Vue.use(Vuex)
this.auth0 = new AuthService()
export default new Vuex.Store({
state: {
user: JSON.parse(localStorage.getItem('user_profile') || '{}'),
isAuthenticated: this.auth0.isAuthenticated()
},
mutations: {
[types.USER_LOGGED_ON] (state, user) {
localStorage.setItem('user_profile', JSON.stringify(user))
state.user = user
state.isAuthenticated = true
},
[types.USER_LOGGED_OFF] (state) {
state.user = {}
state.isAuthenticated = false
}
},
actions: {},
getters: {},
modules: {}
})

2
src/app/src/store/mutation-types.js Normal file
View File

@ -0,0 +1,2 @@
export const USER_LOGGED_OFF = 'user-logged-out'
export const USER_LOGGED_ON = 'user-logged-on'