Cue the music… the truck is rolling through your neighborhood, blaring the music, here to deliver random images to all the kids– and the truck is fueled by json.

THE SPLOT TRUCK IS HERE!

This could be a way for the TRU Collector SPLOT to provide random images that might one day, be an alternative source than flickr for both pechaflickr and Five Card Photo Stories. This would take away concerns over the using flickr as a source (it comes up legit as a question for teachers), but more if you wanted a way to manage the pool of photos without a third party host.

It started with a tweeted question from my pal @dogtrax.

I had a hard time this morning connecting the dots to what Kevin was referring to (maybe not yet enough coffee), but then realized maybe it was this nifty service Lorem Flickr which you can use in HTML anywhere it wants an image, and it serves up CC licensed ones from flickr.

For example, using the URL in an img tag will give a different dog each time, 640×480 pixels in dimensions:

random dog from flickr

The code for this is

That’s pretty nifty, right? Random dog photos. The options on Lorem Flickr let you do a few more tricks.

I had used it for a #netarr activity that maybe did not even get used, something I toyed around with for a site that generated a random character with random information using like 4 different services, all done in the browser.

Characters Cubed- A #NetNarr Experience (Proceed if you dare)
An experimental site to generate characters for Networked Narratives.

Then I thought about a playful site I did to with a free domain I got from Reclaim Hosting (it was for coming up with an original domain)

That site uses server side scripting to rewrite the web site every hour; it does some flickr API calls to find photos at the bottom of the interesting list and key words of “dull” or “boring”, and retrieves info on the last 10 photos by the same person.

sample photo pulled up for a lesser known photographer on flickr, actually the photo here is quite good, a

That could work, with bit of fiddling to do one every day to change it up (via a server cron script), to be a random prompt kind of site that automatically updated itself.

And then another memory- I had started work to add some custom endpoints to the WordPress API so any site running the TRU Collector theme to be the source of random images.

You can see what the special endpoint does (the built on WordPress ones do not do random selection of content), by using a URL on the SPLOT TRU Collector demo site like:

http://splot.ca/collector/wp-json/splotcollector/v1/randy/12

The number at the end tells it how many images to send back data for. I’m able to return a number of useful bits of info for the entry at http://splot.ca/collector/45/

Including title, url for the page with the image, who contributed to the site (hey, that’s me), and URLs for a thumbnail and large size images.

This is done in the SPLOT site by registering a new endpoint for the API.

which define the URL path and the last parameter as a variable for the number of images. The callback function retrieves the data to send back.

I then started tinkering with a simple site to get one random image via JSON and display it (using the ever useful Backstretch.js to fill the screen).

See it in action first at http://lab.cogdogblog.com/randysplot/ (you will of course get a different image than this one… just reload to swap in a new one).

Cannot describe image because it's randomly loaded, but at the bottom is a text box with its title, link to original, and reuse license
Random image pulled via browser script from http://splot.ca/collector

The HTML is basic, just place holders for content loaded down below it.

We lazily load in from remote libraries a jquery library and the backstretch.js code:

The work is done in jQuery code. We define a source site for the SPLOT, set up a function to populate the in page content, and then use an Ajax call to get the remote data (likely needs some error checking in case it get nothing, hey this is a beta version).

This was a good practice to do some basic random image fetching. The part I need to figure out next to make a pechasplot demo is figuring out in the WordPress code to create the custom API endpoint, how to have 2 variables in the URL (one for number of images to get and another to limit by tag).

Here the SPLOT truck? It’s full of random images to deliver.


Featured Image: Added SPLOT logo and some json code to The Super Green Lime Ice Cream Truck flickr photo by Señor Codo shared under a Creative Commons (BY-SA) license

If this kind of stuff has any value, please support me monthly on Patreon or a one time PayPal kibble toss
Profile Picture for Alan Levine aka CogDog
An early 90s builder of the web and blogging Alan Levine barks at CogDogBlog.com on web storytelling (#ds106 #4life), photography, bending WordPress, and serendipity in the infinite internet river. He thinks it's weird to write about himself in the third person.

Comments

    1. Thanks, Unsplash is a great source of open licensed images indeed. I did not know about the random link, that’s handy.

      My experiments are aimed at someone who may want to have a controlled/managed set of source images.

Leave a Reply

Your email address will not be published. Required fields are marked *