<script type="text/x-red" data-template-name="stomp in">
    <div class="form-row">
        <label for="node-input-server" style="width: 110px;"><i class="fa fa-bookmark"></i> Server</label>
        <input type="text" id="node-input-server">
    </div>
    <div class="form-row">
        <label for="node-input-topic" style="width: 110px;"><i class="fa fa-envelope"></i> Destination</label>
        <input type="text" id="node-input-topic" placeholder="topic or queue">
    </div>
    <div class="form-row">
        <label for="node-input-name" style="width: 110px;"><i class="fa fa-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
</script>

<script type="text/x-red" data-help-name="stomp in">
    <p>Connects to a server using the Stomp protocol to receive messages.</p>
    <p>If the message received is JSON <code>msg.payload</code> will be parsed into an
    object. If not it will be the raw data.</p>
    <p><code>msg.headers</code> contains any header information that was also delivered.</p>
    <p><code>msg.topic</code> is set to the predefined subscription topic.</p>
    <p><b>Note</b>: While not a requirement of the Stomp protocol, if connecting to an ActiveMQ server, the destination should
    begin with <i>"/queue/"</i> or with <i>"/topic/"</i>. See
    <a href="https://stomp.github.io/stomp-specification-1.0.html#frame-SEND" target="new">Stomp 1.0 spec</a>
    for more details.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('stomp in',{
        category: 'input',
        color:"#e8cfe8",
        defaults: {
            name: {value:""},
            server: {type:"stomp-server",required:true},
            topic: {value:"",required:true}
        },
        inputs:0,
        outputs:1,
        icon: "bridge.png",
        label: function() {
            return this.name||"stomp";
        },
        labelStyle: function() {
            return (this.name)?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="stomp out">
    <div class="form-row">
        <label for="node-input-server" style="width: 110px;"><i class="fa fa-bookmark"></i> Server</label>
        <input type="text" id="node-input-server">
    </div>
    <div class="form-row">
        <label for="node-input-topic" style="width: 110px;"><i class="fa fa-envelope"></i> Destination</label>
        <input type="text" id="node-input-topic" placeholder="topic or queue">
    </div>
    <div class="form-row">
        <label for="node-input-name" style="width: 110px;"><i class="fa fa-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-tips">The <b>Destination</b> field is optional. If not set uses the <code>msg.topic</code>
    property of the message.</div>
</script>

<script type="text/x-red" data-help-name="stomp out">
    <p>Connects to an Stomp capable server to send messages.</p>
    <p>The <b>Destination</b> field is optional. If set it overrides the <code>msg.topic</code>
    property of the message.</p>
    <p><code>msg.headers</code></code>, if set, should be an object containing field/value
        pairs to be added as request headers.</p>
    <p><b>Note</b>: While not a requirement of the Stomp protocol, if connecting
    to an ActiveMQ server, the destination should
    begin with <i>"/queue/"</i> or with <i>"/topic/"</i>. See the
    <a href="https://stomp.github.io/stomp-specification-1.0.html#frame-SEND" target="new">Stomp 1.0 spec</a>
    for more details.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('stomp out',{
        category: 'output',
        color:"#e8cfe8",
        defaults: {
            name: {value:""},
            server: {type:"stomp-server",required:true},
            topic: {value:""}
        },
        inputs:1,
        outputs:0,
        icon: "bridge.png",
        align: "right",
        label: function() {
            return this.name||"stomp";
        },
        labelStyle: function() {
            return (this.name)?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="stomp-server">
    <div class="form-row node-input-server">
        <label for="node-config-input-server"><i class="fa fa-bookmark"></i> Server</label>
        <input class="input-append-left" type="text" id="node-config-input-server" placeholder="localhost" style="width: 45%;" >
        <label for="node-config-input-port" style="margin-left: 10px; width: 35px; "> Port</label>
        <input type="text" id="node-config-input-port" placeholder="Port" style="width:45px">
    </div>
    <div class="form-row">
        <label for="node-config-input-user"><i class="fa fa-user"></i> Username</label>
        <input type="text" id="node-config-input-user">
    </div>
    <div class="form-row">
        <label for="node-config-input-pass"><i class="fa fa-lock"></i> Password</label>
        <input type="password" id="node-config-input-password">
    </div>

    <div class="form-row">
    <label for="node-config-input-protocolversion"><i class="fa fa-tag"></i> Protocol Version</label>
        <select type="text" id="node-config-input-protocolversion" style="display: inline-block; width: 250px; vertical-align: top;">
            <option value="1.0">v1.0</option>
            <option value="1.1">v1.1</option>
        </select>
    </div>
    <div class="form-row">
        <label for="node-config-input-vhost"><i class="fa fa-server"></i> vhost</label>
        <input type="text" id="node-config-input-vhost" placeholder="Default is null" />
    </div>
    <div class="form-row">
        <label for="node-config-input-reconnectretries"><i class="fa fa-repeat"></i> Reconnect Retries</label>
        <input type="number" id="node-config-input-reconnectretries" />
    </div>
    <div class="form-row">
        <label for="node-config-input-reconnectdelay"><i class="fa fa-clock-o"></i> Reconnect Delay (S)</label>
        <input type="number" id="node-config-input-reconnectdelay" />
    </div>
    <div class="form-row">
        <label for="node-config-input-name"><i class="fa fa-tag"></i> Name</label>
        <input type="text" id="node-config-input-name" placeholder="Name">
    </div>
</script>

<script type="text/javascript">
    RED.nodes.registerType('stomp-server',{
        category: 'config',
        defaults: {
            server: {required:true},
            port: {value:61613,required:true,validate:RED.validators.number()},
            protocolversion: {value:"1.0",required:true},
            vhost: {},
            reconnectretries: {value:"0",required:true,validate:RED.validators.number()},
            reconnectdelay: {value:"0.5",required:true,validate:RED.validators.number()},
            name: {}
        },
        credentials: {
            user: {type:"text"},
            password: {type: "password"}
        },
        label: function() {
            return (this.name?this.name:this.server+":"+this.port);
        }
    });
</script>