node-red-contrib-zigbee2mqtt-devices/dist/nodes/devices-ikea.html

Nodes to interact with zigbee2mqtt for Node-RED

<!--- IKEA DIMMER NODE --->
<script type="text/javascript">

    RED.nodes.registerType('ikea-dimmer', {
        category: 'zigbee2mqtt_remotes-ikea',
        color: '#feca1e',
        defaults: {
            name: { value: "" },
            bridge: { value: "", type: "zigbee2mqtt-bridge-config" },
            deviceName: { value: "", required: true },
        },
        inputs: 0,
        outputs: 5,
        icon: "remote.svg",
        label: function () {
            return this.name || "Ikea Dimmer";
        },
        outputLabels: ["on", "off", "dimm up", "dimm down", "dimm stop"],
        oneditprepare: function () {
            var node = this;
            var deviceName = node.deviceName;
            RED.bavaria.devices.createDeviceSelector("device-selection", deviceName, "EndDevice", "IKEA", "E1743");
        }
    });

</script>

<script type="text/html" data-template-name="ikea-dimmer">
    <div class="zigbee2mqtt-devices-properties">

        <div class="form-row">
            <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
            <input type="text" id="node-input-name">
        </div>
        <div class="form-row">
            <label for="node-input-bridge"><i class="fa fa-server"></i> Bridge</label>
            <input type="text" id="node-input-bridge" placeholder="bridge" />
        </div>
        <div id="device-selection" class="form-row">
        </div>

    </div>
</script>

<script type="text/html" data-help-name="ikea-dimmer">
    <p>Sends a new message when an Ikea remote button is pressed.</p>
    <p>It is only compatible with Ikea remotes (Model: E1743)</p>
    <h3>Output</h3>
    <dl class="message-properties">
        <dt> button_name <span class="property-type"> string </span> </dt>
        <dd> The name of the button that was pressed </dd>
        <dt> button_type  <span class="property-type"> string </span> </dt>
        <dd>
            The type in wich way the button was pressed. Following types are available:
            <ul>
                <li><code>pressed</code> - single press</li>
                <li><code>hold</code> - when a button is hold down for a bit</li>
                <li><code>released</code> - when a hold down button was being released</li>
            </ul>
        </dd>
    </dl>
</script>

<!--- IKEA REMOTE NODE --->
<script type="text/javascript">

    RED.nodes.registerType('ikea-remote', {
        category: 'zigbee2mqtt_remotes-ikea',
        color: '#feca1e',
        defaults: {
            name: { value: "" },
            bridge: { value: "", type: "zigbee2mqtt-bridge-config" },
            deviceName: { value: "", required: true },
        },
        inputs: 0,
        outputs: 5,
        icon: "remote.svg",
        label: function () {
            return this.name || "Ikea Remote";
        },
        outputLabels: ["toggle", "up", "down", "left", "right"],
        oneditprepare: function () {
            var node = this;
            var deviceName = node.deviceName;

            RED.bavaria.devices.createDeviceSelector("device-selection", deviceName, "EndDevice", "IKEA", "E1524%2FE1810");
        }
    });

</script>

<script type="text/html" data-template-name="ikea-remote">
    <div class="zigbee2mqtt-devices-properties">

        <div class="form-row">
            <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
            <input type="text" id="node-input-name">
        </div>
        <div class="form-row">
            <label for="node-input-bridge"><i class="fa fa-server"></i> Bridge</label>
            <input type="text" id="node-input-bridge" placeholder="bridge" />
        </div>
        <div id="device-selection" class="form-row">
        </div>

    </div>
</script>

<script type="text/html" data-help-name="ikea-remote">
    <p> </p>
    <p>It is only compatible with Ikea remotes (Model: E1524/E1810)</p>
    <h3>Output</h3>
    <dl class="message-properties">
        <dt> button_name <span class="property-type"> string </span> </dt>
        <dd> The name of the button that was pressed </dd>
        <dt> button_type  <span class="property-type"> string </span> </dt>
        <dd>
            The type in wich way the button was pressed. Following types are available:
            <ul>
                <li><code>pressed</code> - single press</li>
                <li><code>hold</code> - when a button is hold down for a bit</li>
                <li><code>released</code> - when a hold down button was being released</li>
            </ul>
        </dd>
    </dl>
</script>

<!--- IKEA DIMMER V2 NODE --->
<script type="text/javascript">

    RED.nodes.registerType('ikea-dimmer-v2', {
        category: 'zigbee2mqtt_remotes-ikea',
        color: '#feca1e',
        defaults: {
            name: { value: "" },
            bridge: { value: "", type: "zigbee2mqtt-bridge-config" },
            deviceName: { value: "", required: true },
            extendedOutput: { value: false },
            outputs: { value: 1 },
        },
        inputs: 0,
        outputs: 1,
        outputLabels: function (e) {
            if(this.extendedOutput === true){
                var outputs = ["on", "off", "stop", "move_to"];
                return outputs[e];
            }
            return "";
        },
        icon: "remote.svg",
        label: function () {
            return this.name || "Ikea Dimmer v2";
        },
        oneditprepare: function () {
            var node = this;
            var deviceName = node.deviceName;

            RED.bavaria.devices.createDeviceSelector("device-selection", deviceName, "EndDevice", "IKEA", "ICTC-G-1,E1743");
        },
        oneditsave: function () {
            var outputcount = 1;
            console.log($("#node-input-extendedOutput").val());
            if ($("#node-input-extendedOutput").is(":checked") === true) {
                outputcount = 4;
            }

            if(outputcount != this.outputs){
                this.outputs = outputcount;
            }
        }
    });

