cc licensed ( BY ) flickr photo shared by cogdogblog
The StoryBox project will end its gathering of media at the end of 2011, so there is still time to share any media before the time capsule closes- see http://cogdogblog.com/storybox for ways you can drop media files.
During my 15,000 mile, 5 month 2 country, 29 state/province travels I collected a Shareskian “wack sock” of media- 1230 image, video, audio, document files:
- audio recordings: 127
- documents: 18
- music: 41
- photos: 891
- videos: 147
- remixes: 6
And there is room for more! But to keep it true to the time capsule concept, the last media I will add will have to get to me by Dec 31, 2011 (at 12:59:59)
What happens then? My plan is to return all of this content online, in a yet to be created web site that would allow, ideally, people to add tags/descriptions to help characterize the content and use tools to build new content out of that (e.g. remixes). I am hoping this is something that Omeka might provide (expect an email soon, Patrick! I might need help).
I realized early that the default file list view might be unwieldy, so from the start I have been moving content into subdirectories by media type. Still, even shorter file listings are hard to scan, so over the last few months I have been creating graphic browsers for the media types.
I did find that the single view of 800 icons for the photos was a drag to load (e.g. when I had Vicki Davis’s students all hit the box at the same size, that won for a PirateBox stress test), so I have been adding a paged pagination, involving some dusting off of my Javascript skills- because the PirateBos is a python based server, and I neglected to learn python, andy interaction I have done has been in HTML and JavaScript – but I have a lot of things humming now.
For the photos I run a local php script on the mirror of the StoryBox on my laptop; this script (based on one from WebCheatSheets) is used to generate 800px preview and 100px thumbnail copies of all photos. What I do is have a directory for new photos I plan to make thumbnails for, and another one to write the new files to (“thumbs”), and this make_thumbnails.php script at the top- I can call it from a localhost/makethumbs.make_thumbnails.php url on my machine:
";
// load image and get image size
$img = imagecreatefromjpeg( "{$pathToImages}{$fname}" );
$width = imagesx( $img );
$height = imagesy( $img );
if ($width > $height) {
// calculate thumbnail size for landscape orientation
$new_width = $thumbWidth;
$new_height = floor( $height * ( $thumbWidth / $width ) );
} else {
// calculate thumbnail size for portrait orientation
$new_height = $thumbHeight;
$new_width = floor( $width * ( $thumbHeight / $height ) );
}
// create a new temporary image
$tmp_img = imagecreatetruecolor( $new_width, $new_height );
// copy and resize old image into new image
imagecopyresized( $tmp_img, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height );
// save thumbnail into a file
imagejpeg( $tmp_img, "{$pathToThumbs}{$fname}" );
}
}
// close the directory
closedir( $dir );
}
// give php extra elbow room
ini_set('max_execution_time', 0);
ini_set('memory_limit', '-1');
// call createThumb function and pass to it as parameters the path
// to the directory that contains images, the path to the directory
// in which thumbnails will be placed and the thumbnail's width.
// We are assuming that the path will be a relative path working
// both in the filesystem, and through the web for links
createThumbs("./new/","./thumbs/",100, 100);
// now use the same function to make the preview size versions
createThumbs("./new/","./previews/",800, 600);
?>
Anyhow this creates a 100px preview and a 100px thumbnail for all of the new images to process.
The way all of my browser directories work is I run another local php script that generates a _gallery.js data file, which is just file to declare an array of all file names for each document type. I can then reference this in any web age as a way to have access to all of the content types. Each time I recreate the data file, I shuffle the file names so it makes the content more random.
For photos, the gallery looks like this; it presents 80 thumbnails at a time:
and clicking any thumbnail presents the 800px preview in a thickbox overlay:
It might be hard to see in that screen shot, but at the bottom are “next” / “back” link so you can wade through the images like a slideshow, and there is a “random” link to pick a random photo. And there is another link to download/view the full size original.
I’m still tinkering to get the thickbox placed right on a mobile browser.
I began to think a few weeks ago that I could do this for all of the media types, if I found a way to generate thumbnails for any kind of file. I tried a few apps, and did not get far, but through some googleing I found a command line interface that uses the built in thumbnail generator the OS X finder uses- qlmanage. I found some sample scripts from superuser that I mamanged to do a few one at a time, but thought this could be batched.
I mucked around a bit with some shell scripts- one challenge is that file names with spaces in them cause problems; with some more poking around the internet, I found a one lin script- mine is called “makethumbs.sh” and I have that in a directory with the source files in a directory called “new” and a writable directory named “thumbs” for the icons to be created.
#!/bin/bash
find ./new -type f -print | while read i; do qlmanage -ti "${i}" -o ./thumbs; done
I am not even sure I can explain it, but it works!
So I put all files I need to create icons for in one directory:
I open terminal, type cd and drag the icon for the containing folder so I get to the local directory, and then just run:
sh makethumbs.sh
It generates progress statements as it does its work, and I get a set of 110px thumbnails for all document, video, graphic files:
So my new video page has thumbnails for each video:
Each thumbnail links to a thivkbox overlay that plays the mp4 using the JW Player (which should provide flash and HTML playback):
It features the same navigation and random link option as the photo browser.
I was able to do the same kind of display with the documents, except the thumbnails simply link to the file, but ti works for pdf, rtf, txt files I have collected:
The last browser is for the remixes, which for now are either mp4 videos or gifs (the animated kind). Tis required a little more mumbo jumbo to do the right kind of embedding, but it works with both media types:
so a video would load with the JW Player, but an animated gif appears with an IMG tag. This is one I made from a series of images I took at the Durnin farm
The last one I need to do is for the audio files; there are no relevant icons, so I may do a generic one and list the file name in the playback browser.
I’m still tinkering with this, but now that I have all of the media types in a single .js file, I have been able to create basic HTML pages that display one at random, which can be called from any web page I create via a link, or used in the chat for an activity.
I’m also confident I can create a simple version of Five Card Flick Stories that can run on the StoryBox- it would not be able to write/save any stories, but could provide the HTML to upload to the storybox as a final– yes, I think that would work.
I am having a lot of fun with this- and I wish I could thank people who regularly sent me stuff. Like GNA who kept a steady stream of videos and audios in her travel, Giulia Forsythe who submitted lots of drawings and the first remix, Bryan Jackson and Grant Potter for their recorded music, Leslie for her lovely PirateBox song, Andy Forgrave for a variety of files — and everyone else along the way who clicked the “upload” button (I am forgetting a lot of you, sorry).
This is more fun than canines should be allowed to have.
