Joururi/spellsaurus
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added ESlint to client and applied rules

Browse Source
This commit is contained in:
Alexis
2021-01-21 11:16:09 +01:00
parent 4b25f63531
commit da6cd44987
33 changed files with 1703 additions and 1077 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
client/.eslintrc.json Normal file
View File

@@ -0,0 +1,33 @@
{
"env": {
"node": true
},
"parserOptions": {
"ecmaVersion": 6,
"ecmaFeatures": {
"impliedStrict": true
}
},
"extends": [
"plugin:vue/vue3-recommended",
"eslint:recommended"
],
"rules": {
"indent": ["error", 2],
"accessor-pairs": "warn",
"array-callback-return": "error",
"brace-style": "warn",
"consistent-return": "error",
"default-case": "error",
"eqeqeq": "warn",
"no-case-declarations": "error",
"no-empty-pattern": "warn",
"no-fallthrough": "error",
"no-unused-vars": "error",
"no-useless-catch": "error",
"no-var": "error",
"semi": "warn",
"no-extra-semi": "error",
"yoda": "warn"
}
}

8
client/babel.config.js
View File

@@ -1,5 +1,5 @@
module.exports = { module.exports = {
presets: [ presets: [
'@vue/cli-plugin-babel/preset' '@vue/cli-plugin-babel/preset'
], ],
} };

247
client/package-lock.json generated
View File

@@ -2240,34 +2240,11 @@
"dev": true "dev": true
}, },
"axios": { "axios": {
"version": "0.19.2", "version": "0.21.1",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
"integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==", "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
"requires": { "requires": {
"follow-redirects": "1.5.10" "follow-redirects": "^1.10.0"
},
"dependencies": {
"debug": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"requires": {
"ms": "2.0.0"
}
},
"follow-redirects": {
"version": "1.5.10",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
"requires": {
"debug": "=3.1.0"
}
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
}
} }
}, },
"babel-eslint": { "babel-eslint": {
@@ -4614,12 +4591,11 @@
"dev": true "dev": true
}, },
"ansi-styles": { "ansi-styles": {
"version": "4.2.1", "version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/color-name": "^1.1.1",
"color-convert": "^2.0.1" "color-convert": "^2.0.1"
} }
}, },
@@ -4632,6 +4608,12 @@
"restore-cursor": "^3.1.0" "restore-cursor": "^3.1.0"
} }
}, },
"cli-width": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/cli-width/-/cli-width-3.0.0.tgz",
"integrity": "sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==",
"dev": true
},
"color-convert": { "color-convert": {
"version": "2.0.1", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -4648,15 +4630,32 @@
"dev": true "dev": true
}, },
"eslint-scope": { "eslint-scope": {
"version": "5.0.0", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.0.0.tgz", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
"integrity": "sha512-oYrhJW7S0bxAFDvWqzvMPRm6pcgcnWc4QnofCAqRTRfQC0JcwenzGglTtsLyIuuWFfkqDG9vz67cnttSd53djw==", "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
"dev": true, "dev": true,
"requires": { "requires": {
"esrecurse": "^4.1.0", "esrecurse": "^4.3.0",
"estraverse": "^4.1.1" "estraverse": "^4.1.1"
} }
}, },
"esrecurse": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
"integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
"dev": true,
"requires": {
"estraverse": "^5.2.0"
},
"dependencies": {
"estraverse": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
"integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
"dev": true
}
}
},
"figures": { "figures": {
"version": "3.2.0", "version": "3.2.0",
"resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz", "resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz",
@@ -4667,18 +4666,18 @@
} }
}, },
"glob-parent": { "glob-parent": {
"version": "5.1.0", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.0.tgz", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
"integrity": "sha512-qjtRgnIVmOfnKUE3NJAQEdk+lKrxfw8t5ke7SXtfMTHcjsBfOfWXCQfdb30zfDoZQ2IRSIiidmjtbHZPZ++Ihw==", "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"is-glob": "^4.0.1" "is-glob": "^4.0.1"
} }
}, },
"globals": { "globals": {
"version": "12.3.0", "version": "12.4.0",
"resolved": "https://registry.npmjs.org/globals/-/globals-12.3.0.tgz", "resolved": "https://registry.npmjs.org/globals/-/globals-12.4.0.tgz",
"integrity": "sha512-wAfjdLgFsPZsklLJvOBUBmzYE8/CwhEqSBEMRXA3qxIiNtyqvjYurAtIfDh6chlEPUfmTY3MnZh5Hfh4q0UlIw==", "integrity": "sha512-BWICuzzDvDoH54NHKCseDanAhE3CeDorgDL5MT6LMXXj2WCnd9UC2szdk4AWLfjdgNBCXLUanXYcpBBKOSWGwg==",
"dev": true, "dev": true,
"requires": { "requires": {
"type-fest": "^0.8.1" "type-fest": "^0.8.1"
@@ -4691,9 +4690,9 @@
"dev": true "dev": true
}, },
"import-fresh": { "import-fresh": {
"version": "3.2.1", "version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.2.1.tgz", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
"integrity": "sha512-6e1q1cnWP2RXD9/keSkxHScg508CdXqXWgWBaETNhyuBFz+kUZlKboh+ISK+bU++DmbHimVBrOz/zzPe0sZ3sQ==", "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==",
"dev": true, "dev": true,
"requires": { "requires": {
"parent-module": "^1.0.0", "parent-module": "^1.0.0",
@@ -4701,30 +4700,30 @@
} }
}, },
"inquirer": { "inquirer": {
"version": "7.0.6", "version": "7.3.3",
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.0.6.tgz", "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.3.3.tgz",
"integrity": "sha512-7SVO4h+QIdMq6XcqIqrNte3gS5MzCCKZdsq9DO4PJziBFNYzP3PGFbDjgadDb//MCahzgjCxvQ/O2wa7kx9o4w==", "integrity": "sha512-JG3eIAj5V9CwcGvuOmoo6LB9kbAYT8HXffUl6memuszlwDC/qvFAJw49XJ5NROSFNPxp3iQg1GqkFhaY/CR0IA==",
"dev": true, "dev": true,
"requires": { "requires": {
"ansi-escapes": "^4.2.1", "ansi-escapes": "^4.2.1",
"chalk": "^3.0.0", "chalk": "^4.1.0",
"cli-cursor": "^3.1.0", "cli-cursor": "^3.1.0",
"cli-width": "^2.0.0", "cli-width": "^3.0.0",
"external-editor": "^3.0.3", "external-editor": "^3.0.3",
"figures": "^3.0.0", "figures": "^3.0.0",
"lodash": "^4.17.15", "lodash": "^4.17.19",
"mute-stream": "0.0.8", "mute-stream": "0.0.8",
"run-async": "^2.4.0", "run-async": "^2.4.0",
"rxjs": "^6.5.3", "rxjs": "^6.6.0",
"string-width": "^4.1.0", "string-width": "^4.1.0",
"strip-ansi": "^6.0.0", "strip-ansi": "^6.0.0",
"through": "^2.3.6" "through": "^2.3.6"
}, },
"dependencies": { "dependencies": {
"chalk": { "chalk": {
"version": "3.0.0", "version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==", "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
"dev": true, "dev": true,
"requires": { "requires": {
"ansi-styles": "^4.1.0", "ansi-styles": "^4.1.0",
@@ -4761,9 +4760,9 @@
"dev": true "dev": true
}, },
"onetime": { "onetime": {
"version": "5.1.0", "version": "5.1.2",
"resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.0.tgz", "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
"integrity": "sha512-5NcSkPHhwTVFIQN+TUqXoS5+dlElHXdpAWu9I0HP20YOtIi+aZ0Ct82jdlILDxjLEAWwvm+qj1m6aEtsDVmm6Q==", "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
"dev": true, "dev": true,
"requires": { "requires": {
"mimic-fn": "^2.1.0" "mimic-fn": "^2.1.0"
@@ -4785,6 +4784,15 @@
"signal-exit": "^3.0.2" "signal-exit": "^3.0.2"
} }
}, },
"rxjs": {
"version": "6.6.3",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
"integrity": "sha512-trsQc+xYYXZ3urjOiJOuCOa5N3jAZ3eiSpQB5hIT8zGlL2QfnHLJ2r7GMkBGuIausdJN1OneaI6gQlsqNHHmZQ==",
"dev": true,
"requires": {
"tslib": "^1.9.0"
}
},
"semver": { "semver": {
"version": "6.3.0", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
@@ -4831,9 +4839,9 @@
} }
}, },
"supports-color": { "supports-color": {
"version": "7.1.0", "version": "7.2.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.1.0.tgz", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
"integrity": "sha512-oRSIpR8pxT1Wr2FquTNnGet79b3BWljqOuoW/h4oBhxJ/HUbX5nX6JSruTkvXDCFMwDPvsaTTbvMLKZWSy0R5g==", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
"dev": true, "dev": true,
"requires": { "requires": {
"has-flag": "^4.0.0" "has-flag": "^4.0.0"
@@ -4861,14 +4869,50 @@
} }
}, },
"eslint-plugin-vue": { "eslint-plugin-vue": {
"version": "6.2.1", "version": "7.0.0-beta.4",
"resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-6.2.1.tgz", "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.0.0-beta.4.tgz",
"integrity": "sha512-MiIDOotoWseIfLIfGeDzF6sDvHkVvGd2JgkvjyHtN3q4RoxdAXrAMuI3SXTOKatljgacKwpNAYShmcKZa4yZzw==", "integrity": "sha512-yb8Kki8b94a3A1sGum9TyVAkvPfKGPzWfZcXRmA2Tylt7TRi+b6mOtn1o6kM3NWatBs5gcGiCrH033DDPn0Msw==",
"dev": true, "dev": true,
"requires": { "requires": {
"eslint-utils": "^2.1.0",
"natural-compare": "^1.4.0", "natural-compare": "^1.4.0",
"semver": "^5.6.0", "semver": "^7.3.2",
"vue-eslint-parser": "^7.0.0" "vue-eslint-parser": "^7.1.0"
},
"dependencies": {
"eslint-utils": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-2.1.0.tgz",
"integrity": "sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==",
"dev": true,
"requires": {
"eslint-visitor-keys": "^1.1.0"
}
},
"lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"requires": {
"yallist": "^4.0.0"
}
},
"semver": {
"version": "7.3.4",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
"integrity": "sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==",
"dev": true,
"requires": {
"lru-cache": "^6.0.0"
}
},
"yallist": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
"dev": true
}
} }
}, },
"eslint-scope": { "eslint-scope": {
@@ -5428,9 +5472,9 @@
} }
}, },
"flatted": { "flatted": {
"version": "2.0.1", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.1.tgz", "resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.2.tgz",
"integrity": "sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg==", "integrity": "sha512-r5wGx7YeOwNWNlCA0wQ86zKyDLMQr+/RB8xy74M4hTphfmjlijTSSXGuH8rnvKZnfT9i+75zmd8jcKdMR4O6jA==",
"dev": true "dev": true
}, },
"flush-write-stream": { "flush-write-stream": {
@@ -5447,7 +5491,6 @@
"version": "1.11.0", "version": "1.11.0",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.11.0.tgz", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.11.0.tgz",
"integrity": "sha512-KZm0V+ll8PfBrKwMzdo5D13b1bur9Iq9Zd/RMmAoQQcl2PxxFml8cxXPaaPYVbV0RjNjq1CU7zIzAOqtUPudmA==", "integrity": "sha512-KZm0V+ll8PfBrKwMzdo5D13b1bur9Iq9Zd/RMmAoQQcl2PxxFml8cxXPaaPYVbV0RjNjq1CU7zIzAOqtUPudmA==",
"dev": true,
"requires": { "requires": {
"debug": "^3.0.0" "debug": "^3.0.0"
}, },
@@ -5456,7 +5499,6 @@
"version": "3.2.6", "version": "3.2.6",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
"integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==", "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
"dev": true,
"requires": { "requires": {
"ms": "^2.1.1" "ms": "^2.1.1"
} }
@@ -8017,8 +8059,7 @@
"ms": { "ms": {
"version": "2.1.2", "version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
"dev": true
}, },
"multicast-dns": { "multicast-dns": {
"version": "6.2.3", "version": "6.2.3",
@@ -11261,9 +11302,9 @@
"dev": true "dev": true
}, },
"strip-json-comments": { "strip-json-comments": {
"version": "3.0.1", "version": "3.1.1",
"resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.0.1.tgz", "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
"integrity": "sha512-VTyMAUfdm047mwKl+u79WIdrZxtFtn+nBxHeb844XBQ9uMNTuTHdx2hc5RiAJYqwTj3wc/xe5HLSdJSkJ+WfZw==", "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
"dev": true "dev": true
}, },
"stylehacks": { "stylehacks": {
@@ -11971,9 +12012,9 @@
"integrity": "sha512-Wg+ObZoYK6McHb5OOCFWvm0R7xHp0/p0G1ocx/8bO22jvA/yVY05rADbfiztwCokXBNfQuGv/XSd1ozcTFgekw==" "integrity": "sha512-Wg+ObZoYK6McHb5OOCFWvm0R7xHp0/p0G1ocx/8bO22jvA/yVY05rADbfiztwCokXBNfQuGv/XSd1ozcTFgekw=="
}, },
"v8-compile-cache": { "v8-compile-cache": {
"version": "2.1.0", "version": "2.2.0",
"resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.1.0.tgz", "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.2.0.tgz",
"integrity": "sha512-usZBT3PW+LOjM25wbqIlZwPeJV+3OSz3M1k1Ws8snlW39dZyYL9lOGC5FgPVHfk0jKmjiDV8Z0mIbVQPiwFs7g==", "integrity": "sha512-gTpR5XQNKFwOd4clxfnhaqvfqMpqEwr4tOtCyz4MtYZX2JYhfr1JvBFKdS+7K/9rfpZR3VLX+YWBbKoxCgS43Q==",
"dev": true "dev": true
}, },
"validate-npm-package-license": { "validate-npm-package-license": {
@@ -12026,28 +12067,62 @@
"integrity": "sha512-vuEUm6wYMMrFAHFCrkzIUAy8+MgPAbBGmYXnk2M6X6O2KHbMT1wuDD2izacmsSUp6ZM02e23MJRtPRobl88VMg==" "integrity": "sha512-vuEUm6wYMMrFAHFCrkzIUAy8+MgPAbBGmYXnk2M6X6O2KHbMT1wuDD2izacmsSUp6ZM02e23MJRtPRobl88VMg=="
}, },
"vue-eslint-parser": { "vue-eslint-parser": {
"version": "7.0.0", "version": "7.3.0",
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.0.0.tgz", "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.3.0.tgz",
"integrity": "sha512-yR0dLxsTT7JfD2YQo9BhnQ6bUTLsZouuzt9SKRP7XNaZJV459gvlsJo4vT2nhZ/2dH9j3c53bIx9dnqU2prM9g==", "integrity": "sha512-n5PJKZbyspD0+8LnaZgpEvNCrjQx1DyDHw8JdWwoxhhC+yRip4TAvSDpXGf9SWX6b0umeB5aR61gwUo6NVvFxw==",
"dev": true, "dev": true,
"requires": { "requires": {
"debug": "^4.1.1", "debug": "^4.1.1",
"eslint-scope": "^5.0.0", "eslint-scope": "^5.0.0",
"eslint-visitor-keys": "^1.1.0", "eslint-visitor-keys": "^1.1.0",
"espree": "^6.1.2", "espree": "^6.2.1",
"esquery": "^1.0.1", "esquery": "^1.0.1",
"lodash": "^4.17.15" "lodash": "^4.17.15"
}, },
"dependencies": { "dependencies": {
"acorn": {
"version": "7.4.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
"integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
"dev": true
},
"eslint-scope": { "eslint-scope": {
"version": "5.0.0", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.0.0.tgz", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
"integrity": "sha512-oYrhJW7S0bxAFDvWqzvMPRm6pcgcnWc4QnofCAqRTRfQC0JcwenzGglTtsLyIuuWFfkqDG9vz67cnttSd53djw==", "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
"dev": true, "dev": true,
"requires": { "requires": {
"esrecurse": "^4.1.0", "esrecurse": "^4.3.0",
"estraverse": "^4.1.1" "estraverse": "^4.1.1"
} }
},
"espree": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/espree/-/espree-6.2.1.tgz",
"integrity": "sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==",
"dev": true,
"requires": {
"acorn": "^7.1.1",
"acorn-jsx": "^5.2.0",
"eslint-visitor-keys": "^1.1.0"
}
},
"esrecurse": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
"integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
"dev": true,
"requires": {
"estraverse": "^5.2.0"
},
"dependencies": {
"estraverse": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
"integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
"dev": true
}
}
} }
} }
}, },

