diff --git a/backend/controllers/socialnetworkController.js b/backend/controllers/socialnetworkController.js index 4bc1d8e..afc5291 100644 --- a/backend/controllers/socialnetworkController.js +++ b/backend/controllers/socialnetworkController.js @@ -11,6 +11,8 @@ class SocialNetworkController { this.getImage = this.getImage.bind(this); this.getImageVisibilityTypes = this.getImageVisibilityTypes.bind(this); this.getFolderImageList = this.getFolderImageList.bind(this); + this.getImageByHash = this.getImageByHash.bind(this); + this.changeImage = this.changeImage.bind(this); } async userSearch(req, res) { @@ -77,8 +79,9 @@ class SocialNetworkController { async uploadImage(req, res) { try { const userId = req.headers.userid; - const imageData = req.body; - const image = await this.socialNetworkService.uploadImage(userId, imageData); + const file = req.file; + const formData = req.body; + const image = await this.socialNetworkService.uploadImage(userId, file, formData); res.status(201).json(image); } catch (error) { console.error('Error in uploadImage:', error); @@ -106,6 +109,38 @@ class SocialNetworkController { res.status(500).json({ error: error.message }); } } + + async getImageByHash(req, res) { + try { + const userId = req.headers.userid; + const { hash } = req.params; + const filePath = await this.socialNetworkService.getImageFilePath(userId, hash); + console.log(filePath); + res.sendFile(filePath, err => { + if (err) { + console.error('Error sending file:', err); + res.status(500).json({ error: 'Error sending file' }); + } + }); + } catch (error) { + console.error('Error in getImageByHash:', error); + res.status(403).json({ error: error.message || 'Access denied or image not found' }); + } + } + + async changeImage(req, res) { + try { + const userId = req.headers.userid; + const { imageId } = req.params; + const { title, visibilities } = req.body; + const folderId = await this.socialNetworkService.changeImage(userId, imageId, title, visibilities); + console.log('--->', folderId); + res.status(201).json(await this.socialNetworkService.getFolderImageList(userId, folderId)); + } catch (error) { + console.error('Error in getImageByHash:', error); + res.status(403).json({ error: error.message || 'Access denied or image not found' }); + } + } } export default SocialNetworkController; diff --git a/backend/package-lock.json b/backend/package-lock.json index 59871b3..99b13fd 100644 --- a/backend/package-lock.json +++ b/backend/package-lock.json @@ -16,6 +16,7 @@ "express": "^4.19.2", "i18n": "^0.15.1", "joi": "^17.13.3", + "multer": "^1.4.5-lts.1", "mysql2": "^3.10.3", "nodemailer": "^6.9.14", "pg": "^8.12.0", @@ -351,6 +352,11 @@ "url": "https://github.com/chalk/ansi-styles?sponsor=1" } }, + "node_modules/append-field": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/append-field/-/append-field-1.0.0.tgz", + "integrity": "sha512-klpgFSWLW1ZEs8svjfb7g4qWY0YS5imI82dTg+QahUvJ8YqAY0P10Uk8tTyh9ZGuYEZEMaeJYCF5BFuX552hsw==" + }, "node_modules/aproba": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/aproba/-/aproba-2.0.0.tgz", @@ -513,11 +519,27 @@ "concat-map": "0.0.1" } }, + "node_modules/buffer-from": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz", + "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==" + }, "node_modules/buffer-more-ints": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/buffer-more-ints/-/buffer-more-ints-1.0.0.tgz", "integrity": "sha512-EMetuGFz5SLsT0QTnXzINh4Ksr+oo4i+UGTXEshiGCQWnsgSs7ZhJ8fzlwQ+OzEMs0MpDAMr1hxnblp5a4vcHg==" }, + "node_modules/busboy": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/busboy/-/busboy-1.6.0.tgz", + "integrity": "sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==", + "dependencies": { + "streamsearch": "^1.1.0" + }, + "engines": { + "node": ">=10.16.0" + } + }, "node_modules/bytes": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz", @@ -619,6 +641,47 @@ "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==" }, + "node_modules/concat-stream": { + "version": "1.6.2", + "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz", + "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==", + "engines": [ + "node >= 0.8" + ], + "dependencies": { + "buffer-from": "^1.0.0", + "inherits": "^2.0.3", + "readable-stream": "^2.2.2", + "typedarray": "^0.0.6" + } + }, + "node_modules/concat-stream/node_modules/isarray": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==" + }, + "node_modules/concat-stream/node_modules/readable-stream": { + "version": "2.3.8", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz", + "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==", + "dependencies": { + "core-util-is": "~1.0.0", + "inherits": "~2.0.3", + "isarray": "~1.0.0", + "process-nextick-args": "~2.0.0", + "safe-buffer": "~5.1.1", + "string_decoder": "~1.1.1", + "util-deprecate": "~1.0.1" + } + }, + "node_modules/concat-stream/node_modules/string_decoder": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", + "dependencies": { + "safe-buffer": "~5.1.0" + } + }, "node_modules/config-chain": { "version": "1.1.13", "resolved": "https://registry.npmjs.org/config-chain/-/config-chain-1.1.13.tgz", @@ -1822,6 +1885,14 @@ "node": "*" } }, + "node_modules/minimist": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz", + "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/minipass": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/minipass/-/minipass-5.0.0.tgz", @@ -1893,6 +1964,34 @@ "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" }, + "node_modules/multer": { + "version": "1.4.5-lts.1", + "resolved": "https://registry.npmjs.org/multer/-/multer-1.4.5-lts.1.tgz", + "integrity": "sha512-ywPWvcDMeH+z9gQq5qYHCCy+ethsk4goepZ45GLD63fOu0YcNecQxi64nDs3qluZB+murG3/D4dJ7+dGctcCQQ==", + "dependencies": { + "append-field": "^1.0.0", + "busboy": "^1.0.0", + "concat-stream": "^1.5.2", + "mkdirp": "^0.5.4", + "object-assign": "^4.1.1", + "type-is": "^1.6.4", + "xtend": "^4.0.0" + }, + "engines": { + "node": ">= 6.0.0" + } + }, + "node_modules/multer/node_modules/mkdirp": { + "version": "0.5.6", + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.6.tgz", + "integrity": "sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==", + "dependencies": { + "minimist": "^1.2.6" + }, + "bin": { + "mkdirp": "bin/cmd.js" + } + }, "node_modules/mustache": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/mustache/-/mustache-4.2.0.tgz", @@ -2253,6 +2352,11 @@ "node": ">=0.10.0" } }, + "node_modules/process-nextick-args": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz", + "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==" + }, "node_modules/proto-list": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz", @@ -2698,6 +2802,14 @@ "node": ">= 0.8" } }, + "node_modules/streamsearch": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz", + "integrity": "sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/string_decoder": { "version": "0.10.31", "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz", @@ -2832,6 +2944,11 @@ "node": ">= 0.6" } }, + "node_modules/typedarray": { + "version": "0.0.6", + "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", + "integrity": "sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==" + }, "node_modules/umzug": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/umzug/-/umzug-2.3.0.tgz", diff --git a/backend/package.json b/backend/package.json index 0291153..210ebfb 100644 --- a/backend/package.json +++ b/backend/package.json @@ -18,6 +18,7 @@ "express": "^4.19.2", "i18n": "^0.15.1", "joi": "^17.13.3", + "multer": "^1.4.5-lts.1", "mysql2": "^3.10.3", "nodemailer": "^6.9.14", "pg": "^8.12.0", diff --git a/backend/routers/contactRouter.js b/backend/routers/contactRouter.js index a0803d2..b3c4655 100644 --- a/backend/routers/contactRouter.js +++ b/backend/routers/contactRouter.js @@ -1,19 +1,9 @@ -import ContactService from '../services/ContactService.js'; +import { Router } from 'express'; +import ContactController from '../controllers/contactController.js'; -class ContactController { - constructor() { - this.addContactMessage = this.addContactMessage.bind(this); - } +const router = Router(); +const contactController = new ContactController(); - async addContactMessage(req, res) { - try { - const { email, name, message, acceptDataSave } = req.body; - await ContactService.addContactMessage(email, name, message, acceptDataSave); - res.status(200).json({ status: 'ok' }); - } catch (error) { - res.status(409).json({ error: error.message }); - } - } -} +router.post('/', contactController.addContactMessage); -export default ContactController; +export default router; diff --git a/backend/routers/socialnetworkRouter.js b/backend/routers/socialnetworkRouter.js index 6bb5e71..192070b 100644 --- a/backend/routers/socialnetworkRouter.js +++ b/backend/routers/socialnetworkRouter.js @@ -1,6 +1,8 @@ import express from 'express'; import { authenticate } from '../middleware/authMiddleware.js'; import SocialNetworkController from '../controllers/socialnetworkController.js'; +import multer from 'multer'; +const upload = multer(); const router = express.Router(); const socialNetworkController = new SocialNetworkController(); @@ -10,8 +12,10 @@ router.get('/profile/:userId', authenticate, socialNetworkController.profile); router.post('/folders', authenticate, socialNetworkController.createFolder); router.get('/folders', authenticate, socialNetworkController.getFolders); router.get('/folder/:folderId', authenticate, socialNetworkController.getFolderImageList); -router.post('/images', authenticate, socialNetworkController.uploadImage); +router.post('/images', authenticate, upload.single('image'), socialNetworkController.uploadImage); router.get('/images/:imageId', authenticate, socialNetworkController.getImage); +router.put('/images/:imageId', authenticate, socialNetworkController.changeImage); router.get('/imagevisibilities', authenticate, socialNetworkController.getImageVisibilityTypes); +router.get('/image/:hash', authenticate, socialNetworkController.getImageByHash); export default router; diff --git a/backend/services/socialnetworkService.js b/backend/services/socialnetworkService.js index 52b2a49..1f84428 100644 --- a/backend/services/socialnetworkService.js +++ b/backend/services/socialnetworkService.js @@ -10,6 +10,14 @@ import Folder from '../models/community/folder.js'; import Image from '../models/community/image.js'; import ImageVisibilityType from '../models/type/image_visibility.js'; import FolderImageVisibility from '../models/community/folder_image_visibility.js'; +import ImageImageVisibility from '../models/community/image_image_visibility.js'; +import { v4 as uuidv4 } from 'uuid'; +import fs from 'fs'; +import path from 'path'; +import { fileURLToPath } from 'url'; + +const __filename = fileURLToPath(import.meta.url); +const __dirname = path.dirname(__filename); class SocialNetworkService extends BaseService { async searchUsers({ username, ageFrom, ageTo, genders }) { @@ -95,15 +103,81 @@ class SocialNetworkService extends BaseService { return await Image.findAll({ where: { folderId: folder.id - } + }, + order: [ + ['title', 'asc'] + ] }); } - async uploadImage(hashedId, imageData) { - this.validateImageData(imageData); - const userId = await this.checkUserAccess(hashedId); - imageData.id = userId; - return await Image.create(imageData); + async uploadImage(hashedId, file, formData) { + const userId = await this.getUserId(hashedId); + const newFileName = this.generateUniqueFileName(file.originalname); + const filePath = this.buildFilePath(newFileName); + await this.saveFile(file.buffer, filePath); + const newImage = await this.createImageRecord(formData, userId, file, newFileName); + await this.saveImageVisibilities(newImage.id, formData.visibility); + return newImage; + } + + async getUserId(hashedId) { + return await this.checkUserAccess(hashedId); + } + + generateUniqueFileName(originalFileName) { + const uniqueHash = uuidv4(); + return `${uniqueHash}`; + } + + buildFilePath(fileName) { + const userImagesPath = path.join(__dirname, '../images/user'); + return path.join(userImagesPath, fileName); + } + + async saveFile(buffer, filePath) { + try { + await fs.mkdir(path.dirname(filePath), { recursive: true }); + await fs.writeFile(filePath, buffer); + } catch (error) { + throw new Error(`Failed to save file: ${error.message}`); + } + } + + async createImageRecord(formData, userId, file, fileName) { + try { + return await Image.create({ + title: formData.title, + description: formData.description || null, + originalFileName: file.originalname, + hash: fileName, + folderId: formData.folderId, + userId: userId, + }); + } catch (error) { + throw new Error(`Failed to create image record: ${error.message}`); + } + } + + async saveImageVisibilities(imageId, visibilities) { + if (typeof visibilities === 'string') { + visibilities = JSON.parse(visibilities); + } + if (!visibilities || !Array.isArray(visibilities)) { + throw new Error('Invalid visibilities provided'); + } + + try { + const visibilityPromises = visibilities.map(visibilityId => { + return ImageImageVisibility.create({ + imageId: imageId, + visibilityTypeId: visibilityId + }); + }); + + await Promise.all(visibilityPromises); + } catch (error) { + throw new Error(`Failed to save image visibilities: ${error.message}`); + } } async getImage(imageId) { @@ -255,6 +329,51 @@ class SocialNetworkService extends BaseService { async getPossibleImageVisibilities() { return await ImageVisibilityType.findAll(); } + + async getImageFilePath(hashedUserId, hash) { + const image = await Image.findOne({ where: { hash } }); + if (!image) { + throw new Error('Image not found'); + } + const userId = await this.checkUserAccess(hashedUserId); + const hasAccess = await this.checkUserImageAccess(userId, image.id); + if (!hasAccess) { + throw new Error('Access denied'); + } + const imagePath = this.buildFilePath(image.hash); + if (!fs.existsSync(imagePath)) { + throw new Error('File not found'); + } + return imagePath; + } + + async checkUserImageAccess(userId, imageId) { + const image = await Image.findByPk(imageId); + if (image.userId === userId) { + return true; + } + const accessRules = await ImageImageVisibility.findAll({ + where: { imageId } + }); + return accessRules.some(rule => { + return false; + }); + } + + async changeImage(hashedUserId, imageId, title, visibilities) { + const userId = await this.checkUserAccess(hashedUserId); + await this.checkUserImageAccess(userId, imageId); + const image = await Image.findOne({ where: { id: imageId } }); + if (!image) { + throw new Error('image not found') + } + await image.update({ title: title }); + await ImageImageVisibility.destroy({ where: { imageId } }); + for (const visibility of visibilities) { + await ImageImageVisibility.create({ imageId, visibilityTypeId: visibility.id }); + } + return image.folderId; + } } export default SocialNetworkService; diff --git a/frontend/src/assets/styles.scss b/frontend/src/assets/styles.scss index 53a1ba5..0f6daa0 100644 --- a/frontend/src/assets/styles.scss +++ b/frontend/src/assets/styles.scss @@ -55,6 +55,7 @@ button:hover { h1, h2, h3 { margin: 0; + display: block; } .multiselect__option--highlight, diff --git a/frontend/src/components/FolderItem.vue b/frontend/src/components/FolderItem.vue index b1d54e1..2027e17 100644 --- a/frontend/src/components/FolderItem.vue +++ b/frontend/src/components/FolderItem.vue @@ -1,16 +1,22 @@ @@ -18,15 +24,34 @@ export default { props: { folder: Object, - prefix: { - type: String, - default: '' + isLastItem: { + type: Boolean, + default: false }, - selectedFolder: Object, // Den aktuellen ausgewählten Ordner als Prop übergeben + depth: { + type: Number, + default: 0 + }, + parentsWithChildren: { + type: Array, + default: () => [] + }, + selectedFolder: Object, }, methods: { selectFolder() { - this.$emit('select-folder', this.folder); // Ordner auswählen und nach oben emitten + this.$emit('select-folder', this.folder); + }, + forwardSelectFolderEvent(selectedFolder) { + this.$emit('select-folder', selectedFolder); + }, + showPipe(index) { + return this.parentsWithChildren[index - 1]; + }, + getNewParentsWithChildrenList(index) { + const newParentsWithChildren = [...this.parentsWithChildren]; + newParentsWithChildren.push(index < this.folder.children.length - 1); + return newParentsWithChildren; } } }; @@ -48,5 +73,20 @@ export default { .end-marker { font-size: 1.2em; vertical-align: middle; + margin-top: -22px; + padding-left: 3px; +} + +.marker { + display: inline-block; + width: 10px; +} + +.filler { + padding-left: 3.5px; +} + +.folder-item { + margin: -2px 0; } diff --git a/frontend/src/dialogues/socialnetwork/ImageDialog.vue b/frontend/src/dialogues/socialnetwork/ImageDialog.vue new file mode 100644 index 0000000..cf5e685 --- /dev/null +++ b/frontend/src/dialogues/socialnetwork/ImageDialog.vue @@ -0,0 +1,107 @@ + + + + + diff --git a/frontend/src/i18n/locales/de/socialnetwork.json b/frontend/src/i18n/locales/de/socialnetwork.json index e5636b0..0805981 100644 --- a/frontend/src/i18n/locales/de/socialnetwork.json +++ b/frontend/src/i18n/locales/de/socialnetwork.json @@ -166,6 +166,14 @@ "folder_title": "Ordnername", "visibility": "Sichtbar für", "select_visibility": "Bitte auswählen" + }, + "noimages": "In diesem Ordner befinden sich zur Zeit keine Bilder", + "imagedialog": { + "image_title": "Titel", + "edit_visibility": "Sichtbar für", + "save_changes": "Änderungen speichern", + "close": "Schließen", + "edit_visibility_placeholder": "Bitte auswählen" } } } diff --git a/frontend/src/views/social/GalleryView.vue b/frontend/src/views/social/GalleryView.vue index 365c981..d159ddd 100644 --- a/frontend/src/views/social/GalleryView.vue +++ b/frontend/src/views/social/GalleryView.vue @@ -4,8 +4,9 @@

{{ $t('socialnetwork.gallery.folders') }}

@@ -41,8 +42,8 @@ :close-on-select="false" label="description" :placeholder="$t('socialnetwork.gallery.upload.selectvisibility')" :track-by="'value'"> +