Added station blacklistedGenres, fixed some bugs.

backend/logic/actions/stations.js

@@ -413,7 +413,7 @@ module.exports = {
 
 			(station, next) => {
 				if (station) return next({ 'status': 'failure', 'message': 'A station with that name or display name already exists' });
-				const { _id, displayName, description, genres, playlist, type } = data;
+				const { _id, displayName, description, genres, playlist, type, blacklistedGenres } = data;
 				cache.hget('sessions', session.sessionId, (err, session) => {
 					if (type == 'official') {
 						db.models.user.findOne({_id: session.userId}, (err, user) => {
@@ -428,6 +428,7 @@ module.exports = {
 								privacy: 'private',
 								playlist,
 								genres,
+								blacklistedGenres,
 								currentSong: stations.defaultSong
 							}, next);
 						});

backend/logic/db/schemas/station.js

@@ -21,6 +21,7 @@ module.exports = {
 	startedAt: { type: Number, default: 0, required: true },
 	playlist: { type: Array },
 	genres: [{ type: String }],
+	blacklistedGenres: [{ type: String }],
 	privacy: { type: String, enum: ["public", "unlisted", "private"], default: "private" },
 	locked: { type: Boolean, default: false },
 	queue: [{

backend/logic/stations.js

@@ -97,7 +97,16 @@ module.exports = {
 					db.models.song.find({genres: genre}, (err, songs) => {
 						if (!err) {
 							songs.forEach((song) => {
-								if (songList.indexOf(song._id) === -1) songList.push(song._id);
+								if (songList.indexOf(song._id) === -1) {
+									let found = false;
+									song.genres.forEach((songGenre) => {
+										if (station.blacklistedGenres.indexOf(songGenre) !== -1) found = true;
+										console.log(songGenre, station.blacklistedGenres, station.blacklistedGenres.indexOf(songGenre), found);
+									});
+									if (!found) {
+										songList.push(song._id);
+									}
+								}
 							});
 						}
 						genresDone.push(genre);

frontend/App.vue

@@ -116,6 +116,7 @@
 			},
 			'handleSocketConnection': function () {
 				this.socketConnected = window.socketConnected;
+				console.log(123332222111);
 				this.$broadcast('handleSocketConnection');
 			},
 			'closeModal': function () {

frontend/components/Admin/QueueSongs.vue

@@ -92,19 +92,17 @@
 			},
 			addTag: function (type) {
 				if (type == 'genres') {
-					for (let z = 0; z < this.editing.song.genres.length; z++) {
-						if (this.editing.song.genres[z] == $('#new-genre').val()) return Toast.methods.addToast('Genre already exists', 3000);
-					}
-					if ($('#new-genre').val() !== '') {
-						this.editing.song.genres.push($('#new-genre').val());
+					let genre = $('#new-genre').val().toLowerCase().trim();
+					if (this.editing.song.genres.indexOf(genre) !== -1) return Toast.methods.addToast('Genre already exists', 3000);
+					if (genre) {
+						this.editing.song.genres.push(genre);
 						$('#new-genre').val('');
 					} else Toast.methods.addToast('Genre cannot be empty', 3000);
 				} else if (type == 'artists') {
-					for (let z = 0; z < this.editing.song.artists.length; z++) {
-						if (this.editing.song.artists[z] == $('#new-artist').val()) return Toast.methods.addToast('Artist already exists', 3000);
-					}
+					let artist = $('#new-artist').val();
+					if (this.editing.song.artists.indexOf(artist) !== -1) return Toast.methods.addToast('Artist already exists', 3000);
 					if ($('#new-artist').val() !== '') {
-						this.editing.song.artists.push($('#new-artist').val());
+						this.editing.song.artists.push(artist);
 						$('#new-artist').val('');
 					} else Toast.methods.addToast('Artist cannot be empty', 3000);
 				}

frontend/components/Admin/Songs.vue

@@ -91,19 +91,17 @@
 			},
 			addTag: function (type) {
 				if (type == 'genres') {
-					for (let z = 0; z < this.editing.song.genres.length; z++) {
-						if (this.editing.song.genres[z] == $('#new-genre').val()) return Toast.methods.addToast('Genre already exists', 3000);
-					}
-					if ($('#new-genre').val() !== '') {
-						this.editing.song.genres.push($('#new-genre').val());
+					let genre = $('#new-genre').val().toLowerCase().trim();
+					if (this.editing.song.genres.indexOf(genre) !== -1) return Toast.methods.addToast('Genre already exists', 3000);
+					if (genre) {
+						this.editing.song.genres.push(genre);
 						$('#new-genre').val('');
 					} else Toast.methods.addToast('Genre cannot be empty', 3000);
 				} else if (type == 'artists') {
-					for (let z = 0; z < this.editing.song.artists.length; z++) {
-						if (this.editing.song.artists[z] == $('#new-artist').val()) return Toast.methods.addToast('Artist already exists', 3000);
-					}
+					let artist = $('#new-artist').val();
+					if (this.editing.song.artists.indexOf(artist) !== -1) return Toast.methods.addToast('Artist already exists', 3000);
 					if ($('#new-artist').val() !== '') {
-						this.editing.song.artists.push($('#new-artist').val());
+						this.editing.song.artists.push(artist);
 						$('#new-artist').val('');
 					} else Toast.methods.addToast('Artist cannot be empty', 3000);
 				}

frontend/components/Admin/Stations.vue

@@ -64,6 +64,15 @@
 							{{ genre }}
 							<button class='delete is-info' @click='removeGenre(index)'></button>
 						</span>
+						<label class='label'>Blacklisted Genres</label>
+						<p class='control has-addons'>
+							<input class='input' id='new-blacklisted-genre' type='text' placeholder='Blacklisted Genre'>
+							<a class='button is-info' @click='addBlacklistedGenre()'>Add blacklisted genre</a>
+						</p>
+						<span class='tag is-info' v-for='(index, genre) in newStation.blacklistedGenres' track-by='$index'>
+							{{ genre }}
+							<button class='delete is-info' @click='removeBlacklistedGenre(index)'></button>
+						</span>
 					</div>
 				</div>
 				<footer class='card-footer'>
@@ -82,14 +91,15 @@
 			return {
 				stations: [],
 				newStation: {
-					genres: []
+					genres: [],
+					blacklistedGenres: []
 				}
 			}
 		},
 		methods: {
 			createStation: function () {
 				let _this = this;
-				let { newStation: { _id, displayName, description, genres } } = this;
+				let { newStation: { _id, displayName, description, genres, blacklistedGenres } } = this;
 
 				if (_id == undefined) return Toast.methods.addToast('Field (YouTube ID) cannot be empty', 3000);
 				if (displayName == undefined) return Toast.methods.addToast('Field (Display Name) cannot be empty', 3000);
@@ -101,6 +111,7 @@
 					displayName,
 					description,
 					genres,
+					blacklistedGenres,
 				}, result => {
 					console.log(result);
 				});
@@ -111,13 +122,21 @@
 				});
 			},
 			addGenre: function () {
-				for (let z = 0; z < this.newStation.genres.length; z++) {
-					if (this.newStation.genres[z] == $('#new-genre').val()) return Toast.methods.addToast('Genre already exists', 3000);
-				}
-				if ($('#new-genre').val() !== '') this.newStation.genres.push($('#new-genre').val());
+				let genre = $('#new-genre').val().toLowerCase().trim();
+				if (this.newStation.genres.indexOf(genre) !== -1) return Toast.methods.addToast('Genre already exists', 3000);
+
+				if (genre) this.newStation.genres.push(genre);
+				else Toast.methods.addToast('Genre cannot be empty', 3000);
+			},
+			removeGenre: function (index) { this.newStation.genres.splice(index, 1); },
+			addBlacklistedGenre: function () {
+				let genre = $('#new-blacklisted-genre').val().toLowerCase().trim();
+				if (this.newStation.blacklistedGenres.indexOf(genre) !== -1) return Toast.methods.addToast('Genre already exists', 3000);
+
+				if (genre) this.newStation.blacklistedGenres.push(genre);
 				else Toast.methods.addToast('Genre cannot be empty', 3000);
 			},
-			removeGenre: function (index) { this.newStation.genres.splice(index, 1); }
+			removeBlacklistedGenre: function (index) { this.newStation.blacklistedGenres.splice(index, 1); }
 		},
 		ready: function () {
 			let _this = this;

frontend/components/Station/OfficialHeader.vue

@@ -9,6 +9,11 @@
 					<i class='material-icons'>settings</i>
 				</span>
 			</a>
+			<a class='nav-item' href='#' @click='$parent.toggleModal("addSongToQueue")' v-if='$parent.type === "official"'>
+				<span class='icon'>
+					<i class='material-icons'>queue_music</i>
+				</span>
+			</a>
 			<a v-if='isOwner()' class='nav-item' href='#' @click='$parent.skipStation()'>
 				<span class='icon'>
 					<i class='material-icons'>skip_next</i>
@@ -63,7 +68,7 @@
 					<i class='material-icons'>people</i>
 				</span>
 			</a>-->
-			<a class='nav-item' href='#' @click='$parent.sidebars.playlist = !$parent.sidebars.playlist'>
+			<a class='nav-item' href='#' @click='$parent.sidebars.playlist = !$parent.sidebars.playlist' v-if='$parent.type === "community"'>
 				<span class='icon'>
 					<i class='material-icons'>library_music</i>
 				</span>

frontend/components/Station/Station.vue

@@ -469,7 +469,7 @@
 		events: {
 			'handleSocketConnection': function () {
 				if (this.$parent.socketConnected) {
-					this.joinStation(321);
+					this.joinStation();
 				}
 			}
 		},

frontend/components/pages/Home.vue

@@ -3,7 +3,7 @@
 		<main-header></main-header>
 		<div class="group">
 			<div class="group-title">Official Stations</div>
-			<div class="card" v-for="station in stations.official" v-link="{ path: '/official/' + station._id }" @click="this.$dispatch('joinStation', station._id)" :class="station.class">
+			<div class="card station-card" v-for="station in stations.official" v-link="{ path: '/official/' + station._id }" @click="this.$dispatch('joinStation', station._id)" :class="station.class">
 				<div class="card-image">
 					<figure class="image is-square">
 						<img :src="station.currentSong.thumbnail" onerror="this.src='/assets/notes.png'" />
@@ -28,7 +28,7 @@
 		</div>
 		<div class="group">
 			<div class="group-title">Community Stations <i class="material-icons ccs-button" @click="toggleModal('createCommunityStation')" v-if="$parent.loggedIn">add_circle_outline</i></div>
-			<div class="card" v-for="station in stations.community" v-link="{ path: '/community/' + station._id }" @click="this.$dispatch('joinStation', station._id)" :class="station.class">
+			<div class="card station-card" v-for="station in stations.community" v-link="{ path: '/community/' + station._id }" @click="this.$dispatch('joinStation', station._id)" :class="station.class">
 				<div class="card-image">
 					<figure class="image is-square">
 						<img :src="station.currentSong.thumbnail" onerror="this.src='/assets/notes.png'" />
@@ -173,7 +173,7 @@
 		min-height: 64px;
 	}
 
-	.card {
+	.station-card {
 		margin: 10px;
 		cursor: pointer;
 	}

frontend/main.js

@@ -24,6 +24,7 @@ lofig.get('serverDomain', res => {
 	socket.on("ready", (status, role, username, userId) => {
 		auth.data(status, role, username, userId);
 	});
+	window.socketConnected = true;
 	setInterval(() => {
 		if (!socket.connected) {
 			window.socketConnected = false;