node-red-contrib-chatbot/nodes/chatbot-message.html

REDBot a Chat bot for a full featured chat bot for Telegram, Facebook Messenger and Slack. Almost no coding skills required

<script type="text/javascript">
  RED.nodes.registerType('chatbot-message', {
    category: 'RedBot',
    color: '#FFCC66',
    defaults: {
      name: {
        value: ''
      },
      message: {
        value: ['']
      },
      answer: {
        value: false
      },
      silent: {
        value: false
      }
    },
    inputs: 1,
    outputs: 1,
    paletteLabel: 'Text',
    icon: 'chatbot-message.png',
    label: function() {
      return this.name || 'Text';
    },
    oneditsave: function() {
      var messages = $("#node-input-message-container").editableList('items');
      var node = this;
      node.message = [];

      var idx;
      for(idx = 0; idx < messages.length; idx++) {
        node.message.push({
          message: messages[idx].find('textarea').val()
        });
      }
    },

    oneditprepare: function() {
      $('#node-input-message-container')
        .css('min-height','300px')
        .css('min-width','450px')
        .editableList({
          addButton: 'Add message version',
          addItem: function (container, i, item) {
            var row = $('<div/>').appendTo(container);
            var content = '';
            if (typeof item == 'string') {
              content = item;
            } else if (item.message != null) {
              content = item.message;
            }
            $('<textarea placeholder="Message">' + content + '</textarea>')
              .css({
                width: '93%',
                height: '100px'
              })
              .appendTo(row);
          },
          removable: true,
          sortable: true
        });

      var message = this.message;
      if (typeof message == 'string') {
        message = [message];
      }
      var idx;
      for (idx = 0; idx < message.length; idx++) {
        $("#node-input-message-container").editableList('addItem', message[idx]);
      }
    }
  });
</script>

<script type="text/x-red" data-template-name="chatbot-message">
<div class="form-row">
  <label for="node-input-name"><i class="icon-tag"></i> Name</label>
  <input type="text" id="node-input-name" placeholder="Name">
</div>
<div class="form-row node-input-rule-container-row">
  <ol id="node-input-message-container"></ol>
  <div style="max-width: 460px;font-size: 12px;color: #999999;line-height: 14px;clear:both;margin-top:5px;">
    Supports handlebars-like variables for chat context like {{firstName}}, {{lastName}}, etc. and emoticons (:smile:, etc.).
    In case of multiple version of the content, one will be randomly chosen.
  </div>
</div>
<div class="form-row">
  <table>
    <tr>
      <td width="50%" valign="top" style="font-size: 13px;">
        <input type="checkbox" value="true" id="node-input-answer" style="width:auto;margin-top:0px;">
        <span>Quote the previous message</span>&nbsp;<span class="icon-platform-telegram"/>
      </td>
      <td width="50%" valign="top" style="font-size: 13px;">
        <input type="checkbox" value="true" id="node-input-silent" style="width:auto;margin-top:0px;">
        <span>
          Silent message (no notification)
        </span>&nbsp;<span class="icon-platform-telegram"/>
      </td>
    </tr>
  </table>
</div>
</script>
<script type="text/x-red" data-help-name="chatbot-message"><p>Used to send a plain text message to the chatbot&#39;s user, a handlebars-like syntax can be used to insert values from the chat context, for example:</p>
<pre><code>Hi {{firstName}}, your check is {{total}} euros
</code></pre><p>Some special values (like <code>{{firstName}}</code>, <code>{{lastName}}</code>, <code>{{chatId}}</code>, etc) are always available.</p>
<p>It&#39;s possible to specify more content versions for the same message, one will we randomly chosen with an even distribution.</p>
<p>The text message can be passed through the payload by the upstream node:</p>
<pre><code>msg.payload = &#39;I am a message&#39;;
return msg;
</code></pre><p>or for multiple versions of the message</p>
<pre><code>msg.payload = [
  &#39;First version of the message&#39;,
  &#39;Second version of the message&#39;
];
return msg;
</code></pre><p>Available parameters for the <code>msg.payload</code></p>
<dl class="message-properties">


<dt>message<span class="property-type">string / array of [string]</span><dd>String or array of strings to send. If array, a random one will be chosen</dd>
<dt>silent<span class="property-type">boolean</span><dd>Do not send notification. <em>Telegram</em></dd>
<dt>answer<span class="property-type">boolean</span><dd>Send as answer to the previous message. <em>Telegram</em></dd>
<dt>fallback<span class="property-type">string</span><dd>Fallback message to use in case of a message broadcast containing tokens like {{first_name}} or {{last_name}} and the bot doesn&#39;t have privileges to access profile info. <em>Facebook</em></dd>

</dl>
<p><img src="https://img.shields.io/badge/platform-Alexa-blue.svg?colorB=23cbfd" alt="Alexa">
<img src="https://img.shields.io/badge/platform-Facebook-blue.svg" alt="Facebook">
<img src="https://img.shields.io/badge/platform-Slack-green.svg" alt="Slack">
<img src="https://img.shields.io/badge/platform-Smooch-orange.svg" alt="Smooch">
<img src="https://img.shields.io/badge/platform-Telegram-blue.svg?colorB=7cbaea" alt="Telegram">
<img src="https://img.shields.io/badge/platform-Twilio-ee324a.svg" alt="Twilio">
<img src="https://img.shields.io/badge/platform-Viber-8079d0.svg" alt="Viber"></p>
</script>