21 Jan 2014 by Dan Purdy in Tutorial, Web Development
For a few years now we’ve had a screen above our Reception area at work to inform musicians which studio they are working in that day by displaying session details. The original system I created was a small webpage and a couple of XML files that we would edit for the weeks sessions and then the webpage would refresh itself every 30 minutes and display whatever was in at the time. There was no network access to the computer available at the time and physically it was located under a staircase. As you can imagine trying to get to it to do anything or to update the XML files was a nightmare. Not to mention the only computer we had available to use at the time was an old Mac Pro which meant we were pretty much using the equivalent of a one megaton nuclear warhead to crack a nut, a complete waste of energy.
One of the reasons I built the studio backup system was to alleviate this problem. Now that we had a database of all sessions and what clients were where at any given time it made sense to use this information on the reception screen, it also meant that any staff in the building would be able to edit what was shown on the screen from any computer in the building without having to find someone who understood the structure of an XML file. We also needed to remedy the fact we were using such a large power hungry machine to essentially display a webpage. A Raspberry Pi Kiosk setup seemed to me to be the answer.
Essentially we wanted the raspberry pi to be hidden behind the screen with just a network cable and a HDMI cable coming from it. The pi would display a full screen webpage with session details taken from our database. In the event someone power cycled the Pi we wanted it to boot straight into this full screen state and straight onto the webpage we’d setup. We would need to setup SSH to allow us remote access to the Pi too to avoid the need for a mouse and keyboard at any point.
So I’m going to explain the steps I took to manage this.
I’m assuming if you are following this then you already have a Pi setup with Raspbian. If you dont head over to www.raspbian.org/ and follow the instructions there to load Raspbian onto an SD card.
Once this is done boot your Raspberry Pi and open up a terminal window. Type in
sudo apt-get update && sudo apt-get upgrade -y
These commands will update the package list and upgrade any packages on your device.
Next we install the chromium browser, x11 server utilities and unclutter(removes the cursor from the screen).
To do this type in
sudo apt-get install chromium x11-xserver-utils unclutter
The chromium browser includes a kiosk mode which displays the browser full screen wihout any taskbars or icons which works perfectly for a kiosk style screen.
Now that we have everything we need we can setup SSH to allow us remote access to the unit and get rid of the keyboard and mouse.
First we want to setup a static IP address for our Pi on the network. Make sure your pi is connected to your network and in a terminal window type
ifConfig
Note down the gateway and broadcast address and any other address settings you think you may need for your current connection.
Now in terminal we are going to edit your network settings and setup the static address. To do this type
sudo nano /etc/network/interfaces
This will open up your network interfaces file, start by changing the line that says
iface eth0 inet dhcp
to
iface eth0 inet static
Now you’ll need to add 3 lines straight after if they aren’t already there.
address xxx.xxx.xxx.xxx
netmask 255.255.255.0
gateway xxx.xxx.xxx.xxx
Adding in the static address you would like to use next to the address line and then your gateway address which you noted down earlier into gateway. Gateway is usually the address of your router so if you forgot to write it down you can work it out that way. Remember to use an address that isn’t in the DHCP pool for your router to avoid any conflicts later on with other users on your network. Now hit ctrl-O to write the file and then ctrl+X to get yourself back to your terminal screen.
Now that you have a static address set you can enable SSH on the pi. We’ll use the wizard that comes with raspbian to do this.
In terminal type
sudo raspi-config
First step should be to change your user password which should be option 2. The default username is pi and the default password is raspberry.
Once you’ve changed your password head to option 8 – Advanced Options and then option A4 – SSH and just hit enabled.
SSH is now enabled, lets test it out. Head to another computer on the same network, if you are on a mac/linux computer you can do this next step from the terminal if you are a PC user however you will need to install a SSH program, my favourite being putty.
I’ll explain the steps for using a terminal window, if you are using Putty then you can just pick the information out and fill in the correct boxes with putty to set up. It’s very straight forward.
So still on the 2nd computer open up a terminal window and type
ssh pi@xxx.xxx.xxx.xxx
Where the X’s represent the static address you gave your Pi in the previous part. If it’s worked you should be asked for your password. Enter the password you chose for your Pi and cross your fingers!
Now you should be greeted with a pi@xxx command prompt, this means you are now logged in and directly controlling your Pi.
Great, now you can put your Pi wherever it is going to live and never touch it again! We can now get on to setting up kiosk mode.
Before we start displaying anything on the screen we need to go through a few steps to setup and disable a few settings.
Firstly we should disable the screensaver and any energy saving settings as we don’t want our screen to go to sleep at all when it’s in use, wouldn’t be very useful if it went blank every 5 minutes.
While connected to your pi over SSH type
sudo nano /etc/xdg/lxsession/LXDE/autostart
Please note, some of my commenters have mentioned that if you’re using NOOBs you may need to use the LXDE-pi folder which would mean you need to use the following instead.
sudo nano /etc/xdg/lxsession/LXDE-pi/autostart
As you can probably guess this is a file that runs when your pi boots.
To disable the screensaver add a # to the beginning of the line, this comments the line out.
@xscreensaver -no-splash
Next add these lines underneath the screensaver line
@xset s off
@xset -dpms
@xset s noblank
This disables power management settings and stops the screen blanking after a period of inactivity.
Now that is done we should prevent any error messages displaying on the screen in the instance that someone accidentally power cycles the pi without going through the shutdown procedure. To do this we add the following line underneath the lines you just added.
@sed -i 's/"exited_cleanly": false/"exited_cleanly": true/' ~/.config/chromium/Default/Preferences
Finally we need to tell chromium to start and which page to load once it boots without error dialogs and in Kiosk mode. To do this add the following line to the bottom of this autostart file.
@chromium --noerrdialogs --kiosk http://www.page-to.display
Thanks to a comment from Rikard Eriksson below it seems you may now need to add the incognito flag to ensure no warnings are displayed if you pull the power without first shutting down see below.
@chromium --noerrdialogs --kiosk http://www.page-to.display --incognito
Obviously replace page-to.display with whatever page you want to load. In my case I’m just connecting to the webserver I’ve setup on our network which has our database and my backup system.
Hit ctrl-O and then ctrl-X again to write out and exit the file and now type
sudo reboot
Keep an eye on the display from your Pi now and once the unit boots again it should automatically load chromium in kiosk mode and display the page you’d chosen.
Sorry for the absolutely shocking picture quality there had to get a quick snap to get this tutorial out, I’ll hopefully replace it soon with a better photo but for now you get the idea and also maybe an idea about what you’d like to display on the screen.
Now it’s up to you to display what you’d like or to create a webpage to be displayed.
Enjoy and any problems or questions please feel free to comment or email me and i’ll do my best to Google your problem for you.
Thanks to Nicolas for bringing my attention to the following in the comments!
It seems the latest Raspbian images don’t boot to desktop by default.
To make sure your raspberry pi boots to desktop you will want to type the command after logging in
sudo raspi-config
From there navigate down to boot_behaviour and change this setting to boot in desktop mode by default.
There’s a little discussion about it here
http://raspberrypi.stackexchange.com/questions/7261/how-to-set-my-raspberry-pi-to-boot-into-the-gui
Thanks again Nicolas!