Friday, October 23, 2015

Boring Data Can Be Fun

I was helping out with a site redesign and found a document in the assets that was a poorly formatted table of times to help a bicyclist calculate their speed on a known course.  It looked like it had been hit with the 'ugly stick'.

I thought, "this could be used to make something interactive and fun" and so I put together a little demonstration of what I mean: an interactive calculator with a sense of humor.

In a nutshell, it is simply an HTML 'range' element or slider that triggers the display of the corresponding speed. The widget displays the same information as the table, but some styling makes it look nice.

Normally, the slider is restricted to a reasonable range of values (who can typically bicycle comfortably at speeds greater than 30 mph?). But allowing people to make silly choices gives an opportunity for education and fun and so we display various 'speed' facts from Wikipedia as the speed gets higher.

The widget also offers links to rides of the indicated speed if you have a back-end that supports it (e.g., Drupal).

You can find the code on GitHub and test drive it/play with it on JSFiddle as well. Now I have to figure out how to tie those two together :)


Labels: , , , , , , ,

Tuesday, October 20, 2015

Hacking the Internet Archive - Managing Contributions

When it comes to online content management, we've come a long way since the early days of videoblogging. In particular, there are now quite a few tools to manage your Internet Archive contributions and many old ones have changed.

Here's a list of ways I am aware of to create, upload, edit, update and remove archive.org items and their metadata:

  • FTP - use tools like filezilla or cyberduck to manage your content. No longer used for downloading and it appears that uploading may no longer be supported. I have yet to find an official announcement of that yet.

  • www.archive.org - web forms to manage your content and your metadata. These forms have gotten easier to use over time and allow you to do lots of cool things. On the other hand, I hate forms.

  • s3.archive.org - a powerful interface similar to the Amazon web service. For the truly geeky at heart.  Mainly useful to programmers.  Not so much code as a standard to make calls against using tools and libraries like 'curl'.
    Python interface - built on s3.archive.org, used with curl and programming languages, powerful but very geeky. Mainly for programmers, but can be used at a higher level to make cool scripts or use within other applications. Also a great way to learn about the internal working of the Internet Archive and the Python programming language.

  • ia command line interface - based on the python interface, great for managing lots of items and their metadata, powerful, easy to install and use, geeky, but not too geeky. Works on mac, pc and gnu/linux. I really like this tool. Open source.

  • other libraries and interfaces, such as @diffalot's gem at https://github.com/diffalot/archive

  • various desktop clients - can be easy to use, there have been many, they come, they go, commercial and open source projects

Recently, I've been using and studying the ia command line interface and it is a great tool.

We'll take a look at using the Python-based command line interface in the next several posts to learn more about Internet Archive features and capabilities that we can use to do cool things with our content.

Labels: ,

Hacking the Internet Archive - Python

Python is a popular programming language, used in many situations these days.

Some wonderful folks have created a powerful command line interface to the Internet Archive that is built using Python.

We will talk about installing the 'ia' tool in the next post.

But first, we need to have a compatible version of Python on our computer in order to install and use the 'ia' command line interface. So that't the purpose of this post: just make sure python is installed.

This was easy on my Ubuntu servers. I already had Python 2.7.6 installed and that works fine for now. I may upgrade this, but I was able then to proceed with the 'ia' installation after that and, as they say, "if it's not broke ...".

My older MacBook with OSX 10.6 already had python 2.5 installed and in use. This would not install ia when I tried it and so I thought it would be best to upgrade python. The current version of Python is 3.5. You can install 3.5 alongside 2.5 (do not remove the older one! your mac needs it). Just visit python.org and download their Mac installer version. Once it is installed, you must type 'python3' in all instructions where you see 'python'. I was able then to proceed with the 'ia' installation after that.

On my Windows 7 box, I installed python via the python.org windows installer, which I downloaded and ran. On windows, you need to add the python install folder to your Path environmental variable (right click on your 'Computer' icon, select 'Properties', then click 'Advanced System Settings', then 'Environmental Variables', scroll to and select 'Path' in lower 'System Variables', double click to edit. Add a semi-colon (;) and then the new path to your python install directory binaries.

On windows, type 'py' to run python. On 'mac', type python3. Just type 'python' on Ubuntu. In all cases, you should see something like this:

Once you verify that python is running, you can either play around and type things like 'print(1+1)' if that gets you exicted. Type a 'Ctrl-D' ('Ctrl-Z' on windows) to exit or type 'exit()'. I guess everything is a function in python. :)

Learning the 'ia' tool will give us an opportunity to learn more about python as we continue out explorations.

If you want to learn more about python, check out this cool learning guide that is also on GitHub.

Labels: ,

Monday, October 19, 2015

Hacking the Internet Archive - Icons

The Internet Archive has some cool new glyphs like this:


iconochive-logo

iconochive-audio

iconochive-movies

iconochive-software

iconochive-texts

iconochive-etree

See their post Customized font with Glyphs!.

You can use them too! Like I did here. I just inserted a link to the Internet Archive's style sheet into my blogger template. :)

Labels: ,

Friday, October 16, 2015

Hacking the Internet Archive - URL's

I've been playing around with the Internet Archive again lately.  I though it would be fun to share some of the things I have discovered along the way and so I intend to write up a series of posts on "Hacking the Internet Archive".

By hacking, I mean using various archive.org tools, api's, tips and techniques to do some cool things with your media.  While many of these are documented, many are not and so I'll use these blog posts to share what I find.

To start out, I decided to poke around inside the HTML source code for a details page, In this case a simple image upload.


Using the browser's 'Inspect element' or 'View source' commands, we see something like this (image is example from Chrome desktop browser):



One thing to notice, is that archive.org is now using jQueryBootstrap and other interesting frameworks. Fun stuff! We'll come back to that in a later post.

When the detail page is for a book (mediatype: texts), there are lots of interesting things to say. I'll devote an entire post or two to this topic.

An easy thing to do in most browsers is search for the detail's identifier, preceded by a slash to find interesting url's related to the archive.org item.  Here are some that I found so far:


Some of these url's, such as '/edit' and '/manage' assume that you are already signed in.  They are used to edit the metadata or manage the files using the IA admin pages.  More on these features later (boy! are we gunna have a lot of follow-up posts).

The item home page is located at '/details', followed by the unique id for your archive.org upload item.  By default, archive.org shows single images in the 'theater' area of the page if it can find one.

If there are multiple images, archive.org inserts a bootstrap slide carousel.  If the item is a 'book' (texts), archive.org inserts a book reader.  Video and audio also have players associated with their details page.

BTW, here is the full list of archive.org media types as show in the media type select pull down on the archive.org advanced search page (/advancedsearch.php):

Notice that you can get a thumbnail, if it exists, using '/services/img'. Here's an example: I simply asked blogger to insert an image from a url, then typed in 'http://archive.org/services/AliciasShoes' and presto!

I wonder what other services there are?

You can access a specific file by using '/download'. This is useful for image or video 'src' attributes, 'json' data and more.  Here's an example:


I have not made use of the '/compress' feature yet, but it looks handy. More to come on that one for sure.

I'm not sure what '/embed' does at this time. I think it is for embedding an iframe into another webpage, but it seems to be broken as of this writing. :(



That's the iframe above, that big white space. The main div inside the embed appears to be empty on this and other detail pages I have tried today.

Ok, that's it for the first post. Just a simple introduction to some important features. In future posts, we'll look at some cool tools for working with the Internet Archive and some ways to use them to create some interesting web pages.

Labels: , , , ,