Javascript widget

Using a custom callback function

The API for retrieving commands encoded into JSON also allows a custom callback function to be specified. When this is done, the response is javascript that executes the callback function, passing in the JSON-encoded command set as an argument. This is convenient for use in <script src="..."> tags.

Specify the callback function name at the end of the URL:

http://www.commandlinefu.com/commands/by/root/json/<callback>/

where <callback> is your callback function.

For example, making a request to the URL

http://www.commandlinefu.com/commands/by/root/json/load_into_page/

returns

load_into_page([{"id":"13","command":"sudo !!","summary":"Run the last command as root"...}])

The definition of the callback function load_into_page is up to you: you're free to do what you want with the JSON-encoded commands. Note that namespaced callback functions (of the form namespace.callback) are also supported.

Embedding your commands in your blog/homepage

Using the above callback mechanism, it is easy to embed your commands into your blog using the following javascript:

<script type="text/javascript" src="http://www.commandlinefu.com/commands/by/root/json/clfwidget/"></script> <script type="text/javascript"> function clfwidget(commands) { var commandsHtml = []; for (var i=0; i<Math.min(5, commands.length); ++i) { var command = commands[i].command; var summary = commands[i].summary; var url = commands[i].url; commandsHtml.push('<li><a href="'+url+'">'+summary+'</a><br/><code>$ '+command+'</code></li>'); } var listHtml = '<ul>'+commandsHtml.join('')+'</ul>'; var widgetHtml = listHtml+'<p><a href="http://www.commandlinefu.com">commandlinefu.com</a></p>'; document.getElementById('commandlinefu_list').innerHTML = widgetHtml; } </script> <div id="commandlinefu_list"></div>

Simply paste the above into your page source and set the URL of the second script tag to point to your own command set.

The above javascript simply iterates through the first 5 commands, and injects an unordered list into the div with id "commandlinfu_list".

Collaborate…

The latest version of the above javscript widget is hosted on github to allow other collaborators to get involved. The URL for the project is http://github.com/codeinthehole/commandlinefu - send a quick email to widgets@commandlinefu.com to be added as a collaborator.