<script type="text/x-red" data-template-name="pushover">
    <div class="form-row">
        <label for="node-input-title"><i class="fa fa-flag"></i> Title</label>
        <input type="text" id="node-input-title" placeholder="Node-RED">
    </div>
    <div class="form-row">
        <label for="node-input-device"><i class="fa fa-mobile"></i> Device</label>
        <input type="text" id="node-input-device" placeholder="leave blank for all">
    </div>
    <div class="form-row">
        <label for="node-input-priority"><i class="fa fa-star"></i> Priority</label>
        <input type="text" id="node-input-priority" placeholder="0" style="width:50px;">
    </div>
    <div class="form-row">
        <label for="node-input-sound"><i class="fa fa-bell"></i> Sound</label>
        <select id="node-input-sound">
            <option></option>
            <option>pushover</option>
            <option>bike</option>
            <option>bugle</option>
            <option>cashregister</option>
            <option>classical</option>
            <option>cosmic</option>
            <option>falling</option>
            <option>gamelan</option>
            <option>incoming</option>
            <option>intermission</option>
            <option>magic</option>
            <option>mechanical</option>
            <option>pianobar</option>
            <option>siren</option>
            <option>spacealarm</option>
            <option>tugboat</option>
            <option>alien</option>
            <option>climb</option>
            <option>persistent</option>
            <option>echo</option>
            <option>updown</option>
            <option>none</option>
        </select>
    </div>
    <div class="form-row">
        <label for="node-input-url"><i class="fa fa-link"></i> URL</label>
        <input type="text" id="node-input-url" placeholder="optional url">
    </div>
    <div class="form-row">
        <label for="node-input-url_title"><i class="fa fa-anchor"></i> URL title</label>
        <input type="text" id="node-input-url_title" placeholder="optional url title">
    </div>
    <div class="form-row">
        <label for="node-input-html"><i class="fa fa-code"></i> HTML</label>
        <input type="checkbox" id="node-input-html" style="display:inline-block; width:15px; vertical-align:baseline;" />
        <span>Message is <a href="https://pushover.net/api#html" target="_blank">HTML formatted</a></span>
    </div>
    <div class="form-row">
        <label for="node-input-deviceid"><i class="fa fa-user"></i> User key</label>
        <input type="text" id="node-input-deviceid">
    </div>
    <div class="form-row">
        <label for="node-input-pushkey"><i class="fa fa-key"></i> API token</label>
        <input type="password" id="node-input-pushkey">
    </div>
    <br/>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-tips" id="node-tip">Tip: Leave title blank to set using <code>msg.topic</code>.<br/>
    Leave device blank to send to all devices, or to set using <code>msg.device</code>.<br/>
    Leave priority blank to set using <code>msg.priority</code>. Supports priorities 2, 1, 0, -1, and -2.<br/>
    Leave sound blank to use the default, or set using <code>msg.sound</code>.</div>
</script>

<script type="text/x-red" data-help-name="pushover">
    <p>Uses Pushover to push the msg.payload to a device that has the Pushover app installed.</p>
	<br>
    <p>Optionally uses msg.topic to set the configuration:</p>
    <p><code>msg.topic</code>: set the title</p>
    <p><code>msg.device</code>: set the device</p>
    <p><code>msg.priority</code>: set the priority</p>
    <p><code>msg.attachment</code>: attach an image (Buffer or file path)</p>
    <p><code>msg.url</code>: to add a web address</p>
	<p><code>msg.url_title</code>: to add a url title if not already set in the properties</p>
	<p><code>msg.sound</code>: set the notification sound, <i><a href="https://pushover.net/api#sounds" target="_new">see the available options</a></i></p>
    <p>Uses Pushover. See <i><a href="https://pushover.net" target="_new">this link</a></i> for more details.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('pushover',{
        category: 'mobile-output',
        defaults: {
            name: {value:""},
            device: {value:""},
            title: {value:""},
            priority: {value:0},
            sound: {value:""},
            url: {value:""},
            url_title: {value:""},
            html: {value:false}
        },
        credentials: {
            deviceid: {type:"text"},
            pushkey: {type: "password"}
        },
        color:"#a7c9a0",
        inputs:1,
        outputs:0,
        icon: "pushover.png",
        align: "right",
        label: function() {
            return this.name||this.title||"pushover";
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        },
        oneditprepare: function() {
            $("#node-input-priority").spinner({
                min:-2,
                max:2
            });
        }
    });
</script>