refactor: changed how autorequest works by adding extra station options

backend/logic/db/schemas/station.js

@@ -43,7 +43,9 @@ export default {
 	requests: {
 		enabled: { type: Boolean, default: true },
 		access: { type: String, enum: ["owner", "user"], default: "owner" },
-		limit: { type: Number, min: 1, max: 50, default: 5 }
+		limit: { type: Number, min: 1, max: 50, default: 5 },
+		allowAutorequest: { type: Boolean, default: true, required: true },
+		autorequestLimit: { type: Number, min: 1, max: 50, default: 3, required: true },
 	},
 	autofill: {
 		enabled: { type: Boolean, default: true },

frontend/src/components/Request.vue

@@ -149,7 +149,9 @@ onMounted(async () => {
 					Songs
 				</button>
 				<button
-					v-if="!disableAutoRequest"
+					v-if="
+						station.requests.allowAutorequest && !disableAutoRequest
+					"
 					class="button is-default"
 					:ref="el => (tabs['autorequest-tab'] = el)"
 					:class="{ selected: tab === 'autorequest' }"
@@ -158,7 +160,7 @@ onMounted(async () => {
 					Autorequest
 				</button>
 				<button
-					v-else
+					v-else-if="station.requests.allowAutorequest"
 					class="button is-default disabled"
 					content="Only available on station pages"
 					v-tippy

frontend/src/components/modals/ManageStation/Settings.vue

@@ -64,6 +64,8 @@ const { inputs, save, setOriginalValue } = useForm(
 		requestsEnabled: station.value.requests.enabled,
 		requestsAccess: station.value.requests.access,
 		requestsLimit: station.value.requests.limit,
+		requestsAllowAutorequest: station.value.requests.allowAutorequest,
+		requestsAutorequestLimit: station.value.requests.autorequestLimit,
 		autofillEnabled: station.value.autofill.enabled,
 		autofillLimit: station.value.autofill.limit,
 		autofillMode: station.value.autofill.mode
@@ -83,7 +85,9 @@ const { inputs, save, setOriginalValue } = useForm(
 					...oldStation.requests,
 					enabled: values.requestsEnabled,
 					access: values.requestsAccess,
-					limit: values.requestsLimit
+					limit: values.requestsLimit,
+					allowAutorequest: values.requestsAllowAutorequest,
+					autorequestLimit: values.requestsAutorequestLimit
 				},
 				autofill: {
 					...oldStation.autofill,
@@ -127,6 +131,8 @@ watch(station, value => {
 		requestsEnabled: value.requests.enabled,
 		requestsAccess: value.requests.access,
 		requestsLimit: value.requests.limit,
+		requestsAllowAutorequest: value.requests.allowAutorequest,
+		requestsAutorequestLimit: value.requests.autorequestLimit,
 		autofillEnabled: value.autofill.enabled,
 		autofillLimit: value.autofill.limit,
 		autofillMode: value.autofill.mode
@@ -263,6 +269,40 @@ watch(station, value => {
 						/>
 					</div>
 				</div>
+
+				<div
+					v-if="inputs['requestsEnabled'].value"
+					class="small-section"
+				>
+					<label class="label">Allow autorequest</label>
+					<p class="is-expanded checkbox-control">
+						<label class="switch">
+							<input
+								type="checkbox"
+								v-model="
+									inputs['requestsAllowAutorequest'].value
+								"
+							/>
+							<span class="slider round"></span>
+						</label>
+					</p>
+				</div>
+
+				<div
+					v-if="inputs['requestsEnabled'].value"
+					class="small-section"
+				>
+					<label class="label">Per user autorequest limit</label>
+					<div class="control is-expanded">
+						<input
+							class="input"
+							type="number"
+							min="1"
+							max="50"
+							v-model="inputs['requestsAutorequestLimit'].value"
+						/>
+					</div>
+				</div>
 			</div>
 
 			<div
@@ -490,7 +530,7 @@ watch(station, value => {
 			flex-grow: 1;
 		}
 
-		.checkbox-control {
+		> .checkbox-control {
 			justify-content: end;
 		}
 
@@ -503,6 +543,10 @@ watch(station, value => {
 				margin-left: auto;
 				margin-right: 0;
 			}
+
+			.checkbox-control {
+				justify-content: center;
+			}
 		}
 	}
 }

frontend/src/pages/Station/index.vue

@@ -195,44 +195,47 @@ const updateMediaSessionData = song => {
 	} else ms.removeMediaSessionData(0);
 };
 const autoRequestSong = () => {
-	if (
-		!autoRequestLock.value &&
-		songsList.value.length < 50 &&
-		currentUserQueueSongs.value < station.value.requests.limit * 0.5 &&
-		autoRequest.value.length > 0
-	) {
-		const selectedPlaylist =
-			autoRequest.value[
-				Math.floor(Math.random() * autoRequest.value.length)
-			];
-		if (selectedPlaylist._id && selectedPlaylist.songs.length > 0) {
-			const selectedSong =
-				selectedPlaylist.songs[
-					Math.floor(Math.random() * selectedPlaylist.songs.length)
-				];
-			if (selectedSong.youtubeId) {
-				updateAutoRequestLock(true);
-				socket.dispatch(
-					"stations.addToQueue",
-					station.value._id,
-					selectedSong.youtubeId,
-					data => {
-						updateAutoRequestLock(false);
-						if (data.status !== "success") {
-							setTimeout(
-								() => {
-									autoRequestSong();
-								},
-								data.message ===
-									"That song is already in the queue."
-									? 5000
-									: 1000
-							);
-						}
-					}
-				);
+	const { limit, allowAutorequest, autorequestLimit } =
+		station.value.requests;
+
+	if (autoRequestLock.value) return;
+	if (!allowAutorequest) return;
+	if (songsList.value.length >= 50) return;
+	if (currentUserQueueSongs.value >= limit) return;
+	if (currentUserQueueSongs.value >= autorequestLimit) return;
+	if (autoRequest.value.length === 0) return;
+
+	const uniqueYoutubeIds = new Set();
+
+	autoRequest.value.forEach(playlist => {
+		playlist.songs.forEach(song => {
+			uniqueYoutubeIds.add(song.youtubeId);
+		});
+	});
+
+	if (uniqueYoutubeIds.size > 0) {
+		const youtubeId = Array.from(uniqueYoutubeIds.values())[
+			Math.floor(Math.random() * uniqueYoutubeIds.size)
+		];
+		updateAutoRequestLock(true);
+		socket.dispatch(
+			"stations.addToQueue",
+			station.value._id,
+			youtubeId,
+			data => {
+				updateAutoRequestLock(false);
+				if (data.status !== "success") {
+					setTimeout(
+						() => {
+							autoRequestSong();
+						},
+						data.message === "That song is already in the queue."
+							? 5000
+							: 1000
+					);
+				}
 			}
-		}
+		);
 	}
 };
 const dateCurrently = () => new Date().getTime() + systemDifference.value;