In a spreadsheet... we put a formula in the cell that will ultimately hold an answer...
Change any referenced cell and the value is recalculated. We change A1, then C1 is recalculated...
We change B1... and C1 is recalculated...
If we wanted to represent this same behaviour in javascript... it all happens back to front. We wouldn't add any code to the C1 item at all. Instead we add code to the referenced cells, A1 and B1. We do this by adding our old friends, 'event handlers'.
A1 | | B1 | | C1 | |
18 | | 24 | | 42 | |
OnChange='Calc_c1();' | | OnChange='Calc_c1();' | | | |
Function:
|
function Calc_c1() {
var a1 = document.getElementById('A1');
var b1 = document.getElementById('B1');
var c1 = document.getElementById('C1');
c1.value = a1.value + b1.value;
}
|
(Okay okay... in practice it's trickier than that: you first parse each 'cell' into an int or float, and remember to treat blank strings as zero... but I digress...)
You also use a similar 'event-driven' approach in a windows forms program, such as Visual Basic or Delphi.
So, to get the sort of function that an excel user takes for granted, a javascript or windows programmer has to put event handlers all over the place...
Now, what I'd like to play with is a programming tool that uses the back-to-front-spreadsheet model of programming and yet is nothing like a spreadsheet.
I'm picturing a wiki-style webpage, where you can edit the content of the page. But you can also attach 'spreadsheet-style Formulae' inside controls. Or even inside the text of paragraphs.
Here's a dirty mockup, or 'DMU' as i like to call it. (It's a conceptual mockup only -- it doesn't actually do anything)
You have to mouse over the elements in the above panel to understand the mockup. The paragraph that says "Total 482", for example, is named "p9" (because it is the ninth paragraph) and contains a formula that says "@Sum(t1..t3)" , meaning, "Add up the value of the three text boxes".
Okay -- so what I've got is a panel where each element is automatically given a name, much like the way cells in a spreadsheet are automatically named.
(Perhaps you could also give an element a custom name, say that second textbox might be named 'RentTextBox')
On mouseover you can see the name and formula of an element. (Perhaps it would be shown in a textbox fixed to the top of the screen, in much the same way a spreadsheet shows the current cell's content or formula at the top of the form.
If you click on a formula you can edit it, or even possibly break it into more elements.
When you click in a textbox you would be able to select it's value. But if you press "F2", you would instead see the underlying formula, (if there is one).
Finally, you can edit the whole page at once by clicking a button -- much like how 'edit' works on a wiki page.
If it was working as it should, then clicking on the edit button would show a textarea containing this text:
The following paragraph contains an embedded function.
Mouse over this @p2.Type to read @p3.ToLower(). @p4.ToSentence()
THE FORMULA
or click to edit
[124]
[201]
[157]
__Total: @Sum(t1..t3)__
Notice that text boxes are represented very simply using square brackets. I know that clashes with some existing wiki standards, but i have to say i really don't care.
Notice also that the deault numbering scheme is one-based, not zero-based. Again, I really don't care.
I can't schedule in time to do a better demonstration of this idea until, say 2041. But if you have time to work on it, I've got a fairly decent spec underway, so ask for details.
Also -- i call this thing "Functional Text Language" -- or "FTL" for short, which is of course a sci-fi term for "Faster Than Light" (Travel). I've been watching a lot of Battlestar Galactica recently. My wife is a huge fan
Here's how you'd use FTL to represent other elements, with and without functions and values:
Okay, that's my esoteric idea of the week. Give it a go if you can!