node-red-nodes/storage/mongodb/66-mongodb.html

<script type="text/html" data-template-name="mongodb">
    <div class="form-row">
        <label for="node-config-input-hostname"><i class="fa fa-bookmark"></i><span data-i18n="mongodb.label.host"></span></label>
        <input class="input-append-left" type="text" id="node-config-input-hostname" placeholder="localhost">
    </div>

    <div class="form-row node-config-input-topology">
      <label for="node-config-input-topology"><span data-i18n="mongodb.label.topology"></span></label>
          <select id="node-config-input-topology">
            <option type="button" class="red-ui-button toggle topology-group" selected  value="direct">Direct (mongodb://)</button>
            <option type="button" class="red-ui-button toggle topology-group" value="replicaset">RelicaSet/Cluster (mongodb://)</button>
            <option type="button" class="red-ui-button toggle topology-group" value="dnscluster">DNS Cluster (mongodb+srv://)</button>
          </select>
    </div>

    <div class="form-row node-config-connectOptions">
        <label for="node-config-input-connectOptions"><i class="fa fa-wrench"></i><span data-i18n="mongodb.label.connectOptions"></span></label>
        <input type="text" id="node-config-input-connectOptions">
    </div>

    <div class="form-row node-config-input-port">
        <label for="node-config-input-port"><i class="fa fa-plug"></i><span data-i18n="mongodb.label.port"></span></label>
        <input type="text" id="node-config-input-port" style="width:55px;">
    </div>

    <div class="form-row">
        <label for="node-config-input-db"><i class="fa fa-database"></i> <span data-i18n="mongodb.label.database"></span></label>
        <input type="text" id="node-config-input-db">
    </div>
    <div class="form-row">
        <label for="node-config-input-user"><i class="fa fa-user"></i> <span data-i18n="mongodb.label.username"></span></label>
        <input type="text" id="node-config-input-user">
    </div>
    <div class="form-row">
        <label for="node-config-input-password"><i class="fa fa-lock"></i> <span data-i18n="mongodb.label.password"></span></label>
        <input type="password" id="node-config-input-password">
    </div>
    <div class="form-row">
        <label for="node-config-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-config-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
</script>


<script type="text/html" data-template-name="mongodb out">
    <div class="form-row">
        <label for="node-input-mongodb"><i class="fa fa-bookmark"></i> <span data-i18n="mongodb.label.server"></span></label>
        <input type="text" id="node-input-mongodb">
    </div>
    <div class="form-row">
        <label for="node-input-collection"><i class="fa fa-briefcase"></i> <span data-i18n="mongodb.label.collection"></span></label>
        <input type="text" id="node-input-collection">
    </div>
    <div class="form-row">
        <label for="node-input-operation"><i class="fa fa-wrench"></i> <span data-i18n="mongodb.label.operation"></span></label>
        <select type="text" id="node-input-operation" style="display: inline-block; vertical-align: top;">
            <option value="store" data-i18n="mongodb.operation.save"></option>
            <option value="insert" data-i18n="mongodb.operation.insert"></option>
            <option value="update" data-i18n="mongodb.operation.update"></option>
            <option value="delete" data-i18n="mongodb.operation.remove"></option>
        </select>
    </div>
    <div class="form-row node-input-payonly">
        <label>&nbsp;</label>
        <input type="checkbox" id="node-input-payonly" style="display: inline-block; width: auto; vertical-align: top;">
        <label for="node-input-payonly" style="width: 70%;"><span data-i18n="mongodb.label.onlystore"></span></label>
    </div>
    <div class="form-row node-input-upsert">
        <label>&nbsp;</label>
        <input type="checkbox" id="node-input-upsert" style="display: inline-block; width: auto; vertical-align: top;">
        <label for="node-input-upsert" style="width: 70%;"><span data-i18n="mongodb.label.createnew"></span></label>
    </div>
    <div class="form-row node-input-multi">
        <label>&nbsp;</label>
        <input type="checkbox" id="node-input-multi" style="display: inline-block; width: auto; vertical-align: top;;">
        <label for="node-input-multi" style="width: 70%;"><span data-i18n="mongodb.label.updateall"></span></label>
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
    <div class="form-tips" id="node-warning" style="display: none"><span data-i18n="[html]mongodb.tip"></span></div>
</script>

<script type="text/html" data-template-name="mongodb in">
    <div class="form-row">
        <label for="node-input-mongodb"><i class="fa fa-bookmark"></i> <span data-i18n="mongodb.label.server"></span></label>
        <input type="text" id="node-input-mongodb">
    </div>
    <div class="form-row">
        <label for="node-input-collection"><i class="fa fa-briefcase"></i> <span data-i18n="mongodb.label.collection"></span></label>
        <input type="text" id="node-input-collection">
    </div>
    <div class="form-row">
        <label for="node-input-operation"><i class="fa fa-wrench"></i> <span data-i18n="mongodb.label.operation"></span></label>
        <select type="text" id="node-input-operation" style="display: inline-block; vertical-align: top;">
            <option value="find" data-i18n="mongodb.operation.find"></option>
            <option value="count" data-i18n="mongodb.operation.count"></option>
            <option value="aggregate" data-i18n="mongodb.operation.aggregate"></option>
        </select>
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
    <div class="form-tips" id="node-warning" style="display: none"><span data-i18n="[html]mongodb.tip"></span></div>
</script>

<script type="text/javascript">
    (function () {
        
        function _oneditprepare() {
            $("#node-input-operation").change(function () {
                var id = $("#node-input-operation option:selected").val();

                if (id === "update") {
                    $(".node-input-payonly").hide();
                    $(".node-input-upsert, .node-input-multi").show();
                } else if (id === "delete") {
                    $(".node-input-payonly, .node-input-upsert, .node-input-multi").hide();
                } else {
                    $(".node-input-payonly").show();
                    $(".node-input-upsert, .node-input-multi").hide();
                }
            });

            $("#node-input-collection").change(function () {
                if($("#node-input-collection").val() === "") {
                    $("#node-warning").show();
                } else {
                    $("#node-warning").hide();
                }
            });
        }

        RED.nodes.registerType('mongodb', {
            category: 'config',
            color: "rgb(218, 196, 180)",
            defaults: {
                hostname: {value: "127.0.0.1", required: true},
                topology: {value: "direct", required: true},
                connectOptions: {value: "", required: false},
                port: {value: 27017, required: true},
                db: {value: "", required: true},
                name: {value: ""}
            },
            credentials: {
                user: {type: "text"},
                password: {type: "password"}
            },
            label: function() {
                return this.name || this.db + "@" + this.hostname;
            },
            oneditprepare: function() {
            $("#node-config-input-topology").on("change", function() {
                var topology = $("#node-config-input-topology option:selected").val();
                if (topology === "direct") {
                $(".node-config-input-port").show();
                } else {
                $(".node-config-input-port").hide();
                }
            });
            },
        });

        RED.nodes.registerType('mongodb out', {
            category: 'storage-output',
            color: "rgb(218, 196, 180)",
            defaults: {
                mongodb: {type: "mongodb", required: true},
                name: {value: ""},
                collection: {value: ""},
                payonly: {value: false},
                upsert: {value: false},
                multi: {value: false},
                operation: {value: "store"}
            },
            inputs: 1,
            outputs: 0,
            icon: "mongodb.png",
            align: "right",
            label: function() {
                var mongoNode = RED.nodes.node(this.mongodb);
                return this.name || (mongoNode ? mongoNode.label() + " " + this.collection : "mongodb");
            },
            labelStyle: function() {
                return this.name ? "node_label_italic" : "";
            },
            oneditprepare: _oneditprepare
        });

        RED.nodes.registerType('mongodb in', {
            category: 'storage-input',
            color: "rgb(218, 196, 180)",
            defaults: {
                mongodb: {type: "mongodb", required: true},
                name: {value: ""},
                collection: {value: ""},
                operation: {value: "find"}
            },
            inputs: 1,
            outputs: 1,
            icon: "mongodb.png",
            label: function() {
                var mongoNode = RED.nodes.node(this.mongodb);
                return this.name || (mongoNode ? mongoNode.label() + " " + this.collection : "mongodb");
            },
            labelStyle: function() {
                return this.name ? "node_label_italic" : "";
            },
            oneditprepare: _oneditprepare
        });
    })()
</script>