Show specific report modal if route has query of id

backend/logic/actions/reports.js

@@ -82,6 +82,29 @@ module.exports = {
 		});
 	}),
 
+	/**
+	 * Gets a specific report
+	 *
+	 * @param {Object} session - the session object automatically added by socket.io
+	 * @param {String} reportId - the id of the report to return
+	 * @param {Function} cb - gets called with the result
+	 */
+	findOne: hooks.adminRequired((session, reportId, cb) => {
+		async.waterfall([
+			(next) => {
+				db.models.report.findOne({ _id: reportId }).exec(next);
+			}
+		], (err, report) => {
+			if (err) {
+				err = utils.getError(err);
+				logger.error("REPORTS_FIND_ONE", `Finding report "${reportId}" failed. "${err}"`);
+				return cb({ 'status': 'failure', 'message': err });
+			}
+			logger.success("REPORTS_FIND_ONE", `Finding report "${reportId}" successful.`);
+			cb({ status: 'success', data: report });
+		});
+	}),
+
 	/**
 	 * Gets all reports for a songId
 	 *

frontend/components/Admin/Reports.vue

@@ -25,7 +25,7 @@
 						<span>{{ report.description }}</span>
 					</td>
 					<td>
-						<a class='button is-warning' href='#' @click='toggleModal(report)' v-if='report.issues.length > 0'>Issues</a>
+						<a class='button is-warning' href='#' @click='toggleModal(report)'>Issues Modal</a>
 						<a class='button is-primary' href='#' @click='resolve(report._id)'>Resolve</a>
 					</td>
 				</tr>
@@ -33,7 +33,7 @@
 		</table>
 	</div>
 
-	<issues-modal v-if='modals.reportIssues'></issues-modal>
+	<issues-modal v-if='modals.report'></issues-modal>
 </template>
 
 <script>
@@ -47,7 +47,7 @@
 			return {
 				reports: [],
 				modals: {
-					reportIssues: false
+					report: false
 				}
 			}
 		},
@@ -56,20 +56,20 @@
 				this.socket.emit('apis.joinAdminRoom', 'reports', data => {});
 			},
 			toggleModal: function (report) {
-				this.modals.reportIssues = !this.modals.reportIssues;
-				if (this.modals.reportIssues) this.editing = report;
+				this.modals.report = !this.modals.report;
+				if (this.modals.report) this.editing = report;
 			},
 			resolve: function (reportId) {
 				let _this = this;
 				this.socket.emit('reports.resolve', reportId, res => {
 					Toast.methods.addToast(res.message, 3000);
-					if (res.status == 'success' && this.modals.reportIssues) _this.toggleModal();
+					if (res.status === 'success' && this.modals.report) _this.toggleModal();
 				});
 			}
 		},
 		ready: function () {
 			let _this = this;
-			io.getSocket((socket) => {
+			io.getSocket(socket => {
 				_this.socket = socket;
 				if (_this.socket.connected) _this.init();
 				_this.socket.emit('reports.index', res => {
@@ -87,6 +87,12 @@
 					_this.init();
 				});
 			});
+			if (this.$route.query.id) {
+				this.socket.emit('reports.findOne', this.$route.query.id, res => {
+					if (res.status === 'success') _this.toggleModal(res.data);
+					else Toast.methods.addToast('Report with that ID not found', 3000);
+				});
+			}
 		},
 		components: { IssuesModal }
 	}

frontend/components/Modals/Report.vue

@@ -104,7 +104,7 @@
 				isCurrentSongActive: true,
 				report: {
 					resolved: false,
-					songId: this.$parent.currentSong._id,
+					songId: this.$parent.currentSong.songId,
 					description: '',
 					issues: [
 						{ name: 'Video', reasons: [] },
@@ -160,6 +160,7 @@
 		methods: {
 			create: function () {
 				let _this = this;
+				console.log(this.report);
 				_this.socket.emit('reports.create', _this.report, res => {
 					Toast.methods.addToast(res.message, 4000);
 					if (res.status == 'success') _this.$parent.modals.report = !_this.$parent.modals.report;
@@ -170,11 +171,11 @@
 			},
 			highlight: function (type) {
 				if (type == 'currentSong') {
-					this.report.songId = this.$parent.currentSong._id;
+					this.report.songId = this.$parent.currentSong.songId
 					this.isPreviousSongActive = false;
 					this.isCurrentSongActive = true;
 				} else if (type == 'previousSong') {
-					this.report.songId = this.$parent.previousSong._id;
+					this.report.songId = this.$parent.previousSong.songId
 					this.isCurrentSongActive = false;
 					this.isPreviousSongActive = true;
 				}
@@ -237,4 +238,4 @@
 	.is-highlight-active {
 		border: 3px #03a9f4 solid;
 	}
-</style>
+</style>

frontend/components/Station/Station.vue

@@ -11,7 +11,7 @@
 	<songs-list-sidebar v-if='sidebars.songslist'></songs-list-sidebar>
 	<playlist-sidebar v-if='sidebars.playlist'></playlist-sidebar>
 	<users-sidebar v-if='sidebars.users'></users-sidebar>
-	
+
 	<div class="station">
 		<div v-show="noSong" class="no-song">
 			<h1>No song is currently playing</h1>
@@ -317,18 +317,18 @@
 			},
 			toggleLike: function() {
 				let _this = this;
-				if (_this.liked) _this.socket.emit('songs.unlike', _this.currentSong._id, data => {
+				if (_this.liked) _this.socket.emit('songs.unlike', _this.currentSong.songId, data => {
 					if (data.status !== 'success') Toast.methods.addToast(`Error: ${data.message}`, 8000);
-				}); else _this.socket.emit('songs.like', _this.currentSong._id, data => {
+				}); else _this.socket.emit('songs.like', _this.currentSong.songId, data => {
 					if (data.status !== 'success') Toast.methods.addToast(`Error: ${data.message}`, 8000);
 				});
 			},
 			toggleDislike: function() {
 				let _this = this;
-				if (_this.disliked) return _this.socket.emit('songs.undislike', _this.currentSong._id, data => {
+				if (_this.disliked) return _this.socket.emit('songs.undislike', _this.currentSong.songId, data => {
 					if (data.status !== 'success') Toast.methods.addToast(`Error: ${data.message}`, 8000);
 				});
-				_this.socket.emit('songs.dislike', _this.currentSong._id, data => {
+				_this.socket.emit('songs.dislike', _this.currentSong.songId, data => {
 					if (data.status !== 'success') Toast.methods.addToast(`Error: ${data.message}`, 8000);
 				});
 			},
@@ -373,6 +373,7 @@
 							owner: res.data.owner,
 							privatePlaylist: res.data.privatePlaylist
 						};
+						console.log(res.data.currentSong);
 						_this.currentSong = (res.data.currentSong) ? res.data.currentSong : {};
 						_this.type = res.data.type;
 						_this.startedAt = res.data.startedAt;
@@ -387,7 +388,7 @@
 							_this.youtubeReady();
 							_this.playVideo();
 							_this.socket.emit('songs.getOwnSongRatings', res.data.currentSong._id, data => {
-								if (_this.currentSong._id === data.songId) {
+								if (_this.currentSong.songId === data.songId) {
 									_this.liked = data.liked;
 									_this.disliked = data.disliked;
 								}
@@ -454,7 +455,7 @@
 					}
 				});
 				_this.socket.on('event:songs.next', data => {
-					_this.previousSong = (_this.currentSong._id) ? _this.currentSong : null;
+					_this.previousSong = (_this.currentSong.songId) ? _this.currentSong : null;
 					_this.currentSong = (data.currentSong) ? data.currentSong : {};
 					_this.startedAt = data.startedAt;
 					_this.paused = data.paused;
@@ -466,7 +467,7 @@
 						if (!_this.playerReady) _this.youtubeReady();
 						else _this.playVideo();
 						_this.socket.emit('songs.getOwnSongRatings', data.currentSong._id, (data) => {
-							if (_this.currentSong._id === data.songId) {
+							if (_this.currentSong.songId === data.songId) {
 								_this.liked = data.liked;
 								_this.disliked = data.disliked;
 							}
@@ -481,7 +482,7 @@
 					_this.songsList.forEach((queueSong) => {
 						if (queueSong.requestedBy === userId) isInQueue = true;
 					});
-					if (!isInQueue && _this.privatePlaylistQueueSelected && (_this.automaticallyRequestedSongId !== _this.currentSong.songId || !_this.currentSong._id)) {
+					if (!isInQueue && _this.privatePlaylistQueueSelected && (_this.automaticallyRequestedSongId !== _this.currentSong.songId || !_this.currentSong.songId)) {
 						_this.addFirstPrivatePlaylistSongToQueue();
 					}
 				});
@@ -497,7 +498,7 @@
 
 				_this.socket.on('event:song.like', data => {
 					if (!this.noSong) {
-						if (data.songId === _this.currentSong._id) {
+						if (data.songId === _this.currentSong.songId) {
 							_this.currentSong.dislikes = data.dislikes;
 							_this.currentSong.likes = data.likes;
 						}
@@ -506,7 +507,7 @@
 
 				_this.socket.on('event:song.dislike', data => {
 					if (!this.noSong) {
-						if (data.songId === _this.currentSong._id) {
+						if (data.songId === _this.currentSong.songId) {
 							_this.currentSong.dislikes = data.dislikes;
 							_this.currentSong.likes = data.likes;
 						}
@@ -515,7 +516,7 @@
 
 				_this.socket.on('event:song.unlike', data => {
 					if (!this.noSong) {
-						if (data.songId === _this.currentSong._id) {
+						if (data.songId === _this.currentSong.songId) {
 							_this.currentSong.dislikes = data.dislikes;
 							_this.currentSong.likes = data.likes;
 						}
@@ -524,7 +525,7 @@
 
 				_this.socket.on('event:song.undislike', data => {
 					if (!this.noSong) {
-						if (data.songId === _this.currentSong._id) {
+						if (data.songId === _this.currentSong.songId) {
 							_this.currentSong.dislikes = data.dislikes;
 							_this.currentSong.likes = data.likes;
 						}
@@ -533,7 +534,7 @@
 
 				_this.socket.on('event:song.newRatings', data => {
 					if (!this.noSong) {
-						if (data.songId === _this.currentSong._id) {
+						if (data.songId === _this.currentSong.songId) {
 							_this.liked = data.liked;
 							_this.disliked = data.disliked;
 						}

frontend/components/User/ResetPassword.vue

@@ -4,7 +4,6 @@
 		<!--Implement Validation-->
 		<h1>Step {{step}}</h1>
 
-
 		<label class="label" v-if="step === 1">Email</label>
 		<div class="control is-grouped" v-if="step === 1">
 			<p class="control is-expanded has-icon has-icon-right">

frontend/components/pages/Admin.vue

@@ -74,7 +74,7 @@
 			Users
 		},
 		ready() {
-			switch(this.$route.path) {
+			switch(window.location.pathname) {
 				case '/admin/queuesongs':
 					this.currentTab = 'queueSongs';
 					break;