12/14/12

human scripting

When writing the previous post on simulating probability, I wanted to provide interactive widgets so people could actually run the code. The widget would be a simple webpage with the code embedded in the url itself, so I could reuse it in an iframe. I'm sure this exists, but I couldn't find it. The closest I know of is jsFiddle, and my own simple JavaScript eval utility.

A simple idea, but I often forgo implementing such ideas since they take time to code and test, and more than anything they take time for me to context-switch my brain into programming mode and load up all the proper files and command prompts into the proper places.

But recently I've been playing with human scripting, which doesn't require me to context switch (as much). I opened my JavaScript eval utility in a browser, and looking at that wrote down some changes that needed to be made to realize my vision. Here's the script:

[header stuff from template... says to fork https://github.com/dglittle/glittle.org]

- go to glittle.org directory
- make copy of utils/JavaScriptEval
- call it jsEval
- make these changes
    - remove input box
    - make script textbox consume 100% height (like the output)
    - remove the "script" and "output" labels
    - remove the "history" button
    - move the "run >" button between the textareas (where the "<" button is, but at the top instead of the bottom)
    - remove the "<" button
- watch for any changes to the text in the input box,
    if there is a change,
    add a link below the input box that says "get url to this code"
- if the link "get url to this code" is clicked,
    navigate to a new url which is the current url + "#" + url-encoded version of the code in the input box
- when the page loads, check to see if there is a "#" in the url,
    if so,
    then put the stuff after it into the input box (and deal with the url-encoding.. not sure if you'll need to decode it)

- test this
    - run: node _server.js
    - load http://localhost:8080/utils/jsEval
    - enter: print("it works!")
    - click "get url to this code"
    - press run button
    - take screenshot (include address bar)
    - put screenshot in "humanscript/output"

[footer stuff from template... saying to commit, push and make pull request]


I wrote about 26 new lines of HumanScript. Not sure how long that took, maybe 10 minutes. I submitted the job to a mailing list I keep of programmers. Someone grabbed the task an hour later, logged their time on oDesk, and about an hour after that delivered this github pull request.

I looked at this image in the pull request:


It seemed to be working — had the code in the anchor part of the url like I wanted — so I clicked merge in github's interface. Then github automatically rebuilt glittle.org, and when I navigated over to glittle.org/utils/jsEval, I saw this:


I then went to work using this new utility to update my previous post.

So in summary, I wrote an e-mail, continued writing my blog post, later got an e-mail back saying "done", clicked a merge button in some web interface, and then had a working widget.

No comments:

Post a Comment