smart-nodes/statistic/statistic.html

Smart Nodes

<script type="text/javascript">
    RED.nodes.registerType("smart_statistic", {
        category: "Smart Nodes",
        paletteLabel: "Statistic",
        color: "#E2D96E",
        defaults: {
            name: { value: "" },
            operation: { value: "MIN" }, // MIN, MAX, SUM, DIFF, ABS, ABS_DIFF, AVG, MOV_AVG
            count: { value: 10 },
            out_message: { value: '{"topic": ""}' },
            out_message_type: { value: 'json' },
            save_state: { value: false },
            resend_on_start: { value: false }
        },
        inputs: 1,
        outputs: 1,
        icon: "function.svg",
        label: function ()
        {
            return this.name || this.operation || "Statistic";
        },
        oneditprepare: function ()
        {
            let node = this;

            $("#node-input-operation")
                .css("max-width", "70%")
                .typedInput({
                    types: [{
                        default: "MIN",
                        value: "operation",
                        options: [
                            { value: "MIN", label: node._("statistic.ui.minimum") },
                            { value: "MAX", label: node._("statistic.ui.maximum") },
                            { value: "SUM", label: node._("statistic.ui.sum") },
                            { value: "DIFF", label: node._("statistic.ui.difference") },
                            { value: "ABS", label: node._("statistic.ui.absolute_value") },
                            { value: "ABS_DIFF", label: node._("statistic.ui.absolute_difference") },
                            { value: "AVG", label: node._("statistic.ui.average") },
                            { value: "MOV_AVG", label: node._("statistic.ui.moving_average") }
                        ],
                    }],
                });

            $("#node-input-count").css("max-width", "4rem")
                .css("max-width", "4rem")
                .spinner({
                    min: 2,
                    change: function (event, ui)
                    {
                        var value = parseInt(this.value);
                        value = isNaN(value) ? 0 : value;
                        value = Math.max(value, parseInt($(this).attr("aria-valuemin")));
                        // value = Math.min(value, parseInt($(this).attr("aria-valuemax")));
                        if (value !== this.value) $(this).spinner("value", value);
                    },
                });

            $("#node-input-operation").on("change", function (event, type, value)
            {
                if (value === "MOV_AVG")
                    $(".statistic-moving-average-row").show();
                else
                    $(".statistic-moving-average-row").hide();
            });

            $("#node-input-out_message")
                .css("max-width", "70%")
                .typedInput({
                    type: "json",
                    types: ["json", {
                        value: "NOTHING",
                        label: node._("statistic.ui.default"),
                        icon: "fa fa-times",
                        hasValue: false,
                    }],
                    typeField: "#node-input-out_message_type"
                });

            $("#node-input-save_state").on("change", ev =>
            {
                if (ev.target.checked)
                    $("#resend_on_start_row").show();
                else
                    $("#resend_on_start_row").hide();
            });
            $("#node-input-save_state").trigger("change");


            // Backward compatibility
            if (this.out_message_type == "null" || this.out_message_type == "DEFAULT")
            {
                this.out_message_type = "NOTHING";
                $("#node-input-out_message_type").val("NOTHING");
            }
        }
    });
</script>

<script type="text/html" data-template-name="smart_statistic">
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="statistic.ui.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]statistic.ui.name" />
    </div>
    <div class="form-row">
        <label for="node-input-operation"><i class="fa fa-sort"></i> <span data-i18n="statistic.ui.operation"></span></label>
        <input id="node-input-operation" />
    </div>
    <div class="form-row statistic-moving-average-row" style="display: none;">
        <label for="node-input-count"><i class="fa fa-hashtag"></i> <span data-i18n="statistic.ui.count"></span></label>
        <input id="node-input-count" />
    </div>
    <hr/>
    <h4 style="margin: 0.5rem 0;" data-i18n="statistic.ui.output_messages"></h4>
    <div class="form-row">
        <label for="node-input-out_message"><i class="fa fa-check-circle"></i> <span data-i18n="statistic.ui.message"></span></label>
        <input type="text" id="node-input-out_message"/>
        <input type="hidden" id="node-input-out_message_type">
    </div>
    <div class="form-row">
        <div><strong data-i18n="statistic.ui.note"></strong></div>
        <div data-i18n="[html]statistic.ui.note_text"></div>
    </div>
    <hr/>
    <h4 style="margin: 0.5rem 0;" data-i18n="statistic.ui.system_start"></h4>
    <div class="form-row">
        <input type="checkbox" id="node-input-save_state" style="width: 20px;" />
        <label for="node-input-save_state" style="width: calc(100% - 30px);" data-i18n="statistic.ui.save_state"></label>
    </div>
    <div class="form-row" id="resend_on_start_row">
        <input type="checkbox" id="node-input-resend_on_start" style="width: 20px;" />
        <label for="node-input-resend_on_start" style="width: calc(100% - 30px);" data-i18n="statistic.ui.send_after_start"></label>
    </div>
</script>