Closed whatdoineed2do closed 5 years ago
I agree, the artists and albums lists are in need of some usability improvements. The index is a good idea.
Great, thanks.
I'm not a javascript/frontend dev (only experience with vuejs is in this project/PRs) so am having hard time putting a branch together - I see there exiists dynamic filter (https://vuejs.org/v2/guide/list.html#Displaying-Filtered-Sorted-Results) that doesn't touch the original data.
This might be easier than to generate the divs/anchors on data load
https://github.com/whatdoineed2do/forked-daapd-web/tree/idx-nav
I've made some progress in generating a tab that has references to the anchors on the page (as based on the album names returned from server) but am having awful time trying to figure out how to navigate to the anchor points on the page.
Any pointers welcome
branch: https://github.com/whatdoineed2do/forked-daapd-web/tree/idx-nav
Got the problematic scrolling working with Vue-scroll. @chme can you let me know if this fits into current structure?
screen grab:
The important things are that there are no changes to backend and the "index nav" elements are generated on the fly based on the returned album data. I need to see how this works with non-latin album names but its functional.
Should Also implement this for 'artists' page too
https://github.com/whatdoineed2do/forked-daapd-web/tree/idx-nav-inf-ldng
I created this separate branch - the only difference is that it uses vue-infinity-loading
to render the returned data set from the server; this lets the page render partitially and then the infinity loading loads the entire dataset. On this netbook, it stops the page looking like it has hung whilst it renders.
Whilst the slots are rendeed a spinner is shown even though the index nav and rest of the page is there. the user can click on the indx nav but it wont navigate since the slots are not there .. but its ok as the spinner is shown indicating things are not 100% ready.
Is this something you are interested in merging? again, no changes to the backend
Closing in favor of https://github.com/ejurgensen/forked-daapd/pull/598
When using
#/music/artists
or#/music/albums
are large list can be returned from the server in alphabetical order.When using the web ui from a smart phone / tablet, that does not have a "cntl-f" functionality to search for text, it is very tedious to scroll all the way to the bottom to look for an artist.
Request to have an 'index' navigation bar when looking at artists or albums; the client/web ui should take artist/album data from server and create a number of
anchors
that would logically separate blocks of content; ie one content block would be representing all albums/artists starting with 'A', another content block for things starting 'B' etc.The index navigation bar (mocked up below with blue text) would allow a user to click the individual letters (say, letter 'W') and the page will scroll to the anchor on the page.
Ideally the index bar would be visible (like the nav bar) when the page is scrolled