implement add custom radio station (fixes #157)

.gitlab-ci.yml

@@ -42,9 +42,10 @@ testing:
 
 packaging:
   stage: packaging
+  image: ubuntu:rolling
   script:
     - apt update
-    - DEBIAN_FRONTEND="noninteractive" apt install -y wget sudo gettext php php-simplexml
+    - DEBIAN_FRONTEND="noninteractive" apt install -y wget sudo gettext php php-simplexml nodejs npm
     - wget https://github.com/ChristophWurst/krankerl/releases/download/v0.13.0/krankerl_0.13.0_amd64.deb
     - sudo dpkg -i krankerl_0.13.0_amd64.deb
     - krankerl package

src/views/Favorites.vue

@@ -68,7 +68,7 @@
 					<h2 class="oc-dialog-title">
 						{{ t('radio', 'Add custom station') }}
 					</h2>
-					<form>
+					<form @submit="addCustomStation">
 						<label for="stationName">{{ t('radio', 'Name') }}:</label>
 						<input
 							id="stationName"
@@ -85,16 +85,16 @@
 						<input
 							id="faviconUrl"
 							v-model="station.faviconUrl"
-							type="url"
-							required>
-					</form>
+							type="url">
 						<div class="formControls">
 							<!-- FIXME: Use nextcloud-vue button component -->
-						<button class="icon-add-white primary button new-button"
-							@click="addCustomStation()">
+							<button
+								type="submit"
+								class="icon-add-white primary button new-button">
 								{{ t('radio', 'Add station') }}
 							</button>
 						</div>
+					</form>
 				</div>
 			</Modal>
 		</AppContent>
@@ -144,7 +144,9 @@ export default {
 		sidebarStation: {},
 		tableData: [],
 		modal: true,
-		station: {},
+		station: {
+			faviconUrl: '',
+		},
 	}),
 	computed: {
 		...mapGetters([
@@ -241,9 +243,22 @@ export default {
 			this.modal = false
 		},
 
-		addCustomStation() {
-			console.log('Add custom station', this.station.name)
-			// this.addFavorite(station)
+		addCustomStation(e) {
+			e.preventDefault()
+			const station = {
+				name: this.station.name,
+				urlresolved: this.station.streamUrl,
+				favicon: this.station.faviconUrl,
+				stationuuid: '932eb148-e6f6-11e9-a96c-52543be04c81',
+				bitrate: '',
+				country: '',
+				language: '',
+				homepage: '',
+				codec: '',
+				tags: '',
+			}
+			this.addFavorite(station)
+			this.modal = false
 		},
 
 	},
@@ -289,13 +304,13 @@ export default {
 		grid-template-columns: 100px 1fr;
 		align-items: center;
 		// FIXME: No flex gap support in Chrome
-		margin-bottom: 15px;
-	}
 
 		.formControls {
 			display: flex;
 			justify-content: flex-end;
 			margin-right: 40px;
+			margin-top: 10px;
+			grid-column: 1 / 3;
 
 			.button {
 				padding-left: 35px;
@@ -303,6 +318,7 @@ export default {
 				background-position: 10px center;
 			}
 		}
+	}
 }
 
 @media only screen and (max-width: 1024px) {