node-red-contrib-doorbird-ultimate/nodes/doorbird-ui-image.html

Node-Red Integration for Doorbird Devices

<script type="text/javascript">
    //ui = RED.require("node-red-dashboard")(RED);
    //console.log(ui.state);
    RED.nodes.registerType('ui_doorbird-ui-image', {
        category: 'Dashboard',
        color: '#dedede',
        defaults: {
            group: {type: 'ui_group', required:false},
            name: {value: ''},
            order: {value: 0},
            width: {
                value: 0,
                validate: function(v) {
                    var valid = true
                    var width = v||0;
                    var currentGroup = $('#node-input-group').val()|| this.group;
                    var groupNode = RED.nodes.node(currentGroup);
                    valid = !groupNode || +width <= +groupNode.width;
                    $('#node-input-size').toggleClass('input-error',!valid);
                    return valid;
                }},
            height: {value: 0},
            station: {value: '', type: 'doorbird-config'}
        },
        icon: 'doorbird.png',
        paletteLabel: function() {
            return this._('doorbird-ui-image.admin.paletteLabel');
        },
        inputLabels: function() {
            return this._('doorbird-ui-image.admin.inputLabel');
        },
        outputLabels: function() {
            return this._('doorbird-ui-image.admin.outputLabel');
        },
        inputs: 1,
        outputs: 1,
        label: function() {
            return this.name || this._('doorbird-ui-image.admin.paletteLabel');
        },
        oneditprepare: () => {
            $('#node-input-size').elementSizer( {
                width: '#node-input-width',
                height: '#node-input-height',
                group: '#node-input-group'
            } );
        }
    });
</script>

<script type="text/html" data-template-name="ui_doorbird-ui-image">
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-fw fa-tag"></i> <span data-i18n="doorbird-ui-image.admin.form.labels.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]doorbird-ui-image.admin.form.placeholders.name" />
    </div>
    <br />
    <div class="form-row" id="template-row-group">
        <label><i class="fa fa-fw fa-table"></i> <span data-i18n="doorbird-ui-image.admin.form.labels.group"></span></label>
        <input type="text" id="node-input-group" />
    </div>
    <div class="form-row" id="template-row-size">
        <label><i class="fa fa-fw fa-object-group"></i> <span data-i18n="doorbird-ui-image.admin.form.labels.size"></span></label>
        <input type="hidden" id="node-input-width" />
        <input type="hidden" id="node-input-height" />
        <button id="node-input-size" class="editor-button"></button>
    </div>
    <div class="form-row">
        <label for="node-input-station"><i class="fa fa-tag"></i> <span data-i18n="doorbird-ui-image.admin.form.labels.station"></span></label>
        <input type="text" id="node-input-station">
    </div>
</script>