smart-nodes/mixing-valve/mixing-valve.html

Smart Nodes

<script type="text/javascript">
    RED.nodes.registerType("smart_mixing-valve", {
        category: "Smart Nodes",
        paletteLabel: "Mixing Valve",
        color: "#3FADB5",
        defaults: {
            name: { value: "" },
            enabled: { value: true },
            setpoint: { value: 45 },
            time_total: { value: 60 },
            time_sampling: { value: 60 },
            off_mode: { value: "NOTHING" }, // NOTHING | OPEN | CLOSE
            valve_mode: { value: "HEATING" }, // HEATING | COOLING
            precision: { value: 1.0 },
            max_change_percent: { value: 1 },
            max_change_temp_difference: { value: 20 },
            min_change_time: { value: 0 }
        },
        inputs: 1,
        outputs: 3,
        outputLabels: ["Open", "Close", "Status Position"],
        icon: "mixing-valve.png",
        label: function ()
        {
            return this.name || "Mixing Valve";
        },
        oneditprepare: function ()
        {
            let node = this;

            $("#node-input-setpoint")
                .css("max-width", "4rem")
                .spinner({
                    min: -30,
                    max: 100,
                    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-time_total")
                .css("max-width", "4rem")
                .spinner({
                    min: 0,
                    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-time_sampling")
                .css("max-width", "4rem")
                .spinner({
                    min: 0,
                    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-off_mode")
                .css("max-width", "70%")
                .typedInput({
                    types: [{
                        default: "NOTHING",
                        value: "off_mode",
                        options: [
                            { value: "NOTHING", label: node._("mixing-valve.ui.nothing") },
                            { value: "OPEN", label: node._("mixing-valve.ui.open") },
                            { value: "CLOSE", label: node._("mixing-valve.ui.close") }
                        ],
                    }],
                });

            $("#node-input-valve_mode")
                .css("max-width", "70%")
                .typedInput({
                    types: [{
                        default: "HEATING",
                        value: "valve_mode",
                        options: [
                            { value: "HEATING", label: node._("mixing-valve.ui.heating") },
                            { value: "COOLING", label: node._("mixing-valve.ui.cooling") }
                        ],
                    }],
                });

            $("#node-input-precision")
                  .css("max-width", "4rem")
                  .spinner({
                      min: 0.1,
                      max: 1.0,
                      step: 0.1,
                      change: function (event, ui)
                      {
                          var value = parseFloat(this.value);
                          value = isNaN(value) ? 0.0 : value;
                          value = Math.max(value, parseFloat($(this).attr("aria-valuemin")));
                          value = Math.min(value, parseFloat($(this).attr("aria-valuemax")));
                          if (value !== this.value) $(this).spinner("value", value);
                      },
                  });

            $("#node-input-max_change_percent")
                  .css("max-width", "4rem")
                  .spinner({
                      min: 1,
                      max: 40,
                      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-max_change_temp_difference")
                  .css("max-width", "4rem")
                  .spinner({
                      min: 1,
                      max: 20,
                      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-min_change_time")
                  .css("max-width", "4rem")
                  .spinner({
                      min: 0,
                      max: 2000,
                      step: 100,
                      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);
                      },
                  });
        },
    });
</script>

<script type="text/html" data-template-name="smart_mixing-valve">
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="mixing-valve.ui.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]mixing-valve.ui.name" />
    </div>
    <div class="form-row">
        <input type="checkbox" id="node-input-enabled" style="width: 20px;" />
        <span for="node-input-enabled" style="width: 200px;"> <span data-i18n="mixing-valve.ui.enabled"></span></span>
    </div>
    <div class="form-row">
        <label for="node-input-setpoint"><i class="fa fa-sliders"></i> <span data-i18n="mixing-valve.ui.setpoint"></span></label>
        <input id="node-input-setpoint" value="0" /> °C
    </div>
    <div class="form-row">
        <label for="node-input-time_total"><i class="fa fa-clock-o"></i> <span data-i18n="mixing-valve.ui.runtime"></span></label>
        <input id="node-input-time_total" value="0" /> s
    </div>
    <div class="form-row">
        <label for="node-input-time_sampling"><i class="fa fa-clock-o"></i> <span data-i18n="mixing-valve.ui.sampling"></span></label>
        <input id="node-input-time_sampling" value="0" /> s
    </div>
    <div class="form-row">
        <label for="node-input-off_mode"><i class="fa fa-power-off"></i> <span data-i18n="mixing-valve.ui.power_off"></span></label>
        <input id="node-input-off_mode" />
    </div>
    <div class="form-row">
        <label for="node-input-valve_mode"><i class="fa fa-fire"></i> <span data-i18n="mixing-valve.ui.mode"></span></label>
        <input id="node-input-valve_mode" />
    </div>
    <div class="form-row">
        <label for="node-input-precision"><i class="fa fa-sliders"></i> <span data-i18n="mixing-valve.ui.precision"></span></label>
        <input id="node-input-precision" value="1.0" /> °C
    </div>
    <div class="form-row">
        <label for="node-input-max_change_percent"><i class="fa fa-sliders"></i> <span data-i18n="mixing-valve.ui.max_change_percent"></span></label>
        <input id="node-input-max_change_percent" value="2" /> %
    </div>
    <div class="form-row">
        <label for="node-input-max_change_temp_difference"><i class="fa fa-sliders"></i> <span data-i18n="mixing-valve.ui.max_change_temp_difference"></span></label>
        <input id="node-input-max_change_temp_difference" value="20" /> °C
    </div>
    <div class="form-row">
        <label for="node-input-min_change_time"><i class="fa fa-sliders"></i> <span data-i18n="mixing-valve.ui.min_change_time"></span></label>
        <input id="node-input-min_change_time" value="0" /> ms
    </div>
</script>