From a5ebe54a80ac0d749301434222a63afe065d7a40 Mon Sep 17 00:00:00 2001
From: Jonas Heinrich <onny@project-insanity.org>
Date: Mon, 26 Oct 2020 16:41:58 +0100
Subject: [PATCH] beginning to implement player metadata

---
 src/components/Main.vue   |  2 +-
 src/components/Player.vue | 15 +++++++++------
 src/store.js              |  7 +++++++
 3 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/components/Main.vue b/src/components/Main.vue
index 2c0ed43..55876bd 100644
--- a/src/components/Main.vue
+++ b/src/components/Main.vue
@@ -126,6 +126,7 @@ export default {
 			if (audioPlayer !== null) {
 				audioPlayer.fade(vm.player.volume, 0, 500)
 			}
+			vm.$store.dispatch('setTitle', station.name)
 			this.$jquery.get('http://de1.api.radio-browser.info/json/url/' + station.stationuuid,
 				{
 					'User-Agent': 'Nextcloud Radio/1.0.0', // FIXME global version, doesnt seem to work
@@ -165,7 +166,6 @@ export default {
 		 * Fetching radio stations using Radio-Browser.info API
 		 */
 		loadStations() {
-			// FIXME https://de1.api.radio-browser.info/json/stations/lastchange?limit=10
 			const vm = this
 			if (vm.offset === 0) {
 				vm.pageLoading = true
diff --git a/src/components/Player.vue b/src/components/Player.vue
index 5314c8e..ec7d65b 100644
--- a/src/components/Player.vue
+++ b/src/components/Player.vue
@@ -21,7 +21,9 @@
 			step=".05"
 			:value="player.volume"
 			@input="changeVolume($event)">
-		<span class="stationMetadata" />
+		<span class="playerMetadata">
+			{{ player.title }}
+		</span>
 	</div>
 </template>
 
@@ -93,11 +95,12 @@ export default {
 		}
 	}
 
-	.station_metadata{
-		margin: 2px 20px 5px 20px;
-		padding-left: 5px;
-		white-space:nowrap;
-		overflow:hidden;
+	.playerMetadata{
+		white-space: nowrap;
+		overflow: hidden;
+		background: red;
+		position: relative;
+
 	}
 
 	.volumeIcon {
diff --git a/src/store.js b/src/store.js
index d3cdf20..31e914a 100644
--- a/src/store.js
+++ b/src/store.js
@@ -11,6 +11,7 @@ export default new Vuex.Store({
 			isPaused: false,
 			volume: 0,
 			oldVolume: 0,
+			title: 'test',
 		},
 	},
 	mutations: {
@@ -42,6 +43,9 @@ export default new Vuex.Store({
 				state.player.isPaused = false
 			}
 		},
+		setTitle(state, title) {
+			state.player.title = title
+		},
 	},
 	actions: {
 		isPlaying(context, playerState) {
@@ -59,5 +63,8 @@ export default new Vuex.Store({
 		togglePlay(context) {
 			context.commit('togglePlay')
 		},
+		setTitle(context, title) {
+			context.commit('setTitle', title)
+		},
 	},
 })