diff --git a/src/components/browse/Home.vue b/src/components/browse/Home.vue index 7599029ea218deb608d384c21326e2a61e817cc9..ef736a04ac1ce37766c2f2e883d63db33f523a12 100644 --- a/src/components/browse/Home.vue +++ b/src/components/browse/Home.vue @@ -12,6 +12,12 @@ <artist-card :artist="artist"></artist-card> </div> </div> + <div class="column"> + <h2 class="ui header">Radios</h2> + <radio-card :type="'favorites'"></radio-card> + <radio-card :type="'random'"></radio-card> + <radio-card :type="'less-listened'"></radio-card> + </div> </div> </div> </template> @@ -22,6 +28,7 @@ import backend from '@/audio/backend' import logger from '@/logging' import ArtistCard from '@/components/audio/artist/Card' import config from '@/config' +import RadioCard from '@/components/radios/Card' const ARTISTS_URL = config.API_URL + 'artists/' @@ -29,7 +36,8 @@ export default { name: 'browse', components: { Search, - ArtistCard + ArtistCard, + RadioCard }, data () { return { diff --git a/src/components/radios/Card.vue b/src/components/radios/Card.vue new file mode 100644 index 0000000000000000000000000000000000000000..1e496324aa893518ca2728fcf6f9f19c168bc9c1 --- /dev/null +++ b/src/components/radios/Card.vue @@ -0,0 +1,37 @@ +<template> + <div class="ui card"> + <div class="content"> + <div class="header">Radio : {{ radio.name }}</div> + <div class="description"> + {{ radio.description }} + </div> + </div> + <div class="extra content"> + <radio-button class="right floated button" :type="type"></radio-button> + </div> + </div> +</template> + +<script> +import radios from '@/radios' +import RadioButton from './Button' + +export default { + props: { + type: {type: String, required: true} + }, + components: { + RadioButton + }, + computed: { + radio () { + return radios.types[this.type] + } + } +} +</script> + +<!-- Add "scoped" attribute to limit CSS to this component only --> +<style scoped lang="scss"> + +</style> diff --git a/src/radios/index.js b/src/radios/index.js index a35741c9e46ec5bf3f27584c6f992e6f91e56a6c..b468830863f1a443a987149128495413b7b5f000 100644 --- a/src/radios/index.js +++ b/src/radios/index.js @@ -7,6 +7,20 @@ const CREATE_RADIO_URL = config.API_URL + 'radios/sessions/' const GET_TRACK_URL = config.API_URL + 'radios/tracks/' var radios = { + types: { + random: { + name: 'Random', + description: "Totally random picks, maybe you'll discover new things?" + }, + favorites: { + name: 'Favorites', + description: 'Play your favorites tunes in a never-ending happiness loop.' + }, + 'less-listened': { + name: 'Less listened', + description: "Listen to tracks you usually don't. It's time to restore some balance." + } + }, start (type, objectId) { this.current.type = type this.current.objectId = objectId