technology workshop craft home food play outside costumes

Raspberry Pi: Wall Mounted Calender and Notification Center

by ozua on January 1, 2016

Table of Contents

Raspberry Pi: Wall Mounted Calender and Notification Center . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

Intro: Raspberry Pi: Wall Mounted Calender and Notification Center . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

Step 1: The Hardware . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

Step 2: The Software . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

Step 3: Create a webpage and webserver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

File Downloads . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

Step 4: Install a Web Browser and customize CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

File Downloads . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

Step 5: Set up push buttons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

File Downloads . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

Related Instructables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

Advertisements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

Comments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/
Intro: Raspberry Pi: Wall Mounted Calender and Notification Center
Before the “digital age” many families used wall calendars to show a monthly view of upcoming events. This modern version of the wall mounted calendar includes the
same basic functions:

A monthly agenda
Sync of family members activities
Easy browse between months

Beyond those basic functions this gadget will also handle:

A whether forecast
Upcoming events in the surrounding area
Live information about the public transport
And even more...

What you need:

Raspberry Pi 2
USB Wifi Dongle. (Like Edimax 150Mbps Wireless nano )
LCD laptop screen (take one from a broken laptop http://www.instructables.com/id/Old-laptop-screen...
Controller card for the laptop screen (search Ebay for LCD Controller Driver Board and the serial number of your laptop screen)
Some Push Button Switches (Like http://www.ebay.com/itm/16mm-Start-Horn-Button-Mom... )
Webserver running a custom made homepage
Piece of wood. Height should be more than 30mm, so the electronics can fit inside. The width and height depends on the size of your laptop screen.
Sheet of cork. (Like this http://www.pandurohobby.se/Katalog/50-Skapa-Dekor...
Short HDMI cable
Powersuply for controller board and Raspberry Pi.
Foamcore
Glue.
Mounting screws .

(Inspired by the instructable by Piney http://www.instructables.com/id/Raspberry-Pi-Wall-...)

Step 1: The Hardware

This is the hardware setup.

1. Find a LCD laptop screen . Order a controller board on Ebay. Search for LCD Controller Driver Board and the serial number of your laptop screen.
Read more: http://www.instructables.com/id/Old-laptop-screen-..
2. Craft a piece of wood. Height should be more than 30mm, so the electronics can fit inside. The width and height depends on the size of your laptop screen, have
a margin for an extra 10 mm on all sides. Carve out and make room for the electronics on the back. Drill holes for the buttons and wires.
3. Fasten the laptop screen. I used the orginal mounting frame from the laptop.
4. Cut out foamcore with equal thickness as the screen. and glue it on the wooden slab.
5. Cover all sides with cork. Cut with a “snap-off blade knife” and glue with “glue spray”.
6. Mount the Push Buttons. Use a large drill, and drill carefully by hand.
7. Connect the electronics. Connect three of the Push Buttons to GPIO-pins 19/20/21 and to ground. https://ms-iot.github.io/content/images/PinMappin... Find out
the pin for On/Off button for the controller board, and connect it with the fourth Push Button. (You will find it by trying to connect ground to each pin, suddenly the
LCD will light up). Finaly, connect the HDMI cable between Raspberry and controller board, and connect the screen to the controller board.

http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/
http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/
http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/
 Image Notes
1. Jumpwires connecting ground with On/Off Button.
2. GPIO pins connected with ground, through the Push buttons.

Step 2: The Software

The setup is somehow turning the Raspberry Pi into a kiosk. The OS will auto start a website in full screen mode,
and the Push Buttons is used to control the information at the website. The setup is:

1. Install Raspbain on Raspberry Pi (https://www.raspberrypi.org/documentation/installation/noobs.md)

2. Set up a webpage and a webserver
3. Install a web browser and customize the CSS
4. Set up the push buttons

Step 3: Create a webpage and webserver

The webpage is the canvas the Raspberry Pi will display. The canvas can be filled with any information. I will show you how i to embed a google callender. The embeed
code is generate by googles own aplication. This youtube shows how to get it to work: https://www.youtube.com/watch?v=2tnYwbs-yDk

Google Calendar have built in keyboard shortcuts. Press N and the next month will appear, press P and the previously month is shown. This will only work when the <
iframe > is in focus. I have created a JavaScript that ensure that focus is correct.

An example of the HTML file is attached. For privacy, I have replace some of the code with “*___REPLACED___*”. Instead, use the code generated by google.

Either put the index.html file on your own webhost, or turn your Raspberry Pi into a webserver and host it local. If you already have a webhost continue to the next step.
Install a webserver by following this guide: https://www.raspberrypi.org/documentation/remote-a... Now save your modifed index.html to /var/www/html/index.html, like
this:
sudo cp index.html /var/www/html/index.html

File Downloads

index.html (1 KB)
[NOTE: When saving, if you see .tmp as the file ext, rename it to 'index.html']

http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/
Step 4: Install a Web Browser and customize CSS
There a many web browser out there. But I have only find one that can handle these three requirements; 1) can handle the modern version of google calendar, 2) has a
full screen mode, 3) can run a local CSS. The local CSS is used to change the appearances of the google calendar. The redesign can’t be done at the webpage,
because the CSS are embedded from another server (the google-server).

Install Iceweasel (Firefox for Linux)

https://www.youtube.com/watch?v=69fwZ8yMnz0

Install this extension for Iceweasel:

https://addons.mozilla.org/en-US/firefox/addon/stylish/

Open the “Stylish” extension tab in Iceweasel and customize the CSS to make the google callander look better. Se attached file i for an example.

Now, lets make Iceweasel to autostart and open your webpage at login. Type this in the linus terminal:
cd /home/pi//.config/autostart<br>nano cal.desktop

Write the following. change "localhost" to adress where your canvas-webpage are stored. Save and exit.
[Desktop Entry]
Type=Application<br>Name=hemsida<br>Exec=iceweasel localhost
StartupNotify=false

File Downloads

stylish.css (1 KB)
[NOTE: When saving, if you see .tmp as the file ext, rename it to 'stylish.css']
Step 5: Set up push buttons
The Push Buttons is used to browes forward and backwards in the calendar month view. By default this is done by pressing “p” and “n” at a keyboard. Therefore the
buttons will emulate those two keyboards commands.

First, create a python script to make the Push buttons work: http://razzpisampler.oreilly.com/ch07.html

Download and install Uinput, a python API to create virtual keyboards: http://tjjr.fi/sw/python-uinput/ Raspbian comes with both Python 2 and Python 3. Make sure you
install Uinput with the version you are using.

Put the Uinput-API and the button script together. In this DIY we are using GPIO-pins 19, 20, 21, as described in the hardware section. The attached file shows the final
python scipt.

Auto-start the python script on startup: http://www.instructables.com/id/Raspberry-Pi-Laun... Our laouncher.sh will look like bellow. Replace “/home/pi/py_switch” to the
path of your directory.
cd /
cd /home/pi/py_switch
sudo modprobe uinput
sudo python switch.py
cd /

That's all!

File Downloads

switch.py (901 bytes)

[NOTE: When saving, if you see .tmp as the file ext, rename it to 'switch.py']

Related Instructables

Facebook Wall Quick Easy

Knife switch by Cheap Phone Recessed Wall
Robot by Mount for
Make Perpetual JackH3 How to make a sketchsk3tch Dock + Passive
Calender from Utility Bill Speaker + Rasberry Pi
last year's Organizer by Accessory Google
calender by Organizer using Calendar by
MrJentis
Pra_ga Old Desktop chrischampion
Calendar by
lllshreelll

http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/
Advertisements

Comments
1 comments Add Comment

DIY Hacks and How Tos says: Jan 2, 2016. 8:30 PM REPLY
Awesome notification system. You can set up just about any kind of reminder that you can think of.

http://www.instructables.com/id/Raspberry-Pi-Wall-Mounted-Calender-and-Notificatio/