Number Formatter

[kikohs]

Cables has a DateFormatter but no Number Formatter.
I made my OP which is just a simple wrapper around Number.toLocaleString.

Here is the code if you want to include it for everyone.

// See https://www.w3schools.com/jsref/jsref_tolocalestring_number.asp

const inNum = op.inValue("Input Number");
const inLocaleSwitch = op.inSwitch("Locale", ["browser", "custom"], "browser");
const inLocaleString = op.inString("Locale string", '');
const inStyle = op.inSwitch("Style", ["decimal", "currency", "percent"], "decimal");
const inMaxFrac = op.inInt("Maximum Fraction Digits", 3);
const inMaxSign = op.inInt("Maximum Significant Digits", 21);
const inMinFrac = op.inInt("Minimum Fraction Digits", 3);
const inMinDig = op.inInt("Minimum Integer Digits", 1);
const inMinSign = op.inInt("Minimum Significant Digits", 21);
const inUseGroup = op.inBool('Use Grouping', true);

const inCurrencyName = op.inString('Currency Name', 'EUR');
const inCurrencyDisplay = op.inSwitch("Currency Display", ["symbol", "code", "name"], "symbol");
op.setPortGroup("Currency", [inCurrencyName, inCurrencyDisplay]);

const outString = op.outString('Formatted Number');
const outError = op.outBool('Has error');

// Bind functions
inNum.onChange = inLocaleString.onChange =
inStyle.onChange = inMaxFrac.onChange =
inMaxSign.onChange = inMinFrac.onChange =
inMinDig.onChange = inMinSign.onChange =
inUseGroup.onChange = inCurrencyName.onChange =
inCurrencyDisplay.onChange = inLocaleSwitch.onChange = formatNumber;


function clampNumber(n, minNum, maxNum) {
    if (n < minNum) n = minNum;
    if (n > maxNum) n = maxNum;
    return n;
}

function formatNumber() {
    const num = inNum.get();
    const style = inStyle.get();

    let opts = {
        'style': style,
        'maximumFractionDigits': clampNumber(inMaxFrac.get(), 0, 20),
        'maximumSignificantDigits': clampNumber(inMaxSign.get(), 1, 21),
        'minimumFractionDigits': clampNumber(inMinFrac.get(), 0, 20),
        'minimumIntegerDigits': clampNumber(inMinDig.get(), 1, 21),
        'minimumSignificantDigits': clampNumber(inMinSign.get(), 1, 21),
        'useGrouping': inUseGroup.get()
    };

    if (style == 'currency') {
        opts['currency'] = inCurrencyName.get();
        opts['currencyDisplay'] = inCurrencyDisplay.get();
    }

    try {
        let res = '';
        if (inLocaleSwitch.get() == 'browser')
            res = num.toLocaleString(undefined, opts);
        else 
            res = num.toLocaleString(inLocaleString.get(), opts);
            
        outString.set(res);

        if (outError.get())
            op.setUiError("format_error", null);
        outError.set(false);
    } catch(e) {
        outError.set(true);
        // console.error(e);
        outString.set('');
        op.setUiError("format_error", e);
    }
}

[steam0r]

hey, thanks, i guess default locale should not be "de-DE", even though i guess it's meant nicely ;)

also outError should be a boolean and the actual error itself should be displayed on the op via op.setUiError

and what are these "hardcoded" values and clampNumber?

[kikohs]

Feel free to change the Locale, could be us-US but should not be empty if we use any of the parameters.

[pandrr]

maybe has a switch between "browser default" or a manual value

[kikohs]

Yes, updated the code.

[steam0r]

moved to an issue and already available on dev. thanks!