fix table episode play/resume icon and text

CHANGELOG.md

 ## 0.2 - 2021-02
 
+### Added
+- Pause playing animation
+  [#115](https://git.project-insanity.org/onny/nextcloud-app-podcast/-/issues/115) @onny
+
 ### Changed
 - Use mappers for store
   [#112](https://git.project-insanity.org/onny/nextcloud-app-podcast/-/issues/112) @onny

src/components/Table.vue

@@ -61,7 +61,7 @@
 				<td class="actionColumn">
 					<Actions>
 						<ActionButton
-							:icon="episodeLoaded(episode.id) ? 'icon-pause' : 'icon-play'"
+							:icon="playButtonIcon(episode.id)"
 							:close-after-click="true"
 							@click="doPlay(episode)">
 							{{ playButtonText(episode.id) }}
@@ -137,13 +137,26 @@ export default {
 	methods: {
 		playButtonText(episodeId) {
 			if (this.episodeLoaded(episodeId)) {
-				return t('podcast', 'Pause')
-			} else if (this.isPaused(episodeId)) {
-				return t('podcast', 'Resume')
+				if (this.isPaused(episodeId)) {
+					return t('podcast', 'Resume')
+				} else {
+					return t('podcast', 'Pause')
+				}
 			} else {
 				return t('podcast', 'Play')
 			}
 		},
+		playButtonIcon(episodeId) {
+			if (this.episodeLoaded(episodeId)) {
+				if (this.isPaused(episodeId)) {
+					return 'icon-play'
+				} else {
+					return 'icon-pause'
+				}
+			} else {
+				return 'icon-play'
+			}
+		},
 		escapedEpisodeDescription(episodeDescription) {
 			episodeDescription = episodeDescription.replace(/\n/g, '')
 			return episodeDescription