Scrub values in JavaScript live (opens in new tab)

I did something like this in my presentation[1] about Ember.

It uses Ember.js to maintain the state of the code samples and proved to be very stable. I don't have interactive sliders on specific values, but the code is parsed and run after every character the user types. e.g. you can change the size of the squid on this page[2] and see it reflected immediately on the right.

[1]: http://mutewinter.github.com/why_ember/#/slides

[2]: http://mutewinter.github.com/why_ember/#/slides/data-binding

It isn't really intended for production use. Personally, I plan to use it to tweak values in games I write, because having to alt+tab, find, edit, alt+tab, refresh, restore state for every tiny tweak to the position of a UI element sucks.

This is a development tool :)

I plan to use it to tweak values during game development, so I don't have to edit/reload every time I tweak a number a tiny bit.

The liveness of something like this can be rather useful actually.

I wrote a not-as-fancy "canvas explorer" with a live updating image that you can save snapshots of. [1] Wrote this just yesterday to let me programmatically make images for use elsewhere (I suck at drawing tools.) I'm already enjoying the "liveness" of it and the fact that all images are remembered in localStorage. It's really cool that this is so easy to do with JS.

[1] http://srikumarks.github.com/demos/canvas_explorer/

Plain and simple (if you could ever call it that) exploratory programming? The sort that yields stuff like Jared Tarbell's stuff http://levitated.net/daily/index.html and many Chrome Experiments, etc.

Unfortunately there's no type information in JS, so it's very difficult to extract range data from just the source. Just don't drag it into that range ;)

PS, I'm planning to implement a color picker for strings like 'rgba(200,0,234,0.4)'

Yes, playing with values and seeing the graphical result change is an excellent way of getting the intuition for taught material.

I came across this example (http://www.khanacademy.org/math/statistics/e/exploring_mean_...) from Khan Academy that helps students understand mean and median of a data set. (There are exercises for other summary statistics too.)

Awesome! I'll check it out soon :D

Should be fixed now.