126
client/package.json
View File

@@ -1,71 +1,59 @@
{ {
"name": "spellsaurus_client", "name": "spellsaurus_client",
"version": "1.0.0", "version": "1.0.0",
"description": "The client interface of spellsaurus", "description": "The client interface of spellsaurus",
"keywords": [ "keywords": [
"rpg", "rpg",
"dev", "dev",
"spells", "spells",
"roleplay", "roleplay",
"website", "website",
"database" "database"
], ],
"author": "AlexisNP", "author": "AlexisNP",
"license": "ISC", "license": "ISC",
"bugs": { "bugs": {
"url": "https://github.com/AlexisNP/spellsaurus/issues" "url": "https://github.com/AlexisNP/spellsaurus/issues"
}, },
"homepage": "https://github.com/AlexisNP/spellsaurus#readme", "homepage": "https://github.com/AlexisNP/spellsaurus#readme",
"private": true, "private": true,
"repository": { "repository": {
"type": "git", "type": "git",
"url": "git+https://github.com/AlexisNP/spellsaurus.git" "url": "git+https://github.com/AlexisNP/spellsaurus.git"
}, },
"scripts": { "scripts": {
"serve": "vue-cli-service serve" "lint": "vue-cli-service lint",
}, "serve": "vue-cli-service serve",
"dependencies": { "build": "vue-cli-service build"
"axios": "^0.19.2", },
"bootstrap": "^4.5.0", "dependencies": {
"bootstrap-vue": "^2.15.0", "axios": "^0.21.1",
"core-js": "^3.6.4", "bootstrap": "^4.5.0",
"jquery": "^3.5.1", "bootstrap-vue": "^2.15.0",
"popper.js": "^1.16.1", "core-js": "^3.6.4",
"v-clipboard": "^2.2.3", "jquery": "^3.5.1",
"vue": "^2.6.11", "popper.js": "^1.16.1",
"vue-cookies": "^1.7.0", "v-clipboard": "^2.2.3",
"vue-masonry": "^0.11.8", "vue": "^2.6.11",
"vue-meta": "^2.4.0", "vue-cookies": "^1.7.0",
"vuex": "^3.5.1" "vue-masonry": "^0.11.8",
}, "vue-meta": "^2.4.0",
"devDependencies": { "vuex": "^3.5.1"
"@vue/cli-plugin-babel": "~4.2.0", },
"@vue/cli-plugin-eslint": "~4.2.0", "devDependencies": {
"@vue/cli-service": "~4.2.0", "@vue/cli-plugin-babel": "~4.2.0",
"babel-eslint": "^10.0.3", "@vue/cli-plugin-eslint": "~4.2.0",
"eslint": "^6.7.2", "@vue/cli-service": "~4.2.0",
"eslint-plugin-vue": "^6.1.2", "babel-eslint": "^10.0.3",
"node-sass": "^4.14.1", "eslint": "^6.8.0",
"sass-loader": "^8.0.2", "eslint-plugin-vue": "^7.0.0-beta.4",
"vue-router": "^3.1.6", "node-sass": "^4.14.1",
"vue-template-compiler": "^2.6.11" "sass-loader": "^8.0.2",
}, "vue-router": "^3.1.6",
"eslintConfig": { "vue-template-compiler": "^2.6.11"
"root": true, },
"env": { "browserslist": [
"node": true "> 1%",
}, "last 2 versions"
"extends": [ ]
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
} }

10
client/src/api/api.js
View File

@@ -1,9 +1,9 @@
import axios from "axios" import axios from "axios";
const url = process.env.VUE_APP_API_URL const url = process.env.VUE_APP_API_URL;
axios.defaults.headers.common[process.env.VUE_APP_API_KEY_NAME] = process.env.VUE_APP_API_KEY_VALUE axios.defaults.headers.common[process.env.VUE_APP_API_KEY_NAME] = process.env.VUE_APP_API_KEY_VALUE;
export default axios.create({ export default axios.create({
baseURL: url baseURL: url
}) });

18
client/src/api/ingredientsRepository.js
View File

@@ -1,12 +1,12 @@
import api from './api' import api from './api';
const resource = "/ingredients" const resource = "/ingredients";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
} };

18
client/src/api/metaschoolsRepository.js
View File

@@ -1,12 +1,12 @@
import api from './api' import api from './api';
const resource = "/meta_schools" const resource = "/meta_schools";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
} };

30
client/src/api/repositories.js
View File

