08

Aug

Photo Index Page for your Digital Picture Frame PDF Print E-mail
Written by Kelly McNiece   

For those of you that are used to me talking about food, I also talk about the digital picture frame I built out of an old laptop sometimes. Think of it as food for thought….

While working on the digital picture frame I have always struggled with not being able to see all the pictures that were stored. I knew what I was getting, I put them on my flickr account. I just wanted to see them. It seemed obvious to me that I should be able to create a page that would index them and allow me to look at a page that had all of the thumbnails of the directory where all the pictures are downloaded.

While searching for answers I came across a few options, but this one seems to be the best. This is a simple php script that creates a thumbnail page with everything from the picture directory. Keep in mind, you will need to enable php on your apache server for this to work. If you have a working picture frame, this should be an easy run-through, I hope. If you are like me, you are going to sit down at a remote computer start up some Pandora One, turn over to the Mulatu Atsatke Station. Once you get completely into the ‘groove’, fire up your ssh (putty?) and connect to your picture frame. It has network connectivity, and ssh capability, right? If not, you may want to go back to the build page and try again. It will save you time in the long run.

Let’s begin.

Install php:
sudo apt-get install php5
sudo apt-get install libapache2-mod-php5

Then restart apache
sudo /etc/init.d/apache2 restart

Verify that everything in Apache is working okay by creating a web page that will give you php and server information. Open a test.php file: (http://us3.php.net/phpinfo)
sudo pico /home/flickrframe/flickrframe/htdocs/test.php

Type:
<?php phpinfo(); ?>

Then hit ctrl-x and type y to exit and save.

If you go to the ip address using a web browser you should be able to see the php page working.
http://<yourpictureframeip>/test.php

Your results should look like this.. without the Thai Spicy Peanut BBQ though.

So, now that we have php working, now what. If you are feeling a little worn out, after that technical overload, go take a break. Myself, I am getting some Ice Tea. The best Ice Tea in the world… to me. I’ll be back in a second.  Once you are well rested we can continue.

Create a symbolic Link:
http://en.wikipedia.org/wiki/Symbolic_link

ln –s ~/images ~/flickrframe/htdocs/slides
The ~ or tilde is a representation of the home directory. If you are anywhere in the directory structure you can type cd ~ and it will take to your home directory. Go ahead, try. I will wait.

Back on track…

Basically I am creating a shortcut to the images directory so it is available within the context of the web server. If I go to the web frontend by going to:

http://<yourpictureframeip>/slides/ It should list all of the photos in the slideshow. Just links, no pictures yet.

At this point we have the php working and a link to the directory of the images that appear in our slideshow. Now all we have to do is work a little php magic to make them viewable and clickable.

Install the GD Library
First you need to install the GD library. Here is more info http://www.boutell.com/gd/
sudo apt-get install php5-gd

Edit the time out settings for php scripts, otherwise your page will time out when you try to create the gallery.
sudo pico /etc/php5/apache2/php.info

Go down to the line that says:
max_execution_time =
change the value to 120

Ctrl-x to save and exit.

add the php script
I found this script on WebCheatSheet.com. I found it using google.
http://www.webcheatsheet.com/php/create_thumbnail_images.php

Copy and paste the text into a file called creategallery.php and save it to your htdocs directory. You will need to change a few variables in there to make it work.

Specifically:
In the first function, createThumbs, you will need to change the paths to the directories. For me, they looked like this:

createThumbs(“slides/”,”thumbs/”,100);

This is creating 100px thumbnail images of everything in the slides directory and putting them in the thumbs directory.

Further down in the function createGallery, you will need to change the paths too. For me, they looked like this:
createGallery(“slides/”,”thumbs/”);

This runs through the list of JPGs and creates a listing with the source picture in slides and the thumbnails in thumbs.

Run the Script
Now create the gallery using the web interface:
http://<yourpictureframeip>/creategallery.php

The page will slowly list all of the pics in the directory, at the end it will say Creating gallery.html

Once it is done:
http://<yourpictureframeip>/gallery.html

You should have a nice little clickable thumbnail gallery of all of your images that normally appear in your picture frame. My pictures are a mixture of my own and a random selection of interesting. Good luck.

 

 


blog comments powered by Disqus
Last Updated on Tuesday, 02 February 2010 09:58
 

Side Dishes

Art

Photos by Brett Deering

Jim Matlosz, DP

Design Glass on Etsy
Glass Tile by Stacey Stoll

2monkees  on Etsy
Art by Teri

Blogs

What is Laird Drinking Now?

J-P-G

ffffound

Hello, Romantic

Stare Hard

Words

PDX Pipeline
Various Dishes from around Portland

Ministry of Imagery
He does that verb to your nouns

Jerk Ethic
Looking for work in this town is a full-time job

Vanta-c
One woman's journal across something

Backfencepdx
6 people, 6 stories, 6 minutes each

Shows I missed
but probably should have seen

Like it
You can too.

Food

Yummerdoodles
Real people reviewing food, in Portland, Oregon

 

Main page Contacts Search Contacts Search