implementing favorite stations db backend

lib/Service/StationService.php

@@ -47,10 +47,10 @@ class StationService {
 
 	public function create($stationuuid, $name, $favicon, $url_resolved, $userId) {
 		$station = new Station();
-		$station->setStationUuid($stationuuid);
+		$station->setStationuuid($stationuuid);
 		$station->setName($name);
 		$station->setFavicon($favicon);
-		$station->setUrlResolved($url_resolved);
+		$station->setUrl_resolved($url_resolved);
 		$station->setUserId($userId);
 		return $this->mapper->insert($station);
 	}
@@ -58,10 +58,10 @@ class StationService {
 	public function update($id, $stationuuid, $name, $userId) {
 		try {
 			$station = $this->mapper->find($id, $userId);
-			$station->setStationUuid($stationuuid);
+			$station->setStationuuid($stationuuid);
 			$station->setName($name);
 			$station->setFavicon($favicon);
-			$station->setUrlResolved($url_resolved);
+			$station->setUrl_resolved($url_resolved);
 			return $this->mapper->update($station);
 		} catch (Exception $e) {
 			$this->handleException($e);

package-lock.json

@@ -6603,9 +6603,9 @@
 			"dev": true
 		},
 		"howler": {
-			"version": "2.2.0",
-			"resolved": "https://registry.npmjs.org/howler/-/howler-2.2.0.tgz",
-			"integrity": "sha512-sGPkrAQy7jh5mNDbkRNG0F82R2HFDYNsQXBcX4smXQT0y0F4UMsa/+jXaGwWvcrajWr2tDB7JUkH7G5qSnuIyQ=="
+			"version": "2.2.1",
+			"resolved": "https://registry.npmjs.org/howler/-/howler-2.2.1.tgz",
+			"integrity": "sha512-0iIXvuBO/81CcrQ/HSSweYmbT50fT2mIc9XMFb+kxIfk2pW/iKzDbX1n3fZmDXMEIpYvyyfrB+gXwPYSDqUxIQ=="
 		},
 		"html-tags": {
 			"version": "3.1.0",

package.json

@@ -35,7 +35,7 @@
 		"@nextcloud/l10n": "^1.4.1",
 		"@nextcloud/router": "^1.2.0",
 		"@nextcloud/vue": "^2.7.0",
-		"howler": "^2.2.0",
+		"howler": "^2.2.1",
 		"jquery": "^3.5.1",
 		"music-metadata": "^7.4.1",
 		"vue": "^2.6.12",

src/components/Main.vue

@@ -81,36 +81,26 @@ export default {
 		this.scroll()
 	},
 	methods: {
+
 		async onRoute() {
 			this.offset = 0
 			this.tableData = []
 			const route = this.$route
 			this.loadStations(route.name)
 		},
+
 		/**
 			 * Favor a new station by sending the information to the server
 			 * @param {Object} station Station object
 			 */
 		async doFavor(station) {
 			try {
-				const newStation = {
-					id: -1,
-					stationuuid: station.stationuuid,
-					name: station.name,
-					favicon: station.favicon,
-					url_resolved: station.url_resolved,
-				}
-				const response = await axios.post(generateUrl('/apps/radio/stations'), newStation)
-				console.log(response)
-				// const index = this.stations.findIndex((match) => match.id === this.currentStationId)
-				// this.$set(this.stations, index, response.data)
-				// this.currentStationId = response.data.id
+				await axios.post(generateUrl('/apps/radio/stations'), station)
 			} catch (e) {
-				console.error(e)
 				showError(t('radio', 'Could not favor station'))
 			}
-			this.updating = false
 		},
+
 		/**
 			 * Start playing a radio station and counting the playback
 			 * @param {Object} station Station object
@@ -121,10 +111,7 @@ export default {
 				audioPlayer.fade(vm.player.volume, 0, 500)
 			}
 			vm.$store.dispatch('setTitle', station.name)
-			this.$jquery.get(this.$apiUrl + '/json/url/' + station.stationuuid,
-				{
-					'User-Agent': 'Nextcloud Radio/1.0.0', // FIXME global version, doesnt seem to work
-				})
+
 			audioPlayer = new Howl({
 				src: [station.url_resolved],
 				volume: vm.player.volume,
@@ -153,14 +140,15 @@ export default {
 			audioPlayer.play()
 			audioPlayer.fade(0, vm.player.volume, 500)
 
-			/* const stationMetadata = document.getElementById('stationMetadata')
-			stationMetadata.textContent = station.name */
+			/* Count click */
+			axios.get(this.$apiUrl + '/json/url/' + station.stationuuid)
 		},
+
 		/**
 		 * Fetching radio stations using Radio-Browser.info API
 			 * @param {String} menuState Entries to load
 		 */
-		loadStations(menuState = 'TOP') {
+		async loadStations(menuState = 'TOP') {
 
 			const vm = this
 			const queryBase = this.$apiUrl + '/json/stations'
@@ -182,24 +170,24 @@ export default {
 				queryURI = queryBase + '/byname/' + searchQuery
 			}
 
-			this.$jquery.getJSON(queryURI,
-				{
+			await axios.get(queryURI, {
+				params: {
 					limit: 20,
 					order: sortBy,
 					reverse: true,
 					offset: vm.offset,
-					'User-Agent': 'Nextcloud Radio/1.0.0', // FIXME global version, doesnt seem to work
-				})
-				.done(function(data) {
-					for (let i = 0; i < data.length; i++) {
-						const obj = data[i]
+				},
+			})
+				.then(function(response) {
+					for (let i = 0; i < response.data.length; i++) {
+						const obj = response.data[i]
 						let blurHash = vm.blurHashes[obj.stationuuid]
 						if (!blurHash) {
 							blurHash = 'L1TSUA?bj[?b~qfQfQj[ayfQfQfQ'
 						}
-						data[i].blurHash = blurHash
+						response.data[i].blurHash = blurHash
 					}
-					vm.tableData = vm.tableData.concat(data)
+					vm.tableData = vm.tableData.concat(response.data)
 					vm.offset += 20
 					vm.pageLoading = false
 				})

src/main.js

@@ -27,14 +27,12 @@ import { translate, translatePlural } from '@nextcloud/l10n'
 
 import App from './App'
 
-import jquery from 'jquery'
 import VueBlurHash from 'vue-blurhash'
 
 import 'vue-blurhash/dist/vue-blurhash.css'
 
 Vue.prototype.t = translate
 Vue.prototype.n = translatePlural
-Vue.prototype.$jquery = jquery
 
 Vue.prototype.$apiUrl = 'https://de1.api.radio-browser.info'