[web-src] composer review

web-src/src/lib/Composers.js

@@ -39,7 +39,7 @@ export default class Composers {
   }
 
   createSortedAndFilteredList () {
-    var composersSorted = this.items
+    let composersSorted = this.items
     if (this.options.hideSingles || this.options.hideSpotify || this.options.hideOther) {
       composersSorted = composersSorted.filter(composer => this.isComposerVisible(composer))
     }

web-src/src/pages/PageComposer.vue

@@ -1,7 +1,5 @@
 <template>
   <div>
-    <tabs-music></tabs-music>
-
     <content-with-heading>
       <template slot="heading-left">
         <p class="title is-4">{{ name }}</p>
@@ -35,7 +33,6 @@
 <script>
 import { LoadDataBeforeEnterMixin } from './mixin'
 import ContentWithHeading from '@/templates/ContentWithHeading'
-import TabsMusic from '@/components/TabsMusic'
 import ListItemAlbums from '@/components/ListItemAlbum'
 import ModalDialogAlbum from '@/components/ModalDialogAlbum'
 import ModalDialogComposer from '@/components/ModalDialogComposer'
@@ -43,7 +40,7 @@ import webapi from '@/webapi'
 
 const composerData = {
   load: function (to) {
-    return webapi.library_composer(to.params.composer, 'albums')
+    return webapi.library_composer(to.params.composer)
   },
 
   set: function (vm, response) {
@@ -55,7 +52,7 @@ const composerData = {
 export default {
   name: 'PageComposer',
   mixins: [LoadDataBeforeEnterMixin(composerData)],
-  components: { ContentWithHeading, TabsMusic, ListItemAlbums, ModalDialogAlbum, ModalDialogComposer },
+  components: { ContentWithHeading, ListItemAlbums, ModalDialogAlbum, ModalDialogComposer },
 
   data () {
     return {

web-src/src/pages/PageComposerTracks.vue

@@ -1,11 +1,8 @@
 <template>
   <div>
-    <tabs-music></tabs-music>
-
     <content-with-heading>
       <template slot="heading-left">
         <p class="title is-4">{{ composer }}</p>
-        <p class="heading">{{ tracks.total }} tracks</p>
       </template>
       <template slot="heading-right">
         <div class="buttons is-centered">
@@ -36,7 +33,6 @@
 <script>
 import { LoadDataBeforeEnterMixin } from './mixin'
 import ContentWithHeading from '@/templates/ContentWithHeading'
-import TabsMusic from '@/components/TabsMusic'
 import ListItemTrack from '@/components/ListItemTrack'
 import ModalDialogTrack from '@/components/ModalDialogTrack'
 import ModalDialogComposer from '@/components/ModalDialogComposer'
@@ -44,7 +40,7 @@ import webapi from '@/webapi'
 
 const tracksData = {
   load: function (to) {
-    return webapi.library_composer(to.params.composer, 'tracks')
+    return webapi.library_composer_tracks(to.params.composer)
   },
 
   set: function (vm, response) {
@@ -56,7 +52,7 @@ const tracksData = {
 export default {
   name: 'PageComposerTracks',
   mixins: [LoadDataBeforeEnterMixin(tracksData)],
-  components: { ContentWithHeading, TabsMusic, ListItemTrack, ModalDialogTrack, ModalDialogComposer },
+  components: { ContentWithHeading, ListItemTrack, ModalDialogTrack, ModalDialogComposer },
 
   data () {
     return {

web-src/src/pages/PageComposers.vue

@@ -3,6 +3,9 @@
     <tabs-music></tabs-music>
 
     <content-with-heading>
+      <template slot="options">
+        <index-button-list :index="composers_list.indexList"></index-button-list>
+      </template>
       <template slot="heading-left">
         <p class="title is-4">{{ heading }}</p>
         <p class="heading">{{ composers.total }} composers</p>
@@ -18,18 +21,14 @@
 import { LoadDataBeforeEnterMixin } from './mixin'
 import ContentWithHeading from '@/templates/ContentWithHeading'
 import TabsMusic from '@/components/TabsMusic'
+import IndexButtonList from '@/components/IndexButtonList'
 import ListComposers from '@/components/ListComposers'
 import webapi from '@/webapi'
-import * as types from '@/store/mutation_types'
 import Composers from '@/lib/Composers'
 
 const composersData = {
   load: function (to) {
-    if (to.params.genre) {
-      return webapi.library_genre_composers(to.params.genre)
-    } else {
     return webapi.library_composers()
-    }
   },
 
   set: function (vm, response) {
@@ -46,7 +45,7 @@ const composersData = {
 export default {
   name: 'PageComposers',
   mixins: [LoadDataBeforeEnterMixin(composersData)],
-  components: { ContentWithHeading, TabsMusic, ListComposers },
+  components: { ContentWithHeading, TabsMusic, IndexButtonList, ListComposers },
 
   data () {
     return {
@@ -66,35 +65,9 @@ export default {
 
     composers_list () {
       return new Composers(this.composers.items, {
-        hideSingles: this.hide_singles,
+        sort: 'Name',
-        hideSpotify: this.hide_spotify,
-        sort: this.sort,
         group: true
       })
-    },
-
-    hide_singles: {
-      get () {
-        return this.$store.state.hide_singles
-      },
-      set (value) {
-        this.$store.commit(types.HIDE_SINGLES, value)
-      }
-    },
-
-    hide_spotify: {
-      get () {
-        return this.$store.state.hide_spotify
-      },
-      set (value) {
-        this.$store.commit(types.HIDE_SPOTIFY, value)
-      }
-    },
-
-    sort: {
-      get () {
-        return 'Name'
-      }
     }
   },
 

web-src/src/webapi/index.js

@@ -271,9 +271,20 @@ export default {
     return axios.get('/api/library/composers')
   },
 
-  library_composer (composer, type) {
+  library_composer (composer) {
-    var params = {
+    const params = {
-      type: type,
+      type: 'albums',
+      media_kind: 'music',
+      expression: 'composer is "' + composer + '"'
+    }
+    return axios.get('/api/search', {
+      params: params
+    })
+  },
+
+  library_composer_tracks (composer) {
+    const params = {
+      type: 'tracks',
       media_kind: 'music',
       expression: 'composer is "' + composer + '"'
     }