Here are my notes on making Rune more minimalistic.Caveats:
- This presupposes that you SSH in to your Rune device and edit files there.
- I don't know if the modifications work with all versions of RuneAudio and on all systems. There could also be errors in my notes. Post corrections and I'll update the notes.
- It is
a good idea to first make a backup of the whole RuneAudio installation (make a clone of the microSD card)
and backup the individual file that you will modify.
- In the instructions pay attention to when you are to search and replace (1) a string (part of a line) and when to replace (2) a whole line.
The file we will do all modifications in is runeui.js It is located here
- Code: Select all
/srv/http/assets/js/runeui.js
You can also browse through the contents of the file online here
https://github.com/RuneAudio/RuneUI/blo ... /runeui.jspreliminary step: make a variable for toggling modifications on/offfind the line
- Code: Select all
var GUI = {
and add this line above it
- Code: Select all
var mini = 1;
Once the modifications are done you can toggle many but not all of them on/off by changing this variable. Useful for troubleshooting.
mod 1: Library: remove subtitlesSearch each one of these strings and replace it with nothing
- Code: Select all
browse MPD database by album
browse MPD database by artist
browse MPD database by genre
USB attached drives
webradio local playlists
Browse your library
mod 2: Library: shorten titlesSearch and replace all instances of the string
- Code: Select all
USB storage
with
- Code: Select all
USB
and all instances of the string
- Code: Select all
My Webradios
with
- Code: Select all
Radio
and all instances of the string
- Code: Select all
s</h3>
with
- Code: Select all
</h3>
(This changes Albums to Album and so on.)
mod 3: Library: hide buttons except usb radio album artist genreSearch and replace the string
- Code: Select all
networkMounts))
with
- Code: Select all
networkMounts) && !mini)
- Code: Select all
localStorages))
with
- Code: Select all
localStorages) && !mini)
- Code: Select all
Spotify))
with
- Code: Select all
Spotify) && !mini)
- Code: Select all
Dirble))
with
- Code: Select all
Dirble) && !mini)
find the line
- Code: Select all
// Jamendo (static)
and add this line below it
- Code: Select all
if (!mini) {
and find the line
- Code: Select all
// Album list (static)
and add this line above it
- Code: Select all
}
mod 4: Playback: if radiostream, hide time-knob and coverfind the line
- Code: Select all
function refreshState() {
and add these lines below it
- Code: Select all
if (mini) {
if (GUI.stream === 'radio') { $('#time-knob, #cover-art').addClass('hide'); }
else { $('#time-knob, #cover-art').removeClass('hide'); }
}
mod 5: Playback: various modificationsfind the line
- Code: Select all
function refreshState() {
and add these lines above it
- Code: Select all
if (mini) {
// hide share, mpd, bitrate, playlistpos
$('#overlay-social-open, #overlay-playsource-open, #playlist-position, #format-bitrate').addClass('hide');
//hide vol up down mute buttons
$('#volumedn, #volumeup, #volumemute').addClass('hide');
//click vol wheel to toggle mute
$("#volume").bind("click", function () {
$(':focus').blur();
$("#volumemute").click();
});
//move repeat random single buttons to queue page footer
$('#repeat, #random, #single').prependTo("#pl-controls");
//hide nav btn in library & queue
$('#db-controls, #pl-firstPage, #pl-lastPage, #pl-prevPage, #pl-nextPage').addClass('hide');
//hide spinner
$("#currentsong i, #currenttitle i, #currentalbum i, #countdown-display i, #total i").addClass('hide');
//remove dummy text
$("#currentsong, #currenttitle, #currentalbum, #countdown-display, #total").html(' ');
//remove search default + hints
$('#pl-filter').removeAttr('placeholder').removeAttr('data-original-title');
$('#db-search-keyword').removeAttr('placeholder');
}
mod 6: Playlist: disable reminders when queue is emptyfind both instances of
- Code: Select all
$('#playlist-warning').removeClass('hide');
and add lines above and below like this
- Code: Select all
if (!mini) {
$('#playlist-warning').removeClass('hide');
}
mod 7: Disable [No Title] type placeholders when no title tagSearch for each of these strings
- Code: Select all
[no artist]
[no album]
[no title]
and replace the string including the [ ] brackets (but
not the whole line) with this string
- Code: Select all
mod 8: Library: remove subtitle for add new webradiosearch and delete this string (but leave everything else on the same line)
- Code: Select all
<span class="bl">add a webradio to your library</span>
mod 9: Playback: hide album image placeholder when no song in queuefind this line in the section added in mod 5 above
- Code: Select all
$('#db-search-keyword').removeAttr('placeholder');
and add this below it
- Code: Select all
$("#cover-art").css('border', '2px solid #000000');
Next find both instances of the string
- Code: Select all
$('#cover-art').css('background-image'
and add this on new lines above each instance
- Code: Select all
var miniopacity = mini && ( !currentalbum && !currentartist ) ? "0.0" : "1.0"
$("#cover-art").css('opacity', miniopacity);
mod 10: Library/Playlist: disable popup notifications/confirmationsfind this line
- Code: Select all
pushstream.addChannel('notify');
and comment out the line below it so the two lines look like this
- Code: Select all
pushstream.addChannel('notify');
// pushstream.connect();
Necessary steps to apply the modificationsFirst, 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.
(Note: you
can test the modifications without minifying. For that go to developer settings ( the url to your Rune device with /dev added, for example 192.168.96.2/dev ). and turn Dev Mode on and save. RuneAudio will now use runeui.js instead of runeui.min.js . When done testing do the minify steps above and also turn Dev Mode off.)
edit: removed steps that were actually not needed to apply the changes.