First off, a big thank you to Jeremy and the community bringing us TW. I
use it every day.
I have several HTML calculator forms in TWC that I am trying to migrate to
TW5. These forms take input and calculate return value(s) using inline
Javascript. Since inline Javascript is no longer allowed in TW5, I am
struggling to recreate this functionality. I tried this method in TW5:
1. Tiddler AverageHoleDiameter
|calculator|k
|d|<$edit tiddler="AverageHoleDiameterData" field="d"/>|
|t|<$edit tiddler="AverageHoleDiameterData" field="t"/>|
|a|<$edit tiddler="AverageHoleDiameterData" field="a"/>|
|α|<$edit tiddler="AverageHoleDiameterData" field="alpha"/>|
|D,,avg,,|<$macrocall $name="averageHoleDiameter"
d={{AverageHoleDiameterData!!d}} t={{AverageHoleDiameterData!!t}}
a={{AverageHoleDiameterData!!a}} alpha={{AverageHoleDiameterData!!alpha}}/>|
2. Tiddler AverageHoleDiameterData
Holds field data. Separate tiddler to avoid losing input focus on re-render.
3. Macro $:/.jb/modules/macros/averageHoleDiameter
(function(){
exports.name = "averageHoleDiameter";
exports.params = [
{name: "d"},
{name: "t"},
{name: "a"},
{name: "alpha"}
];
exports.run = function(d, t, a, alpha) {
if (d && a && t && alpha) {
var b = (a - d) / 2 / Math.tan(Math.PI * alpha / 90);
if (b < t) {
// not knife edged
var davg = d + Math.pow(a - d, 2) / 4 / t / Math.tan(Math.PI *
alpha / 90);
} else {
// knife edged
var davg = a - t * Math.tan(Math.PI * alpha / 90);
}
return davg.toFixed(3);
} else {
return "";
}
};
})();
This works, but it seems very hackish (requires 3 tiddlers per calculator).
Is there a cleaner way to implement forms with Javascript calculated return
values in TW5? Could I encapsulate the entire form in a widget?
I would love to make a generic calculator widget, which takes JSON
definition of inputs, outputs, and logic as parameters and renders the
form. Something that could be called like:
<$calculator
inputs="""[
{name: "Hole diameter", variable: "d"},
{name: "Sheet thickness", variable: "t"},
{name: "Countersink diameter", variable: "a"},
{name: "Countersink angle", variable: "alpha", defaultValue: 100}
]"""
outputs="""[
{name: "Countersink depth", variable: "b"},
{name: "Average hole diameter", variable: "davg"}
]"""
logic="""
if (d && a && t && alpha) {
var b = (a - d) / 2 / Math.tan(Math.PI * alpha / 90);
if (b < t) {
// not knife edged
var davg = d + Math.pow(a - d, 2) / 4 / t / Math.tan(Math.PI *
alpha / 90);
} else {
// knife edged
var davg = a - t * Math.tan(Math.PI * alpha / 90);
}
} else {
return ;
}"""
/>
This is where I'm in over my head. An ideas for a simpler implementation?
Thank you,
Jared
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.
