node-red-contrib-webthingsio/webthingsio-get-property.html

Set/get properties, execute actions and inject on events of your WebThings

<script type="text/javascript">

    RED.nodes.registerType('webthingsio-get-property', {
        category: 'Web Things IO',
        color: '#5d9bc7',
        defaults: {
            /* eslint-disable no-undefined */
            name: {value: ''},
            gateway: {value: '', type: 'webthingsio-gateway', required: true},
            thing: {value: undefined, validate: (v) => v ? true : false},
            property: {value: undefined, validate: (v) => v ? true : false},
        },
        inputs: 1,
        outputs: 1,
        icon: 'webthingsio.svg',
        label: function() {
            if (this.name) {
                return this.name;
            } else if (this.gateway && this.thing && this.property) {
                const decodedThing = decodeURIComponent(this.thing);
                if (RED.settings.webthingsioGatewayShorterLabels) {
                    return this._('webthingsio-get-property.shortLabel')
                        .replace('%property', this.property)
                        .replace('%thing', decodedThing);
                } else {
                    return this._('webthingsio-get-property.longLabel')
                        .replace('%property', this.property)
                        .replace('%thing', decodedThing);
                }
            }
            return this._('webthingsio-get-property.defaultLabel');
        },
        paletteLabel: 'Get property',
        oneditprepare: async function() {
            async function initializeInputs(node) {
                if (
                    $('#node-input-gateway')[0].options.length > 1 &&
                    !node.gateway
                ) {
                    $('#node-input-gateway')[0].selectedIndex = 0;
                    $('#node-input-gateway').removeClass('input-error');
                }
                await webthingsio.updateThing(false);
                $('#node-input--thing').prop('value', node.thing);
                await webthingsio.updateProperty(false, false, true);
                $('#node-input--property').prop('value', node.property);
            }

            function addListeners() {
                $('#node-input-gateway')[0].addEventListener(
                    'change',
                    () => webthingsio.updateThing(),
                );
                $('#node-input--thing')[0].addEventListener(
                    'change',
                    () => webthingsio.updateProperty(true, false, true),
                );
            }

            await initializeInputs(this);
            addListeners();
        },
        oneditsave: function() {
            webthingsio.saveThing(this);
            webthingsio.saveProperty(this);
        },
    });
</script>

<script type="text/html" data-template-name="webthingsio-get-property">
    <div class="form-row" id="node-errorGatewayConnect" data-i18n="webthingsio-get-property.errorGatewayConnect" style="display: none; color: red;"> 
    </div>
    <div class="form-row">
        <label for="node-input-name" data-i18n="webthingsio-get-property.labelName"><i class="fa fa-tag"></i></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]webthingsio-get-property.placeholderName">
    </div>
    <div class="form-row">
        <label for="node-input-gateway" data-i18n="webthingsio-get-property.labelGateway"><i class="fa fa-tag"></i></label>
        <input type="text" id="node-input-gateway">
    </div>
    <div class="form-row" id="thing-row" style="display: none;">
        <label for="node-input--thing" data-i18n="webthingsio-get-property.labelThing"><i class="fa fa-tag"></i></label>
        <select id="node-input--thing" style="width: 70%;"></select>
    </div>
    <div class="form-row" id="property-row" style="display: none;">
        <label for="node-input--property" data-i18n="webthingsio-get-property.labelProperty"><i class="fa fa-tag"></i></label>
        <select id="node-input--property" style="width: 70%;"></select>
    </div>
</script>