Template:Calculator/doc

From Festipedia, hosted by the FR Heritage Group

This template is for creating interactive calculators. It requires the calculator gadget. You must not have opted out of the calculator gadget for this to work.

You can use this template multiple times on a page to make input widgets, with some of the widgets having formulas based on other widgets, like a spreadsheet.

You can use {{Calculator label}} to mark text as a label for a calculator widget.

Example[edit]

{{calculator|id=a|default=2|size=4}} × {{calculator|id=b|default=2|size=4}} = {{calculator|id=c|formula=a*b|default=4|size=8|readonly=true|type=text}}

produces:

2 × 2 = 4

BMI calculator metric[edit]

{| class="wikitable" style = "float: left; margin-left:15px;"
|+ Metric
|-
| {{calculator label|Weight|for=weightkg}} || {{calculator|id=weightkg|size=3}} kg
|-
| {{calculator label|Height|for=heightcm}} || {{calculator|id=heightcm|size=3}} cm
|-
| BMI || '''{{calculator|id=bmimetric|type=plain|formula=round(weightkg/pow(heightcm/100,2))|style=min-width:3ch;display:inline-block}} kg/m<sup>2</sup>'''
|}
Metric
Weight kg
Height cm
BMI kg/m2

BMI calculator imperial[edit]

You can put widgets inside tables:

<table class="wikitable">
<tr><td>Imperial</td></tr>
<tr><td>Weight</td><td>{{calculator|id=weight|size=3}} lbs</td></tr>
<tr><td>Height</td><td>{{calculator|id=heightFeet|size=1}} feet {{calculator|id=heightInches|size=2}} inches</td></tr>
<tr><td>BMI</td><td>'''{{calculator|id=bmi|type=plain|formula=round(100*weight*703/pow(heightFeet*12+heightInches,2))/100}} kg/m<sup>2</sup>'''</td></tr>
</table>
Imperial
Weight lbs
Height feet inches
BMI kg/m2

Formula[edit]

Formulas use normal math syntax, with english words representing other input boxes. e.g. sin(1+foo*2) would multiply the foo box by 2, add 1 and take the sine of the whole thing. All calculations are done using IEEE 754 double precision floating point numbers.

Operators supported include: +, -, *, ×, /, ÷, % (percent is the modulo operator). Exponentiation must use the pow() function.

Math functions supported include: 'abs', 'acos', 'acosh', 'asin', 'asinh', 'atan', 'atan2', 'atanh', 'ceil', 'cos', 'cosh', 'exp', 'floor', 'hypot', 'log', 'log10', 'log2', 'max', 'min', 'pow', 'random', 'sign', 'sin', 'sinh', 'sqrt', 'tan', 'tanh', 'trunc'

These have the same definition as in javascript. In particular, that means that log() is log base-e. The exception is round, which we use our own definition of

The following additional functions are supported which are not from javascript Math library:

  • ifzero - if first argument is epsilon away from zero, return second argument, otherwise third argument
  • ifnan - if first argument is not a number (NaN), return second argument, otherwise third argument
  • iffinite - if the first argument is finite return second argument, otherwise return third argument.
  • coalesce - return the first argument that is not NaN.
  • ifpositive - if first argument is ≥ 0 return second, otherwise return third. (Note this tries to account for floating point error)
  • ifequal - If first and second argument are the same, accounting for floating point error.
  • round - A round function. Unlike javascript round(), this implements round half away from zero ("commercial rounding"). It takes an optional second argument to say how many decimal digits to rount to. e.g. round( 3.125, 2 ) = 3.13, round( -3.125, 2 ) = -3.13.
  • jsround - Use javascript round. This does round half towards positive infinity with a precision of 0. See mdn docs

Numbers can be integers, decimals or scientific notation. For example: 1, 2.84543, 3.12E6, -5, 3.45×10⁻⁴⁵

The following constants are supported: Infinity, -Infinity, NaN, pi, π, EPSILON

At the moment, relational operators like ≤ or ≠ and IF statements are not supported. This might be added in a future version if needed. This can be worked around by using ifzero and ifpositive functions.

Fallback[edit]

Users who do not have the gadget enabled or have JS disabled, will not see the input boxes. Instead they will just see the default value for each box. With a good choice of default, this can be sufficient.

For example, if you have ''sin({{calculator|id=sine|type=text|default=0.5|size=4}}π)={{calculator|type=plain|default=1.00|decimals=2|formula=sin(sine*π)|id=sineres}}'' to make sin(0.5π)=1.00, the non-js user will lose the interactivity, but they will still see the equation.

If you want more sophisticated fallbacks, you can use the calculatorgadget-enabled and calculatorgadget-fallback CSS classes.

<div class="calculatorgadget-enabled" style="display:none">This text is only shown if the gadget is enabled. {{calculator|type=text|size=20|default=100|id=xyz}} </div>
<div class="calculatorgadget-fallback">This text is only shown if the gadget is disabled</div>

Which produces:

This text is only shown if the gadget is disabled

Template arguments[edit]

Note: Not all arguments work on all input types.

id
The id for this field, used in formulas of other fields (Has to be english characters)
default
The starting value
readonly
Make field read only
formula
The formula to calculate this field. See below for what is supported
type
Type of field. Currently supported are plain, number, text, radio and checkbox. Checkbox and radio can be useful in combination with TemplateStyles.
size
how big to make the input box (In terms of number of letters that can fit in the box)
max
Max number allowed (number type only)
min
Min number allowed (number type only)
placeholder
Placeholder text that shows up light grey when there is no input
step
How big the interval is for type=number inputs
style
Custom CSS to use for the element.
name
When using type=radio, the name of the radio group.
precision
Format field to this many significant digits. (Only works type=plain and type=text)
exponential-precision
Format field to this many significant digits in scientific notation. (Only works type=plain and type=text)
decimals
Format field to this many decimal digits. (Only works type=plain and type=text)
NaN-text
Use this text instead of NaN when result is not a number (Only works type=plain and type=text)

Add a calculator widget to the page. Like a spreadsheet you can refer to other widgets in the same page.

Template parameters

ParameterDescriptionTypeStatus
idid

The id for this input. This is used to reference it in formula of other calculator templates

Stringrequired
typetype

What type of input box

Suggested values
plain number text radio checkbox
Stringrequired
formulaformula

Formula to calculate this field

Example
3*log(a)
Stringsuggested
readonlyreadonly

Make input box readonly to user input

Booleanoptional
sizesize

Size of input box (How many characters it will fit)

Numberoptional
maxmax

max number allowed (type=number inputs only)

Numberoptional
minmin

min number allowed (type=number inputs only)

Numberoptional
placeholderplaceholder

Text to put as a placeholder in empty input

Stringoptional
stepstep

How much to increment a type=number input box

Example
2.5
Numberoptional
defaultdefault

Default value for this field

Stringsuggested
stylestyle

CSS to style the input element with

Stringoptional
namename

For type=radio what group to assign the radio button to

Unknownoptional
precisionprecision

Format to this many significant digits, using decimal notation except for really large numbers [Only applies to type=number or type=plain]

Example
2
Numberoptional
exponential-precisionexponential-precision

Format to this many significant digits, using scientific notation [Only applies to type=number or type=plain]

Example
2
Numberoptional
decimalsdecimals

Format to a fixed number of decimal digits [Only applies to type=number or type=plain]

Example
2
Numberoptional
NaN-textNaN-text

Use this text instead of NaN to signify "not a number". Only applies to format=plain or format=text. Plaintext only; wikitext is not supported

Example
Invalid calculation
Stringoptional