From 15e0b6f64b8cf8d12c2471fe8f7d20b7c6f9ca27 Mon Sep 17 00:00:00 2001 From: Evorp <3vorpgaming@gmail.com> Date: Tue, 16 Jan 2024 19:59:37 -0800 Subject: [PATCH] various fixes, skeleton for pack page --- package.json | 94 +++++------ pages/components/drop-zone.js | 2 +- pages/components/multi-range-input.js | 2 +- pages/components/quick-date-picker.js | 72 ++++---- pages/contribution/main.js | 3 + pages/gallery/gallery.js | 2 +- pages/pack/main.js | 129 +++++++++++++- pages/review/review_preview.js | 235 +++++++++++++------------- pages/settings/settingsPage.js | 4 +- pages/texture/main.js | 8 +- pages/users/main.js | 167 +++++++++--------- puppeteer.config.cjs | 4 +- resources/css/webapp.css | 14 +- resources/strings/en_US.js | 8 +- webapp.js | 5 +- 15 files changed, 438 insertions(+), 311 deletions(-) diff --git a/package.json b/package.json index dbd6ef2..4830b97 100644 --- a/package.json +++ b/package.json @@ -1,49 +1,49 @@ { - "name": "faithful-web-app", - "version": "1.0.0", - "description": "The official Web Application for the Faithful website.", - "main": "main.js", - "scripts": { - "dev": "nodemon main.js --watch .env --watch main.js", - "start": "pm2 start \"node main.js\" --name \"APP\"", - "watch": "browser-refresh main.js", - "prettier": "prettier \"{,!(node_modules)/**/}*.js\" --config .prettierrc --write", - "test:app": "env-cmd -f ./tests/.env.test node main.js", - "test:mocha": "mocha --recursive tests/**/*.test.js", - "nodemon:app:test": "nodemon --exec pnpm run test:app", - "nodemon:mock_server": "nodemon --exec node tests/mock_server.js" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/Faithful-Resource-Pack/App.git" - }, - "keywords": [], - "author": "", - "license": "ISC", - "bugs": { - "url": "https://github.com/Faithful-Resource-Pack/App/issues" - }, - "homepage": "https://github.com/Faithful-Resource-Pack/App#readme", - "dependencies": { - "axios": "^1.6.3", - "btoa": "^1.2.1", - "dotenv": "^16.3.1", - "express": "^4.18.2", - "moment": "^2.30.1", - "node-domexception": "^2.0.1", - "node-fetch": "^3.3.2", - "node-localstorage": "^3.0.5", - "prettier": "^3.1.1", - "twin-bcrypt": "^2.1.1", - "url": "^0.11.3" - }, - "devDependencies": { - "@types/express": "^4.17.21", - "chai": "^5.0.0", - "cors": "^2.8.5", - "env-cmd": "^10.1.0", - "mocha": "^10.2.0", - "nodemon": "^3.0.2", - "puppeteer": "^21.6.1" - } + "name": "faithful-web-app", + "version": "1.0.0", + "description": "The official Web Application for the Faithful website.", + "main": "main.js", + "scripts": { + "dev": "nodemon main.js --watch .env --watch main.js", + "start": "pm2 start \"node main.js\" --name \"APP\"", + "watch": "browser-refresh main.js", + "prettier": "prettier \"{,!(node_modules)/**/}*.js\" --config .prettierrc --write", + "test:app": "env-cmd -f ./tests/.env.test node main.js", + "test:mocha": "mocha --recursive tests/**/*.test.js", + "nodemon:app:test": "nodemon --exec pnpm run test:app", + "nodemon:mock_server": "nodemon --exec node tests/mock_server.js" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/Faithful-Resource-Pack/App.git" + }, + "keywords": [], + "author": "", + "license": "ISC", + "bugs": { + "url": "https://github.com/Faithful-Resource-Pack/App/issues" + }, + "homepage": "https://github.com/Faithful-Resource-Pack/App#readme", + "dependencies": { + "axios": "^1.6.3", + "btoa": "^1.2.1", + "dotenv": "^16.3.1", + "express": "^4.18.2", + "moment": "^2.30.1", + "node-domexception": "^2.0.1", + "node-fetch": "^3.3.2", + "node-localstorage": "^3.0.5", + "prettier": "^3.1.1", + "twin-bcrypt": "^2.1.1", + "url": "^0.11.3" + }, + "devDependencies": { + "@types/express": "^4.17.21", + "chai": "^5.0.0", + "cors": "^2.8.5", + "env-cmd": "^10.1.0", + "mocha": "^10.2.0", + "nodemon": "^3.0.2", + "puppeteer": "^21.6.1" + } } diff --git a/pages/components/drop-zone.js b/pages/components/drop-zone.js index c7aec21..dca0585 100644 --- a/pages/components/drop-zone.js +++ b/pages/components/drop-zone.js @@ -52,7 +52,7 @@ export default {
- `, + `, data() { return { isDragging: false, diff --git a/pages/components/multi-range-input.js b/pages/components/multi-range-input.js index 4bafde1..1eb56b1 100644 --- a/pages/components/multi-range-input.js +++ b/pages/components/multi-range-input.js @@ -29,7 +29,7 @@ export default { class="my-0 pt-0" /> - `, + `, data() { return { ranges: [], diff --git a/pages/components/quick-date-picker.js b/pages/components/quick-date-picker.js index 648e4a6..4dc071d 100644 --- a/pages/components/quick-date-picker.js +++ b/pages/components/quick-date-picker.js @@ -29,42 +29,42 @@ export default { }, }, template: ` - -
- -
- - - - {{ upper_months[i-1] }} - - - -
-
- {{ i }} -
- - `, + +
+ +
+ + + + {{ upper_months[i-1] }} + + + +
+
+ {{ i }} +
+ + `, data() { return { date: new Date(new Date(this.value).setHours(0, 0, 0, 0)), diff --git a/pages/contribution/main.js b/pages/contribution/main.js index 40c97f0..a494f01 100644 --- a/pages/contribution/main.js +++ b/pages/contribution/main.js @@ -129,6 +129,9 @@ export default { {{ $root.lang().database.labels.search_contributions }}mdi-magnify + +
{{ $root.lang().database.subtitles.contribution_result }}
+ diff --git a/pages/pack/main.js b/pages/pack/main.js index 861e2ab..22b0579 100644 --- a/pages/pack/main.js +++ b/pages/pack/main.js @@ -3,10 +3,127 @@ export default { name: "pack-page", template: ` - -
- {{ $root.lang().database.titles.packs }} -
-
- `, + +
+
+ {{ $root.lang().database.titles.packs }} +
+ + +
{{ $root.lang().database.labels.select_pack_type }}
+ {{ formatTags(t) }} + + +
{{ $root.lang().database.subtitles.pack_result }}
+ + + + + + + + + + + + + +
+ +
+
+ `, + data() { + return { + pageColor: "amber darken-2", + pageStyles: "", + search: "", + textColorOnPage: "white--text", + tags: [], + packs: [], + }; + }, + methods: { + activeTag(t) { + const result = {}; + result["v-btn--active " + this.pageColor + " " + this.textColorOnPage] = + (t === "all" && !this.tag) || (t && this.tag && t.toLowerCase() === this.tag.toLowerCase()); + + return result; + }, + startSearch() { + // change url to match + const newPath = this.packURL(this.tag); + if (newPath !== this.$route.path) return this.$router.push(newPath); + + // "all" tag searches everything + const url = new URL(`${this.$root.apiURL}/packs/search`); + if (this.tags.includes(this.$route.params.type)) + url.searchParams.set("tag", this.$route.params.type); + + axios + .get(url.toString()) + .then((res) => { + this.packs = res.data; + }) + .catch((err) => console.error(err)); + }, + packURL(tag) { + return "/packs/" + tag ?? "all"; + }, + formatTags(s) { + return s + .split("_") + .map((p) => (p == "progart" ? "Programmer Art" : p[0].toUpperCase() + p.slice(1))) + .join(" "); + }, + }, + computed: { + packTags() { + return ["all", ...this.tags]; + }, + tag() { + if (this.$route.params.type) return this.$route.params.type; + return "all"; + }, + listColumns() { + // big screens use two columns, smaller use one + return this.$vuetify.breakpoint.mdAndUp ? 2 : 1; + }, + }, + mounted() { + axios.get(`${this.$root.apiURL}/packs/tags`).then((res) => (this.tags = res.data)); + this.startSearch(); + window.updatePageStyles(this); + }, + watch: { + "$route.params": { + handler(params, old) { + // if hash changed but not params + if (JSON.stringify(params) === JSON.stringify(old)) return; + + // search whenever the url changes (when tag is switched) + this.startSearch(); + }, + }, + }, }; diff --git a/pages/review/review_preview.js b/pages/review/review_preview.js index 35031a3..7ff952f 100644 --- a/pages/review/review_preview.js +++ b/pages/review/review_preview.js @@ -17,135 +17,134 @@ export default { template: `
- - -