</script>

<script type="text/html" data-template-name="ikea-dimmer-v2">
    <div class="zigbee2mqtt-devices-properties">

        <div class="form-row">
            <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
            <input type="text" id="node-input-name">
        </div>
        <div class="form-row">
            <label for="node-input-bridge"><i class="fa fa-server"></i> Bridge</label>
            <input type="text" id="node-input-bridge" placeholder="bridge" />
        </div>
        <div id="device-selection" class="form-row">
        </div>
        <div class="config-group">
            <div class="form-row">
                <input type="checkbox" id="node-input-extendedOutput" style="display: inline-block; width: auto; vertical-align: top;" autocomplete="off" />
                <label for="node-input-extendedOutput" style="width: 70%;"><code>ExtendedOutput</code> - This will expose each button as seperate output.</label>
            </div>
        </div>
    </div>
</script>

<script type="text/html" data-help-name="ikea-dimmer-v2">
    <p>Sends a new message when an Ikea dimmer is used.</p>
    <p>This node supports the small round dimmer (Model: <code>ICTC-G-1</code>) and the small quadratic dimmer (Model: <code>E1743</code>)</p>
    <h3>Output</h3>
    <dl class="message-properties">
        <dt> "on"-button pressed</dt>
        <dd> Sends a <code>state-override</code> message with full brightness.</dd>
        <dt> "on"-button hold</dt>
        <dd> Sends a <code>brightness-move</code> action with positive <code>move</code> value. (Dimm up)</dd>
        <dt> "off"-button pressed</dt>
        <dd> Sends a <code>state-override</code> message with 0 brightness.</dd>
        <dt> "off"-button hold</dt>
        <dd> Sends a <code>brightness-move</code> action with negative <code>move</code> value. (Dimm down)</dd>
        <dt> "on/off"-button released</dt>
        <dd> Sends a <code>brightness-move</code> action with 0 <code>move</code> value. (Dimm stop)</dd>
        <dt> "move_to"-button pressed</dt>
        <dd> Only for <code>ICTC-G-1</code>. It sends a <code>brightness-override</code> with the value from the remote. (action_level)</dd>
    </dl>
    <h3>ExtendedOutput</h3>
    <dl class="message-properties">
        <dd>When the extended output is enabled, each button is assigned to its own output. It will send the button-events to each output with empty payload. Only <code>msg.action.name</code> (e.g. "on") and <code>msg.action.description</code>(e.g. "pressed") is set.</dd>
    </dl>
</script>

<!--- IKEA STYRBAR NODE --->
<script type="text/javascript">

    RED.nodes.registerType('ikea-styrbar', {
        category: 'zigbee2mqtt_remotes-ikea',
        color: '#feca1e',
        defaults: {
            name: { value: "" },
            bridge: { value: "", type: "zigbee2mqtt-bridge-config" },
            deviceName: { value: "", required: true },
            outputs: { value: 2 },
        },
        inputs: 0,
        outputs: 2,
        outputLabels: function (e) {
            var outputs = ["lights", "scenes"];
            return outputs[e];
        },
        icon: "remote.svg",
        label: function () {
            return this.name || "Ikea Styrbar";
        },
        oneditprepare: function () {
            var node = this;
            var deviceName = node.deviceName;

            RED.bavaria.devices.createDeviceSelector("device-selection", deviceName, "EndDevice", "IKEA", "E2001");
        },
        oneditsave: function () {
            
        }
    });

</script>

<script type="text/html" data-template-name="ikea-styrbar">
    <div class="zigbee2mqtt-devices-properties">

        <div class="form-row">
            <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
            <input type="text" id="node-input-name">
        </div>
        <div class="form-row">
            <label for="node-input-bridge"><i class="fa fa-server"></i> Bridge</label>
            <input type="text" id="node-input-bridge" placeholder="bridge" />
        </div>
        <div id="device-selection" class="form-row">
        </div>
    </div>
</script>

<script type="text/html" data-help-name="ikea-styrbar">
    <p>Sends a new message when an Ikea Styrbar is used.</p>
    <p>This node supports the Styrbar (Model: <code>E2001</code>)</p>
    <h3>Output</h3>
    <dl class="message-properties">
        <dt> "on"-button pressed</dt>
        <dd> Sends a <code>state-override</code> message with full brightness.</dd>
        <dt> "on"-button hold</dt>
        <dd> Sends a <code>brightness-move</code> action with positive <code>move</code> value. (Dimm up)</dd>
        <dt> "off"-button pressed</dt>
        <dd> Sends a <code>state-override</code> message with 0 brightness.</dd>
        <dt> "off"-button hold</dt>
        <dd> Sends a <code>brightness-move</code> action with negative <code>move</code> value. (Dimm down)</dd>
        <dt> "on/off"-button released</dt>
        <dd> Sends a <code>brightness-move</code> action with 0 <code>move</code> value. (Dimm stop)</dd>
        <dt> "left"-button pressed</dt>
        <dd> Send a <code>{"command": "previous"}</code></dd>
        <dt> "left"-button hold</dt>
        <dd> Send a <code>{"command": "previous_hold"}</code></dd>
        <dt> "left"-button released</dt>
        <dd> Send a <code>{"command": "previous_released"}</code></dd>
        <dt> "right"-button pressed</dt>
        <dd> Send a <code>{"command": "next"}</code></dd>
        <dt> "right"-button hold</dt>
        <dd> Send a <code>{"command": "next_hold"}</code></dd>
        <dt> "right"-button released</dt>
        <dd> Send a <code>{"command": "next_released"}</code></dd>
    </dl>
</script>