I saw Martin Weller’s tweet out for a randomizing text generator:

He got lots of replies (which is what make twitter useful when often it can not be), though many were just offering tools, not necessarily web producing ones (cough Excel).

Were I not busy with other tasks Sunday, I would have liked to not only a suggestion, but better yet, to whip up a prototype.

I had pretty much done what Martin asked for with my Make a MOOC generator.

Ths enerator creates a random name for a MOOC, for example
"To Autonomous Marxism: In The Writings of the Blessed John Henry Newman #tam19"

It’s done in PHP though, so likely knocks out for being “idiot proof”. I was pretty sure the way that one works, though (a few arrays to hold the list of phrases and a constructor that pulled that at random), could be done all in Javascript in an HTML file.

By then Martin had gotten one going using a web tool I love, glitch, and he already blogged it (one of many reasons I respect and like Martin).

It works, so I could have just moved on to the day. To me it’s a bit scrunched on a phone, and I could not help but wonder if it could be done another way. I gave myself an hour over breakfast to put the edtechaphor together:

A random metaphor generated "Use raising a puppy as a metaphor got connectivism"

I’ve been using Bootstrap already for another project, so it’s fresh in my mind. It not only gives you everything in a single index.html file (loading the scripts and styles via hosted libraries) but a lot of styles, grids, components to put into the mix.

This just uses the jumbotron for the metaphor and a button. I added to be fancy a background using the fantastic (also remotely hosted) Backstretch.js which magically fills the background with a specified image.

Just for fun, I searched for open licensed images on terms crazy machine and one near the top was one by my photo friend Michael Coghlan!

The whole thing (meaning one HTML file and the background image) is on github so it can be used, forked, but also as above, hosted there. I just put the custom styles and scripts right into the HTML file. A “proper” coder might have insisted on storing them in external folders tucked under an assets directory. Poo.

As far as how it works, the functionality is tucked into the bottom of the HTML file in a script tag. I went to the source of Martin’s glitch code to get the array of phrases he used, but hey, the function was there too that assembled it on his site, so I borrowed it too (rewriting little bit to use jQuery).

So there are 2 arrays for the possible choices of metaphors and technology. The only gotcha is making sure there are no apostrophes inside (if so use \'). I added a few for fun.

What I do like are the array of “options” which offers 3 different ways to construct the sentences. So what generate() does is randomly pick one of the 3 options, and in those, it inserts a random analogy and a random tech. It puts it into the h1 header with an id of metaphorical (which starts empty).

Then to make it work, we call the generate() function when the page loads and each time the button is clicked.

After I tweeted the link Martin’s way, in a flash he had it running in a subdomain.

And properly updated with a background image of the super dog Teilo.

Then the fun begins.

You cannot go too wrong with stuff that generates random stuff. That’s what’s in my transcript.

Give Martin’s generator a spin at http://metaphor.edtechie.net/ — and if you want to make your own, just grab the code and spin it up.


Now Martin can generate in German!

Featured Image: Image by Dean Moriarty from Pixabay (sort of public domain license) modified with Wikimedia Commons image Martin Guitar Logo also public domain.

If this kind of stuff has value, please support me by tossing a one time PayPal kibble or monthly on Patreon
Become a patron at Patreon!
Profile Picture for CogDog The Blog
An early 90s builder of web stuff 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. And he is 100% into the Fediverse (or tells himself so) Tooting as @cogdog@cosocial.ca


    1. That’s a way more useful approach, would like to maybe roll it into one. Perhaps the parameter to load could either be a google sheet id (for this way) or a url for a json data file? And then we just need a way to include a link to a background image, and no one would ever need to fiddle with the site code.

      Thank for riffing, John.

Leave a Reply

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