@@ -1,21 +1,21 @@
import spellsRepository from './spellsRepository' import spellsRepository from './spellsRepository';
import schoolsRepository from './schoolsRepository' import schoolsRepository from './schoolsRepository';
import metaschoolsRepository from './metaschoolsRepository' import metaschoolsRepository from './metaschoolsRepository';
import variablesRepository from './variablesRepository' import variablesRepository from './variablesRepository';
import ingredientsRepository from './ingredientsRepository' import ingredientsRepository from './ingredientsRepository';
import usersRepository from './usersRepository' import usersRepository from './usersRepository';
// List of possible repositories // List of possible repositories
const repositories = { const repositories = {
spells: spellsRepository, spells: spellsRepository,
schools: schoolsRepository, schools: schoolsRepository,
metaschools: metaschoolsRepository, metaschools: metaschoolsRepository,
variables: variablesRepository, variables: variablesRepository,
ingredients: ingredientsRepository, ingredients: ingredientsRepository,
users: usersRepository, users: usersRepository,
} };
// Usage : RepositoryFactoryInstance.get('reponame'); // Usage : RepositoryFactoryInstance.get('reponame');
export const RepositoryFactory = { export const RepositoryFactory = {
get: name => repositories[name] get: name => repositories[name]
} };

24
client/src/api/schoolsRepository.js
View File

@@ -1,15 +1,15 @@
import api from './api' import api from './api';
const resource = "/schools" const resource = "/schools";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
getSpellsFromOne(id) { getSpellsFromOne(id) {
return api.get(`${resource}/${id}/spells`) return api.get(`${resource}/${id}/spells`);
} }
} };

42
client/src/api/spellsRepository.js
View File

