Posted on by admin

Music players for the Pi Zero W

I have been investigating music players for the Pi Zero. I wanted to be able to control them using a mobile phone or tablet. I intended to put a couple around the house and re-cycle some old sound systems and computer speakers. The player also needs to connect to my fileserver that has my entire CD library on it.

I looked at “pi musicbox” first of all, it seemed to satisfy my requirements, but when I tested it I found some problems. These are my findings:-

  1. The image can be downloaded direct from their website. It has a small footprint and it works straight away.
  2. The configuration file is visible on a partition for windows users, so the wifi details can be plugged in before booting up while the sd card is still connected to a PC. This works great.
  3. Once the system was booted up, I could connect to the web server and control it from a PC and mobile. Additional configuration can be done from here. I tried to set up a link to my file server, but it didn’t work. I had to enable SSH and connect to the command terminal and hack the configuration file at /opt/musicbox/startup.sh. The line to mount a network server had to be changed to: mount -t cifs -o user=pi,password=pi //FILESERVER/pi-music /music/Network
  4. The system scans all the network files by default on boot up. This takes a lot of time and I am not sure why it is necessary.
  5. The web user interface was very slow to operate and got stuck a few times.
  6. There was an annoying spinning disk when waiting that didn’t go away on some browsers.

So I was not very impressed…….

I have not yet tried “Volumnio”.

The next product I tried was VLC which I have used on my PC for audio and video and it is quite robust and useful. It happens to have its on internal web server that can be switched on so I installed it on a headless pi with a GUI. (VLC can run without a GUI, but it is easier to configure with a GUI).

The setup to be done is as follows:

  1. Run VLC and go to the control page TOOLS / / PREFERENCES / / INTERFACE from the main menu bar. Click to check the box “All”, then select “main interfaces” from the left hand list and click to check the box “Web”.
  2. Select lua on the expanded “main interfaces” option and add a password for http access.
  3. Add the following file (with sudo) /usr/share/vlc/lua/http/.hosts and add entries to allow access to the web server. e.g. ::1 192.168.1.123 or just use 1:0 0.0.0.0 for everybody.
  4. I also added an entry to start the invisible VLC (called CVLC) on boot by adding @cvlc to the file /home/pi/.config/lxsession/LXDE-pi/autostart
  5. Once the server has started it can be accessed from any web browser. Note that it is on port 8080. (use http://my pi IP address whatever:8080 on the URL line of the browser)
  6. Mount the fileserver music library in the /home/pi folder as this is where browsing starts from. i.e.
 mkdir /home/pi/MusicLibrary

 add a mount command to /etc/fstab

 //FILESERVER/pi-music /home/pi/MusicLibrary cifs user=pi,password=pi,uid=pi,gid=pi,x-systemd.automount 0 0

I found that the response was snappy and it worked well.  There is a separate interface for mobiles and tablets with less functionality. VLC is quite useful in that playlists can be setup and access to other music streams can be setup.

I am currently using a USB to Audio widgit that plugs into the pi USB port. You can see this in the photo above. This cost less than a pound and took three weeks to arrive all the way from China. The pi recognises it without any fuss.

I decided that the mobile interface needed a function to select and play all files listed on the browse window, i.e. play a full CD rather than play a single file. I was able to hack the http server files and add some jquery/javascript to achieve this. The server html files are located at /usr/share/vlc/lua/http.

I hacked the file “mobile_browse.html” to add an extra button to play all the files. A copy is attached here :

<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - >
< mobile_browse.html: VLC media player web interface - VLM
< - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - >
< Copyright (C) 2005-2014 VLC authors and VideoLAN
< $Id$
<
< Authors: Brandon Brooks <bwbrooks -at- archmageinc -dot- com>
<
< This program is free software; you can redistribute it and/or modify
< it under the terms of the GNU General Public License as published by
< the Free Software Foundation; either version 2 of the License, or
< (at your option) any later version.
<
< This program is distributed in the hope that it will be useful,
< but WITHOUT ANY WARRANTY; without even the implied warranty of
< MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
< GNU General Public License for more details.
<
< You should have received a copy of the GNU General Public License
< along with this program; if not, write to the Free Software
< Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston MA 02110-1301, USA.
< - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<html>
 <head>
 <title><?vlc gettext("VLC media player - Web Interface") ?></title>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <meta name="viewport" content="width=device-width" />
 <link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />
 <script type="text/javascript" src="js/common.js"></script>
 <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
 <link type="text/css" href="css/main.css" rel="stylesheet" />
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
 <script type="text/javascript" src="js/jquery.jstree.js"></script>
 <script type="text/javascript" src="js/controllers.js"></script>
 <script type="text/javascript">
 var pollStatus = false;
 var browse_target = '#mobile';
 $(function(){
 browse(); 
 
 })

function clearit()
 {
 sendCommand({'command':'pl_empty'})
 updatePlayList(true);
 }

function queueit ()
 {
 clearit();
 var $children = $('#browse_elements').children('li');
 var first=true;
 var play=false;

$children.each(function()
 { 
 var path = this.getAttribute('opendir') ? this.getAttribute('opendir') : this.getAttribute('openfile');

if (!first) {
 sendCommand('command=in_enqueue&input='+encodeURI(path));
 if (!play) {
 sendCommand('command=in_play&input='+encodeURI(path));
 }
 play = true;
 }
 first=false; 
 });
 
 setTimeout(function(){updatePlayList(true);window.location = "mobile.html";},2000);
 
 }
 </script>

<style>
 .buttonx {
 background-color: #FF0000; 
 border-style: solid;
 border-width: 4px;
 border-color: black;
 color: white;
 padding: 15px 32px;
 text-align: center;
 text-decoration: none;
 display: inline-block;
 font-size: 24px;
 }
 </style>
 </head>
 <body>
 <div id="window_browse" title="<?vlc gettext("Media Browser") ?>">
 <div>
 <ol id='browse_elements' selectable="selectable">
 <li><?vlc gettext("Play List") ?></li>
 </ol>
 </div>
 </div>
 <br/>
 
 <button id="qbutt" type="button" value="Q" class=buttonx onclick="queueit();">Play</button>


</body>
</html>
Proudly powered by WordPress