Page 1 of 2

library navigation - home button and breadcrumb bar

PostPosted: 16 May 2016, 22:17
by lubosv
hi folks,

there are two things that might be of benefit when using the library - in particular in network mounts, USB drives and artist / genre / album sections:

  • button (home or similar) which could be used to jumping directly into the main library window - example: when located deep in directory structure of the NAS, it's necessary to go back / back / back / back through all levels in order to get to internet radios. having the possibility to jump up in one step would be good
  • the UI is showing the "path" one is located in. would it be possible to convert the string into a breadcrumb navigation? in that way, it would be possible to jump to a specific level up in the hierarchy

i tried to search for this in the feature request list, but to no avail - so hopefully this is not a duplicate of existing story... any views / thoughts?

Re: library navigation - home button and breadcrumb bar

PostPosted: 16 May 2016, 23:04
by hondagx35
Hi lubosv,

good point.

We will consider this for future versions.

Frank

Re: library navigation - home button and breadcrumb bar

PostPosted: 17 May 2016, 09:16
by waves
Here is a mod to get the first request. It changes the bottom Library button (when you're already in the library ) to jump to the library home screen even if you're currently browsing e.g. USB\genre\artist\album\disc1\ .

mod: when browsing folders in library, click library button to jump directly to library start page.

Caveats:
- This presupposes that you SSH in to your Rune device and edit files there.
- It is a good idea to first make a backup of the files you modify.

Edit this file
Code: Select all
/srv/http/assets/js/runeui.js

and find the lines
Code: Select all
            if ($('#open-panel-sx').hasClass('active')) {
                customScroll('pl', parseInt(GUI.json.song), 500);

and replace them with with
Code: Select all
            if ($('#open-panel-sx').hasClass('active')) {
                // customScroll('pl', parseInt(GUI.json.song), 500);
                renderLibraryHome();


Necessary steps to apply the modifications
First, when you are done editing, save runeui.js

Next we minify the file (i.e. convert it into a more compact file that RuneAudio normally uses)
- Copy all the contents of your modified runeui.js file to the clipboard
- Paste into the editbox at http://gpbmike.github.io/refresh-sf/
- Click the button Javascript on the right side of the editbox. The content is now minified
- Copy all the minified text in the editbox
- Edit the file runeui.min.js (make a backup of it first!) and replace all its contents with the minified text from the clipboard. Then save. Then reload RuneAudio in the browser.

edit: removed steps that were actually not needed.
edit: disambiguated which code location to modify

Re: library navigation - home button and breadcrumb bar

PostPosted: 17 May 2016, 22:52
by lubosv
frank, nice to hear that you find the ideas interesting and worth considering.

waves, this works marvelously! at first i was a bit worried that clicking the 'library button' would always bring me to the library top level but fortunately this is not the case. the button works in this way only when clicked from within the library. accessing it from the playback or queue sections brings me to the last used library level. great!

since i need to do some further modifications i switched my installation to dev mode but your info on how to "minify" will surely be useful soon.

thanks for your quick help, guys! much appreciated!

Re: library navigation - home button and breadcrumb bar

PostPosted: 18 May 2016, 01:15
by moshel
+1 for breadcrumbs. I sometimes remember a name of a song in an album. currently there is no easy way of going to the album path from the search ui other than memorizing the path string.

Regards,
Moshe

Re: library navigation - home button and breadcrumb bar

PostPosted: 18 May 2016, 18:46
by waves
lubosv wrote:at first i was a bit worried that clicking the 'library button' would always bring me to the library top level but fortunately this is not the case. the button works in this way only when clicked from within the library. accessing it from the playback or queue sections brings me to the last used library level. great!

Yes, that was my first thought too. But then I saw that the preexisting code already was conditional on the Library section being active. So easy mod to switch just that one line.

As for breadcrumb navigation it should also be doable. But I'm short on time to do it ATM. But here is a sketch on steps needed I think. In the same file as before, runeui.js , find
Code: Select all
    } else {
        breadcrumb.html(path);
    }
    $('#db-homeSetup').addClass('hide');

That breadcrumb.html(path); should be expanded in these steps
- split path variable into slash separated segments.
- For each segment, make a href that on click calls the getDB function with the path up to and including that segment as parameter. getDB example
Code: Select all
getDB({ path: "USB" });

- merge the a href segments with slashes inbetween into a variable
- do breadcrumb.html(segmentsvariable)

Perhaps some javascript hero jumps in here and pieces that together? :)

Re: library navigation - home button and breadcrumb bar

PostPosted: 18 May 2016, 21:10
by lubosv
very interesting approach, waves! :) even though i don't use JS, it is quite clear why & how it should work. i might try my luck later - it's never too late to learn another language... ;-)

just for clarification - would it then mean that the breadcrumb "path" will be very long string of concatenated hyperlinks - for A / B / C / D like that (pseudocode)?
Code: Select all
  path = "<a href="A-URL">A</> / <a href="A/B-URL">B</> / <a href="A/B/C-URL">C</> / <a href="A/B/C/D-URL">D</>"
  breadcrumb.html(path);

i actually tried to find the respective part in the page source in the browser (in order to better understand how the whole system is built) but wasn't successful. do i need to look for something special?

Re: library navigation - home button and breadcrumb bar

PostPosted: 19 May 2016, 03:39
by moshel
I have been thinking about it a little before going to sleep....
I think that instead of burdening the search page with tons of HTML (and slowing the load time considerably and adding lots of I/O), it might be better to just make the whole path clickable and add the broken down breadcrumbs trail in the "directory listing"?

what I mean is that by pressing the line under the name of the song in the search result, you will go into library view of the directory that contains this song, perhaps positioned on the song. A nice addition to this would be to add after the "back" breadcrumbs path. it is similar in concept to the windows explorer display (who would believe that i would ever bring windows explorer as a positive example in UI!)

regards,
Moshe

Re: library navigation - home button and breadcrumb bar

PostPosted: 19 May 2016, 07:19
by waves
lubosv wrote:just for clarification - would it then mean that the breadcrumb "path" will be very long string of concatenated hyperlinks - for A / B / C / D like that (pseudocode)?

Yeah that is on the right track. The line is number 1160 here
https://github.com/RuneAudio/RuneUI/blo ... /runeui.js
edit: use the improved code in this later post instead.

Re: library navigation - home button and breadcrumb bar

PostPosted: 19 May 2016, 07:40
by waves
moshel wrote:instead of burdening the search page with tons of HTML ... it might be better to just make the whole path clickable and add the broken down breadcrumbs trail in the "directory listing"?

The mod I just posted above only gives clickable breadcrumbs when browsing. To add it for search results would take additional code changes. One variation of your suggestion is this: when the user clicks a file in the search results then show clickable breadcrumb path on the bottom directory line (above the library | playback | queue buttons) just like when browsing.

I should add: I'm just a user who likes to poke around in the code and mod things a bit. Not part of the RuneAudio dev team, so my views are only my own. And there is no guarantee that mods I post end up in the
official RuneAudio.