prisme-flow
Version:
prisme platform flow engine
146 lines (136 loc) • 4.47 kB
HTML
<!--
Created by prisme.io on 09/06/2017.
@author <a href="mailto:hello@prisme.io">savane vamara</a> (prisme.io)
-->
<script type="text/javascript">
RED.nodes.registerType('bot-message', {
category: 'bot',
color: '#FFCC66',
defaults: {
name: {
value: ''
},
message: {
value: ['']
},
answer: {
value: false
},
track: {
value: false
},
parse_mode: {
value: ''
}
},
inputs: 1,
outputs: 1,
paletteLabel: 'text',
icon: '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="bot-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">
<label for="node-input-answer"><i class="icon-share-alt"></i> Answer</label>
<input type="checkbox" value="true" id="node-input-answer">
<span style="max-width: 460px;font-size: 12px;color: #999999;line-height: 14px;">Quote the previous message <i>[Telegram]</i></span>
</div>
<div class="form-row">
<label for="node-input-parse_mode"><i class="icon-cog"></i> Parse</label>
<select id="node-input-parse_mode" placeholder="Select parse mode">
<option value="">None</option>
<option value="Markdown">Markdown</option>
<option value="HTML">HTML</option>
</select>
<div style="max-width: 460px;font-size: 12px;color: #999999;line-height: 14px;clear:both;margin-top:5px;">
Render the message with Markdown or HTML <i>[Telegram]</i>
</div>
</div>
</script>
<script type="text/x-red" data-help-name="chatbot-message">
<p>Plain text message with templating capabilities <em>[Telegram, Facebook, Smooch, Slack]</em></p>
<p>
Used to send a plain text message to the chatbot's user, a handlebars-like syntax can be used to insert values from the
chat context, for example:
<pre>
Hi {{firstName}}, your check is {{total}} euros
</pre>
Some <a href="https://prisme.io" target="_blank">special values</a> (like {{firstName}}, {{lastName}}, {{chatId}}, etc) are always available.
</p>
<p>
It'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>
msg.payload = 'I am a message';
return msg;
</pre>
or for multiple versions of the message
<pre>
msg.payload = [
'First version of the message',
'Second version of the message'
];
return msg;
</pre>
</script>