@@ -1,24 +1,24 @@
import api from './api' import api from './api';
const resource = "/spells" const resource = "/spells";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getPage(page) { getPage(page) {
return api.get(`${resource}/page/${page}`) return api.get(`${resource}/page/${page}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
addOne(data) { addOne(data) {
return api.post(`${resource}`, data) return api.post(`${resource}`, data);
}, },
updateOne(id, data) { updateOne(id, data) {
return api.put(`${resource}/${id}`, data) return api.put(`${resource}/${id}`, data);
}, },
deleteOne(id) { deleteOne(id) {
return api.delete(`${resource}/${id}`) return api.delete(`${resource}/${id}`);
} }
} };

18
client/src/api/variablesRepository.js
View File

@@ -1,12 +1,12 @@
import api from './api' import api from './api';
const resource = "/variables" const resource = "/variables";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
} };

8
client/src/app.vue
View File

@@ -1,19 +1,19 @@
<template> <template>
<div id="srs"> <div id="srs">
<header> <header>
<navbar/> <navbar />
</header> </header>
<router-view/> <router-view />
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'app', name: 'App',
metaInfo: { metaInfo: {
title: 'Auracle', title: 'Auracle',
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

32
client/src/components/global/loader.vue
View File

@@ -1,24 +1,24 @@
<template> <template>
<div class="lds-roller"> <div class="lds-roller">
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'loader', name: 'Loader',
data() { data() {
return { return {
} };
} }
} };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

81
client/src/components/global/navbar/navbar.vue
View File

@@ -1,21 +1,70 @@
<template> <template>
<nav class="navbar navbar-expand-sm fixed-top navbar-dark bg-dark"> <nav class="navbar navbar-expand-sm fixed-top navbar-dark bg-dark">
<router-link :to="'/'" class="navbar-brand font-display font-weight-700">Auracle</router-link> <router-link
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation"> :to="'/'"
<span class="navbar-toggler-icon"></span> class="navbar-brand font-display font-weight-700"
>
Auracle
</router-link>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbar"
aria-controls="navbar"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon" />
</button> </button>
<div class="collapse navbar-collapse" id="navbar"> <div
<ul class="navbar-nav mr-auto" v-if="links.length != 0"> id="navbar"
<li class="nav-item" v-for="(link, index) in links" :key="index"> class="collapse navbar-collapse"
<router-link :to="link.url" class="nav-link">{{ link.text }}</router-link> >
<ul
v-if="links.length != 0"
class="navbar-nav mr-auto"
>
<li
v-for="(link, index) in links"
:key="index"
class="nav-item"
>
<router-link
:to="link.url"
class="nav-link"
>
{{ link.text }}
</router-link>
</li> </li>
</ul> </ul>
<div v-if="user" class="navbar-nav"> <div
<router-link :to="'/profil'" class="nav-link">{{ user.name }}</router-link> v-if="user"
<div @click="logoutUser()" class="nav-link">Deconnexion</div> class="navbar-nav"
>
<router-link
:to="'/profil'"
class="nav-link"
>
{{ user.name }}
</router-link>
<div
class="nav-link"
@click="logoutUser()"
>
Deconnexion
</div>
</div> </div>
<div v-else class="navbar-nav"> <div
<router-link :to="'/connexion'" class="nav-link">Connexion</router-link> v-else
class="navbar-nav"
>
<router-link
:to="'/connexion'"
class="nav-link"
>
Connexion
</router-link>
</div> </div>
</div> </div>
</nav> </nav>
@@ -24,7 +73,7 @@
<script> <script>
export default { export default {
name: 'navbar', name: 'Navbar',
data() { data() {
return { return {
links: [ links: [
@@ -41,11 +90,11 @@ export default {
url: '/ages', url: '/ages',
} }
] ]
} };
}, },
computed: { computed: {
user() { user() {
return this.$store.getters.getUserProfile return this.$store.getters.getUserProfile;
} }
}, },
methods: { methods: {
@@ -54,7 +103,7 @@ export default {
this.$router.push('/'); this.$router.push('/');
} }
} }
} };
</script> </script>

416
client/src/components/spells/add-spell-card.vue
View File

@@ -1,159 +1,297 @@
<template> <template>
<b-modal <b-modal
ref="add_spell_modal" ref="add_spell_modal"
size="lg" size="lg"
modal-class="b-modal"> modal-class="b-modal"
>
<template #modal-header="{ close }">
<div
id="spell_show_edit_modal"
class="h1 modal-title font-display font-weight-bold"
>
<div class="line-height-100">
<span v-if="!spell.name">Nouveau sort</span>
<span v-if="spell.name">{{ spell.name }}</span>
</div>
</div>
<button
type="button"
class="close"
data-dismiss="modal"
aria-label="Close"
@click="close()"
>
<span aria-hidden="true">&times;</span>
</button>
</template>
<template v-slot:modal-header="{ close }"> <template #default>
<div class="h1 modal-title font-display font-weight-bold" id="spell_show_edit_modal"> <form
<div class="line-height-100"> id="add-spell"
<span v-if="!spell.name">Nouveau sort</span> @submit="addSpell"
<span v-if="spell.name">{{spell.name}}</span> >
</div> <div class="form-group">
</div> <label
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @click="close()"> for="spell_name"
<span aria-hidden="true">&times;</span> class="font-weight-bold col-form-label"
</button> >Nom&nbsp;:</label>
</template> <input
id="spell_name"
v-model="spell.name"
type="text"
class="form-control"
name="spell_name"
placeholder="(256 caractères max.)"
>
</div>
<div class="form-group">
<label
for="spell_description"
class="font-weight-bold col-form-label"
>Description&nbsp;:</label>
<textarea
id="spell_description"
v-model="spell.description"
class="form-control"
name="spell_description"
placeholder="(2048 caractères max.)"
/>
</div>
<div class="form-check form-check-inline">
<input
id="spell_ritual"
v-model="spell.is_ritual"
type="checkbox"
class="form-check-input"
name="spell_ritual"
>
<label
for="spell_ritual"
class="font-weight-bold col-form-label"
>Rituel ?&nbsp;</label>
</div>
<div class="form-group">
<label
for="spell_level"
class="font-weight-bold col-form-label"
>Niveau&nbsp;:</label>
<input
id="spell_level"
v-model="spell.level"
type="number"
class="form-control"
name="spell_level"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div>
<div class="form-group">
<label
for="spell_schools"
class="font-weight-bold col-form-label"
>École(s)&nbsp;:</label>
<select
id="spell_schools"
v-model="spell.schools"
class="form-control"
name="spell_schools"
multiple
>
<option
v-for="(school, index) in all_schools"
:key="index"
:value="'school_' + school.id"
>
{{ school.name }}
</option>
</select>
</div>
<div class="form-group">
<label
for="spell_charge"
class="font-weight-bold col-form-label"
>Charge&nbsp;:</label>
<input
id="spell_charge"
v-model="spell.charge"
type="number"
class="form-control"
name="spell_charge"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div>
<div class="form-group">
<label
for="spell_ingredients"
class="font-weight-bold col-form-label"
>Ingrédient(s)&nbsp;:</label>
<select
id="spell_ingredients"
v-model="spell.ingredients"
class="form-control"
name="spell_ingredients"
multiple
>
<option
v-for="(ingredient,index) in all_ingredients"
:key="index"
:value="'ingredient_' + ingredient.id"
>
{{ ingredient.name }}
</option>
</select>
</div>
<div class="form-group">
<label
for="spell_cost"
class="font-weight-bold col-form-label"
>Coût&nbsp;:</label>
<input
id="spell_cost"
v-model="spell.cost"
type="text"
class="form-control"
name="spell_cost"
placeholder="(32 caractères max.)"
>
</div>
<div class="form-group">
<label
for="spell_variables"
class="font-weight-bold col-form-label"
>Variable(s)&nbsp;:</label>
<select
id="spell_variables"
v-model="spell.variables"
class="form-control"
name="spell_variables"
multiple
>
<option
v-for="(variable,index) in all_variables"
:key="index"
:value="'variable_' + variable.id"
>
{{ variable.description }}
</option>
</select>
</div>
</form>
</template>
<template v-slot:default> <template #modal-footer="{ close }">
<form id="add-spell" @submit="addSpell"> <button
<div class="form-group"> type="button"
<label for="spell_name" class="font-weight-bold col-form-label">Nom&nbsp;:</label> class="btn btn-secondary"
<input type="text" class="form-control" name="spell_name" id="spell_name" placeholder="(256 caractères max.)" v-model="spell.name"> data-dismiss="modal"
</div> @click="close()"
<div class="form-group"> >
<label for="spell_description" class="font-weight-bold col-form-label">Description&nbsp;:</label> Fermer
<textarea class="form-control" name="spell_description" id="spell_description" placeholder="(2048 caractères max.)" v-model="spell.description"></textarea> </button>
</div> <input
<div class="form-check form-check-inline"> type="submit"
<input type="checkbox" class="form-check-input" id="spell_ritual" name="spell_ritual" v-model="spell.is_ritual"> class="btn btn-primary"
<label for="spell_ritual" class="font-weight-bold col-form-label">Rituel ?&nbsp;</label> value="Enregistrer"
</div> form="add-spell"
<div class="form-group"> >
<label for="spell_level" class="font-weight-bold col-form-label">Niveau&nbsp;:</label> </template>
<input type="number" class="form-control" name="spell_level" id="spell_level" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.level"> </b-modal>
</div>
<div class="form-group">
<label for="spell_schools" class="font-weight-bold col-form-label">École(s)&nbsp;:</label>
<select class="form-control" id="spell_schools" name="spell_schools" multiple v-model="spell.schools">
<option v-for="(school, index) in all_schools" :key="index" :value="'school_' + school.id">{{school.name}}</option>
</select>
</div>
<div class="form-group">
<label for="spell_charge" class="font-weight-bold col-form-label">Charge&nbsp;:</label>
<input type="number" class="form-control" name="spell_charge" id="spell_charge" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.charge">
</div>
<div class="form-group">
<label for="spell_ingredients" class="font-weight-bold col-form-label">Ingrédient(s)&nbsp;:</label>
<select class="form-control" id="spell_ingredients" name="spell_ingredients" multiple v-model="spell.ingredients">
<option v-for="(ingredient,index) in all_ingredients" :key="index" :value="'ingredient_' + ingredient.id">{{ingredient.name}}</option>
</select>
</div>
<div class="form-group">
<label for="spell_cost" class="font-weight-bold col-form-label">Coût&nbsp;:</label>
<input type="text" class="form-control" name="spell_cost" id="spell_cost" placeholder="(32 caractères max.)" v-model="spell.cost">
</div>
<div class="form-group">
<label for="spell_variables" class="font-weight-bold col-form-label">Variable(s)&nbsp;:</label>
<select class="form-control" id="spell_variables" name="spell_variables" multiple v-model="spell.variables">
<option v-for="(variable,index) in all_variables" :key="index" :value="'variable_' + variable.id">{{variable.description}}</option>
</select>
</div>
</form>
</template>
<template v-slot:modal-footer="{ close }">
<button type="button" class="btn btn-secondary" data-dismiss="modal" @click="close()">Fermer</button>
<input type="submit" class="btn btn-primary" value="Enregistrer" form="add-spell">
</template>
</b-modal>
</template> </template>
<script> <script>
// API // API
import { RepositoryFactory } from "@/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
const Schools = RepositoryFactory.get('schools') const Schools = RepositoryFactory.get('schools');
const Variables = RepositoryFactory.get('variables') const Variables = RepositoryFactory.get('variables');
const Ingredients = RepositoryFactory.get('ingredients') const Ingredients = RepositoryFactory.get('ingredients');
export default { export default {
'name': 'add-spell-card', 'name': 'AddSpellCard',
data() { data() {
return { return {
spell: { spell: {
type: Object, type: Object,
name: "", name: "",
description: "", description: "",
is_ritual: false, is_ritual: false,
level: 0, level: 0,
cost: "0", cost: "0",
charge: 0, charge: 0,
schools: [], schools: [],
variables: [], variables: [],
ingredients: [], ingredients: [],
}, },
all_schools: [], all_schools: [],
all_variables: [], all_variables: [],
all_ingredients: [], all_ingredients: [],
} };
}, },
created() { created() {
// Gets all relevant info for multiple selects // Gets all relevant info for multiple selects
let fetchSchools = Schools.getAll() let fetchSchools = Schools.getAll();
let fetchVariables = Variables.getAll() let fetchVariables = Variables.getAll();
let fetchIngredients = Ingredients.getAll() let fetchIngredients = Ingredients.getAll();
Promise.all([fetchSchools, fetchVariables, fetchIngredients]) Promise.all([fetchSchools, fetchVariables, fetchIngredients])
.then(v => {
this.all_schools = v[0].data;
this.all_variables = v[1].data;
this.all_ingredients = v[2].data;
})
.catch(err => {
console.log(err);
});
},
mounted() {
this.$refs["add_spell_modal"].show();
this.$root.$on('bv::modal::hide', () => {
this.$emit('cancelAdd');
});
},
methods: {
addSpell(e) {
e.preventDefault();
let schoolsData = Object.values(this.spell.schools).map(v => {
return parseInt(v.slice(7));
});
let variablesData = Object.values(this.spell.variables).map(v => {
return parseInt(v.slice(9));
});
let ingredientsData = Object.values(this.spell.ingredients).map(v => {
return parseInt(v.slice(11));
});
let data = {
name: this.spell.name,
description: this.spell.description,
is_ritual: !!+this.spell.is_ritual,
level: parseInt(this.spell.level),
cost: this.spell.cost,
charge: parseInt(this.spell.charge),
schools: schoolsData,
variables: variablesData,
ingredients: ingredientsData,
};
Spells.addOne(data)
.then(v => { .then(v => {
this.all_schools = v[0].data this.$emit('addSpell', v.data);
this.all_variables = v[1].data this.$refs["add_spell_modal"].hide();
this.all_ingredients = v[2].data
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
},
mounted() {
this.$refs["add_spell_modal"].show()
this.$root.$on('bv::modal::hide', () => {
this.$emit('cancelAdd')
})
},
methods: {
addSpell(e) {
e.preventDefault()
let schoolsData = Object.values(this.spell.schools).map(v => { return parseInt(v.slice(7)) })
let variablesData = Object.values(this.spell.variables).map(v => { return parseInt(v.slice(9)) })
let ingredientsData = Object.values(this.spell.ingredients).map(v => { return parseInt(v.slice(11)) })
let data = {
name: this.spell.name,
description: this.spell.description,
is_ritual: !!+this.spell.is_ritual,
level: parseInt(this.spell.level),
cost: this.spell.cost,
charge: parseInt(this.spell.charge),
schools: schoolsData,
variables: variablesData,
ingredients: ingredientsData,
}
Spells.addOne(data)
.then(v => {
this.$emit('addSpell', v.data)
this.$refs["add_spell_modal"].hide()
})
.catch(err => {
console.log(err)
})
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

490
client/src/components/spells/edit-spell-card.vue
View File

@@ -1,197 +1,341 @@
<template> <template>
<b-modal <b-modal
ref="edit_spell_modal" ref="edit_spell_modal"
size="lg" size="lg"
modal-class="b-modal" modal-class="b-modal"
:spell="computeSpell"> :spell="computeSpell"
>
<template #modal-header="{ close }">
<div
id="spell_show_edit_modal"
class="h1 modal-title font-display font-weight-bold"
>
<div class="line-height-100">
{{ spell.name }}#{{ spell.id }}
</div>
</div>
<button
type="button"
class="close"
data-dismiss="modal"
aria-label="Close"
@click="close()"
>
<span aria-hidden="true">&times;</span>
</button>
</template>
<template v-slot:modal-header="{ close }"> <template #default>
<div class="h1 modal-title font-display font-weight-bold" id="spell_show_edit_modal"><div class="line-height-100">{{spell.name}}#{{spell.id}}</div></div> <form
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @click="close()"> id="update-spell"
<span aria-hidden="true">&times;</span> ref="update-spell"
</button> @submit="updateSpell"
</template> >
<div class="form-group">
<template v-slot:default> <label
<form id="update-spell" ref="update-spell" @submit="updateSpell"> for="spell_name"
<div class="form-group"> class="font-weight-bold col-form-label"
<label for="spell_name" class="font-weight-bold col-form-label">Nom&nbsp;:</label> >Nom&nbsp;:</label>
<input type="text" class="form-control" name="spell_name" id="spell_name" placeholder="(256 caractères max.)" v-model="spell.name"> <input
</div> id="spell_name"
<div class="form-group"> v-model="spell.name"
<label for="spell_description" class="font-weight-bold col-form-label">Description&nbsp;:</label> type="text"
<textarea class="form-control" name="spell_description" id="spell_description" placeholder="(2048 caractères max.)" v-model="spell.description"></textarea> class="form-control"
</div> name="spell_name"
<div class="form-check form-check-inline"> placeholder="(256 caractères max.)"
<input type="checkbox" class="form-check-input" id="spell_ritual" name="spell_ritual" v-model="spell.is_ritual"> >
<label for="spell_ritual" class="font-weight-bold col-form-label">Rituel ?&nbsp;</label> </div>
</div> <div class="form-group">
<div class="form-group"> <label
<label for="spell_level" class="font-weight-bold col-form-label">Niveau&nbsp;:</label> for="spell_description"
<input type="number" class="form-control" name="spell_level" id="spell_level" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.level"> class="font-weight-bold col-form-label"
</div> >Description&nbsp;:</label>
<div class="form-group"> <textarea
<label for="spell_schools" class="font-weight-bold col-form-label">École(s)&nbsp;:</label> id="spell_description"
<select class="form-control" id="spell_schools" name="spell_schools" multiple v-model="spell.spell_school_ids_value"> v-model="spell.description"
<option v-for="(school, index) in all_schools" :key="index" :value="'school_' + school.id">{{school.name}}</option> class="form-control"
</select> name="spell_description"
</div> placeholder="(2048 caractères max.)"
<div class="form-group"> />
<label for="spell_charge" class="font-weight-bold col-form-label">Charge&nbsp;:</label> </div>
<input type="number" class="form-control" name="spell_charge" id="spell_charge" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.charge"> <div class="form-check form-check-inline">
</div> <input
<div class="form-group"> id="spell_ritual"
<label for="spell_ingredients" class="font-weight-bold col-form-label">Ingrédient(s)&nbsp;:</label> v-model="spell.is_ritual"
<select class="form-control" id="spell_ingredients" name="spell_ingredients" multiple v-model="spell.spell_ingredient_ids_value"> type="checkbox"
<option v-for="(ingredient,index) in all_ingredients" :key="index" :value="'ingredient_' + ingredient.id">{{ingredient.name}}</option> class="form-check-input"
</select> name="spell_ritual"
</div> >
<div class="form-group"> <label
<label for="spell_cost" class="font-weight-bold col-form-label">Coût&nbsp;:</label> for="spell_ritual"
<input type="text" class="form-control" name="spell_cost" id="spell_cost" placeholder="(32 caractères max.)" v-model="spell.cost"> class="font-weight-bold col-form-label"
</div> >Rituel ?&nbsp;</label>
<div class="form-group"> </div>
<label for="spell_variables" class="font-weight-bold col-form-label">Variable(s)&nbsp;:</label> <div class="form-group">
<select class="form-control" id="spell_variables" name="spell_variables" multiple v-model="spell.spell_variable_ids_value"> <label
<option v-for="(variable,index) in all_variables" :key="index" :value="'variable_' + variable.id">{{variable.description}}</option> for="spell_level"
</select> class="font-weight-bold col-form-label"
</div> >Niveau&nbsp;:</label>
</form> <input
</template> id="spell_level"
v-model="spell.level"
type="number"
class="form-control"
name="spell_level"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div>
<div class="form-group">
<label
for="spell_schools"
class="font-weight-bold col-form-label"
>École(s)&nbsp;:</label>
<select
id="spell_schools"
v-model="spell.spell_school_ids_value"
class="form-control"
name="spell_schools"
multiple
>
<option
v-for="(school, index) in all_schools"
:key="index"
:value="'school_' + school.id"
>
{{ school.name }}
</option>
</select>
</div>
<div class="form-group">
<label
for="spell_charge"
class="font-weight-bold col-form-label"
>Charge&nbsp;:</label>
<input
id="spell_charge"
v-model="spell.charge"
type="number"
class="form-control"
name="spell_charge"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div>
<div class="form-group">
<label
for="spell_ingredients"
class="font-weight-bold col-form-label"
>Ingrédient(s)&nbsp;:</label>
<select
id="spell_ingredients"
v-model="spell.spell_ingredient_ids_value"
class="form-control"
name="spell_ingredients"
multiple
>
<option
v-for="(ingredient,index) in all_ingredients"
:key="index"
:value="'ingredient_' + ingredient.id"
>
{{ ingredient.name }}
</option>
</select>
</div>
<div class="form-group">
<label
for="spell_cost"
class="font-weight-bold col-form-label"
>Coût&nbsp;:</label>
<input
id="spell_cost"
v-model="spell.cost"
type="text"
class="form-control"
name="spell_cost"
placeholder="(32 caractères max.)"
>
</div>
<div class="form-group">
<label
for="spell_variables"
class="font-weight-bold col-form-label"
>Variable(s)&nbsp;:</label>
<select
id="spell_variables"
v-model="spell.spell_variable_ids_value"
class="form-control"
name="spell_variables"
multiple
>
<option
v-for="(variable,index) in all_variables"
:key="index"
:value="'variable_' + variable.id"
>
{{ variable.description }}
</option>
</select>
</div>
</form>
</template>
<template v-slot:modal-footer="{ close }"> <template #modal-footer="{ close }">
<button type="button" class="btn btn-danger" data-dismiss="modal" @click="close()">Fermer</button> <button
<!-- <input type="button" class="btn btn-success" value="Enregistrer comme nouveau" @click="cloneSpell()"> --> type="button"
<input type="submit" class="btn btn-primary" value="Enregistrer" form="update-spell"> class="btn btn-danger"
</template> data-dismiss="modal"
</b-modal> @click="close()"
>
Fermer
</button>
<!-- <input type="button" class="btn btn-success" value="Enregistrer comme nouveau" @click="cloneSpell()"> -->
<input
type="submit"
class="btn btn-primary"
value="Enregistrer"
form="update-spell"
>
</template>
</b-modal>
</template> </template>
<script> <script>
// API // API
import { RepositoryFactory } from "@/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
const Schools = RepositoryFactory.get('schools') const Schools = RepositoryFactory.get('schools');
const Variables = RepositoryFactory.get('variables') const Variables = RepositoryFactory.get('variables');
const Ingredients = RepositoryFactory.get('ingredients') const Ingredients = RepositoryFactory.get('ingredients');
export default { export default {
name: 'edit-spell-card', name: 'EditSpellCard',
props: { props: {
spell: { spell: {
type: Object, type: Object,
required: true, required: true,
id: Number, id: Number,
name: String, name: String,
description: String, description: String,
is_ritual: Boolean, is_ritual: Boolean,
schools: Array, schools: Array,
variables: Array, variables: Array,
ingredients: Array, ingredients: Array,
},
}, },
data() { },
return { data() {
all_schools: [], return {
all_variables: [], all_schools: [],
all_ingredients: [], all_variables: [],
} all_ingredients: [],
};
},
computed: {
computeSpell() {
let output = this.spell;
output.spell_school_ids = [];
output.spell_variable_ids = [];
output.spell_ingredient_ids = [];
output.spell_school_ids_value = [];
output.spell_variable_ids_value = [];
output.spell_ingredient_ids_value = [];
output.schools.forEach(element => {
output.spell_school_ids.push(element['id']);
});
output.variables.forEach(element => {
output.spell_variable_ids.push(element['id']);
});
output.ingredients.forEach(element => {
output.spell_ingredient_ids.push(element['id']);
});
output.spell_school_ids.forEach(element => {
output.spell_school_ids_value.push("school_" + element);
});
output.spell_variable_ids.forEach(element => {
output.spell_variable_ids_value.push("variable_" + element);
});
output.spell_ingredient_ids.forEach(element => {
output.spell_ingredient_ids_value.push("ingredient_" + element);
});
return output;
}
},
watch: {
computeSpell: {
deep: true,
handler() {
this.$refs["edit_spell_modal"].show();
}
}
},
created() {
// Gets all relevant info for multiple selects
let fetchSchools = Schools.getAll();
let fetchVariables = Variables.getAll();
let fetchIngredients = Ingredients.getAll();
Promise.all([fetchSchools, fetchVariables, fetchIngredients])
.then(v => {
this.all_schools = v[0].data;
this.all_variables = v[1].data;
this.all_ingredients = v[2].data;
})
.catch(err => {
console.log(err);
});
},
mounted() {
this.$refs["edit_spell_modal"].show();
this.$root.$on('bv::modal::hide', () => {
this.$emit('editSpell', {});
});
},
methods: {
cloneSpell() {
}, },
computed: { updateSpell(e) {
computeSpell() { e.preventDefault();
let output = this.spell
output.spell_school_ids = []
output.spell_variable_ids = []
output.spell_ingredient_ids = []
output.spell_school_ids_value = []
output.spell_variable_ids_value = []
output.spell_ingredient_ids_value = []
output.schools.forEach(element => { let schoolsData = Object.values(this.spell.spell_school_ids_value).map(v => {
output.spell_school_ids.push(element['id']) return parseInt(v.slice(7));
}) });
output.variables.forEach(element => { let variablesData = Object.values(this.spell.spell_variable_ids_value).map(v => {
output.spell_variable_ids.push(element['id']) return parseInt(v.slice(9));
}) });
output.ingredients.forEach(element => { let ingredientsData = Object.values(this.spell.spell_ingredient_ids_value).map(v => {
output.spell_ingredient_ids.push(element['id']) return parseInt(v.slice(11));
}) });
output.spell_school_ids.forEach(element => { let data = {
output.spell_school_ids_value.push("school_" + element) name: this.spell.name,
}) description: this.spell.description,
output.spell_variable_ids.forEach(element => { is_ritual: !!+this.spell.is_ritual,
output.spell_variable_ids_value.push("variable_" + element) level: parseInt(this.spell.level),
}) cost: this.spell.cost,
output.spell_ingredient_ids.forEach(element => { charge: parseInt(this.spell.charge),
output.spell_ingredient_ids_value.push("ingredient_" + element) schools: schoolsData,
}) variables: variablesData,
ingredients: ingredientsData,
};
return output Spells.updateOne(this.spell.id, data)
}
},
created() {
// Gets all relevant info for multiple selects
let fetchSchools = Schools.getAll()
let fetchVariables = Variables.getAll()
let fetchIngredients = Ingredients.getAll()
Promise.all([fetchSchools, fetchVariables, fetchIngredients])
.then(v => { .then(v => {
this.all_schools = v[0].data this.$emit('updateSpell', v.data);
this.all_variables = v[1].data
this.all_ingredients = v[2].data
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}, },
mounted() { }
this.$refs["edit_spell_modal"].show() };
this.$root.$on('bv::modal::hide', () => {
this.$emit('editSpell', {})
})
},
watch: {
computeSpell: {
deep: true,
handler() {
this.$refs["edit_spell_modal"].show()
}
}
},
methods: {
cloneSpell() {
},
updateSpell(e) {
e.preventDefault()
let schoolsData = Object.values(this.spell.spell_school_ids_value).map(v => { return parseInt(v.slice(7)) })
let variablesData = Object.values(this.spell.spell_variable_ids_value).map(v => { return parseInt(v.slice(9)) })
let ingredientsData = Object.values(this.spell.spell_ingredient_ids_value).map(v => { return parseInt(v.slice(11)) })
let data = {
name: this.spell.name,
description: this.spell.description,
is_ritual: !!+this.spell.is_ritual,
level: parseInt(this.spell.level),
cost: this.spell.cost,
charge: parseInt(this.spell.charge),
schools: schoolsData,
variables: variablesData,
ingredients: ingredientsData,
}
Spells.updateOne(this.spell.id, data)
.then(v => {
this.$emit('updateSpell', v.data)
})
.catch(err => {
console.log(err)
})
},
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

208
client/src/components/spells/spell-card.vue
View File

@@ -1,110 +1,162 @@
<template> <template>
<div
:class="main_school"
class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer"
>
<div <div
:class="main_school" class="spellcard bg-white p-4 rounded text-dark shadow"
class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer"> style="border-left-width:4px;border-left-style:solid;"
<div class="spellcard bg-white p-4 rounded text-dark shadow" style="border-left-width:4px;border-left-style:solid;"> >
<div
:title="spell.name"
class="h3 font-display font-weight-bold text-wrap word-break"
style="line-height:100%;"
>
<router-link
:to="`/sorts/${spell.id}`"
class="text-decoration-none"
>
{{ spell.name }}
</router-link>
</div>
<div :title="spell.name" class="h3 font-display font-weight-bold text-wrap word-break" style="line-height:100%;"> <div>
<router-link :to="`/sorts/${spell.id}`" class="text-decoration-none">{{spell.name}}</router-link> <div class="font-weight-700 text-muted d-inline-block">
</div> Niveau {{ spell.level }}
<div>
<div class="font-weight-700 text-muted d-inline-block">Niveau {{spell.level}}</div>
<span> · </span>
<div class="text-muted d-inline-block">
<span v-for="(school,index) in spell.schools" :key="index">
<span v-if="index!=0">, </span>
<router-link :to="`ecoles/${school.id}`" class="text-secondary">{{school.name}}</router-link>
</span>
</div>
</div>
<div v-if="spell.charge!=0" class="small font-weight-bold">
<span>Charge {{spell.charge}} tour(s)</span>
</div>
<div v-if="spell.is_ritual" class="small font-weight-bold">
<span>Rituel</span>
</div>
<div v-if="spell.ingredients.length>0" class="small">
<span class="font-weight-bold">Nécessite </span>
<span v-for="(ingredient,index) in spell.ingredients" :key="index">
<span v-if="index!=0">, </span>
<span>{{ingredient.name}}</span>
</span>
</div>
<div
v-clipboard="spell.description"
:id="'spell_description_' + spell.id"
v-b-tooltip.click
placement="bottom"
title="Description copiée !"
class="small text-muted mt-2">
<span class="prewrap">{{spell.description}}</span>
</div>
<div class="mt-2">
<div class="font-weight-bold d-inline-block"><span>Coût : </span>{{spell.cost}}</div>
<div v-if="spell.variables.length>0" class="small d-inline-block">, où&nbsp;:</div>
<div class=small>
<span v-for="(variable,index) in spell.variables" :key="index">
<span class="font-weight-bold">
<span v-if="index!=0"><br></span>
<span>{{String.fromCharCode(120+index)}}</span>
</span>
<span> = {{variable.description}}</span>
</span>
</div>
<footer v-if="user" class="text-right">
<a class="h5 text-secondary mr-1">
<i class="mad" @click="editSpell(spell)">edit</i>
</a>
<a class="h5 text-danger">
<i class="mad" @click="deleteSpell(spell)">delete</i>
</a>
</footer>
</div>
</div> </div>
<span> · </span>
<div class="text-muted d-inline-block">
<span
v-for="(school,index) in spell.schools"
:key="index"
>
<span v-if="index!=0">, </span>
<router-link
:to="`ecoles/${school.id}`"
class="text-secondary"
>{{ school.name }}</router-link>
</span>
</div>
</div>
<div
v-if="spell.charge!=0"
class="small font-weight-bold"
>
<span>Charge {{ spell.charge }} tour(s)</span>
</div>
<div
v-if="spell.is_ritual"
class="small font-weight-bold"
>
<span>Rituel</span>
</div>
<div
v-if="spell.ingredients.length>0"
class="small"
>
<span class="font-weight-bold">Nécessite </span>
<span
v-for="(ingredient,index) in spell.ingredients"
:key="index"
>
<span v-if="index!=0">, </span>
<span>{{ ingredient.name }}</span>
</span>
</div>
<div
:id="'spell_description_' + spell.id"
v-clipboard="spell.description"
v-b-tooltip.click
placement="bottom"
title="Description copiée !"
class="small text-muted mt-2"
>
<span class="prewrap">{{ spell.description }}</span>
</div>
<div class="mt-2">
<div class="font-weight-bold d-inline-block">
<span>Coût : </span>{{ spell.cost }}
</div>
<div
v-if="spell.variables.length>0"
class="small d-inline-block"
>
, où&nbsp;:
</div>
<div class="small">
<span
v-for="(variable,index) in spell.variables"
:key="index"
>
<span class="font-weight-bold">
<span v-if="index!=0"><br></span>
<span>{{ String.fromCharCode(120+index) }}</span>
</span>
<span> = {{ variable.description }}</span>
</span>
</div>
<footer
v-if="user"
class="text-right"
>
<a class="h5 text-secondary mr-1">
<i
class="mad"
@click="editSpell(spell)"
>edit</i>
</a>
<a class="h5 text-danger">
<i
class="mad"
@click="deleteSpell(spell)"
>delete</i>
</a>
</footer>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
// API // API
import { RepositoryFactory } from "@/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
export default { export default {
name: 'spell-card', name: 'SpellCard',
props: { props: {
spell: Object, spell: Object,
}, },
data() { data() {
return { return {
main_school: this.spell.schools[0].name, main_school: this.spell.schools[0].name,
} };
},
created() {
this.main_school = this.main_school.toLowerCase()
}, },
computed: { computed: {
user() { user() {
return this.$store.getters.getUserProfile return this.$store.getters.getUserProfile;
} }
}, },
created() {
this.main_school = this.main_school.toLowerCase();
},
methods: { methods: {
editSpell(spell) { editSpell(spell) {
this.$emit('editSpell', spell) this.$emit('editSpell', spell);
}, },
deleteSpell(spell) { deleteSpell(spell) {
Spells.deleteOne(this.spell.id) Spells.deleteOne(this.spell.id)
.then(() => { .then(() => {
this.$emit('deleteSpell', spell) this.$emit('deleteSpell', spell);
}) });
} }
}, },
} };
</script> </script>

478
client/src/components/spells/spells-list.vue
View File

@@ -1,224 +1,290 @@
<template> <template>
<div class="spell-list-wrapper"> <div class="spell-list-wrapper">
<div class="mb-4">
<div class="mb-4"> <form>
<form> <div class="form-group mb-2">
<div class="form-group mb-2"> <input
<input type="text" class="form-control" v-model="search_text" name="search_terms" id="search_terms" placeholder="Rechercher l'arcane"> id="search_terms"
</div> v-model="search_text"
<div class="mb-3"> type="text"
<div class="form-check form-check-inline"> class="form-control"
<input class="form-check-input" type="radio" name="search_term" id="search_fields_name" value="search_fields_name"> name="search_terms"
<label class="form-check-label" for="search_fields_name">Nom</label> placeholder="Rechercher l'arcane"
</div> >
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_description" value="search_fields_description" checked>
<label class="form-check-label" for="search_fields_description">Description</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_schools" value="search_fields_schools" disabled>
<label class="form-check-label" for="search_fields_schools">École(s)</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_ingredients" value="search_fields_ingredients" disabled>
<label class="form-check-label" for="search_fields_ingredients">Ingrédients</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_variables" value="search_fields_variables" disabled>
<label class="form-check-label" for="search_fields_variables">Variables</label>
</div>
</div>
</form>
</div> </div>
<div class="mb-3">
<button <div class="form-check form-check-inline">
v-if="user" <input
@click="showAdd" id="search_fields_name"
type="button" class="form-check-input"
class="btn font-display font-weight-bold btn-lg btn-outline-dark btn-block shadow-sm mb-4"> type="radio"
name="search_term"
<i class="mad">add</i> value="search_fields_name"
<span>Ajouter un sort</span> >
</button> <label
class="form-check-label"
<div for="search_fields_name"
v-if="filteredSpells.length > 0" >Nom</label>
class="spell-list-wrapper"> </div>
<div <div class="form-check form-check-inline">
class="row spells-list" <input
v-masonry id="search_fields_description"
transition-duration="1s" class="form-check-input"
item-selector=".spell-card"> type="radio"
<spell-card name="search_term"
class="spell-card" value="search_fields_description"
v-masonry-tile checked
v-for="(spell) in filteredSpells" >
:key="spell.id" <label
:spell="spell" class="form-check-label"
@editSpell="editSpell" for="search_fields_description"
@deleteSpell="deleteSpell" /> >Description</label>
</div> </div>
<div class="form-check form-check-inline">
<edit-spell-card <input
v-if="Object.keys(current_edit_spell).length > 0" id="search_fields_schools"
:spell="current_edit_spell" class="form-check-input"
@editSpell="editSpell" type="radio"
@updateSpell="updateSpell"/> name="search_term"
value="search_fields_schools"
<add-spell-card disabled
v-if="adding_spell" >
@cancelAdd="cancelAdd" <label
@addSpell="addSpell"/> class="form-check-label"
</div> for="search_fields_schools"
<div >
v-else École(s)
class="loader-wrapper"> </label>
<loader/> </div>
<div class="form-check form-check-inline">
<input
id="search_fields_ingredients"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_ingredients"
disabled
>
<label
class="form-check-label"
for="search_fields_ingredients"
>Ingrédients</label>
</div>
<div class="form-check form-check-inline">
<input
id="search_fields_variables"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_variables"
disabled
>
<label
class="form-check-label"
for="search_fields_variables"
>Variables</label>
</div>
</div> </div>
</form>
</div> </div>
<button
v-if="user"
type="button"
class="btn font-display font-weight-bold btn-lg btn-outline-dark btn-block shadow-sm mb-4"
@click="showAdd"
>
<i class="mad">add</i>
<span>Ajouter un sort</span>
</button>
<div
v-if="filteredSpells.length > 0"
class="spell-list-wrapper"
>
<div
v-masonry
class="row spells-list"
transition-duration="1s"
item-selector=".spell-card"
>
<spell-card
v-for="(spell) in filteredSpells"
:key="spell.id"
v-masonry-tile
class="spell-card"
:spell="spell"
@editSpell="editSpell"
@deleteSpell="deleteSpell"
/>
</div>
<edit-spell-card
v-if="Object.keys(current_edit_spell).length > 0"
:spell="current_edit_spell"
@editSpell="editSpell"
@updateSpell="updateSpell"
/>
<add-spell-card
v-if="adding_spell"
@cancelAdd="cancelAdd"
@addSpell="addSpell"
/>
</div>
<div
v-else
class="loader-wrapper"
>
<loader />
</div>
</div>
</template> </template>
<script> <script>
// Components // Components
import SpellCard from "./spell-card" import SpellCard from "./spell-card";
import EditSpellCard from "./edit-spell-card" import EditSpellCard from "./edit-spell-card";
import AddSpellCard from "./add-spell-card" import AddSpellCard from "./add-spell-card";
// API // API
import { RepositoryFactory } from "~/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
const Schools = RepositoryFactory.get('schools') const Schools = RepositoryFactory.get('schools');
export default { export default {
name: 'spellslist', name: 'Spellslist',
components: { components: {
'spell-card': SpellCard, 'spell-card': SpellCard,
'edit-spell-card': EditSpellCard, 'edit-spell-card': EditSpellCard,
'add-spell-card': AddSpellCard, 'add-spell-card': AddSpellCard,
},
props: {
schoolId: {
type: Number,
default: 1
}, },
props: { },
school_id: String, data() {
return {
spells: [],
loading: false,
current_edit_spell: {},
currentIndex: 1,
adding_spell: false,
search_text: "",
};
},
computed: {
filteredSpells() {
return this.spells;
}, },
data() { user() {
return { return this.$store.state.user;
spells: [],
loading: false,
current_edit_spell: {},
currentIndex: 1,
adding_spell: false,
search_text: "",
}
},
computed: {
filteredSpells() {
return this.spells
},
user() {
return this.$store.state.user
}
},
beforeMount() {
this.spells = this.filteredSpells
if (!this.school_id) {
this.getInitialSpells()
} else {
this.getInitialSchoolSpells()
}
},
mounted() {
if (!this.school_id) {
this.scroll()
}
},
methods: {
getInitialSpells() {
Spells.getPage(this.currentIndex)
.then(v => {
this.loading = true
let spells = this.filteredSpells
spells.push(v.data)
this.spells = spells[0]
})
.then(() => {
this.currentIndex++
this.loading = false
})
.catch(err => {
console.log(err)
})
},
getInitialSchoolSpells() {
Schools.getSpellsFromOne(this.school_id)
.then(v => {
this.loading = true
let spells = this.filteredSpells
spells.push(v.data.spells)
this.spells = spells[0]
})
.then(() => {
this.currentIndex++
this.loading = false
})
.catch(err => {
console.log(err)
})
},
scroll() {
window.onscroll = () => {
if (((window.innerHeight + window.scrollY) - document.body.offsetHeight) >= -1) {
Spells.getPage(this.currentIndex)
.then(v => {
this.loading = true
let spells = this.filteredSpells
for (let i = 0; i < v.data.length; i++) {
const element = v.data[i];
spells.push(element)
}
})
.then(() => {
this.currentIndex++
this.loading = false
})
.catch(err => {
console.log(err)
})
}
}
},
editSpell(e) {
this.current_edit_spell = e;
},
showAdd() {
this.adding_spell = true
},
cancelAdd() {
this.adding_spell = false
},
// Receives events to update the data
addSpell(e) {
Spells.getOne(e.id)
.then(v => {
let spells = this.filteredSpells
spells.unshift(v.data)
})
.then(() => {
this.adding_spell = false
})
.catch(err => {
console.log(err)
})
},
updateSpell(e) {
let oldSpell = this.spells.find(x => x.id === e.id)
this.spells.splice(this.spells.indexOf(oldSpell), 1, e)
this.current_edit_spell = {}
},
deleteSpell(e) {
this.spells.splice(this.spells.indexOf(e), 1)
this.current_edit_spell = {}
}
} }
} },
beforeMount() {
this.spells = this.filteredSpells;
if (!this.school_id) {
this.getInitialSpells();
} else {
this.getInitialSchoolSpells();
}
},
mounted() {
if (!this.school_id) {
this.scroll();
}
},
methods: {
getInitialSpells() {
Spells.getPage(this.currentIndex)
.then(v => {
this.loading = true;
let spells = this.filteredSpells;
spells.push(v.data);
this.spells = spells[0];
})
.then(() => {
this.currentIndex++;
this.loading = false;
})
.catch(err => {
console.log(err);
});
},
getInitialSchoolSpells() {
Schools.getSpellsFromOne(this.school_id)
.then(v => {
this.loading = true;
let spells = this.filteredSpells;
spells.push(v.data.spells);
this.spells = spells[0];
})
.then(() => {
this.currentIndex++;
this.loading = false;
})
.catch(err => {
console.log(err);
});
},
scroll() {
window.onscroll = () => {
if (((window.innerHeight + window.scrollY) - document.body.offsetHeight) >= -1) {
Spells.getPage(this.currentIndex)
.then(v => {
this.loading = true;
let spells = this.filteredSpells;
for (let i = 0; i < v.data.length; i++) {
const element = v.data[i];
spells.push(element);
}
})
.then(() => {
this.currentIndex++;
this.loading = false;
})
.catch(err => {
console.log(err);
});
}
};
},
editSpell(e) {
this.current_edit_spell = e;
},
showAdd() {
this.adding_spell = true;
},
cancelAdd() {
this.adding_spell = false;
},
// Receives events to update the data
addSpell(e) {
Spells.getOne(e.id)
.then(v => {
let spells = this.filteredSpells;
spells.unshift(v.data);
})
.then(() => {
this.adding_spell = false;
})
.catch(err => {
console.log(err);
});
},
updateSpell(e) {
let oldSpell = this.spells.find(x => x.id === e.id);
this.spells.splice(this.spells.indexOf(oldSpell), 1, e);
this.current_edit_spell = {};
},
deleteSpell(e) {
this.spells.splice(this.spells.indexOf(e), 1);
this.current_edit_spell = {};
}
}
};
</script> </script>

127
client/src/components/timeline/timeline.vue
View File

@@ -1,66 +1,77 @@
<template> <template>
<ul class="timeline"> <ul class="timeline">
<li class="timeline-item period first"> <li class="timeline-item period first">
<div class="timeline-info"></div> <div class="timeline-info" />
<div class="timeline-content"> <div class="timeline-content">
<h2 class="timeline-title">LE RENOUVEAU</h2> <h2 class="timeline-title">
</div> LE RENOUVEAU
</li> </h2>
<li class="timeline-item"> </div>
<div class="timeline-info"> </li>
<span>March 12, 2016</span> <li class="timeline-item">
</div> <div class="timeline-info">
<div class="timeline-marker"></div> <span>March 12, 2016</span>
<div class="timeline-content"> </div>
<h3 class="timeline-title">Event Title</h3> <div class="timeline-marker" />
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque.</p> <div class="timeline-content">
</div> <h3 class="timeline-title">
</li> Event Title
<li class="timeline-item"> </h3>
<div class="timeline-info"> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque.</p>
<span>March 23, 2016</span> </div>
</div> </li>
<div class="timeline-marker"></div> <li class="timeline-item">
<div class="timeline-content"> <div class="timeline-info">
<h3 class="timeline-title">Event Title</h3> <span>March 23, 2016</span>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p> </div>
</div> <div class="timeline-marker" />
</li> <div class="timeline-content">
<li class="timeline-item period"> <h3 class="timeline-title">
<div class="timeline-info"></div> Event Title
<div class="timeline-marker"></div> </h3>
<div class="timeline-content"> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p>
<h2 class="timeline-title">April 2016</h2> </div>
</div> </li>
</li> <li class="timeline-item period">
<li class="timeline-item"> <div class="timeline-info" />
<div class="timeline-info"> <div class="timeline-marker" />
<span>April 02, 2016</span> <div class="timeline-content">
</div> <h2 class="timeline-title">
<div class="timeline-marker"></div> April 2016
<div class="timeline-content"> </h2>
<h3 class="timeline-title">Event Title</h3> </div>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p> </li>
</div> <li class="timeline-item">
</li> <div class="timeline-info">
<li class="timeline-item"> <span>April 02, 2016</span>
<div class="timeline-info"> </div>
<span>April 28, 2016</span> <div class="timeline-marker" />
</div> <div class="timeline-content">
<div class="timeline-marker"></div> <h3 class="timeline-title">
<div class="timeline-content"> Event Title
<h3 class="timeline-title">Event Title</h3> </h3>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p>
</div> </div>
</li> </li>
</ul> <li class="timeline-item">
<div class="timeline-info">
<span>April 28, 2016</span>
</div>
<div class="timeline-marker" />
<div class="timeline-content">
<h3 class="timeline-title">
Event Title
</h3>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p>
</div>
</li>
</ul>
</template> </template>
<script> <script>
export default { export default {
name: 'timeline', name: 'Timeline',
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

13
client/src/components/user/profile/update-form.vue
View File

@@ -6,13 +6,12 @@
<script> <script>
export default { export default {
name: 'update-form', name: 'UpdateForm',
props: { props: {
user: Object, user: {
type: Object,
default: null,
},
} }
} };
</script> </script>
<style>
</style>

10
client/src/global-components.js
View File

@@ -1,7 +1,7 @@
import Navbar from './components/global/navbar/navbar' import Navbar from './components/global/navbar/navbar';
import Loader from './components/global/loader' import Loader from './components/global/loader';
export default [ export default [
Navbar, Navbar,
Loader Loader
] ];

84
client/src/main.js
View File

@@ -1,70 +1,76 @@
// Core // Core
import Vue from 'vue' import Vue from 'vue';
import VueRouter from 'vue-router' import VueRouter from 'vue-router';
import App from './app.vue' import App from './app.vue';
import VueMeta from 'vue-meta' import VueMeta from 'vue-meta';
Vue.use(VueMeta, { Vue.use(VueMeta, {
// optional pluginOptions // optional pluginOptions
refreshOnceOnNavigation: true refreshOnceOnNavigation: true
}) });
// Environment // Environment
require('dotenv').config() import dotenv from 'dotenv';
dotenv.config();
import store from './store' // Store
import store from './store';
import Globals from './global-components.js' // Global components
import Globals from './global-components.js';
Globals.forEach(component => { Globals.forEach(component => {
Vue.component(component.name, component) Vue.component(component.name, component);
}); });
// Cookies // Cookies
import VueCookies from 'vue-cookies' import VueCookies from 'vue-cookies';
Vue.use(VueCookies) Vue.use(VueCookies);
// Jquery // Jquery
import jquery from 'jquery' import jquery from 'jquery';
window.$ = jquery window.$ = jquery;
window.jquery = jquery window.jquery = jquery;
// Styles // Styles
// Fonts // Fonts
import './assets/scss/_fonts.scss' import './assets/scss/_fonts.scss';
import './assets/scss/_global.scss' import './assets/scss/_global.scss';
import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap-vue/dist/bootstrap-vue.css' import 'bootstrap-vue/dist/bootstrap-vue.css';
import 'bootstrap/dist/js/bootstrap.js' import 'bootstrap/dist/js/bootstrap.js';
// Plugins // Plugins
import { BootstrapVue } from 'bootstrap-vue' import { BootstrapVue } from 'bootstrap-vue';
Vue.use(BootstrapVue) Vue.use(BootstrapVue);
import { VueMasonryPlugin } from 'vue-masonry' // Masonry (will probably get removed in the very very near future lmao)
Vue.use(VueMasonryPlugin) import { VueMasonryPlugin } from 'vue-masonry';
Vue.use(VueMasonryPlugin);
import clipboard from 'v-clipboard' // Clipboard (might find a better one or code it myself idk)
Vue.use(clipboard) import clipboard from 'v-clipboard';
Vue.use(clipboard);
// FUNCTIONS // FUNCTIONS
var filter = (text, length, clamp) => { // Let's be honest i will 1000% refactor this.
clamp = clamp || '...'; let filter = (text, length, clamp) => {
var node = document.createElement('div'); clamp = clamp || '...';
node.innerHTML = text; let node = document.createElement('div');
var content = node.textContent; node.innerHTML = text;
return content.length > length ? content.slice(0, length) + clamp : content; let content = node.textContent;
} return content.length > length ? content.slice(0, length) + clamp : content;
};
Vue.filter('truncate', filter); Vue.filter('truncate', filter);
// Router // Router
import router from './routes' import router from './routes';
Vue.use(VueRouter) Vue.use(VueRouter);
// Mount Vue // Mount Vue
const app = new Vue({ const app = new Vue({
render: h => h(App), render: h => h(App),
router, router,
store: store store: store
}) });
app.$mount('#srs') app.$mount('#srs');

12
client/src/pages/index-page.vue
View File

@@ -2,8 +2,12 @@
<div class="container-fluid"> <div class="container-fluid">
<section class="d-flex justify-content-center align-items-center"> <section class="d-flex justify-content-center align-items-center">
<main class="px-4"> <main class="px-4">
<h1 class="title text-dark mb-4 font-display font-weight-black line-height-100">"C'est magique, ta gueule."</h1> <h1 class="title text-dark mb-4 font-display font-weight-black line-height-100">
<div class="lead font-display font-weight-bold">— N'importe quel MJ, une fois dans sa vie</div> "C'est magique, ta gueule."
</h1>
<div class="lead font-display font-weight-bold">
— N'importe quel MJ, une fois dans sa vie
</div>
<hr class="w-50"> <hr class="w-50">
<div class="lead"> <div class="lead">
<span class="font-display font-weight-bold">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>. <span class="font-display font-weight-bold">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>.
@@ -15,8 +19,8 @@
<script> <script>
export default { export default {
name: 'index-page', name: 'IndexPage',
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

13
client/src/pages/schools/schools-page.vue
View File

@@ -1,17 +1,22 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">Écoles</h1> id="spell-container"
class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
Écoles
</h1>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'schools-page', name: 'SchoolsPage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Maîtrises' titleTemplate: '%s - Maîtrises'
}, },
} };
</script> </script>

21
client/src/pages/schools/single-school-page.vue
View File

@@ -1,8 +1,13 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">{{ school.name }}</h1> id="spell-container"
class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
{{ school.name }}
</h1>
<p>{{ school.description }}</p> <p>{{ school.description }}</p>
<spell-list :school_id="id"/> <spell-list :school_id="id" />
</div> </div>
</template> </template>
@@ -11,14 +16,14 @@
import { RepositoryFactory } from "@/api/repositories"; import { RepositoryFactory } from "@/api/repositories";
const Schools = RepositoryFactory.get('schools'); const Schools = RepositoryFactory.get('schools');
import SpellsList from "~/components/spells/spells-list"; import SpellsList from "@/components/spells/spells-list";
export default { export default {
name: 'single-school-page', name: 'SingleSchoolPage',
metaInfo() { metaInfo() {
return { return {
titleTemplate: `%s - ${this.school.name}`, titleTemplate: `%s - ${this.school.name}`,
} };
}, },
components: { components: {
'spell-list': SpellsList, 'spell-list': SpellsList,
@@ -30,7 +35,7 @@ export default {
errors: { errors: {
loading: "", loading: "",
} }
} };
}, },
created() { created() {
Schools.getOne(this.id) Schools.getOne(this.id)
@@ -41,7 +46,7 @@ export default {
console.log(err); console.log(err);
}); });
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

22
client/src/pages/spells/single-spell-page.vue
View File

@@ -1,7 +1,15 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">{{ spell.name }}</h1> id="spell-container"
<p class="prewrap">{{ spell.description }}</p> </div> class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
{{ spell.name }}
</h1>
<p class="prewrap">
{{ spell.description }}
</p>
</div>
</template> </template>
<script> <script>
@@ -10,11 +18,11 @@ import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells'); const Spells = RepositoryFactory.get('spells');
export default { export default {
name: 'single-spell-page', name: 'SingleSpellPage',
metaInfo() { metaInfo() {
return { return {
titleTemplate: this.spell.name ? `%s - ${this.spell.name}` : '%s', titleTemplate: this.spell.name ? `%s - ${this.spell.name}` : '%s',
} };
}, },
data() { data() {
return { return {
@@ -23,7 +31,7 @@ export default {
errors: { errors: {
loading: "", loading: "",
} }
} };
}, },
created() { created() {
Spells.getOne(this.id) Spells.getOne(this.id)
@@ -34,7 +42,7 @@ export default {
console.log(err); console.log(err);
}); });
}, },
} };
</script> </script>
<style> <style>

15
client/src/pages/spells/spells-page.vue
View File

@@ -1,7 +1,12 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">Sortilèges</h1> id="spell-container"
<spell-list/> class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
Sortilèges
</h1>
<spell-list />
</div> </div>
</template> </template>
@@ -9,14 +14,14 @@
import SpellsList from "@/components/spells/spells-list.vue"; import SpellsList from "@/components/spells/spells-list.vue";
export default { export default {
name: 'spells-page', name: 'SpellsPage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Grimoire' titleTemplate: '%s - Grimoire'
}, },
components: { components: {
'spell-list': SpellsList, 'spell-list': SpellsList,
} }
} };
</script> </script>
<style lang="scss"></style> <style lang="scss"></style>

17
client/src/pages/timelines/timeline-page.vue
View File

@@ -1,22 +1,27 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">Chronologie</h1> id="spell-container"
<timeline/> class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
Chronologie
</h1>
<timeline />
</div> </div>
</template> </template>
<script> <script>
import Timeline from "~/components/timeline/timeline" import Timeline from "@/components/timeline/timeline";
export default { export default {
name: 'timeline-page', name: 'TimelinePage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Âges' titleTemplate: '%s - Âges'
}, },
components: { components: {
'timeline': Timeline 'timeline': Timeline
} }
} };
</script> </script>
<style> <style>

62
client/src/pages/user/profile-page.vue
View File

@@ -1,38 +1,72 @@
<template> <template>
<div <div
v-if="user" v-if="user"
class="container-fluid p-4"
id="spell-container" id="spell-container"
class="container-fluid p-4"
> >
<h2 class="display-3 font-display mb-3"> <h2 class="display-3 font-display mb-3">
<span class="username">{{ user.name }}</span> <span class="username">{{ user.name }}</span>
</h2> </h2>
<span>Membre depuis le {{ registered_date }}</span> <span>Membre depuis le {{ registered_date }}</span>
<ul class="nav nav-tabs mt-3 mb-3" id="tabs-tab" role="tablist"> <ul
id="tabs-tab"
class="nav nav-tabs mt-3 mb-3"
role="tablist"
>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" id="tabs-home-tab" data-toggle="pill" href="#tabs-home" role="tab" aria-controls="tabs-home" aria-selected="true">Mes sorts</a> <a
id="tabs-home-tab"
class="nav-link active"
data-toggle="pill"
href="#tabs-home"
role="tab"
aria-controls="tabs-home"
aria-selected="true"
>Mes sorts</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" id="tabs-contact-tab" data-toggle="pill" href="#tabs-contact" role="tab" aria-controls="tabs-contact" aria-selected="false">Paramètres</a> <a
id="tabs-contact-tab"
class="nav-link"
data-toggle="pill"
href="#tabs-contact"
role="tab"
aria-controls="tabs-contact"
aria-selected="false"
>Paramètres</a>
</li> </li>
</ul> </ul>
<div class="tab-content" id="tabs-tabContent"> <div
<div class="tab-pane fade show active" id="tabs-home" role="tabpanel" aria-labelledby="tabs-home-tab">...</div> id="tabs-tabContent"
<div class="tab-pane fade" id="tabs-contact" role="tabpanel" aria-labelledby="tabs-contact-tab"> class="tab-content"
<update-form :user="user"/> >
<div
id="tabs-home"
class="tab-pane fade show active"
role="tabpanel"
aria-labelledby="tabs-home-tab"
>
...
</div>
<div
id="tabs-contact"
class="tab-pane fade"
role="tabpanel"
aria-labelledby="tabs-contact-tab"
>
<update-form :user="user" />
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import UpdateForm from '~/components/user/profile/update-form.vue' import UpdateForm from '@/components/user/profile/update-form.vue';
export default { export default {
name: 'profile-page', name: 'ProfilePage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Profil' titleTemplate: '%s - Profil'
}, },
@@ -41,11 +75,11 @@ export default {
}, },
data() { data() {
return { return {
} };
}, },
computed: { computed: {
user() { user() {
return this.$store.getters.getUserProfile return this.$store.getters.getUserProfile;
}, },
registered_date() { registered_date() {
let raw_date = new Date(this.user.register_date); let raw_date = new Date(this.user.register_date);
@@ -59,7 +93,7 @@ export default {
return new Intl.DateTimeFormat("fr", date_options).format(raw_date); return new Intl.DateTimeFormat("fr", date_options).format(raw_date);
} }
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

28
client/src/routes.js
View File

@@ -1,21 +1,21 @@
import VueRouter from 'vue-router' import VueRouter from 'vue-router';
import store from './store' import store from './store';
// Pages // Pages
import Index from "@/pages/index-page" import Index from "@/pages/index-page";
import Spells from "@/pages/spells/spells-page" import Spells from "@/pages/spells/spells-page";
import SpellSingle from "@/pages/spells/single-spell-page" import SpellSingle from "@/pages/spells/single-spell-page";
import Schools from "./pages/schools/schools-page" import Schools from "./pages/schools/schools-page";
import SchoolSingle from "@/pages/schools/single-school-page" import SchoolSingle from "@/pages/schools/single-school-page";
import Timeline from "./pages/timelines/timeline-page" import Timeline from "./pages/timelines/timeline-page";
import Profile from "@/pages/user/profile-page" import Profile from "@/pages/user/profile-page";
import Login from "@/pages/user/login-page" import Login from "@/pages/user/login-page";
import Register from "@/pages/user/register-page" import Register from "@/pages/user/register-page";
// Routes // Routes
const routes = [ const routes = [
@@ -71,14 +71,14 @@ const routes = [
logoutFilter: true, logoutFilter: true,
} }
}, },
] ];
const router = new VueRouter({ const router = new VueRouter({
mode: 'history', mode: 'history',
routes, routes,
linkActiveClass: "", linkActiveClass: "",
linkExactActiveClass: "active", linkExactActiveClass: "active",
}) });
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
if (to.matched.some(record => record.meta.loginFilter)) { if (to.matched.some(record => record.meta.loginFilter)) {
@@ -97,6 +97,6 @@ router.beforeEach((to, from, next) => {
next(); next();
} }
next(); next();
}) });
export default router; export default router;

10
client/src/store/modules/spell.store.js
View File

@@ -1,18 +1,18 @@
const state = { const state = {
} };
const getters = { const getters = {
} };
const actions = { const actions = {
} };
const mutations = { const mutations = {
} };
export default { export default {
namespaced: true, namespaced: true,
@@ -20,4 +20,4 @@ export default {
getters, getters,
actions, actions,
mutations, mutations,
} };

50
client/src/store/modules/user.store.js
View File

@@ -1,7 +1,7 @@
import cookie from 'vue-cookies'; import cookie from 'vue-cookies';
// API // API
import { RepositoryFactory } from "~/api/repositories"; import { RepositoryFactory } from "@/api/repositories";
const Users = RepositoryFactory.get('users'); const Users = RepositoryFactory.get('users');
export const namespaced = true; export const namespaced = true;
@@ -12,7 +12,7 @@ const state = {
const getters = { const getters = {
getUserProfile: state => { getUserProfile: state => {
return state.profile return state.profile;
} }
}; };
@@ -40,23 +40,23 @@ const actions = {
user_login ({ commit }, data) { user_login ({ commit }, data) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
Users.login(data.user) Users.login(data.user)
.then(v => { .then(v => {
let user = v.data.user; let user = v.data.user;
// Check if the use wishes to be remembered // Check if the use wishes to be remembered
if (data.remember_me) { if (data.remember_me) {
cookie.set('user_profile', user, 60 * 60 * 24 * 30); // Expires after a month cookie.set('user_profile', user, 60 * 60 * 24 * 30); // Expires after a month
} else { } else {
cookie.set('user_profile', user, 0); // Expires after browser session expires cookie.set('user_profile', user, 0); // Expires after browser session expires
} }
commit('loginUser', user); commit('loginUser', user);
resolve(user); resolve(user);
}) })
.catch(err => { .catch(err => {
reject(err.response); reject(err.response);
}); });
}) });
}, },
user_logout ({ commit }) { user_logout ({ commit }) {
@@ -72,14 +72,14 @@ const actions = {
user_register ({ commit }, data) { user_register ({ commit }, data) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
Users.register(data.user) Users.register(data.user)
.then(() => { .then(() => {
commit('registerUser'); commit('registerUser');
resolve(); resolve();
}) })
.catch(err => { .catch(err => {
reject(err.response); reject(err.response);
}); });
}) });
} }
}; };

9
client/vue.config.js
View File

@@ -1,19 +1,18 @@
const path = require('path') const path = require('path');
module.exports = { module.exports = {
lintOnSave: false,
configureWebpack: { configureWebpack: {
resolve: { resolve: {
alias: { alias: {
"~": path.resolve(__dirname, 'src/') "@": path.resolve(__dirname, 'src/')
} }
} }
}, },
css: { css: {
loaderOptions: { loaderOptions: {
scss: { scss: {
prependData: ` prependData: `@import "@/assets/scss/_variables.scss";`
@import "@/assets/scss/_variables.scss";
`
} }
} }
} }