mod: big letter indicates position in large library folder
Posted: 02 Jun 2016, 00:24
mod: big letter indicates position in one large library folder (of your choice)
One way to make scrolling a large folder of albums easier is to show the first letter of the folder currently near the middle of the screen in a big font. In addition to the regular list the user sees a big A and, as he scrolls down, B C D ... That helps you stop at the right place when scrolling a long way quickly. This mod does just that.
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.
- a drawback is that the right top corner menu button temporarily does not work while in the big letter scroll folder
- this only works for one single folder. The default is "USB" but you can change that below. You could probably also modify the code to work in all folders.
- I think I've below included all changes needed for this mod but feel free to comment if something is missing or unclear.
Edit this file
near the top find the lines
and add these lines below
find lines
and add above them
find line
and add below
find line
and add below
find lines
and add below
find lines
and add below
find function
and in it find the line
and add this above that line
find lines
and add below
Note: do the following find/add step only if you have done this mod, otherwise ignore this step.
find
and add below it
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: fixed typo and error.
edit: added step to hide big letter when navigating to subfolder
One way to make scrolling a large folder of albums easier is to show the first letter of the folder currently near the middle of the screen in a big font. In addition to the regular list the user sees a big A and, as he scrolls down, B C D ... That helps you stop at the right place when scrolling a long way quickly. This mod does just that.
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.
- a drawback is that the right top corner menu button temporarily does not work while in the big letter scroll folder
- this only works for one single folder. The default is "USB" but you can change that below. You could probably also modify the code to work in all folders.
- I think I've below included all changes needed for this mod but feel free to comment if something is missing or unclear.
Edit this file
- Code: Select all
/srv/http/assets/js/runeui.js
near the top find the lines
- Code: Select all
// Global GUI Array
// =================
and add these lines below
- Code: Select all
var manualnav = ""
var bigfolder = "USB" //Edit this if you want bigletter in some other folder
find lines
- Code: Select all
// update info and status on Playback tab
function refreshState() {
and add above them
- Code: Select all
//BIGLETTER
// Mod to show one big letter when scrolling in bigfolder library folder
var prevpath = "";
$(window).scroll(function() {
if ( ( !$('#open-panel-sx').hasClass('active') ) || (manualnav != bigfolder) )
return
var winTop = $(this).scrollTop();
winTop = winTop + window.innerHeight / 3;
var $lis = $('#database-entries li');
var top = $.grep($lis, function(item) {
return $(item).position().top <= winTop;
}); // top is js array of items above WinTop (visible top)
var toplast = $(top[top.length - 1]); //array last item
var pp = toplast.data('path');
var pparr = pp.split("/"); //segments
var letter = pparr[pparr.length - 1] //last segment = filename
letter = letter.substr(0,1); //first letter
if (letter != prevpath && letter != null) {
prevpath = letter;
$('#menu-settings').css({'margin': '200px 0 0 -130px', 'font-size': '60px'}); //Top R Bottom L
$('#menu-settings').html( "<b>" + prevpath + "</b>" ); //bigletter
$('#menu-settings').bind('click', false); //disable menu dropdown
}
});
function hidebigletter(){
$('#menu-settings').css({'margin': '0 -30px 0 0', 'font-size': '14px'});
$('#menu-settings').html('<i class="fa fa-bars dx"></i>');
$('#menu-settings').unbind('click', false);
prevpath = "";
}
// on ready playback tab
$('a', '#open-playback').click(function(){
if (prevpath) { hidebigletter() }; //restore menu
});
find line
- Code: Select all
$('#db-level-up').click(function(){
and add below
- Code: Select all
if (prevpath) { hidebigletter() };
find line
- Code: Select all
$('a', '#open-panel-dx').click(function(){
and add below
- Code: Select all
if (prevpath) { hidebigletter() };
find lines
- Code: Select all
} else {
++GUI.currentDBpos[10];
and add below
- Code: Select all
if ($(this).data('path') == "USB")
manualnav = "USB";
find lines
- Code: Select all
// browse by file (default)
browsemode = el.data('browsemode');
and add below
- Code: Select all
manualnav = path;
find function
- Code: Select all
$('#db-level-up').click(function(){
and in it find the line
- Code: Select all
getDB({
and add this above that line
- Code: Select all
manualnav = path;
find lines
- Code: Select all
else {
breadcrumb.html(path);
and add below
- Code: Select all
if (path != bigfolder) { hidebigletter() };
Note: do the following find/add step only if you have done this mod, otherwise ignore this step.
find
- Code: Select all
if ($('#open-panel-sx').hasClass('active')) {
renderLibraryHome();
and add below it
- Code: Select all
manualnav = '';
if (prevpath) { hidebigletter() };
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: fixed typo and error.
edit: added step to hide big letter when navigating to subfolder